81 lines
1.5 KiB
SCSS
81 lines
1.5 KiB
SCSS
// Copyright 2022 Signal Messenger, LLC
|
|
// SPDX-License-Identifier: AGPL-3.0-only
|
|
|
|
.StoryLinkPreview {
|
|
align-items: center;
|
|
background-color: $color-white;
|
|
border-radius: 36px;
|
|
color: $color-gray-90;
|
|
display: inline-flex;
|
|
max-width: 560px;
|
|
min-width: 560px;
|
|
overflow: hidden;
|
|
|
|
&__content {
|
|
margin-left: 24px;
|
|
margin-right: 24px;
|
|
padding: 16px 0;
|
|
}
|
|
|
|
&__title {
|
|
@include font-body-1-bold;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-line-clamp: 1;
|
|
display: -webkit-box;
|
|
overflow: hidden;
|
|
font-size: 28px;
|
|
line-height: 40px;
|
|
letter-spacing: -0.16px;
|
|
}
|
|
|
|
&__description {
|
|
@include font-body-2;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-line-clamp: 2;
|
|
display: -webkit-box;
|
|
overflow: hidden;
|
|
font-size: 26px;
|
|
line-height: 36px;
|
|
letter-spacing: -0.06px;
|
|
}
|
|
|
|
&__location {
|
|
@include font-caption;
|
|
color: $color-gray-45;
|
|
font-size: 22px;
|
|
line-height: 28px;
|
|
letter-spacing: 0.12px;
|
|
}
|
|
|
|
&__no-image {
|
|
align-items: center;
|
|
display: flex;
|
|
height: 176px;
|
|
justify-content: center;
|
|
margin-left: 52px;
|
|
margin-right: 52px;
|
|
|
|
&::before {
|
|
@include color-svg('../images/icons/v2/link-24.svg', $color-gray-90);
|
|
content: '';
|
|
display: block;
|
|
height: 48px;
|
|
width: 48px;
|
|
}
|
|
}
|
|
|
|
&--tall {
|
|
flex-direction: column;
|
|
}
|
|
|
|
&--tiny {
|
|
min-width: inherit;
|
|
|
|
.StoryLinkPreview__no-image {
|
|
height: 100px;
|
|
margin-left: 24px;
|
|
margin-right: 0;
|
|
width: auto;
|
|
}
|
|
}
|
|
}
|