diff options
Diffstat (limited to 'src/client/style/_component-search.scss')
-rw-r--r-- | src/client/style/_component-search.scss | 64 |
1 files changed, 64 insertions, 0 deletions
diff --git a/src/client/style/_component-search.scss b/src/client/style/_component-search.scss new file mode 100644 index 0000000..51d6b4a --- /dev/null +++ b/src/client/style/_component-search.scss @@ -0,0 +1,64 @@ +.search { + height: 54px; + position: relative; + + &-overflow { + border-radius: 2px; + background-color: white; + position: absolute; + width: 100%; + } + + &--has-focus { + box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); + } + + &__results--has-results { + border-top: 1px #BDBDBD solid; + } + + &__icon-wrapper { + height: 54px; + padding: 15px; + svg { + height: 24px; + width: 24px; + } + } + + &__input-wrapper { + display: flex; + height: 54px; + + input { + border: 0; + background-color: transparent; + flex-grow: 1; + height: inherit; + padding: 16px; + padding-left: 0px; + font-size: 16px; + outline: none; + } + } + + &__results { + transition: 0.1s ease-in-out min-height; + overflow: hidden; + } + + &__result { + display: flex; + + &--selected { + background-color: lightgray; + } + + &__text { + padding: 15px; + padding-left: 0px; + font-size: 16px; + transform: translate(0, 3px); + } + } +} |