Galleries/PythonGallery
1
0
Fork 0
mirror of https://github.com/Derpy-Leggies/OnlyLegs.git synced 2025-06-29 11:36:16 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Make buttons more consistent

Browse source 
Rename JumpUp button to top-of-page
This commit is contained in:
Michał Gdula 2023-03-12 18:19:43 +00:00
parent 0d10de923d
commit b208b872d7
13 changed files with 143 additions and 102 deletions
Download patch file Download diff file Expand all files Collapse all files

80
gallery/themes/default/components/elements/pop-up.sass
View file

@ -1,21 +1,3 @@
@mixin pop-up-btn($color, $fill: false)
@if $fill
color: $white
background-color: $color
border: 2px solid $color
&:hover
background-color: $white
color: $color
@else
color: $color
background-color: $white
border: 2px solid $color
&:hover
background-color: $color
color: $white
.pop-up
width: calc(100% - 3.5rem)
height: 100vh
@ -89,7 +71,7 @@
position: sticky
top: 0
font-size: 2.5rem
font-size: 2.25rem
font-weight: 600
text-align: center
line-height: 1
@ -151,61 +133,6 @@
.pop-up-wrapper
transform: translate(-50%, 50%) scale(1)
.pop-up__btn
margin: 0
padding: 0.5rem 1rem
width: auto
height: 2.5rem
display: flex
justify-content: center
align-items: center
font-size: 1rem
font-weight: 600
text-align: center
line-height: 1
border-radius: $rad-inner
cursor: pointer
transition: background-color 0.2s ease, color 0.2s ease
@include pop-up-btn($black)
&:focus
outline: none
.pop-up__btn-fill
@include pop-up-btn($black, true)
@each $name, $colour in (primary: $primary, info: $info, warning: $warning, critical: $critical)
.pop-up__btn-#{$name}
@include pop-up-btn($colour)
.pop-up__btn-#{$name}-fill
@include pop-up-btn($colour, true)
.pop-up__input
margin: 0
padding: 0.5rem
width: 100%
height: 2.5rem
font-size: 1rem
font-weight: 600
text-align: left
line-height: 1
border-radius: $rad-inner
background-color: $white
border: 2px solid $black
&:focus
outline: none
border-color: $primary
.pop-up__link
color: $primary
text-decoration: none
@ -251,7 +178,4 @@
opacity: 1
.pop-up-wrapper
transform: translateY(0)
.pop-up__btn
width: 100%
transform: translateY(0)