wf_akkoma-fe/patches/pr412_better-markdown-quotes.patch
2024-10-14 00:21:08 +02:00

99 lines
3.3 KiB
Diff

From 00fb74aa84160ac0b484b7db4050b3e20b76b781 Mon Sep 17 00:00:00 2001
From: ilja <git@ilja.space>
Date: Wed, 21 Aug 2024 17:57:40 +0200
Subject: [PATCH] commit 1 ======== Improve style for quoted text in
RichContent
Previously quoted text (e.g. in Markdown `> Some text`) was italic
When two different quotes were made, there was no destinction between the two, making it look like one quote
This is confusing
Now we have a vertical line in front of the quote
When two different pieces of text are quoted, it is now clear because the lines are separated
This vertical line is a typical way of visualising quoted text, so it should be easy to understand what it is
commit 2
========
Make text faint for blockquotes
In code review it was decided that faint text for blockquotes should be used.
I copied how it was done in other places to faint text.
When making a theme for *oma-fe, there's a check for how readable things remain.
I'm unsure how that exactly works, but timestamps for a status is also faint,
so by using the same way of doing this, this should also be taken into account
for the theming engine.
commit 3
========
Fix spacing between paragraph and blockquote
Blockquotes are blocks, so not wrapped in an extra p-tag.
In statusses this gave an unfortunate result that the margins were different.
A p-tag has a bottom margin of 1em. Blockquotes had 0.2em top and bottom.
So under a paragraph there was 1em space, but under the blockquote, there was only 0.2em space.
The last p-tag has 0 margin at the bottom.
This commit basically does the same thing for blockquotes now, making it more consistent.
One difference is that the blockquote has a left margin of 0.2em because a little "jump"
in makes it look a bit better imo.
commit 4
========
Remove pre-wrap from status_body
For some strange reason, after a mention a quote would be double as high as it should.
Removing this "pre-wrap" seems to fix this. I'm not sure what it was exactly for, but I don't see anything break.
The code blocks now don't wrap any more, but show a scroll bar, which imo is better for a code block.
---
src/components/rich_content/rich_content.scss | 14 ++++++++++++--
src/components/status_body/status_body.scss | 3 ---
2 files changed, 12 insertions(+), 5 deletions(-)
diff --git a/src/components/rich_content/rich_content.scss b/src/components/rich_content/rich_content.scss
index 63df7d74..f9c019c3 100644
--- a/src/components/rich_content/rich_content.scss
+++ b/src/components/rich_content/rich_content.scss
@@ -1,7 +1,17 @@
+@import './../../_variables.scss';
+
.RichContent {
blockquote {
- margin: 0.2em 0 0.2em 2em;
- font-style: italic;
+ margin: 0 0 1em 0.2em;
+ padding: 0 0 0 1em;
+ border-width: 0 0 0 0.3em;
+ border-style: solid;
+ color: $fallback--faint;
+ color: var(--faint, $fallback--faint);
+ }
+
+ blockquote:last-child {
+ margin-bottom: 0;
}
pre {
diff --git a/src/components/status_body/status_body.scss b/src/components/status_body/status_body.scss
index 434cb482..236d8ee1 100644
--- a/src/components/status_body/status_body.scss
+++ b/src/components/status_body/status_body.scss
@@ -61,9 +61,6 @@
}
.text {
- & > * {
- white-space: pre-wrap;
- }
&.-single-line {
white-space: nowrap;
text-overflow: ellipsis;
--
2.39.5