aniva/Chrysoblog
aniva
/
Chrysoblog
1
1
Fork 0
Code Issues 9 Pull Requests 2 Packages Projects Releases Wiki Activity

fix: Code block indent and content envvar reading

This commit is contained in:
Leni Aniva 2024-09-14 19:01:40 -07:00
parent e10fca7ffe
commit 76a716839a
Signed by: aniva
GPG Key ID: 4D9B1C8D10EA4C50
4 changed files with 20 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/routes/+page.svelte
View File

@ -75,7 +75,7 @@
</div> </div>
</div> </div>
</div> </div>
<article class="prose-bio lg:prose-xl dark:prose-invert"> <article id="bio-core" class="prose lg:prose-xl dark:prose-invert">
<Content /> <Content />
</article> </article>
</div> </div>
@ -149,9 +149,15 @@
height: 20vh; height: 20vh;
border-radius: 50%; border-radius: 50%;
} }
:global(h1 after) { #bio-core {
content: ' '; width: 100%;
display: block; }
border: 2px solid black; #bio-core > :global(*):not(h1):not(h2) {
margin-left: 50px;
}
#bio-core > :global(h1) {
color: theme('colors.eucalyptus.700');
font-weight: normal;
border-bottom: 1px solid;
} }
</style> </style>

4
src/style/content.css
View File

@ -1,3 +1,7 @@
blockquote {
background: #fafaee;
font-style: italic;
}
/* block quotes */ /* block quotes */
.note-blockquote { .note-blockquote {
border-left: 4px solid #0078d4; /* Blue left border */ border-left: 4px solid #0078d4; /* Blue left border */

2
svelte.config.js
View File

@ -2,7 +2,7 @@ import adapter from '@sveltejs/adapter-auto';
import { vitePreprocess } from '@sveltejs/vite-plugin-svelte'; import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
import { mdsvex } from 'mdsvex'; import { mdsvex } from 'mdsvex';
const contentDir = import.meta.env.CHRYSOBLOG_CONTENT || "src/content"; const contentDir = import.meta.env?.CHRYSOBLOG_CONTENT ?? "src/content";
/** @type {import('@sveltejs/kit').Config} */ /** @type {import('@sveltejs/kit').Config} */
const config = { const config = {

19
tailwind.config.ts
View File

@ -87,6 +87,9 @@ const config: Config = {
}, },
typography: ((theme) => { typography: ((theme) => {
let markdownCommon = { let markdownCommon = {
h1: {
color: theme('colors.eucalyptus.700'),
},
h2: { h2: {
color: theme('colors.eucalyptus.700'), color: theme('colors.eucalyptus.700'),
}, },
@ -104,27 +107,13 @@ const config: Config = {
listStyleType: "decimal", listStyleType: "decimal",
listStylePosition: "outside", listStylePosition: "outside",
}, },
maxWidth: "100%",
}; };
return { return {
bio: {
css: {
...markdownCommon,
h1: {
color: theme('colors.eucalyptus.700'),
"border-bottom": "1px solid",
},
"*:not(h1):not(h2):not(span):not(code)": {
"margin-left": "50px",
},
},
},
DEFAULT: { DEFAULT: {
css: { css: {
...markdownCommon, ...markdownCommon,
h1: {
color: theme('colors.eucalyptus.700'),
},
}, },
}, },
}; };