2022-04-08 13:48:36 +00:00
|
|
|
@import 'scss/variables';
|
2020-11-29 14:32:08 +00:00
|
|
|
|
|
|
|
.quote {
|
2021-03-17 13:01:53 +00:00
|
|
|
font-size: 0.8em;
|
|
|
|
text-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
|
2021-04-12 13:56:23 +00:00
|
|
|
cursor: initial;
|
|
|
|
user-select: none;
|
2021-08-27 17:27:11 +00:00
|
|
|
--shadow-shift: 0.125rem;
|
2022-04-08 13:48:36 +00:00
|
|
|
color: #fff;
|
|
|
|
font-weight: 600;
|
2020-11-29 14:32:08 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
.quoteauthor {
|
2021-03-17 13:01:53 +00:00
|
|
|
font-size: 0.9em;
|
|
|
|
letter-spacing: 0.5px;
|
2021-04-13 17:25:55 +00:00
|
|
|
user-select: none;
|
2021-08-25 12:28:41 +00:00
|
|
|
|
2021-08-27 17:27:11 +00:00
|
|
|
--shadow-shift: 0.125rem;
|
2021-04-11 19:17:23 +00:00
|
|
|
|
2021-04-10 15:22:37 +00:00
|
|
|
svg {
|
|
|
|
margin-left: 10px;
|
2021-04-11 19:17:23 +00:00
|
|
|
filter: drop-shadow(0 0 6px rgba(0, 0, 0, 0.3));
|
2021-04-10 15:22:37 +00:00
|
|
|
}
|
2020-11-29 14:32:08 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
i.material-icons,
|
|
|
|
h1.quoteauthor {
|
2021-03-17 13:01:53 +00:00
|
|
|
display: inline;
|
2020-11-29 14:32:08 +00:00
|
|
|
}
|
|
|
|
|
2022-04-08 13:48:36 +00:00
|
|
|
.quoteAuthorLink {
|
2021-03-17 13:01:53 +00:00
|
|
|
text-decoration: none;
|
|
|
|
color: white;
|
2021-04-12 13:56:23 +00:00
|
|
|
user-select: none;
|
2021-03-17 13:01:53 +00:00
|
|
|
}
|
2022-04-08 13:48:36 +00:00
|
|
|
|
|
|
|
.author {
|
|
|
|
@extend %basic;
|
|
|
|
display: flex;
|
|
|
|
flex-flow: row;
|
|
|
|
height: 70px;
|
|
|
|
font-weight: 300;
|
|
|
|
margin: 10px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.author-name {
|
|
|
|
font-size: clamp(15px, 2.5vw, 0.6em);
|
|
|
|
}
|
|
|
|
|
|
|
|
.author-knownfor {
|
|
|
|
font-size: clamp(13px, 2.5vw, 0.4em);
|
|
|
|
@include themed() {
|
|
|
|
color: t($subColor);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.author-license {
|
|
|
|
font-size: clamp(8px, 2.5vw, 0.25em);
|
|
|
|
@include themed() {
|
|
|
|
color: t($subColor);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.author img {
|
|
|
|
height: 100%;
|
|
|
|
width: auto;
|
|
|
|
border-radius: 12px 0 0 12px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.author-img {
|
|
|
|
@extend %basic;
|
|
|
|
height: 100%;
|
|
|
|
width: 70px;
|
|
|
|
border-radius: 12px 0 0 12px;
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
justify-content: center;
|
|
|
|
background-size: cover !important;
|
|
|
|
background-repeat: no-repeat !important;
|
|
|
|
background-position: initial;
|
|
|
|
}
|
|
|
|
|
|
|
|
.author-content {
|
|
|
|
display: flex;
|
|
|
|
flex-flow: column;
|
|
|
|
justify-content: center;
|
|
|
|
align-items: flex-start;
|
|
|
|
padding: 20px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.author-holder {
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
justify-content: center;
|
|
|
|
flex-flow: column;
|
2022-04-11 21:57:07 +00:00
|
|
|
animation: fadeIn 1s;
|
|
|
|
}
|
|
|
|
|
|
|
|
@keyframes fadeIn {
|
|
|
|
0% {
|
|
|
|
opacity: 0;
|
|
|
|
}
|
|
|
|
100% {
|
|
|
|
opacity: 1;
|
|
|
|
}
|
2022-04-08 13:48:36 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
.quote-buttons {
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
gap: 10px;
|
|
|
|
padding: 20px 20px 20px 0;
|
|
|
|
|
|
|
|
a {
|
|
|
|
display: flex;
|
|
|
|
}
|
|
|
|
a {
|
|
|
|
@include basicIconButton(11px, 1.3rem, ui);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.quotediv {
|
2022-04-11 21:57:07 +00:00
|
|
|
animation: fadeIn 1s;
|
2022-04-08 13:48:36 +00:00
|
|
|
width: 40vw;
|
|
|
|
display: flex;
|
|
|
|
flex-direction: column;
|
|
|
|
gap: 10px;
|
|
|
|
button {
|
|
|
|
@include basicIconButton(11px, 1.3rem, ui);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.deleteButton {
|
|
|
|
height: auto !important;
|
|
|
|
@include basicIconButton(11px, 1.3rem, modal);
|
|
|
|
}
|