mirror of
https://github.com/stackblitz/bolt.new
synced 2024-11-28 06:52:47 +00:00
134 lines
5.0 KiB
CSS
134 lines
5.0 KiB
CSS
|
:root {
|
||
|
--cm-backgroundColor: var(--bolt-elements-editor-backgroundColor, var(--bolt-elements-app-backgroundColor));
|
||
|
--cm-textColor: var(--bolt-elements-editor-textColor, var(--bolt-text-primary));
|
||
|
|
||
|
/* Gutter */
|
||
|
|
||
|
--cm-gutter-backgroundColor: var(--bolt-elements-editor-gutter-backgroundColor, var(--cm-backgroundColor));
|
||
|
--cm-gutter-textColor: var(--bolt-elements-editor-gutter-textColor, var(--bolt-text-secondary));
|
||
|
--cm-gutter-activeLineTextColor: var(--bolt-elements-editor-gutter-activeLineTextColor, var(--cm-gutter-textColor));
|
||
|
|
||
|
/* Fold Gutter */
|
||
|
|
||
|
--cm-foldGutter-textColor: var(--bolt-elements-editor-foldGutter-textColor, var(--cm-gutter-textColor));
|
||
|
--cm-foldGutter-textColorHover: var(--bolt-elements-editor-foldGutter-textColorHover, var(--cm-gutter-textColor));
|
||
|
|
||
|
/* Active Line */
|
||
|
|
||
|
--cm-activeLineBackgroundColor: var(--bolt-elements-editor-activeLineBackgroundColor, rgb(224 231 235 / 30%));
|
||
|
|
||
|
/* Cursor */
|
||
|
|
||
|
--cm-cursor-width: 2px;
|
||
|
--cm-cursor-backgroundColor: var(--bolt-elements-editor-cursorColor, var(--bolt-text-primary));
|
||
|
|
||
|
/* Matching Brackets */
|
||
|
|
||
|
--cm-matching-bracket: var(--bolt-elements-editor-matchingBracketBackgroundColor, rgb(50 140 130 / 0.3));
|
||
|
|
||
|
/* Selection */
|
||
|
|
||
|
--cm-selection-backgroundColorFocused: var(--bolt-elements-editor-selection-backgroundColor, #42b4ff);
|
||
|
--cm-selection-backgroundOpacityFocused: var(--bolt-elements-editor-selection-backgroundOpacity, 0.3);
|
||
|
--cm-selection-backgroundColorBlured: var(--bolt-elements-editor-selection-inactiveBackgroundColor, #c9e9ff);
|
||
|
--cm-selection-backgroundOpacityBlured: var(--bolt-elements-editor-selection-inactiveBackgroundOpacity, 0.3);
|
||
|
|
||
|
/* Panels */
|
||
|
|
||
|
--cm-panels-borderColor: var(--bolt-elements-editor-panels-borderColor, var(--bolt-elements-app-borderColor));
|
||
|
|
||
|
/* Search */
|
||
|
|
||
|
--cm-search-backgroundColor: var(--bolt-elements-editor-search-backgroundColor, var(--cm-backgroundColor));
|
||
|
--cm-search-textColor: var(--bolt-elements-editor-search-textColor, var(--bolt-elements-app-textColor));
|
||
|
--cm-search-closeButton-backgroundColor: var(--bolt-elements-editor-search-closeButton-backgroundColor, transparent);
|
||
|
|
||
|
--cm-search-closeButton-backgroundColorHover: var(
|
||
|
--bolt-elements-editor-search-closeButton-backgroundColorHover,
|
||
|
var(--bolt-background-secondary)
|
||
|
);
|
||
|
|
||
|
--cm-search-closeButton-textColor: var(
|
||
|
--bolt-elements-editor-search-closeButton-textColor,
|
||
|
var(--bolt-text-secondary)
|
||
|
);
|
||
|
|
||
|
--cm-search-closeButton-textColorHover: var(
|
||
|
--bolt-elements-editor-search-closeButton-textColorHover,
|
||
|
var(--bolt-text-primary)
|
||
|
);
|
||
|
|
||
|
--cm-search-button-backgroundColor: var(
|
||
|
--bolt-elements-editor-search-button-backgroundColor,
|
||
|
var(--bolt-background-secondary)
|
||
|
);
|
||
|
|
||
|
--cm-search-button-backgroundColorHover: var(
|
||
|
--bolt-elements-editor-search-button-backgroundColorHover,
|
||
|
var(--bolt-background-active)
|
||
|
);
|
||
|
|
||
|
--cm-search-button-textColor: var(--bolt-elements-editor-search-button-textColor, var(--bolt-text-secondary));
|
||
|
--cm-search-button-textColorHover: var(--bolt-elements-editor-search-button-textColorHover, var(--bolt-text-primary));
|
||
|
--cm-search-button-borderColor: var(--bolt-elements-editor-search-button-borderColor, transparent);
|
||
|
|
||
|
--cm-search-button-borderColorHover: var(
|
||
|
--bolt-elements-editor-search-button-borderColorHover,
|
||
|
var(--cm-search-button-borderColor)
|
||
|
);
|
||
|
|
||
|
--cm-search-button-borderColorFocused: var(
|
||
|
--bolt-elements-editor-search-button-borderColorFocused,
|
||
|
var(--bolt-border-accent)
|
||
|
);
|
||
|
|
||
|
--cm-search-input-backgroundColor: var(
|
||
|
--bolt-elements-editor-search-input-backgroundColor,
|
||
|
var(--bolt-background-primary)
|
||
|
);
|
||
|
|
||
|
--cm-search-input-borderColor: var(
|
||
|
--bolt-elements-editor-search-input-borderColor,
|
||
|
var(--bolt-elements-app-borderColor)
|
||
|
);
|
||
|
|
||
|
--cm-search-input-borderColorFocused: var(
|
||
|
--bolt-elements-editor-search-input-borderColorFocused,
|
||
|
var(--bolt-border-accent)
|
||
|
);
|
||
|
|
||
|
/* Tooltip */
|
||
|
|
||
|
--cm-tooltip-backgroundColor: var(
|
||
|
--bolt-elements-editor-tooltip-backgroundColor,
|
||
|
var(--bolt-elements-app-backgroundColor)
|
||
|
);
|
||
|
|
||
|
--cm-tooltip-textColor: var(--bolt-elements-editor-tooltip-textColor, var(--bolt-text-primary));
|
||
|
|
||
|
--cm-tooltip-backgroundColorSelected: var(
|
||
|
--bolt-elements-editor-tooltip-backgroundColorSelected,
|
||
|
var(--bolt-background-accent)
|
||
|
);
|
||
|
|
||
|
--cm-tooltip-textColorSelected: var(
|
||
|
--bolt-elements-editor-tooltip-textColorSelected,
|
||
|
var(--bolt-text-primary-inverted)
|
||
|
);
|
||
|
|
||
|
--cm-tooltip-borderColor: var(--bolt-elements-editor-tooltip-borderColor, var(--bolt-elements-app-borderColor));
|
||
|
}
|
||
|
|
||
|
html[data-theme='light'] {
|
||
|
--bolt-elements-editor-gutter-textColor: #237893;
|
||
|
--bolt-elements-editor-gutter-activeLineTextColor: var(--bolt-text-primary);
|
||
|
--bolt-elements-editor-foldGutter-textColorHover: var(--bolt-text-primary);
|
||
|
}
|
||
|
|
||
|
html[data-theme='dark'] {
|
||
|
--bolt-elements-editor-gutter-activeLineTextColor: var(--bolt-text-primary);
|
||
|
--bolt-elements-editor-selection-backgroundOpacityBlured: 0.1;
|
||
|
--bolt-elements-editor-activeLineBackgroundColor: rgb(50 53 63 / 50%);
|
||
|
--bolt-elements-editor-foldGutter-textColorHover: var(--bolt-text-primary);
|
||
|
}
|