Post styling

This commit is contained in:
Michal Vanko 2024-03-02 22:56:06 +01:00
parent 872bf84a0e
commit 33e9f6b95e
4 changed files with 134 additions and 71 deletions

View File

@ -1,3 +1,6 @@
[build]
rustflags = ["-Z", "threads=8"]
[package]
name = "axum_server"
version = "0.1.0"

View File

@ -91,6 +91,7 @@ fn parse_html(markdown: &str) -> String {
alt="{alt}"
src="{src}"
/>
<figcaption>
"#,
alt = title,
src = dest_url,
@ -100,7 +101,7 @@ fn parse_html(markdown: &str) -> String {
}
_ => event,
},
Event::End(TagEnd::Image) => Event::Html("</figure>".into()),
Event::End(TagEnd::Image) => Event::Html("</figcaption></figure>".into()),
_ => event,
});

View File

@ -2,8 +2,7 @@
@tailwind components;
@tailwind utilities;
@layer base {
.article-body {
.article-body {
h1 {
@apply px-4 text-2xl text-blue-900 my-2;
}
@ -16,5 +15,21 @@
pre {
@apply p-4 my-1 overflow-auto text-sm;
}
figure {
@apply m-4;
img {
@apply rounded shadow-md;
}
}
figcaption {
@apply mt-2 text-center text-sm italic text-blue-800;
}
table {
@apply m-2 overflow-auto text-sm;
}
}
.video-embed {
@apply m-4;
}

View File

@ -444,63 +444,6 @@ video {
display: none;
}
.article-body {
h1 {
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
h1 {
padding-left: 1rem;
padding-right: 1rem;
}
h1 {
font-size: 1.5rem;
line-height: 2rem;
}
h1 {
--tw-text-opacity: 1;
color: rgb(30 58 138 / var(--tw-text-opacity));
}
h2 {
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
h2 {
padding-left: 1rem;
padding-right: 1rem;
}
h2 {
font-size: 1.25rem;
line-height: 1.75rem;
}
h2 {
--tw-text-opacity: 1;
color: rgb(30 58 138 / var(--tw-text-opacity));
}
p {
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
p {
padding-left: 1rem;
padding-right: 1rem;
}
pre {
margin-top: 0.25rem;
margin-bottom: 0.25rem;
}
pre {
overflow: auto;
}
pre {
padding: 1rem;
}
pre {
font-size: 0.875rem;
line-height: 1.25rem;
}
}
*, ::before, ::after {
--tw-border-spacing-x: 0;
--tw-border-spacing-y: 0;
@ -773,6 +716,107 @@ video {
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.article-body {
h1 {
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
h1 {
padding-left: 1rem;
padding-right: 1rem;
}
h1 {
font-size: 1.5rem;
line-height: 2rem;
}
h1 {
--tw-text-opacity: 1;
color: rgb(30 58 138 / var(--tw-text-opacity));
}
h2 {
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
h2 {
padding-left: 1rem;
padding-right: 1rem;
}
h2 {
font-size: 1.25rem;
line-height: 1.75rem;
}
h2 {
--tw-text-opacity: 1;
color: rgb(30 58 138 / var(--tw-text-opacity));
}
p {
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
p {
padding-left: 1rem;
padding-right: 1rem;
}
pre {
margin-top: 0.25rem;
margin-bottom: 0.25rem;
}
pre {
overflow: auto;
}
pre {
padding: 1rem;
}
pre {
font-size: 0.875rem;
line-height: 1.25rem;
}
figure {
margin: 1rem;
}
figure {
img {
border-radius: 0.25rem;
}
img {
--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
}
figcaption {
margin-top: 0.5rem;
}
figcaption {
text-align: center;
}
figcaption {
font-size: 0.875rem;
line-height: 1.25rem;
}
figcaption {
font-style: italic;
}
figcaption {
--tw-text-opacity: 1;
color: rgb(30 64 175 / var(--tw-text-opacity));
}
table {
margin: 0.5rem;
}
table {
overflow: auto;
}
table {
font-size: 0.875rem;
line-height: 1.25rem;
}
}
.video-embed {
margin: 1rem;
}
.after\:content-\[\'\2c \'\]::after {
--tw-content: ',';
content: var(--tw-content);