lib.itmens/common/static/scss/_common.scss
2024-04-21 11:44:06 -04:00

240 lines
3.6 KiB
SCSS

.tldr {
overflow: hidden;
text-overflow: " ... [点击展开]";
display: -webkit-box;
-webkit-line-clamp: 10;
-webkit-box-orient: vertical;
}
.tldr-2 {
overflow: hidden;
text-overflow: " ... [点击展开]";
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.longlist {
max-height: 60vh;
overflow-y: scroll;
}
.hidden {
display: none;
}
.invisible {
visibility: hidden;
}
.folded {
max-height: 0;
transform: scaleY(0);
transform-origin: top;
transition: transform 0.2s ease;
}
.folded.unfold {
max-height: max-content;
transform: scaleY(1);
}
a:not(:hover) {
text-decoration: none;
}
body {
--pico-block-spacing-vertical: var(--pico-block-spacing-horizontal);
}
article.item-card {
padding: calc(var(--pico-block-spacing-horizontal));
margin-bottom: calc(var(--pico-block-spacing-vertical) / 2);
header,
footer {
padding: calc(var(--pico-block-spacing-horizontal) / 2);
}
section {
margin-bottom: calc(var(--pico-spacing) / 1);
}
}
article.item-card.external h5 {
font-style: italic;
}
details {
margin: 0;
}
.invalid {
color: var(--pico-del-color);
}
.valid {
color: var(--pico-ins-color);
}
.empty {
font-style: italic;
font-size: 80%;
color: var(--pico-muted-color);
}
.deleting {
background: repeating-linear-gradient(
135deg,
var(--pico-muted-border-color),
var(--pico-muted-border-color) 10px,
var(--pico-background-color) 10px,
var(--pico-background-color) 20px
);
}
.hint {
color: var(--pico-muted-color);
opacity: 0.5;
}
.oneline {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.handler {
color: var(--pico-muted-color);
word-break: break-all;
opacity: 0.5;
}
.loading {
color: var(--pico-muted-color);
opacity: 0.5;
}
.shelf {
.action {
margin-top: 0.1em;
}
}
.post {
span.invisible {
display: none;
}
span.ellipsis:after {
content: "";
}
}
.action {
width: max-content;
float: right;
&.inline {
float: none;
}
>span {
padding-left: calc(var(--pico-spacing)/2);
}
a {
cursor: pointer;
text-decoration: none;
}
a.hidden {
display: none;
}
a.disabled,
.timestamp {
cursor: unset;
color: var(--pico-muted-color);
opacity: 0.5;
}
a:not(:hover) {
color: var(--pico-muted-color);
opacity: 0.5;
}
a.activated:not(:hover) {
color: var(--pico-primary);
opacity: 1;
}
.tag-list a:not(:hover) {
color: white;
}
}
.hide-action {
.action {
display: none !important;
}
}
small.title_deco {
color: var(--pico-muted-color);
opacity: 0.5;
}
form img {
max-height: 20vh;
}
.avatar {
display: inline-block;
img {
border-radius: 50%;
height: calc(1rem * var(--pico-line-height) + var(--pico-nav-link-spacing-vertical) * 2 - var(--pico-border-width) * 2);
width: calc(1rem * var(--pico-line-height) + var(--pico-nav-link-spacing-vertical) * 2 - var(--pico-border-width) * 2);
border: 2px solid var(--pico-form-element-background-color);
border-radius: 50%;
transition: linear 0.25s;
}
}
.avatar a img:hover {
transition: ease-out 0.2s;
border: 2px solid var(--pico-primary);
-webkit-transition: ease-out 0.2s;
}
.multi-fields {
>span:not(:first-child):before {
content: "/";
margin: 0 0.5em;
}
}
.pagination {
text-align: center;
width: 100%;
margin-top: 1em;
a {
margin: 0 0.3em;
}
.s, .prev, .next {
font-size: 1.4em;
}
.prev {
margin-right: 0.5em;
}
.next {
margin-left: 0.5em;
}
.current {
font-weight: bold;
font-size: 1.1em;
color: var(--pico-secondary);
}
}