Code highlighting

This commit is contained in:
2024-09-11 13:15:00 +02:00
parent a9ef5c8f93
commit 4305da1d0c
6 changed files with 138 additions and 23 deletions

View File

@ -35,7 +35,7 @@ a {
}
table {
@apply text-sm mx-auto max-w-image table-auto border-collapse border-spacing-12 border border-gray-200 rounded md:text-base md:my-4 lg:text-xl lg:my-8;
@apply text-sm mx-auto my-4 max-w-image table-auto border-collapse border-spacing-12 border border-gray-200 rounded md:text-base lg:text-xl lg:my-8;
}
thead {
@ -62,6 +62,14 @@ a {
@apply my-2 md:my-4 text-slate-600 max-w-note;
}
}
:not(pre) code {
@apply text-pink-950 rounded border border-blue-300 px-1 py-0.5 bg-blue-100 text-sm md:text-base lg:text-xl;
}
pre code pre {
@apply mx-2 rounded lg:mx-auto lg:text-lg shadow-sm lg:max-w-note;
}
}
.video-embed {

View File

@ -1228,6 +1228,10 @@ a {
margin-left: auto;
margin-right: auto;
}
table {
margin-top: 1rem;
margin-bottom: 1rem;
}
table {
max-width: 70rem;
}
@ -1256,12 +1260,6 @@ a {
font-size: 0.875rem;
line-height: 1.25rem;
}
@media (min-width: 768px) {
table {
margin-top: 1rem;
margin-bottom: 1rem;
}
}
@media (min-width: 768px) {
table {
font-size: 1rem;
@ -1371,6 +1369,77 @@ a {
}
}
}
:not(pre) code {
border-radius: 0.25rem;
}
:not(pre) code {
border-width: 1px;
}
:not(pre) code {
--tw-border-opacity: 1;
border-color: rgb(147 197 253 / var(--tw-border-opacity));
}
:not(pre) code {
--tw-bg-opacity: 1;
background-color: rgb(219 234 254 / var(--tw-bg-opacity));
}
:not(pre) code {
padding-left: 0.25rem;
padding-right: 0.25rem;
}
:not(pre) code {
padding-top: 0.125rem;
padding-bottom: 0.125rem;
}
:not(pre) code {
font-size: 0.875rem;
line-height: 1.25rem;
}
:not(pre) code {
--tw-text-opacity: 1;
color: rgb(80 7 36 / var(--tw-text-opacity));
}
@media (min-width: 768px) {
:not(pre) code {
font-size: 1rem;
line-height: 1.5rem;
}
}
@media (min-width: 1024px) {
:not(pre) code {
font-size: 1.25rem;
line-height: 1.75rem;
}
}
pre code pre {
margin-left: 0.5rem;
margin-right: 0.5rem;
}
pre code pre {
border-radius: 0.25rem;
}
pre code pre {
--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
@media (min-width: 1024px) {
pre code pre {
margin-left: auto;
margin-right: auto;
}
}
@media (min-width: 1024px) {
pre code pre {
max-width: 60rem;
}
}
@media (min-width: 1024px) {
pre code pre {
font-size: 1.125rem;
line-height: 1.75rem;
}
}
}
.video-embed {