gitea/nas
1
0
Fork 2
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

Add rendering of quote posts in web UI (#34738)

Browse source
This commit is contained in:
diondiondion 2025-05-21 17:50:45 +02:00 • committed by GitHub
parent f1a6f4333a
commit 97b9e8849d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
14 changed files with 219 additions and 43 deletions
Download patch file Download diff file Expand all files Collapse all files

61
app/javascript/styles/mastodon/components.scss
View file

@ -1491,8 +1491,12 @@ body > [data-popper-placement] {
}
}
&--is-quote {
border: none;
}
&--in-thread {
$thread-margin: 46px + 10px;
--thread-margin: calc(46px + 8px);
border-bottom: 0;
@ -1508,16 +1512,16 @@ body > [data-popper-placement] {
.hashtag-bar,
.content-warning,
.filter-warning {
margin-inline-start: $thread-margin;
width: calc(100% - $thread-margin);
margin-inline-start: var(--thread-margin);
width: calc(100% - var(--thread-margin));
}
.more-from-author {
width: calc(100% - $thread-margin + 2px);
width: calc(100% - var(--thread-margin) + 2px);
}
.status__content__read-more-button {
margin-inline-start: $thread-margin;
margin-inline-start: var(--thread-margin);
}
}
@ -1873,6 +1877,41 @@ body > [data-popper-placement] {
}
}
.status__quote {
position: relative;
margin-block-start: 16px;
margin-inline-start: 56px;
border-radius: 8px;
color: var(--nested-card-text);
background: var(--nested-card-background);
border: var(--nested-card-border);
}
.status__quote--error {
display: flex;
align-items: center;
gap: 8px;
padding: 12px;
font-size: 15px;
}
.status__quote-icon {
position: absolute;
inset-block-start: 18px;
inset-inline-start: -50px;
display: block;
width: 26px;
height: 26px;
padding: 5px;
color: #6a49ba;
z-index: 10;
.status__quote--error & {
inset-block-start: 50%;
transform: translateY(-50%);
}
}
.detailed-status__link {
display: inline-flex;
align-items: center;
@ -2306,11 +2345,6 @@ a.account__display-name {
}
}
.status__avatar {
width: 46px;
height: 46px;
}
.muted {
.status__content,
.status__content p,
@ -10515,6 +10549,7 @@ noscript {
line-height: 22px;
color: $darker-text-color;
-webkit-line-clamp: 4;
line-clamp: 4;
-webkit-box-orient: vertical;
max-height: none;
overflow: hidden;
@ -10818,9 +10853,9 @@ noscript {
.content-warning {
display: block;
box-sizing: border-box;
background: rgba($ui-highlight-color, 0.05);
color: $secondary-text-color;
border: 1px solid rgba($ui-highlight-color, 0.15);
background: var(--nested-card-background);
color: var(--nested-card-text);
border: var(--nested-card-border);
border-radius: 8px;
padding: 8px (5px + 8px);
position: relative;

4
app/javascript/styles/mastodon/css_variables.scss
View file

@ -27,6 +27,10 @@
--rich-text-container-color: rgba(87, 24, 60, 100%);
--rich-text-text-color: rgba(255, 175, 212, 100%);
--rich-text-decorations-color: rgba(128, 58, 95, 100%);
--nested-card-background: color(from #{$ui-highlight-color} srgb r g b / 5%);
--nested-card-text: #{$secondary-text-color};
--nested-card-border: 1px solid
color(from #{$ui-highlight-color} srgb r g b / 15%);
--input-placeholder-color: #{$dark-text-color};
--input-background-color: var(--surface-variant-background-color);
--on-input-color: #{$secondary-text-color};