v1/UI/src/generic.sass

67 lines
1.3 KiB
Sass

.rp-button
border: 0
border-radius: 2px
transition: transform 0.2s ease-out, box-shadow 0.2s ease-out
position: relative
box-sizing: border-box
transform: translateZ(0)
&::after
content: ""
position: absolute
top: 0
bottom: 0
right: 0
left: 0
background-color: rgba(0,0,0,0.1)
border-radius: 2px
transform: translateZ(0)
opacity: 0
transition: opacity 0.15s ease-in-out
&:hover
transform: translateZ(0) translateY(-1px)
box-shadow: 0 1px 2px rgba(0,0,0,0.3)
&::after
opacity: 0.7
&:active
transform: translateZ(0) translateY(0px)
box-shadow: none
&::after
opacity: 1
&.primary
background-color: var(--c-green)
color: var(--c-dark)
&.secondary
background-color: var(--c-3)
color: var(--c-7)
&.c5
background-color: var(--c-5)
color: var(--c-9)
&.discord
background-color: var(--c-discord)
color: var(--c-white)
&.discord-alt
background-color: transparent
color: var(--c-white)
border: 1px solid var(--c-discord)
&::after
background-color: hsla(0,0%,100%,0.05)
transition: opacity 0.3s ease-in-out
&-logo
height: 1.6rem
.rp-discord
border: 1px solid var(--c-discord-dark)
box-shadow: 0 0 1px rgba(0,0,0,0.3)
svg.smol-bump
position: relative
top: -0.125rem