mirror of
https://github.com/Shadowfita/docmost.git
synced 2025-11-16 09:41:04 +10:00
* reduce space between list items * reduce spacing * Make inline code readable in dark mode * Disable spellcheck in code * fix numbered list in toggle block
108 lines
2.3 KiB
CSS
108 lines
2.3 KiB
CSS
.ProseMirror {
|
|
pre {
|
|
padding: var(--mantine-spacing-sm) var(--mantine-spacing-md);
|
|
font-family: "JetBrainsMono", var(--mantine-font-family-monospace);
|
|
border-radius: var(--mantine-radius-default);
|
|
|
|
@mixin light {
|
|
background-color: var(--mantine-color-gray-0);
|
|
color: var(--mantine-color-gray-9);
|
|
}
|
|
|
|
@mixin dark {
|
|
background-color: var(--mantine-color-dark-8);
|
|
color: var(--mantine-color-dark-1);
|
|
}
|
|
|
|
code {
|
|
color: inherit;
|
|
padding: 0;
|
|
background: none;
|
|
font-size: inherit;
|
|
}
|
|
|
|
/* Code styling */
|
|
.hljs-comment,
|
|
.hljs-quote {
|
|
color: light-dark(
|
|
var(--mantine-color-gray-5),
|
|
var(--mantine-color-dark-2)
|
|
);
|
|
}
|
|
|
|
.hljs-variable,
|
|
.hljs-template-variable,
|
|
.hljs-attribute,
|
|
.hljs-tag,
|
|
.hljs-name,
|
|
.hljs-regexp,
|
|
.hljs-link,
|
|
.hljs-name,
|
|
.hljs-selector-id,
|
|
.hljs-selector-class {
|
|
color: light-dark(var(--mantine-color-red-7), var(--mantine-color-red-5));
|
|
}
|
|
|
|
.hljs-number,
|
|
.hljs-meta,
|
|
.hljs-built_in,
|
|
.hljs-builtin-name,
|
|
.hljs-literal,
|
|
.hljs-type,
|
|
.hljs-params {
|
|
color: light-dark(
|
|
var(--mantine-color-blue-7),
|
|
var(--mantine-color-cyan-5)
|
|
);
|
|
}
|
|
|
|
.hljs-string,
|
|
.hljs-symbol,
|
|
.hljs-bullet {
|
|
color: light-dark(var(--mantine-color-red-7), var(--mantine-color-red-5));
|
|
}
|
|
|
|
.hljs-title,
|
|
.hljs-section {
|
|
color: light-dark(
|
|
var(--mantine-color-pink-7),
|
|
var(--mantine-color-yellow-5)
|
|
);
|
|
}
|
|
|
|
.hljs-keyword,
|
|
.hljs-selector-tag {
|
|
color: light-dark(
|
|
var(--mantine-color-violet-7),
|
|
var(--mantine-color-violet-3)
|
|
);
|
|
}
|
|
|
|
.hljs-emphasis {
|
|
font-style: italic;
|
|
}
|
|
|
|
.hljs-strong {
|
|
font-weight: 700;
|
|
}
|
|
}
|
|
|
|
:not(pre) > code {
|
|
font-family: "JetBrainsMono", var(--mantine-font-family-monospace);
|
|
line-height: var(--mantine-line-height);
|
|
padding: 2px calc(var(--mantine-spacing-xs) / 2);
|
|
border-radius: var(--mantine-radius-sm);
|
|
margin: 0;
|
|
|
|
@mixin where-light {
|
|
background-color: var(--code-bg, var(--mantine-color-gray-1));
|
|
color: var(--mantine-color-black);
|
|
}
|
|
|
|
@mixin where-dark {
|
|
background-color: var(--mantine-color-dark-8);
|
|
color: var(--mantine-color-gray-4);
|
|
}
|
|
}
|
|
}
|