hexo-theme-stellar/source/css/_layout/widgets/widgets.styl

82 lines
1.7 KiB
Stylus
Raw Normal View History

2022-11-23 23:17:24 +08:00
.widgets
.loading-wrap
margin: 0.5rem 0
2024-01-17 22:57:52 +08:00
background: var(--alpha50)
2022-10-26 21:19:52 +08:00
2022-11-23 23:17:24 +08:00
.widgets
2022-10-26 21:19:52 +08:00
overflow: scroll
flex-grow: 1
scrollbar-width: none
scrollbar(0, 0)
z-index: 1
line-height: 1.2
2022-11-23 21:54:21 +08:00
.widget-wrapper
2022-10-26 21:19:52 +08:00
.widget-header
2024-02-05 18:01:50 +08:00
padding-left: var(--gap-padding)
padding-right: var(--gap-padding)
2022-10-26 21:19:52 +08:00
display: flex
justify-content: space-between
2024-01-31 22:45:07 +08:00
align-items: baseline
2024-01-17 00:27:48 +08:00
line-height: 28px
2024-01-17 22:57:52 +08:00
font-weight: 500
2024-01-31 22:45:07 +08:00
font-size: $fs-13
2024-01-17 22:57:52 +08:00
color: var(--text-p1)
2022-10-26 21:19:52 +08:00
.item
display: block
2024-01-17 00:27:48 +08:00
>span
2022-10-26 21:19:52 +08:00
text-align: left
2024-01-17 22:57:52 +08:00
opacity 0.6
2022-10-26 21:19:52 +08:00
&:empty
display: none
.cap-action
line-height: 0
2024-01-20 13:35:43 +08:00
color: inherit
opacity 0.6
trans2: opacity background
2024-01-17 00:27:48 +08:00
border-radius: 4px
padding: 6px
2024-02-02 00:36:01 +08:00
margin-right: -6px
2024-01-20 13:35:43 +08:00
svg
height: 1em
width: auto
transform: scale(1.2)
2024-01-17 00:27:48 +08:00
fill: var(--text-p2)
2022-10-26 21:19:52 +08:00
&:hover
color: $color-hover
2024-01-17 00:27:48 +08:00
background: var(--alpha100)
2024-01-20 13:35:43 +08:00
opacity 1
svg
2022-10-26 21:19:52 +08:00
fill: $color-hover
.widget-body
color: var(--text-p1)
p
margin-top: .5em
margin-bottom: .5em
line-height: 1.5
2024-01-17 00:27:48 +08:00
2022-11-27 17:16:38 +08:00
.widget-wrapper
2024-01-17 00:27:48 +08:00
display: block
2024-02-05 18:01:50 +08:00
.l_left .widgets
margin: 0 var(--gap-margin)
.widget-wrapper
margin: 32px 0
.l_right .widgets
.widget-wrapper
margin-top: 8px
.widget-header
padding-left: var(--gap-max)
padding-right: var(--gap-max)
&:not(.toc)
margin-left: var(--gap-margin)
margin-right: var(--gap-margin)
.widget-wrapper+.widget-wrapper
margin-top: 32px
@media screen and (max-width: $device-laptop)
.widget-wrapper
margin-top: var(--gap-margin)
border-radius: $border-card