inhji/chiya
inhji/chiya
1
1
Fork 0
Code Issues 8 Pull requests 9 Activity

hljs

Browse source
This commit is contained in:
Inhji 2023-09-12 20:43:25 +02:00
parent 695ba3f644
commit e17582823c
3 changed files with 128 additions and 122 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
assets/css/app.css
View file

@ -2,9 +2,9 @@
@import "tailwindcss/components"; @import "tailwindcss/components";
@import "tailwindcss/utilities"; @import "tailwindcss/utilities";
@import "./hljs.css";
@import "./lightbox.css"; @import "./lightbox.css";
@import "./tablesort.css"; @import "./tablesort.css";
@import "./tokyo-night-dark.css";
/* /*
The base layer is for things like reset rules or default styles applied to plain HTML elements. The base layer is for things like reset rules or default styles applied to plain HTML elements.
@ -33,6 +33,10 @@
margin-block-start: var(--flow-space, 1em); margin-block-start: var(--flow-space, 1em);
} }
:root .prose {
@apply prose-inhji;
}
:root[data-mode=dark] .prose { :root[data-mode=dark] .prose {
@apply prose-invert; @apply prose-invert;
} }

196
assets/css/hljs.css
View file

@ -7,94 +7,95 @@
Based on the Tomorrow Night Eighties theme: https://github.com/isagalaev/highlight.js/blob/master/src/styles/tomorrow-night-eighties.css Based on the Tomorrow Night Eighties theme: https://github.com/isagalaev/highlight.js/blob/master/src/styles/tomorrow-night-eighties.css
*/ */
.hljs { & .hljs {
background: #fefefe; background: #fefefe;
color: #545454; color: #545454;
} }
/* Comment */ /* Comment */
.hljs-comment, & .hljs-comment,
.hljs-quote { & .hljs-quote {
color: #696969; color: #696969;
} }
/* Red */ /* Red */
.hljs-variable, & .hljs-variable,
.hljs-template-variable, & .hljs-template-variable,
.hljs-tag, & .hljs-tag,
.hljs-name, & .hljs-name,
.hljs-selector-id, & .hljs-selector-id,
.hljs-selector-class, & .hljs-selector-class,
.hljs-regexp, & .hljs-regexp,
.hljs-deletion { & .hljs-deletion {
color: #d91e18; color: #d91e18;
} }
/* Orange */ /* Orange */
.hljs-number, & .hljs-number,
.hljs-built_in, & .hljs-built_in,
.hljs-literal, & .hljs-literal,
.hljs-type, & .hljs-type,
.hljs-params, & .hljs-params,
.hljs-meta, & .hljs-meta,
.hljs-link { & .hljs-link {
color: #aa5d00; color: #aa5d00;
} }
/* Yellow */ /* Yellow */
.hljs-attribute { & .hljs-attribute {
color: #aa5d00; color: #aa5d00;
} }
/* Green */ /* Green */
.hljs-string, & .hljs-string,
.hljs-symbol, & .hljs-symbol,
.hljs-bullet, & .hljs-bullet,
.hljs-addition { & .hljs-addition {
color: #008000; color: #008000;
} }
/* Blue */ /* Blue */
.hljs-title, & .hljs-title,
.hljs-section { & .hljs-section {
color: #007faa; color: #007faa;
} }
/* Purple */ /* Purple */
.hljs-keyword, & .hljs-keyword,
.hljs-selector-tag { & .hljs-selector-tag {
color: #7928a1; color: #7928a1;
} }
.hljs-emphasis { & .hljs-emphasis {
font-style: italic; font-style: italic;
} }
.hljs-strong { & .hljs-strong {
font-weight: bold; font-weight: bold;
} }
@media screen and (-ms-high-contrast: active) { @media screen and (-ms-high-contrast: active) {
.hljs-addition, & .hljs-addition,
.hljs-attribute, & .hljs-attribute,
.hljs-built_in, & .hljs-built_in,
.hljs-bullet, & .hljs-bullet,
.hljs-comment, & .hljs-comment,
.hljs-link, & .hljs-link,
.hljs-literal, & .hljs-literal,
.hljs-meta, & .hljs-meta,
.hljs-number, & .hljs-number,
.hljs-params, & .hljs-params,
.hljs-string, & .hljs-string,
.hljs-symbol, & .hljs-symbol,
.hljs-type, & .hljs-type,
.hljs-quote { & .hljs-quote {
color: highlight; color: highlight;
} }
.hljs-keyword, & .hljs-keyword,
.hljs-selector-tag { & .hljs-selector-tag {
font-weight: bold; font-weight: bold;
}
} }
} }
@ -107,93 +108,94 @@
Based on the Tomorrow Night Eighties theme: https://github.com/isagalaev/highlight.js/blob/master/src/styles/tomorrow-night-eighties.css Based on the Tomorrow Night Eighties theme: https://github.com/isagalaev/highlight.js/blob/master/src/styles/tomorrow-night-eighties.css
*/ */
.hljs { & .hljs {
background: #2b2b2b; background: #2b2b2b;
color: #f8f8f2; color: #f8f8f2;
} }
/* Comment */ /* Comment */
.hljs-comment, & .hljs-comment,
.hljs-quote { & .hljs-quote {
color: #d4d0ab; color: #d4d0ab;
} }
/* Red */ /* Red */
.hljs-variable, & .hljs-variable,
.hljs-template-variable, & .hljs-template-variable,
.hljs-tag, & .hljs-tag,
.hljs-name, & .hljs-name,
.hljs-selector-id, & .hljs-selector-id,
.hljs-selector-class, & .hljs-selector-class,
.hljs-regexp, & .hljs-regexp,
.hljs-deletion { & .hljs-deletion {
color: #ffa07a; color: #ffa07a;
} }
/* Orange */ /* Orange */
.hljs-number, & .hljs-number,
.hljs-built_in, & .hljs-built_in,
.hljs-literal, & .hljs-literal,
.hljs-type, & .hljs-type,
.hljs-params, & .hljs-params,
.hljs-meta, & .hljs-meta,
.hljs-link { & .hljs-link {
color: #f5ab35; color: #f5ab35;
} }
/* Yellow */ /* Yellow */
.hljs-attribute { & .hljs-attribute {
color: #ffd700; color: #ffd700;
} }
/* Green */ /* Green */
.hljs-string, & .hljs-string,
.hljs-symbol, & .hljs-symbol,
.hljs-bullet, & .hljs-bullet,
.hljs-addition { & .hljs-addition {
color: #abe338; color: #abe338;
} }
/* Blue */ /* Blue */
.hljs-title, & .hljs-title,
.hljs-section { & .hljs-section {
color: #00e0e0; color: #00e0e0;
} }
/* Purple */ /* Purple */
.hljs-keyword, & .hljs-keyword,
.hljs-selector-tag { & .hljs-selector-tag {
color: #dcc6e0; color: #dcc6e0;
} }
.hljs-emphasis { & .hljs-emphasis {
font-style: italic; font-style: italic;
} }
.hljs-strong { & .hljs-strong {
font-weight: bold; font-weight: bold;
} }
@media screen and (-ms-high-contrast: active) { @media screen and (-ms-high-contrast: active) {
.hljs-addition, & .hljs-addition,
.hljs-attribute, & .hljs-attribute,
.hljs-built_in, & .hljs-built_in,
.hljs-bullet, & .hljs-bullet,
.hljs-comment, & .hljs-comment,
.hljs-link, & .hljs-link,
.hljs-literal, & .hljs-literal,
.hljs-meta, & .hljs-meta,
.hljs-number, & .hljs-number,
.hljs-params, & .hljs-params,
.hljs-string, & .hljs-string,
.hljs-symbol, & .hljs-symbol,
.hljs-type, & .hljs-type,
.hljs-quote { & .hljs-quote {
color: highlight; color: highlight;
} }
.hljs-keyword, & .hljs-keyword,
.hljs-selector-tag { & .hljs-selector-tag {
font-weight: bold; font-weight: bold;
}
} }
} }

