mirror of
https://github.com/wavetermdev/waveterm.git
synced 2024-12-22 16:48:23 +01:00
e29cb2debe
I'm updating the magnify button to be always visible and animate a transition between being a "Magnify" button and a "Minimize" button. This also cleans up some text shrinking behavior in the block frame header so the end icons are always visible. Also fixes some height discrepancies in the block frame header. Also implements a `prefers-reduced-motion` query for the tilelayout and block frame to ensure transitions are not set if the user does not want them.
74 lines
2.4 KiB
Plaintext
74 lines
2.4 KiB
Plaintext
// Copyright 2024, Command Line Inc.
|
|
// SPDX-License-Identifier: Apache-2.0
|
|
|
|
:root {
|
|
--main-text-color: #f7f7f7;
|
|
--title-font-size: 18px;
|
|
--secondary-text-color: rgb(195, 200, 194);
|
|
--grey-text-color: #666;
|
|
--main-bg-color: rgb(34, 34, 34);
|
|
--border-color: rgba(255, 255, 255, 0.08);
|
|
--base-font: normal 14px / normal "Inter", sans-serif;
|
|
--fixed-font: normal 12px / normal "Hack", monospace;
|
|
--accent-color: rgb(88, 193, 66);
|
|
--panel-bg-color: rgba(31, 33, 31, 0.5);
|
|
--highlight-bg-color: rgba(255, 255, 255, 0.2);
|
|
--markdown-font: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif,
|
|
"Apple Color Emoji", "Segoe UI Emoji";
|
|
--error-color: rgb(229, 77, 46);
|
|
--warning-color: rgb(224, 185, 86);
|
|
--success-color: rgb(78, 154, 6);
|
|
--hover-bg-color: rgba(255, 255, 255, 0.1);
|
|
--block-bg-color: rgba(0, 0, 0, 0.5);
|
|
--block-bg-solid-color: rgb(0, 0, 0);
|
|
--block-border-radius: 8px;
|
|
|
|
/* scrollbar colors */
|
|
--scrollbar-background-color: transparent;
|
|
--scrollbar-thumb-color: rgba(255, 255, 255, 0.15);
|
|
--scrollbar-thumb-hover-color: rgba(255, 255, 255, 0.5);
|
|
--scrollbar-thumb-active-color: rgba(255, 255, 255, 0.6);
|
|
|
|
--header-font: 700 11px / normal "Inter", sans-serif;
|
|
--header-icon-size: 14px;
|
|
--header-icon-width: 16px;
|
|
--header-height: 30px;
|
|
|
|
--tab-green: rgb(88, 193, 66);
|
|
|
|
/* z-index values */
|
|
--zindex-header-hover: 100;
|
|
--zindex-termstickers: 20;
|
|
--zindex-modal: 2;
|
|
--zindex-modal-wrapper: 500;
|
|
--zindex-modal-backdrop: 1;
|
|
--zindex-elem-modal: 100;
|
|
--zindex-window-drag: 100;
|
|
--zindex-tab-name: 3;
|
|
--zindex-layout-placeholder-container: 1;
|
|
--zindex-layout-overlay-container: 2;
|
|
--zindex-block-mask-inner: 10;
|
|
|
|
// z-indexes in xterm.css
|
|
// xterm-helpers: 5
|
|
// xterm-helper-textarea: -5
|
|
// composition-view: 1
|
|
// xterm-message: 10
|
|
// xterm-decoration: 6
|
|
// xterm-decoration-top-layer: 7
|
|
// xterm-decoration-overview-ruler: 8
|
|
// xterm-decoration-top: 2
|
|
|
|
/* modal colors */
|
|
--modal-bg-color: rgb(26, 28, 26);
|
|
--modal-header-bottom-border-color: rgba(241, 246, 243, 0.15);
|
|
|
|
/* toggle colors */
|
|
--toggle-bg-color: var(--border-color);
|
|
--toggle-thumb-color: var(--main-text-color);
|
|
--toggle-checked-bg-color: var(--accent-color);
|
|
|
|
/* link color */
|
|
--link-color: #58c142;
|
|
}
|