59 lines
1.4 KiB
Stylus
59 lines
1.4 KiB
Stylus
/* ---------------------------------
|
|
* Donate Buttons
|
|
* --------------------------------- */
|
|
$donate-qrcode-max-width ?= 280px
|
|
$donate-qrcode-shadow ?= $card-shadow
|
|
$donate-qrcode-box-radius ?= $card-radius
|
|
|
|
$donate-button-colors ?= {
|
|
'afdian': rgb(136, 95, 217),
|
|
'alipay': rgb(0, 160, 232),
|
|
'buymeacoffee': rgb(255, 221, 0),
|
|
'paypal': rgb(254, 183, 0),
|
|
'patreon': rgb(255, 66, 77),
|
|
'wechat': rgb(26, 173, 25),
|
|
}
|
|
|
|
.donate
|
|
position: relative
|
|
|
|
.qrcode
|
|
display: none
|
|
position: absolute
|
|
z-index: 99
|
|
bottom: 2.5em
|
|
line-height: 0
|
|
overflow: hidden
|
|
box-shadow: $donate-qrcode-shadow
|
|
border-radius: $donate-qrcode-box-radius
|
|
|
|
img
|
|
max-width: $donate-qrcode-max-width
|
|
|
|
&:hover
|
|
.qrcode
|
|
display: block
|
|
|
|
&:first-child:not(:last-child)
|
|
.qrcode
|
|
left: -.75rem
|
|
|
|
&:last-child:not(:first-child)
|
|
.qrcode
|
|
right: -.75rem
|
|
|
|
for $name, $color in $donate-button-colors
|
|
&[data-type={'"' + $name + '"'}]
|
|
color: findColorInvert($color)
|
|
background-color: $color
|
|
border-color: transparent
|
|
|
|
&:active
|
|
background-color: darken($color, 5%)
|
|
|
|
&:hover
|
|
background-color: darken($color, 2.5%)
|
|
|
|
&:focus:not(:active)
|
|
box-shadow: 0 0 0 .125em rgba($color, .25)
|