X-Git-Url: https://git.mdrn.pl/wolnelektury.git/blobdiff_plain/5bd864493e531e5600c5ca989825d89cc3ee1487..94a4fcc7ab9e1713dc2defc8b35c875fc90f6fa5:/src/wolnelektury/static/2022/styles/local.scss diff --git a/src/wolnelektury/static/2022/styles/local.scss b/src/wolnelektury/static/2022/styles/local.scss index 1dea8ca03..f72b99710 100644 --- a/src/wolnelektury/static/2022/styles/local.scss +++ b/src/wolnelektury/static/2022/styles/local.scss @@ -1,31 +1,9 @@ -$teal: #007880; - - -.l-change-pop { - transition: 350ms all; - - p { - a { - color: $teal; - } - } -} - -.is-open .l-change-pop { - height: 0; - margin-top: 0; - margin-bottom: 0; - padding-top: 0; - padding-bottom: 0; -} +$teal: #007880; +$green: #92BD39; +$red: #FF4C54; -.ui-autocomplete a { - display: block; - transition: none; -} - .jp-state-playing .icon-play { &:before { @@ -41,28 +19,38 @@ $teal: #007880; .sponsors-page { display: flex; - justify-content: space-between; margin-top: 48px; - - @include rwd(tablet) { - flex-wrap: wrap; + flex-wrap: wrap; + justify-content: space-around; + gap: 60px; + + @include rwd($break-wide) { + gap: 0; + justify-content: space-between; + flex-wrap: nowrap; } .sponsors-column { - margin: 1em 40px; + margin: 1em 0; display: flex; flex-direction: column; align-items: center; font-size: 0; + .sponsors-column-name { font-weight: $regular; @include font-size(18px); - line-height: 150%; + line-height: 115%; + height: 62px; + margin: 0; text-align: center; color: #474747; + display: flex; + align-items: center; + max-width: 8em; } .sponsor-logos { - height: 120px; + height: 140px; overflow: hidden; a { margin-top: 20px; @@ -194,12 +182,45 @@ $teal: #007880; padding: 5px 10px; margin-left: 5px; border-radius: 15px; + white-space: nowrap; + + a { + color: currentColor; + } + a:hover { + color: inherit; + } + + &.filter-category-epoch { + background: $teal; + color: white; + } + &.filter-category-kind { + background: $red; + } + &.filter-category-genre { + background: $green; + } + &.filter-category-set { + background: white; + color: black; + border: 1px solid #888; + + &:after { + content: ''; + font-family: 'wl' !important; + font-size: .9em; + margin-left: 3px; + color: $red; + } + } } } .with-filter { padding: 20px 0 0; position: relative; + width: 100%; h2 { margin-bottom: 0; @@ -207,6 +228,7 @@ $teal: #007880; } .with-filter .row div.filter-container { background: white; + width: 100%; top: 0; bottom: 100%; opacity: 0; @@ -222,6 +244,11 @@ $teal: #007880; opacity: 1; } } +.with-filter .row div.filter-container:hover { + top: 15px; + bottom: 5px; + opacity: 1; +} .l-books__input .filter-container { top: 0;