68 lines
1.3 KiB
Stylus
68 lines
1.3 KiB
Stylus
button
|
|
border: none
|
|
font-weight: 500
|
|
outline: none
|
|
disable-select()
|
|
cursor: pointer
|
|
|
|
a.button
|
|
font-weight: 500
|
|
line-height: 1
|
|
padding: 0.75rem 2rem
|
|
border-radius: $border-button
|
|
font-size: $fs-15
|
|
user-select: none
|
|
&.theme
|
|
background: $color-theme
|
|
color: var(--card)
|
|
&:hover
|
|
background: $color-hover
|
|
&.start
|
|
border-radius: 100px
|
|
background: var(--text-p1)
|
|
color: var(--card)
|
|
|
|
a[onclick]:hover
|
|
cursor: pointer
|
|
|
|
a.button.start.gradient
|
|
position relative
|
|
ondark()
|
|
transition: 0.38s ease-out
|
|
z-index: 0
|
|
background: convert(hexo-config('style.gradient.start'))
|
|
background-size: 1000%
|
|
color: white
|
|
text-shadow: 0 0 1px rgba(0,0,0,0.12)
|
|
animation: glow 60s linear infinite
|
|
@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(12px)
|
|
opacity: 0.5
|
|
transition: 0.38s ease-out
|
|
&:hover:after
|
|
filter: blur(36px)
|
|
opacity 1
|
|
|
|
:root[data-theme="dark"] &
|
|
ondark()
|
|
:root:not([data-theme]) &
|
|
@media (prefers-color-scheme: dark)
|
|
ondark()
|