BUG: Lists aren't rendering properly.
This commit is contained in:
parent
793e656efa
commit
0961df361c
65
src/app.css
65
src/app.css
@ -3,6 +3,71 @@
|
||||
|
||||
/* This is very painful. There must be a better way. */
|
||||
@layer base {
|
||||
|
||||
div.blog-wrapper h1,
|
||||
div.blog-wrapper h2,
|
||||
div.blog-wrapper h3,
|
||||
div.blog-wrapper h4,
|
||||
div.blog-wrapper h5,
|
||||
div.blog-wrapper h6,
|
||||
div.blog-wrapper p,
|
||||
div.blog-wrapper ul,
|
||||
div.blog-wrapper ol {
|
||||
@apply text-gray-300;
|
||||
}
|
||||
|
||||
div.blog-wrapper ul {
|
||||
list-style-type: disc !important;
|
||||
@apply bg-red-500;
|
||||
}
|
||||
|
||||
div.blog-wrapper.prose ul {
|
||||
list-style-type: disc;
|
||||
@apply bg-red-500;
|
||||
}
|
||||
|
||||
div.blog-wrapper ul {
|
||||
@apply list-decimal;
|
||||
}
|
||||
|
||||
div.blog-wrapper h1 {
|
||||
@apply text-4xl font-bold;
|
||||
}
|
||||
|
||||
div.blog-wrapper h2 {
|
||||
@apply text-3xl font-bold;
|
||||
}
|
||||
|
||||
div.blog-wrapper h3 {
|
||||
@apply text-2xl font-bold;
|
||||
}
|
||||
|
||||
div.blog-wrapper h4 {
|
||||
@apply text-xl font-bold;
|
||||
}
|
||||
|
||||
div.blog-wrapper h5 {
|
||||
@apply text-lg font-bold;
|
||||
}
|
||||
|
||||
/* Same size as h5, but not bold */
|
||||
div.blog-wrapper h6 {
|
||||
@apply text-lg;
|
||||
}
|
||||
|
||||
div.blog-wrapper p {
|
||||
@apply text-sm;
|
||||
}
|
||||
|
||||
div.blog-wrapper a {
|
||||
@apply underline hover:text-blue-300;
|
||||
}
|
||||
|
||||
div.blog-wrapper p code {
|
||||
@apply bg-[#191724] p-1;
|
||||
}
|
||||
|
||||
|
||||
pre {
|
||||
background-color: #191724;
|
||||
padding: 0.5rem 2rem;
|
||||
|
||||
@ -1,7 +1,70 @@
|
||||
# This is a blog post
|
||||
# H1 Tag
|
||||
## H2 Tag
|
||||
### H3 Tag
|
||||
#### H4 Tag
|
||||
##### H5 Tag
|
||||
###### H6 Tag
|
||||
|
||||
*This text is italic*
|
||||
**This text is bold**
|
||||
***This text is bold and italic***
|
||||
|
||||
[This is an anchor](https://www.youtube.com), but this is not.
|
||||
|
||||
This is a blog post about something. It's really interesting. I hope you enjoy it.
|
||||
|
||||
# Markdown Quirks and Edge Cases
|
||||
|
||||
## Emphasis and Strong Emphasis
|
||||
|
||||
*This text is emphasized.*
|
||||
_This text is also emphasized._
|
||||
|
||||
**This text is strong emphasis.**
|
||||
__This text is also strong emphasis.__
|
||||
|
||||
* Item 1
|
||||
* Item 2
|
||||
* Item 3
|
||||
|
||||
+ Another Item 1
|
||||
+ Another Item 2
|
||||
|
||||
1. Yet Another Item 1
|
||||
2. Yet Another Item 2
|
||||
|
||||
***This text is both emphasized and strong!***
|
||||
___This text is also both emphasized and strong!___
|
||||
|
||||
## Strikethrough
|
||||
|
||||
~~This text is strikethrough.~~
|
||||
|
||||
## Links
|
||||
|
||||
[Link to Google](https://www.google.com)
|
||||
[Link with title](https://www.google.com "Google's Homepage")
|
||||
[Relative link](/some/page)
|
||||
[Link with spaces in URL](https://www.google.com/search?q=hello%20world)
|
||||
<https://www.google.com> (Auto-linked URL)
|
||||
|
||||
## Images
|
||||
|
||||

|
||||

|
||||
 (URL encoded spaces)
|
||||
|
||||
## Code
|
||||
|
||||
`Inline code`
|
||||
```javascript
|
||||
// Code block with language specified
|
||||
function myFunction() {
|
||||
console.log("Hello, world!");
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
My favorite color is red.
|
||||
|
||||
```cpp
|
||||
|
||||
@ -6,3 +6,8 @@
|
||||
<div class="blog-wrapper prose">
|
||||
{@html data.post.content}
|
||||
</div>
|
||||
<ul class="list-disc">
|
||||
<li>Item 1</li>
|
||||
<li>Item 2</li>
|
||||
<li>Item 3</li>
|
||||
</ul>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user