Nulo
21f650fc57
Esto hace que sea legible y más usable cuando el modo oscuro está activado. https://0xacab.org/sutty/sutty/-/issues/2135 Idealmente, me gustaría tener modo oscuro real en el editor.
83 lines
1.5 KiB
SCSS
83 lines
1.5 KiB
SCSS
.editor {
|
|
box-sizing: border-box;
|
|
*, *::before, *::after { box-sizing: inherit; }
|
|
|
|
// Arreglo temporal para que las cosas sean legibles en modo oscuro
|
|
--foreground: black;
|
|
--background: white;
|
|
--color: #f206f9;
|
|
background: var(--background);
|
|
color: var(--foreground);
|
|
|
|
h1, h2, h3, h4, h5, h6, p, li {
|
|
min-height: 1.5rem;
|
|
}
|
|
|
|
mark {
|
|
background: #f206f9;
|
|
padding: 0;
|
|
}
|
|
|
|
iframe {
|
|
border: 0;
|
|
min-height: 480px;
|
|
}
|
|
|
|
figure {
|
|
padding: .5rem;
|
|
}
|
|
|
|
img, video, iframe, audio {
|
|
width: 100%;
|
|
max-width: 600px;
|
|
display: block;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.editor-toolbar {
|
|
position: sticky;
|
|
top: 0px;
|
|
background: white;
|
|
}
|
|
|
|
.editor-aviso-word {
|
|
display: none;
|
|
position: initial; /* evitar que tape el texto */
|
|
}
|
|
|
|
.editor-primary-toolbar, .editor-auxiliary-toolbar {
|
|
display: block;
|
|
overflow-x: auto;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.editor-auxiliary-toolbar {
|
|
& > * {
|
|
display: none;
|
|
}
|
|
[data-editor-auxiliary-active] {
|
|
display: block;
|
|
}
|
|
}
|
|
|
|
word-wrap: break-word;
|
|
div[data-align="left"] { text-align: left; }
|
|
div[data-align="center"] { text-align: center; }
|
|
div[data-align="right"] { text-align: right; }
|
|
|
|
.editor-content {
|
|
min-height: 480px;
|
|
p, h1, h2, h3, h4, h5, h6, ul, li, figcaption { outline: #ccc solid thin; }
|
|
strong, em, del, u, sub, sup, small { background: #0002; }
|
|
a { background: #13fefe50; }
|
|
[data-editor-selected] { outline: #f206f9 solid thick; }
|
|
}
|
|
|
|
*[data-editor-loading] {
|
|
opacity: 0.5;
|
|
}
|
|
|
|
*[data-editor-error] {
|
|
filter: grayscale(100%);
|
|
}
|
|
}
|