2023-11-28 10:58:59 +00:00
|
|
|
annotation-row {
|
|
|
|
display: flex;
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
|
|
border-radius: 5px;
|
2024-01-03 22:11:54 +00:00
|
|
|
border: 1px solid var(--color-quinary-on-sidepane);
|
2023-11-28 10:58:59 +00:00
|
|
|
background: var(--material-background);
|
|
|
|
|
|
|
|
.head {
|
|
|
|
display: flex;
|
|
|
|
padding: 4px 8px;
|
|
|
|
align-items: center;
|
|
|
|
gap: 4px;
|
|
|
|
border-bottom: 1px solid var(--fill-quinary);
|
|
|
|
|
|
|
|
.icon {
|
|
|
|
width: 16px;
|
|
|
|
height: 16px;
|
|
|
|
-moz-context-properties: fill;
|
|
|
|
fill: var(--annotation-color, var(--fill-secondary));
|
|
|
|
}
|
|
|
|
|
|
|
|
.title {
|
2024-01-12 22:45:01 +00:00
|
|
|
font-weight: 600;
|
2023-11-28 10:58:59 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.body {
|
|
|
|
img {
|
|
|
|
max-width: 100%;
|
|
|
|
}
|
|
|
|
|
|
|
|
.quote, .comment {
|
|
|
|
display: -webkit-box;
|
|
|
|
-webkit-box-orient: vertical;
|
|
|
|
-webkit-line-clamp: 9;
|
|
|
|
overflow: hidden;
|
2024-06-06 14:02:52 +00:00
|
|
|
overflow-wrap: anywhere;
|
2023-11-28 10:58:59 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
.quote {
|
|
|
|
margin: 3px 8px;
|
|
|
|
padding-inline-start: 6px;
|
|
|
|
border-inline-start: 2px solid var(--annotation-color, var(--fill-secondary));
|
|
|
|
color: var(--fill-secondary);
|
|
|
|
|
|
|
|
@include comfortable {
|
|
|
|
margin-block: 5px;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.comment {
|
|
|
|
padding: 3px 8px;
|
|
|
|
|
|
|
|
@include comfortable {
|
|
|
|
padding-block: 4px;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.tags {
|
|
|
|
border-top: 1px solid var(--fill-quinary);
|
|
|
|
padding: 3px 8px;
|
|
|
|
}
|
|
|
|
}
|