2021-03-05 21:37:28 +08:00
|
|
|
button
|
|
|
|
|
border: none
|
|
|
|
|
font-weight: 500
|
|
|
|
|
outline: none
|
|
|
|
|
disable-select()
|
|
|
|
|
cursor: pointer
|
|
|
|
|
|
|
|
|
|
a.button
|
|
|
|
|
font-weight: 500
|
|
|
|
|
line-height: 1
|
|
|
|
|
padding: 0.75rem 2rem
|
2022-12-15 22:42:48 +08:00
|
|
|
border-radius: $border-button
|
2021-03-05 21:37:28 +08:00
|
|
|
font-size: $fs-15
|
2022-12-16 14:53:08 +08:00
|
|
|
user-select: none
|
2021-03-05 21:37:28 +08:00
|
|
|
&.theme
|
|
|
|
|
background: $color-theme
|
2022-10-05 23:00:52 +08:00
|
|
|
color: var(--card)
|
2021-03-05 21:37:28 +08:00
|
|
|
&:hover
|
|
|
|
|
background: $color-hover
|
2022-12-15 22:42:48 +08:00
|
|
|
&.start
|
|
|
|
|
border-radius: 100px
|
|
|
|
|
background: var(--text-p1)
|
|
|
|
|
color: var(--card)
|
2021-03-05 21:37:28 +08:00
|
|
|
|
|
|
|
|
a[onclick]:hover
|
|
|
|
|
cursor: pointer
|
2022-12-16 14:53:08 +08:00
|
|
|
|
|
|
|
|
a.button.start.gradient
|
|
|
|
|
transition: 0.38s ease-out
|
|
|
|
|
position relative
|
|
|
|
|
z-index: 0
|
|
|
|
|
background: convert(hexo-config('style.gradient.start'))
|
|
|
|
|
background-size: 1000%
|
|
|
|
|
color: white
|
2022-12-16 23:45:36 +08:00
|
|
|
animation: glow 60s linear infinite
|
2022-12-16 14:53:08 +08:00
|
|
|
@keyframes glow {
|
|
|
|
|
from {
|
|
|
|
|
background-position: 0%
|
|
|
|
|
}
|
|
|
|
|
to {
|
|
|
|
|
background-position: 1000%
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
&:after
|
|
|
|
|
content: ''
|
|
|
|
|
position absolute
|
|
|
|
|
left: 0
|
|
|
|
|
right: 0
|
|
|
|
|
top: 0
|
|
|
|
|
bottom: 0
|
|
|
|
|
border-radius: 100px
|
|
|
|
|
background: inherit
|
|
|
|
|
z-index -1
|
|
|
|
|
filter: blur(36px)
|
|
|
|
|
transition: 0.38s ease-out
|
|
|
|
|
opacity 0
|
|
|
|
|
&:hover:after
|
|
|
|
|
opacity 1
|
