mirror of https://github.com/gohugoio/hugo
50 lines
2.1 KiB
CSS
50 lines
2.1 KiB
CSS
@import "./chroma_dark.css";
|
|
@import "./chroma.css";
|
|
@import "./highlight.css";
|
|
|
|
/* Some contrast ratio fixes as reported by Google Page Speed. */
|
|
.chroma .c1 {
|
|
@apply text-gray-500;
|
|
}
|
|
|
|
.dark .chroma .c1 {
|
|
@apply text-gray-400;
|
|
}
|
|
|
|
.highlight code {
|
|
@apply text-sm/6;
|
|
}
|
|
|
|
.content {
|
|
@apply prose prose-sm sm:prose-base prose-stone max-w-none dark:prose-invert dark:text-slate-200;
|
|
/* headings */
|
|
@apply prose-headings:font-semibold;
|
|
/* lead */
|
|
@apply prose-lead:text-slate-500 prose-lead:text-xl prose-lead:mt-2 sm:prose-lead:mt-4 prose-lead:leading-relaxed dark:prose-lead:text-slate-400;
|
|
/* links */
|
|
@apply prose-a:text-primary dark:prose-a:text-blue-500 prose-a:hover:text-blue-500 dark:prose-a:hover:text-blue-400 prose-a:underline;
|
|
@apply prose-a:prose-code:underline prose-a:prose-code:hover:text-blue-500 prose-a:prose-code:hover:underline;
|
|
/* pre */
|
|
@apply prose-pre:text-gray-800 prose-pre:border-1 prose-pre:border-gray-100 prose-pre:bg-light dark:prose-pre:bg-dark dark:prose-pre:ring-1 dark:prose-pre:ring-slate-300/10;
|
|
/* code */
|
|
@apply prose-code:px-0.5 prose-code:text-gray-500 prose-code:dark:text-gray-300 border-none;
|
|
@apply prose-code:before:hidden prose-code:after:hidden prose-code:font-mono;
|
|
@apply prose-table:prose-th:prose-code:text-white;
|
|
/* tables */
|
|
@apply prose-table:w-auto prose-table:border-2 prose-table:border-gray-100 prose-table:dark:border-gray-800 prose-table:prose-th:font-bold prose-table:prose-th:bg-blue-500 dark:prose-table:prose-th:bg-blue-500/50 prose-table:prose-th:p-2 prose-table:prose-td:p-2 prose-table:prose-th:text-white;
|
|
/* hr */
|
|
@apply dark:prose-hr:border-slate-800;
|
|
/* ol */
|
|
@apply prose-ol:marker:prose dark:prose-ol:marker:text-gray-300;
|
|
/* ul */
|
|
@apply prose-ul:marker:text-gray-500 dark:prose-ul:marker:text-gray-300;
|
|
}
|
|
|
|
/* This will not match highlighting inside e.g. the code-toggle shortcode. */
|
|
/* For more fine grained control of this, see components/shortcodes.css. */
|
|
.content > .highlight,
|
|
.content dd > .highlight,
|
|
.content li > .highlight {
|
|
@apply border-1 border-gray-200 dark:border-slate-600 mt-6 mb-8;
|
|
}
|