diff --git a/src/scss/components/logo.scss b/src/scss/components/logo.scss index 03c51256ed..2441aa01f4 100644 --- a/src/scss/components/logo.scss +++ b/src/scss/components/logo.scss @@ -1,7 +1,7 @@ @import '../abstracts/variables'; @import '../abstracts/utilities'; - +// === Logo === // .logo { display: block; } @@ -27,31 +27,10 @@ height: 90px; padding: 23px 20px; } - - &.logo--healthcare { - padding: 20px 1.25rem; - @include breakpoint(md) { - height: 100px; - padding: 23px 22px; - } - @include breakpoint(page-container) { - height: 113px; - } - } - - // @todo Move this to search or search-toggle? - .search-is-open & { - visibility: none; - opacity: 0; - - @include breakpoint(md) { - display: block; - opacity: 1; - visibility: visible; - } - } } +// === End: Logo === // +// === Logo SVG === // .logo-icon { fill: $uiowa-gold; height: 20px; @@ -68,7 +47,29 @@ height: 43px; } - .logo--healthcare & { + &:hover, + &:focus { + opacity: 0.7; + } +} +// === End: Logo SVG === // + +// === Logo Healthcare === // +.logo--tab { + &.logo--healthcare { + padding: 20px 1.25rem; + @include breakpoint(md) { + height: 100px; + padding: 23px 22px; + } + @include breakpoint(page-container) { + height: 113px; + } + } +} + +.logo--healthcare { + .logo-icon { height: 32px; @include breakpoint(md) { height: 47px; @@ -78,9 +79,5 @@ height: 67px; } } - - &:hover, - &:focus { - opacity: 0.7; - } } +// === End: Logo Healthcare === //