summaryrefslogtreecommitdiff
path: root/_sass/components/_search.scss
diff options
context:
space:
mode:
Diffstat (limited to '_sass/components/_search.scss')
-rw-r--r--_sass/components/_search.scss186
1 files changed, 0 insertions, 186 deletions
diff --git a/_sass/components/_search.scss b/_sass/components/_search.scss
deleted file mode 100644
index d28dabc..0000000
--- a/_sass/components/_search.scss
+++ /dev/null
@@ -1,186 +0,0 @@
-.search {
- @include overflow(auto);
-
-}
-.search--google-custom-search-engine {
- .main {
- padding-top: map-get($spacers, 4);
- padding-bottom: map-get($spacers, 4);
- @include media-breakpoint-down(md) {
- position: absolute;
- padding: 0;
- }
- }
-}
-
-.search__header {
- margin-top: map-get($spacers, 4);
- font-size: map-get($base, font-size-h1);
- font-weight: map-get($base, font-weight-bold);
- color: $text-color-d;
- .search--light & {
- color: $text-color-theme-light-d;
- }
- .search--dark & {
- color: $text-color-theme-dark-d;
- }
- @include media-breakpoint-down(md) {
- display: none;
- }
-}
-
-.search-bar {
- @include flexbox();
- margin: map-get($spacers, 3) 0 map-get($spacers, 4) 0;
-}
-
-.search-box {
- position: relative;
- width: 100%;
- max-width: 22rem;
- @include media-breakpoint-down(md) {
- width: 100%;
- max-width: none;
- }
- & > input {
- display: inline-block;
- width: 100%;
- height: $button-height-lg;
- padding: 0 2rem;
- margin: 0;
- line-height: 1 !important;
- color: $text-color;
- background-color: transparent;
- border: 2px solid $border-color;
- border-radius: map-get($button, pill-radius);
- -webkit-appearance: none; /* fix iOS don't display box-shadow properly */
- @include transition(box-shadow map-get($animation, duration) map-get($animation, timing-function));
- @include focus {
- box-shadow: 0 0 0 2px rgba($border-color, .4);
- }
- .search--light & {
- color: $text-color-theme-light;
- border-color: $text-color-theme-light;
- @include focus {
- box-shadow: 0 0 0 2px rgba($text-color-theme-light, .4);
- }
- }
- .search--dark & {
- color: $text-color-theme-dark;
- border-color: $text-color-theme-dark;
- @include focus {
- box-shadow: 0 0 0 2px rgba($text-color-theme-dark, .4);
- }
- }
- }
- & > .search-box__icon-search {
- color: $text-color-l;
- .search--light & {
- color: $text-color-theme-light-l;
- }
- .search--dark & {
- color: $text-color-theme-dark-l;
- }
- }
- & > .search-box__icon-clear {
- & > a {
- @include link-colors($text-color);
- .search--light & {
- @include link-colors($text-color-theme-light);
- }
- .search--dark & {
- @include link-colors($text-color-theme-dark);
- }
- cursor: pointer;
- }
- }
- & > .search-box__icon-search, & > .search-box__icon-clear {
- position: absolute;
- width: $button-height-lg;
- height: $button-height-lg;
- line-height: $button-height-lg;
- text-align: center;
- vertical-align: middle;
- }
- &.not-empty > .search-box__icon-clear {
- display: block;
- }
- & > .search-box__icon-clear {
- top: 0;
- right: 0;
- display: none;
- }
- & > .search-box__icon-search {
- top: 0;
- left: 0;
- }
-}
-
-.search__cancel {
- margin-left: map-get($spacers, 2);
- font-weight: map-get($base, font-weight-bold);
- white-space: nowrap;
-}
-
-.search-result {
- margin: map-get($spacers, 4) 0;
- font-size: map-get($base, font-size-sm);
- line-height: map-get($base, line-height-sm);
-}
-
-.search-result__header {
- margin: map-get($spacers, 3) 0 map-get($spacers, 2) 0;
- font-size: map-get($base, font-size-lg);
- font-weight: map-get($base, font-weight-bold);
- color: $text-color-l;
- text-transform: uppercase;
- .search--light & {
- color: $text-color-theme-light-l;
- }
- .search--dark & {
- color: $text-color-theme-dark-l;
- }
-}
-
-.search-result__item {
- list-style-type: none;
- a {
- padding: map-get($spacers, 1) map-get($spacers, 3);
- @include transition(none);
- @include clickable($text-color, transparent, $text-color-3, $main-color-3);
- .search--light & {
- @include clickable($text-color-theme-light, transparent, $text-color-theme-dark, $main-color-theme-light);
- }
- .search--dark & {
- @include clickable($text-color-theme-dark, transparent, $text-color-theme-light, $main-color-theme-dark);
- }
- }
- &.active {
- a {
- @include plain() {
- color: $text-color-3;
- background-color: $main-color-3;
- .search--light & {
- color: $text-color-theme-dark;
- background-color: $main-color-theme-light;
- }
- .search--dark & {
- color: $text-color-theme-light;
- background-color: $main-color-theme-dark;
- }
- }
- @include active() {
- @include transition(map-get($clickable, transition));
- }
- }
- }
-}
-
-// google search
-.gsc-control-cse {
- *,
- ::before,
- ::after {
- box-sizing: initial;
- }
-}