diff --git a/app/assets/stylesheets/partials/_search.scss b/app/assets/stylesheets/partials/_search.scss index bc61e48..7897fc4 100644 --- a/app/assets/stylesheets/partials/_search.scss +++ b/app/assets/stylesheets/partials/_search.scss @@ -2,6 +2,19 @@ // #SEARCH BITS // ------------------------ +/* Shared link styling */ +@mixin searchUnderlinedLinks { + color: $color-text-oncolor; + font-weight: $fw-medium; + text-decoration: underline; + text-decoration-color: $color-red-500; + text-underline-offset: 0.5rem; + + &:hover { + color: $color-red-400; + } +} + /* New USE UI search styles */ #search-form { margin: 0; @@ -219,20 +232,16 @@ a { padding: 12px 20px 16px; background-color: transparent; - color: $color-text-oncolor; display: inline-block; - font-weight: $fw-medium; - border: 2px solid transparent; - border-bottom: 0; + border-bottom: 0; - text-decoration: underline; - text-decoration-color: $color-red-500; - text-underline-offset: 0.5rem; + @include searchUnderlinedLinks; &:hover { border-color: $color-gray-700; background-color: $color-gray-900; + color: $color-text-oncolor; } &.active { @@ -249,4 +258,19 @@ } +} + +/* ============== */ +/* Search Actions */ +/* ============== */ + +.search-actions { + padding-top: 16px; + padding-bottom: 8px; + display: flex; + gap: 24px; + + a { + @include searchUnderlinedLinks(); + } } \ No newline at end of file diff --git a/app/assets/stylesheets/partials/_variables.scss b/app/assets/stylesheets/partials/_variables.scss index 8b2b9c1..00a95e8 100644 --- a/app/assets/stylesheets/partials/_variables.scss +++ b/app/assets/stylesheets/partials/_variables.scss @@ -16,6 +16,8 @@ $color-gray-950: #1a1a1a; $color-gray-975: #191919; // RED +$color-red-300: #FF6666; +$color-red-400: #FF3333; $color-red-500: #ff0000; $color-red-600: #e50000; diff --git a/app/views/search/_form.html.erb b/app/views/search/_form.html.erb index 7e03bf4..ae29e6b 100644 --- a/app/views/search/_form.html.erb +++ b/app/views/search/_form.html.erb @@ -5,6 +5,9 @@ +
+ More search options +
<% if Feature.enabled?(:boolean_picker) %>