X-Git-Url: https://git.mdrn.pl/wolnelektury.git/blobdiff_plain/fd1a9915dd65789cccf27041a1f01cd4077273fc..7e9be4e3962e1cccc43798d0507b2c82cd1d275c:/src/wolnelektury/static/2022/more.scss diff --git a/src/wolnelektury/static/2022/more.scss b/src/wolnelektury/static/2022/more.scss index 8e50810cc..9d7cf2199 100644 --- a/src/wolnelektury/static/2022/more.scss +++ b/src/wolnelektury/static/2022/more.scss @@ -1,3 +1,100 @@ +body.is-open { + height: 100%; + overflow-y: hidden; +} + +.l-change-pop { + margin-top: 18px; +} +.is-open .l-change-pop { + height: auto; + margin-top: 18px; + padding: 10px 50px; +} + +.l-navigation__logo { + height: 44px; +} + +.l-navigation__menu { + .scrollable { + height: 100%; + overflow-y: scroll; + padding-bottom: 30px; + } +} + +.l-navigation__menu__book__header { + display: flex; + align-items: center; + justify-content: space-between; + + p { + margin: 0; + + &.korona { + &:before { + content: url('images/korona.svg'); + width: 21px; + margin-right: -21px; + position: relative; + top: -10px; + left: -3px; + } + } + } +} +.l-navigation__menu__book { + .button { + display: inline-block; + font-size: 16px; + font-weight: 700; + padding: 0 20px; + min-width: 212px; + line-height: 38px; + text-align: center; + + /* green 700 */ + background: #92BD39; + color: #083F4D; + border-radius: 6px; + + transition: background-color 150ms; + + &:hover { + background-color: #FBC40F; + } + } +} +.l-navigation__menu__book__info { + img { + width: 42px; + height: 60px; + } +} +.l-navigation__menu__links ul li a em { + font-style: normal; + color: #FFA500; + font-weight: 600; +} +.l-navigation__login { + color: #74BDC2; + margin-right: 20px; + + a { + color: white; + } +} +.l-navigation__actions { + position: relative; + height: 44px; + + .user { + margin-right: 25px; + } +} + + .l-books { margin-right: -17px; } @@ -36,6 +133,9 @@ } } +.l-checkout__box { + position: relative; +} .l-checkout__payments { display: none; @@ -98,3 +198,57 @@ } } } + + + +#user-menu { + //display: none; + + position:absolute; + top: 60px; + z-index: 1; + + position: absolute; + width: 186px; + top: 48px; + right: 45px; + + /* yellow 900 */ + background: #F7BA00; + box-shadow: 0px 0px 20px rgba(1, 129, 137, 0.2); + border-radius: 10px; + overflow: hidden; + + opacity:0; + pointer-events: none; + transition: 200ms opacity; + + &.is-open { + //display: block; + pointer-events: all; + opacity: 100%; + } + + ul { + margin: 0; + padding: 0; + list-style: none; + + li { + a { + color: #474747; + display: block; + line-height: 27px; + padding: 8px 21px; + &:hover { + color: #474747; + background: #EDAA00; + } + + strong { + font-weight: 600; + } + } + } + } +}