mirror of
https://github.com/l0ng-ai/openidea.git
synced 2026-11-07 08:26:57 +00:00
- Filters that do not fit the toolbar move behind a chevron that lists them, so the action buttons on the right stay visible. - Commits on the current branch are tinted unless the log is filtered to that branch, instead of dimming the others only when other branches happen to be loaded. - The HEAD commit is drawn as a ring around a dot. - A wide graph no longer paints the subject and references over the author column; references shrink down to their icon. - Scrollbar thumbs keep a minimum length on long lists.
201 lines
4.6 KiB
CSS
201 lines
4.6 KiB
CSS
@import "@fontsource-variable/inter";
|
||
@import "@fontsource-variable/jetbrains-mono";
|
||
@import "./tokens.css";
|
||
|
||
/* Monochrome icons default to the theme icon grey; callers override for selected / disabled. */
|
||
:root {
|
||
--icon-color: var(--fg-icon);
|
||
}
|
||
|
||
*,
|
||
*::before,
|
||
*::after {
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
html,
|
||
body,
|
||
#root {
|
||
height: 100%;
|
||
margin: 0;
|
||
}
|
||
|
||
body {
|
||
background: var(--bg-frame);
|
||
color: var(--fg);
|
||
font-family: var(--font-ui);
|
||
font-size: var(--fs-ui);
|
||
line-height: 1.4;
|
||
-webkit-font-smoothing: antialiased;
|
||
overflow: hidden;
|
||
-webkit-user-select: none;
|
||
user-select: none;
|
||
cursor: default;
|
||
}
|
||
|
||
html[data-selection-lock] *:not([data-selection-scope], [data-selection-scope] *) {
|
||
-webkit-user-select: none !important;
|
||
user-select: none !important;
|
||
}
|
||
|
||
input:not([type="checkbox"], [type="radio"], [type="range"], [type="color"]),
|
||
textarea,
|
||
[contenteditable="true"] {
|
||
cursor: text;
|
||
}
|
||
|
||
button {
|
||
font: inherit;
|
||
color: inherit;
|
||
background: none;
|
||
border: 0;
|
||
padding: 0;
|
||
/* Desktop convention: controls keep the arrow; only links get the hand. */
|
||
cursor: default;
|
||
}
|
||
|
||
input,
|
||
textarea,
|
||
select {
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
|
||
/* Radio buttons drawn like the Checkbox primitive (IntelliJ Islands). */
|
||
input[type="radio"] {
|
||
appearance: none;
|
||
flex: none;
|
||
width: 16px;
|
||
height: 16px;
|
||
margin: 0;
|
||
border-radius: 50%;
|
||
background: var(--bg-checkbox, var(--bg-button));
|
||
box-shadow: inset 0 0 0 1px var(--border-checkbox, var(--control-off));
|
||
cursor: default;
|
||
transition:
|
||
background var(--dur-fast) var(--ease),
|
||
box-shadow var(--dur-fast) var(--ease);
|
||
}
|
||
input[type="radio"]:checked {
|
||
background: radial-gradient(circle, var(--fg-button-primary) 0 2.5px, transparent 3px), var(--bg-button-primary);
|
||
box-shadow: none;
|
||
}
|
||
input[type="radio"]:disabled {
|
||
background: transparent;
|
||
box-shadow: inset 0 0 0 1px var(--border);
|
||
}
|
||
input[type="radio"]:disabled:checked {
|
||
background: radial-gradient(circle, var(--fg-faint) 0 2.5px, transparent 3px), var(--border);
|
||
}
|
||
input[type="radio"]:focus-visible {
|
||
outline: 2px solid var(--focus-ring, var(--accent));
|
||
outline-offset: 1px;
|
||
}
|
||
|
||
a {
|
||
color: var(--link);
|
||
}
|
||
a:hover {
|
||
color: var(--link-hover);
|
||
}
|
||
|
||
/* Focus rings mark controls only, as in IDEA: lists, trees, tables, menus, popups and other
|
||
focusable containers show focus through their selected row instead of a frame. Text fields
|
||
never get one, whatever their role (a search box is a combobox): their frame shows focus, and
|
||
an outline here draws a second box inside it. `:where` keeps this at the specificity of a bare
|
||
`:focus-visible`, so a component's own focus style always wins. */
|
||
:focus-visible {
|
||
outline: none;
|
||
}
|
||
:where(
|
||
button,
|
||
a[href],
|
||
input:is(
|
||
[type="checkbox"],
|
||
[type="radio"],
|
||
[type="range"],
|
||
[type="color"],
|
||
[type="file"],
|
||
[type="button"],
|
||
[type="submit"],
|
||
[type="reset"]
|
||
),
|
||
select,
|
||
summary,
|
||
[role="button"],
|
||
[role="link"],
|
||
[role="checkbox"],
|
||
[role="radio"],
|
||
[role="switch"],
|
||
[role="tab"],
|
||
[role="combobox"],
|
||
[role="slider"],
|
||
[role="spinbutton"]
|
||
):not(
|
||
:where(
|
||
input:not(
|
||
[type="checkbox"],
|
||
[type="radio"],
|
||
[type="range"],
|
||
[type="color"],
|
||
[type="file"],
|
||
[type="button"],
|
||
[type="submit"],
|
||
[type="reset"]
|
||
),
|
||
textarea,
|
||
[contenteditable="true"],
|
||
[contenteditable=""]
|
||
)
|
||
):focus-visible {
|
||
outline: 2px solid var(--focus-ring);
|
||
outline-offset: -2px;
|
||
}
|
||
|
||
::selection {
|
||
background: var(--bg-editor-selection);
|
||
}
|
||
|
||
.mono {
|
||
font-family: var(--font-mono);
|
||
}
|
||
|
||
/* macOS-style overlay scrollbars (ScrollBar.Mac.thumbColor / hoverThumbColor) */
|
||
::-webkit-scrollbar {
|
||
width: 10px;
|
||
height: 10px;
|
||
background: transparent;
|
||
}
|
||
::-webkit-scrollbar-thumb {
|
||
background-color: var(--scrollbar-thumb);
|
||
border: 2px solid transparent;
|
||
background-clip: content-box;
|
||
border-radius: 6px;
|
||
min-height: 32px;
|
||
min-width: 32px;
|
||
}
|
||
::-webkit-scrollbar-thumb:hover {
|
||
background-color: var(--scrollbar-thumb-hover);
|
||
}
|
||
::-webkit-scrollbar-track,
|
||
::-webkit-scrollbar-corner {
|
||
background: transparent;
|
||
}
|
||
|
||
/* Settings › Appearance › Antialiasing (IDE / Editor). */
|
||
:root[data-aa-ide="subpixel"] body {
|
||
-webkit-font-smoothing: subpixel-antialiased;
|
||
}
|
||
:root[data-aa-ide="none"] body {
|
||
-webkit-font-smoothing: none;
|
||
}
|
||
:root[data-aa-editor="greyscale"] .cm-editor {
|
||
-webkit-font-smoothing: antialiased;
|
||
}
|
||
:root[data-aa-editor="subpixel"] .cm-editor {
|
||
-webkit-font-smoothing: subpixel-antialiased;
|
||
}
|
||
:root[data-aa-editor="none"] .cm-editor {
|
||
-webkit-font-smoothing: none;
|
||
}
|