mirror of
https://github.com/mountain-loop/yaak.git
synced 2026-01-16 14:06:49 +01:00
155 lines
3.0 KiB
CSS
155 lines
3.0 KiB
CSS
.cm-wrapper {
|
|
height: 100%;
|
|
width: 100%;
|
|
position: relative;
|
|
}
|
|
|
|
.cm-wrapper .cm-editor {
|
|
position: absolute !important;
|
|
left: 0;
|
|
right: 0;
|
|
top: 0;
|
|
bottom: 0;
|
|
}
|
|
|
|
.cm-editor {
|
|
width: 100%;
|
|
display: block;
|
|
}
|
|
|
|
.cm-singleline .cm-scroller {
|
|
overflow: hidden !important;;
|
|
}
|
|
|
|
.cm-editor .cm-tooltip {
|
|
color: gray;
|
|
}
|
|
|
|
.cm-editor .placeholder-widget {
|
|
background-color: hsl(var(--color-blue-400));
|
|
padding: 0.05em 0.3em;
|
|
border-radius: 0.2em;
|
|
color: white;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.cm-editor .cm-scroller {
|
|
border-radius: var(--border-radius-lg);
|
|
background-color: hsl(var(--color-gray-50));
|
|
}
|
|
|
|
.cm-editor.cm-focused {
|
|
outline: none !important;
|
|
}
|
|
|
|
.cm-multiline .cm-editor.cm-focused .cm-scroller {
|
|
box-shadow: 0 0 0 1px hsl(var(--color-blue-400)/0.4);
|
|
}
|
|
|
|
.cm-editor .cm-line {
|
|
color: hsl(var(--color-gray-900));
|
|
}
|
|
|
|
.cm-multiline .cm-editor .cm-line {
|
|
padding-left: 1em;
|
|
padding-right: 1.5em;
|
|
}
|
|
|
|
.cm-singleline .cm-scroller {
|
|
display: flex;
|
|
align-items: center !important;
|
|
}
|
|
|
|
.cm-editor .cm-gutters {
|
|
background-color: hsl(var(--color-gray-50));
|
|
border-right: 0;
|
|
color: hsl(var(--color-gray-200));
|
|
}
|
|
|
|
.cm-editor .cm-gutterElement {
|
|
transition: color var(--transition-duration);
|
|
}
|
|
|
|
.cm-editor .fold-gutter-icon {
|
|
height: 1.5em;
|
|
padding-top: 0.2em;
|
|
padding-left: 0.4em;
|
|
padding-right: 0.4em;
|
|
cursor: pointer;
|
|
border-radius: 0.2em;
|
|
}
|
|
|
|
.cm-editor .fold-gutter-icon::after {
|
|
display: block;
|
|
width: 0.5em;
|
|
height: 0.5em;
|
|
border: 1px solid transparent;
|
|
border-left-color: currentColor;
|
|
border-bottom-color: currentColor;
|
|
transform: rotate(-45deg);
|
|
content: "";
|
|
}
|
|
|
|
.cm-editor .fold-gutter-icon[data-open] {
|
|
padding-top: 0.4em;
|
|
padding-left: 0.2em;
|
|
}
|
|
|
|
.cm-editor .fold-gutter-icon[data-open]::after {
|
|
transform: rotate(-135deg);
|
|
}
|
|
|
|
.cm-editor .fold-gutter-icon:hover {
|
|
background-color: hsl(var(--color-gray-100)/0.2);
|
|
color: hsl(var(--color-gray-400));
|
|
}
|
|
|
|
.cm-editor.cm-focused .cm-gutters {
|
|
color: hsl(var(--color-gray-300));
|
|
}
|
|
|
|
.cm-editor .cm-foldPlaceholder {
|
|
background-color: hsl(var(--color-gray-100));
|
|
border: 1px solid hsl(var(--color-gray-200));
|
|
padding: 0 0.3em;
|
|
}
|
|
|
|
.cm-editor .cm-activeLineGutter,
|
|
.cm-editor .cm-activeLine {
|
|
background-color: transparent;
|
|
}
|
|
|
|
.cm-editor.cm-focused .cm-activeLineGutter,
|
|
.cm-editor.cm-focused .cm-activeLine {
|
|
background-color: hsl(var(--color-gray-100)/0.3);
|
|
}
|
|
|
|
.cm-editor * {
|
|
cursor: text;
|
|
}
|
|
|
|
.cm-editor .cm-cursor {
|
|
border-left: 2px solid hsl(var(--color-gray-900));
|
|
}
|
|
|
|
.cm-editor .cm-selectionBackground {
|
|
background-color: hsl(var(--color-gray-200));
|
|
}
|
|
|
|
.cm-editor.cm-focused .cm-selectionBackground {
|
|
background-color: hsl(var(--color-gray-200));
|
|
}
|
|
|
|
/* --> Add padding to container. For some reason, using padding on both adds an extra
|
|
* 1px offset so we need to use a combination of padding and margin.
|
|
*/
|
|
.cm-editor .cm-gutters {
|
|
padding-top: 0.2em;
|
|
}
|
|
|
|
.cm-editor .cm-content {
|
|
margin-top: 0.2em;
|
|
}
|
|
|
|
/* <-- */
|