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

Switch button and pop-up styling

Browse source 
again
This commit is contained in:
Michał Gdula 2023-04-19 15:05:54 +00:00
parent 48f6b02755
commit f0e586d0d5
6 changed files with 32 additions and 38 deletions
Download patch file Download diff file Expand all files Collapse all files

34
onlylegs/static/sass/components/buttons/block.sass
View file

@ -1,11 +1,12 @@
@mixin btn-block($color)
background-color: RGBA($color, 0.1)
color: RGB($color)
box-shadow: 0 1px 0 RGBA($black, 0.2), 0 -1px 0 RGBA($white, 0.2)
// box-shadow: 0 1px 0 RGBA($black, 0.2), 0 -1px 0 RGBA($white, 0.2)
&:hover, &:focus-visible
background-color: RGBA($color, 0.1)
background-color: RGBA($color, 0.15)
color: RGB($color)
box-shadow: 0 1px 0 RGBA($black, 0.2), 0 -1px 0 RGBA($color, 0.2)
// box-shadow: 0 1px 0 RGBA($black, 0.2), 0 -1px 0 RGBA($color, 0.2)
.btn-block
@ -29,7 +30,7 @@
color: RGB($white)
border: none
border-radius: $rad-inner
box-shadow: 0 1px 0 RGBA($black, 0.2), 0 -1px 0 RGBA($white, 0.2)
// box-shadow: 0 1px 0 RGBA($black, 0.2), 0 -1px 0 RGBA($white, 0.2)
outline: none
cursor: pointer
@ -37,23 +38,24 @@
&:hover, &:focus-visible
background-color: RGBA($white, 0.2)
box-shadow: 0 1px 0 RGBA($black, 0.3), 0 -1px 0 RGBA($white, 0.3)
// box-shadow: 0 1px 0 RGBA($black, 0.3), 0 -1px 0 RGBA($white, 0.3)
&.transparent
background-color: transparent
&:hover, &:focus-visible
text-decoration: underline
&.primary
@include btn-block($primary)
&.critical
@include btn-block($critical)
&.warning
@include btn-block($warning)
&.success
@include btn-block($success)
&.info
@include btn-block($info)
&.black
@include btn-block($black)
@ -94,7 +96,7 @@
border: none
border-bottom: 3px solid RGBA($white, 0.1)
border-radius: $rad-inner
box-shadow: 0 1px 0 RGBA($black, 0.2), 0 -1px 0 RGBA($white, 0.2)
// box-shadow: 0 1px 0 RGBA($black, 0.2), 0 -1px 0 RGBA($white, 0.2)
outline: none
cursor: pointer
@ -134,7 +136,7 @@
color: RGB($white)
border: none
border-radius: $rad-inner
box-shadow: 0 1px 0 RGBA($black, 0.2), 0 -1px 0 RGBA($white, 0.2)
// box-shadow: 0 1px 0 RGBA($black, 0.2), 0 -1px 0 RGBA($white, 0.2)
outline: none
cursor: pointer
@ -157,17 +159,17 @@
&:hover, &:focus-visible
background-color: RGBA($white, 0.2)
color: RGB($white)
box-shadow: 0 1px 0 RGBA($black, 0.3), 0 -1px 0 RGBA($white, 0.3)
// box-shadow: 0 1px 0 RGBA($black, 0.3), 0 -1px 0 RGBA($white, 0.3)
&.active
background-color: RGBA($primary, 0.2)
color: RGB($primary)
box-shadow: 0 1px 0 RGBA($black, 0.3), 0 -1px 0 RGBA($primary, 0.3)
// box-shadow: 0 1px 0 RGBA($black, 0.3), 0 -1px 0 RGBA($primary, 0.3)
&.edging
background-color: RGBA($white, 0.2)
color: RGB($white)
box-shadow: 0 1px 0 RGBA($black, 0.3), 0 -1px 0 RGBA($white, 0.3)
// box-shadow: 0 1px 0 RGBA($black, 0.3), 0 -1px 0 RGBA($white, 0.3)
input
display: none // So it doesnt get in the way of the drop as that breaks things
@ -175,4 +177,4 @@
&.error
background-color: RGBA($critical, 0.2)
color: RGB($critical)
box-shadow: 0 1px 0 RGBA($black, 0.3), 0 -1px 0 RGBA($critical, 0.3)
// box-shadow: 0 1px 0 RGBA($black, 0.3), 0 -1px 0 RGBA($critical, 0.3)