99 lines
1.8 KiB
SCSS

.WebLink {
min-height: 3rem;
padding: 0.25rem 0 0 3.75rem;
font-size: 0.875rem;
line-height: 1.125rem;
position: relative;
& + & {
margin-top: 1.5rem;
}
&.without-media::before {
content: attr(data-initial);
width: 3rem;
height: 3rem;
position: absolute;
left: 0;
top: 0;
background-color: var(--color-webpage-initial-background);
color: #fff;
display: flex;
align-items: center;
justify-content: center;
border-radius: var(--border-radius-messages-small);
text-transform: uppercase;
font-weight: 500;
font-size: 1.5rem;
}
.Media {
position: absolute;
left: 0;
top: 0;
width: 3rem;
height: 3rem;
cursor: default !important;
padding-bottom: unset !important;
border-radius: var(--border-radius-messages-small) !important;
}
.site-name,
.site-description,
.site-title {
word-break: break-word;
text-align: initial;
}
.site-name {
display: block;
color: var(--color-links);
font-weight: 400;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.site-title {
font-size: 1rem;
font-weight: 400;
margin-bottom: 0.0625rem;
line-height: 1.3125rem;
}
.sender-name,
.site-description {
margin-bottom: 0;
color: var(--color-text-secondary);
line-height: 1.125rem;
max-height: 2.25rem;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.sender-name {
margin-top: 0.25rem;
}
.site-description .emoji {
width: 1rem !important;
height: 1rem !important;
}
&[dir="rtl"] {
padding: 0.25rem 3.75rem 0 0;
.Media,
&.without-media::before {
left: auto;
right: 0;
}
.content {
text-align: right;
}
}
}