Add prose style

This commit is contained in:
Ondřej 2024-08-10 14:20:56 +02:00
parent 9d95c74aab
commit ac3bf50b12
2 changed files with 25 additions and 1 deletions

View file

@ -3,3 +3,27 @@
@import "tailwindcss/utilities";
/* This file is for your main application CSS */
.prose {
& > * + * {
margin-top: 0.5em;
}
ul {
list-style-type: disc;
padding-left: 1em;
}
a {
color: theme(colors.blue.600);
font-weight: 500;
text-decoration: underline;
text-underline-offset: 0.25em;
text-decoration-color: theme(colors.blue.600 / 25%);
transition: color 150ms;
&:hover {
color: theme(colors.blue.500);
}
}
}

View file

@ -24,7 +24,7 @@
<%= if @chore.description do %>
<div class="col-span-12">
<p class="text-sm font-medium text-zinc-500 mb-2">Description</p>
<div class="text-md">
<div class="text-md prose">
<%= raw(Earmark.as_html!(@chore.description)) %>
</div>
</div>