48
assets/tailwind.config.js
View file

@ -23,34 +23,34 @@ module.exports = {
background: 'rgb(var(--color-background) / <alpha-value>)' background: 'rgb(var(--color-background) / <alpha-value>)'
}, },
typography: ({ theme }) => ({ typography: ({ theme }) => ({
colorful: { inhji: {
css: { css: {
'--tw-prose-lead': theme('colors.rose[700]'), '--tw-prose-lead': theme('colors.neutral[700]'),
'--tw-prose-links': theme('colors.rose[900]'), '--tw-prose-links': theme('colors.neutral[900]'),
'--tw-prose-counters': theme('colors.rose[600]'), '--tw-prose-counters': theme('colors.neutral[600]'),
'--tw-prose-bullets': theme('colors.rose[400]'), '--tw-prose-bullets': theme('colors.neutral[400]'),
'--tw-prose-hr': theme('colors.rose[300]'), '--tw-prose-hr': theme('colors.neutral[300]'),
'--tw-prose-quotes': theme('colors.rose[900]'), '--tw-prose-quotes': theme('colors.neutral[900]'),
'--tw-prose-quote-borders': theme('colors.rose[300]'), '--tw-prose-quote-borders': theme('colors.neutral[300]'),
'--tw-prose-captions': theme('colors.rose[700]'), '--tw-prose-captions': theme('colors.neutral[700]'),
'--tw-prose-code': theme('colors.rose[900]'), '--tw-prose-code': theme('colors.neutral[900]'),
'--tw-prose-pre-code': theme('colors.rose[100]'), '--tw-prose-pre-code': theme('colors.neutral[100]'),
'--tw-prose-pre-bg': theme('colors.rose[900]'), '--tw-prose-pre-bg': theme('colors.neutral[200]'),
'--tw-prose-th-borders': theme('colors.rose[300]'), '--tw-prose-th-borders': theme('colors.neutral[300]'),
'--tw-prose-td-borders': theme('colors.rose[200]'), '--tw-prose-td-borders': theme('colors.neutral[200]'),
'--tw-prose-invert-lead': theme('colors.rose[300]'), '--tw-prose-invert-lead': theme('colors.neutral[300]'),
'--tw-prose-invert-links': theme('colors.white'), '--tw-prose-invert-links': theme('colors.white'),
'--tw-prose-invert-counters': theme('colors.rose[400]'), '--tw-prose-invert-counters': theme('colors.neutral[400]'),
'--tw-prose-invert-bullets': theme('colors.rose[600]'), '--tw-prose-invert-bullets': theme('colors.neutral[600]'),
'--tw-prose-invert-hr': theme('colors.rose[700]'), '--tw-prose-invert-hr': theme('colors.neutral[700]'),
'--tw-prose-invert-quotes': theme('colors.rose[100]'), '--tw-prose-invert-quotes': theme('colors.neutral[100]'),
'--tw-prose-invert-quote-borders': theme('colors.rose[700]'), '--tw-prose-invert-quote-borders': theme('colors.neutral[700]'),
'--tw-prose-invert-captions': theme('colors.rose[400]'), '--tw-prose-invert-captions': theme('colors.neutral[400]'),
'--tw-prose-invert-code': theme('colors.white'), '--tw-prose-invert-code': theme('colors.white'),
'--tw-prose-invert-pre-code': theme('colors.rose[300]'), '--tw-prose-invert-pre-code': theme('colors.neutral[300]'),
'--tw-prose-invert-pre-bg': 'rgb(0 0 0 / 50%)', '--tw-prose-invert-pre-bg': 'rgb(0 0 0 / 50%)',
'--tw-prose-invert-th-borders': theme('colors.rose[600]'), '--tw-prose-invert-th-borders': theme('colors.neutral[600]'),
'--tw-prose-invert-td-borders': theme('colors.rose[700]'), '--tw-prose-invert-td-borders': theme('colors.neutral[700]'),
}, },
}, },
}), }),