1878 lines
46 KiB
CSS
1878 lines
46 KiB
CSS
/* @settings
|
|
name: Minimal Edge
|
|
id: minimal-edge-settings
|
|
settings:
|
|
-
|
|
id: main-theme
|
|
title: Interface
|
|
type: heading
|
|
level: 2
|
|
collapsed: true
|
|
-
|
|
id: background-theme
|
|
title: Themes
|
|
type: class-select
|
|
allowEmpty: false
|
|
default: default-theme
|
|
options:
|
|
-
|
|
label: Default
|
|
value: default-theme
|
|
-
|
|
label: Warm
|
|
value: warm-theme
|
|
-
|
|
label: Eclipse
|
|
value: eclipse-theme
|
|
-
|
|
label: Vintage
|
|
value: vintage-theme
|
|
-
|
|
label: Warm Amber
|
|
value: warm-amber-theme
|
|
-
|
|
label: Rose
|
|
value: rose-theme
|
|
|
|
|
|
-
|
|
id: font-style
|
|
title: Body Text Font
|
|
description: Choose the font family for your main text
|
|
type: variable-select
|
|
default: var(--font-text)
|
|
options:
|
|
-
|
|
label: System Default
|
|
value: var(--font-text)
|
|
-
|
|
label: Cursive
|
|
value: cursive
|
|
-
|
|
label: Helvetica
|
|
value: Helvetica, Arial, sans-serif
|
|
-
|
|
label: Georgia
|
|
value: Georgia, serif
|
|
-
|
|
label: Monospace
|
|
value: monospace
|
|
|
|
-
|
|
|
|
id: titlebar-button-style
|
|
title: Titlebar Button Style
|
|
type: class-select
|
|
description: change titlebar style(windows only)
|
|
allowEmpty: false
|
|
default: titlebar-default-style
|
|
options:
|
|
-
|
|
label: Default
|
|
value: titlebar-default-style
|
|
-
|
|
label: Minimal
|
|
value: titlebar-minimal-style
|
|
-
|
|
label: Retro
|
|
value: titlebar-retro-style
|
|
-
|
|
label: Vintage
|
|
value: titlebar-vintage-style
|
|
-
|
|
id: file-explorer-icons-heading
|
|
title: File Explorer Icons
|
|
type: heading
|
|
level: 4
|
|
collapsed: false
|
|
-
|
|
id: hide-folder-icons
|
|
title: Hide Folder Icons
|
|
description: Toggle visibility of folder icons in the file explorer
|
|
type: class-toggle
|
|
default: false
|
|
-
|
|
id: hide-file-icons
|
|
title: Hide File Icons
|
|
description: Toggle visibility of file icons in the file explorer
|
|
type: class-toggle
|
|
default: false
|
|
-
|
|
|
|
id: heading-styles
|
|
title: Heading Styles
|
|
type: heading
|
|
level: 4
|
|
collapsed: true
|
|
|
|
-
|
|
id: heading-style-toggle
|
|
title: Heading Style Mode
|
|
type: class-select
|
|
allowEmpty: false
|
|
default: heading-style-none
|
|
options:
|
|
-
|
|
label: None
|
|
value: heading-style-none
|
|
-
|
|
label: Basic (All headings same color)
|
|
value: heading-style-basic
|
|
-
|
|
label: Advanced (Individual heading colors)
|
|
value: heading-style-advanced
|
|
|
|
-
|
|
id: basic-heading-settings
|
|
title: Basic Heading Settings
|
|
type: heading
|
|
level: 5
|
|
collapsed: true
|
|
|
|
-
|
|
id: heading-color
|
|
title: Heading Color (Basic Mode)
|
|
description: Sets the color for all headings
|
|
type: variable-color
|
|
format: hex
|
|
default: "#333333"
|
|
|
|
-
|
|
id: custom-heading-font
|
|
title: Custom Heading Font (Basic Mode)
|
|
description: Font family for all headings
|
|
type: variable-text
|
|
default: ""
|
|
|
|
|
|
-
|
|
id: advanced-heading-settings
|
|
title: Advanced Heading Settings
|
|
type: heading
|
|
level: 5
|
|
collapsed: true
|
|
|
|
-
|
|
id: h1-color
|
|
title: H1 Color
|
|
type: variable-color
|
|
format: hex
|
|
default: "#333333"
|
|
|
|
-
|
|
id: custom-h1-font
|
|
title: Custom H1 Font
|
|
description: Font family for H1
|
|
type: variable-text
|
|
default: ""
|
|
|
|
-
|
|
id: h2-color
|
|
title: H2 Color
|
|
type: variable-color
|
|
format: hex
|
|
default: "#444444"
|
|
|
|
-
|
|
id: custom-h2-font
|
|
title: Custom H2 Font
|
|
description: Font family for H2
|
|
type: variable-text
|
|
default: ""
|
|
|
|
-
|
|
id: h3-color
|
|
title: H3 Color
|
|
type: variable-color
|
|
format: hex
|
|
default: "#555555"
|
|
|
|
-
|
|
id: custom-h3-font
|
|
title: Custom H3 Font
|
|
description: Font family for H3
|
|
type: variable-text
|
|
default: ""
|
|
|
|
-
|
|
id: h4-color
|
|
title: H4 Color
|
|
type: variable-color
|
|
format: hex
|
|
default: "#666666"
|
|
|
|
-
|
|
id: custom-h4-font
|
|
title: Custom H4 Font
|
|
description: Font family for H4
|
|
type: variable-text
|
|
default: ""
|
|
|
|
-
|
|
id: h5-color
|
|
title: H5 Color
|
|
type: variable-color
|
|
format: hex
|
|
default: "#777777"
|
|
|
|
-
|
|
id: custom-h5-font
|
|
title: Custom H5 Font
|
|
description: Font family for H5
|
|
type: variable-text
|
|
default: ""
|
|
|
|
-
|
|
id: h6-color
|
|
title: H6 Color
|
|
type: variable-color
|
|
format: hex
|
|
default: "#888888"
|
|
|
|
-
|
|
id: custom-h6-font
|
|
title: Custom H6 Font
|
|
description: Font family for H6
|
|
type: variable-text
|
|
default: ""
|
|
|
|
-
|
|
|
|
id: border-style
|
|
title: Border Style
|
|
type: heading
|
|
level: 2
|
|
collapsed: true
|
|
|
|
-
|
|
id: disable-border
|
|
title: Disable Borders
|
|
description: Toggle borders on or off
|
|
type: class-toggle
|
|
default: false
|
|
|
|
-
|
|
id: border-radius
|
|
title: Border Radius
|
|
description: Set the border radius for elements
|
|
type: variable-number
|
|
default: 11
|
|
min: 0
|
|
max: 20
|
|
step: 1
|
|
format: px
|
|
|
|
-
|
|
id: modal-settings
|
|
title: Modal Settings
|
|
type: heading
|
|
level: 2
|
|
collapsed: true
|
|
|
|
-
|
|
id: enable-modal-blur
|
|
title: Enable Modal Background Blur
|
|
description: Toggle blur effect on modal backgrounds
|
|
type: class-toggle
|
|
default: true
|
|
|
|
-
|
|
id: modal-blur-amount
|
|
title: Modal Background Blur Amount
|
|
description: Set the blur amount for modal backgrounds (in pixels)
|
|
type: variable-number
|
|
default: 3
|
|
min: 0
|
|
max: 10
|
|
step: 1
|
|
format: px
|
|
|
|
-
|
|
id: enable-modal-animation
|
|
title: Enable Modal Animation
|
|
description: Toggle to turn off the modal animation
|
|
type: class-toggle
|
|
default: true
|
|
|
|
-
|
|
id: ribbon-settings
|
|
title: Ribbon Style
|
|
type: heading
|
|
level: 2
|
|
collapsed: true
|
|
|
|
-
|
|
id: ribbon-style
|
|
title: Ribbon Style
|
|
type: class-select
|
|
allowEmpty: false
|
|
default: ribbon-default-style
|
|
options:
|
|
-
|
|
label: Default
|
|
value: ribbon-default-style
|
|
-
|
|
label: Box
|
|
value: ribbon-box-style
|
|
-
|
|
label: Edge
|
|
value: ribbon-edge-style
|
|
|
|
-
|
|
id: support-header
|
|
title: Support
|
|
type: heading
|
|
level: 1
|
|
collapsed: false
|
|
|
|
-
|
|
id: minimal-edge-support
|
|
level: 2
|
|
type: info-text
|
|
markdown: true
|
|
description: >
|
|
If you enjoy my work, consider supporting me by [buying me a coffee](https://buymeacoffee.com/el_haris) or starring the project on [GitHub](https://github.com/Elhary/Obsidian-Minimal-Edge). Your support is greatly appreciated!
|
|
|
|
*/
|
|
|
|
|
|
/* Light Mode Themes Styles */
|
|
|
|
|
|
/* Vintage Theme - Light Mode*/
|
|
|
|
|
|
body.theme-light.vintage-theme {
|
|
--background-primary: #ece5df;
|
|
--background-secondary: #f7f0e9;
|
|
--text-normal: #333;
|
|
--icon-color: #d98639d3;
|
|
--icon-color-focused: #7a4a1db7;
|
|
--tab-text-color-focused-active-current: #7a4a1db7;
|
|
--background-modifier-border: var(--border-size) var(--border-style) #2c242447;
|
|
--code-background: #544d3e;
|
|
--code-keyword: #FFAD60;
|
|
--code-normal: #FD8B51;
|
|
--code-operator: #F2E5BF;
|
|
--code-value: #e3b750;
|
|
--code-function: #dcbb59;
|
|
--code-property: #d29a8c;
|
|
--code-string: #79b1c7;
|
|
--hr-color: #2c242447;
|
|
--table-border-color: #2c242447;
|
|
--canvas-dot-pattern: #796e6e47;
|
|
}
|
|
|
|
|
|
body.theme-light.vintage-theme .workspace-ribbon .sidebar-toggle-button .clickable-icon {
|
|
color: #534e3d
|
|
}
|
|
|
|
body.theme-light.vintage-theme .clickable-icon:nth-child(4n + 1) {
|
|
color: #ec9b4e;
|
|
}
|
|
|
|
body.theme-light.vintage-theme .clickable-icon:nth-child(4n + 2) {
|
|
color: #fc7a39;
|
|
}
|
|
|
|
body.theme-light.vintage-theme .clickable-icon:nth-child(4n + 3) {
|
|
color: #ffa047;
|
|
}
|
|
|
|
body.theme-light.vintage-theme .clickable-icon:nth-child(4n + 4) {
|
|
color: #529dbb;
|
|
}
|
|
|
|
body.theme-light.vintage-theme .canvas-control-item:nth-child(4n + 1) {
|
|
color: #534e3d;
|
|
}
|
|
|
|
body.theme-light.vintage-theme .canvas-control-item:nth-child(4n + 2) {
|
|
color: #fc7a39;
|
|
}
|
|
|
|
body.theme-light.vintage-theme .canvas-control-item:nth-child(4n + 3) {
|
|
color: #ffa047;
|
|
}
|
|
|
|
body.theme-light.vintage-theme .canvas-control-item:nth-child(4n + 4) {
|
|
color: #529dbb;
|
|
}
|
|
|
|
body.theme-light.vintage-theme .nav-file-tag {
|
|
background-color: #ffa04763;
|
|
color: #7e7e7e86;
|
|
}
|
|
|
|
body.theme-light.vintage-theme input[type=checkbox] {
|
|
border: var(--background-modifier-border);
|
|
}
|
|
|
|
body.theme-light.vintage-theme input[type=checkbox]:checked {
|
|
background-color: #529dbb;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* Vintage Theme - Dark Mode*/
|
|
|
|
body.theme-dark.vintage-theme {
|
|
--background-primary: #291f18;
|
|
--background-secondary: #41352a;
|
|
--text-normal: #c2b8ac;
|
|
--text-accent: #a0662fdf;
|
|
--icon-color: #a0662f9c;
|
|
--icon-color-focused: #965e29e1;
|
|
--tab-text-color-focused-active-current: #965e29e1;
|
|
--interactive-normal: #291f18;
|
|
--background-modifier-border: var(--border-size) var(--border-style) #b9979747;
|
|
--code-background: #27231a;
|
|
--code-keyword: #FFAD60;
|
|
--code-normal: #FD8B51;
|
|
--code-operator: #F2E5BF;
|
|
--code-value: #e3b750;
|
|
--code-function: #dcbb59;
|
|
--code-property: #d29a8c;
|
|
--code-string: #79b1c7;
|
|
--hr-color: #b9979747;
|
|
--table-border-color: #b9979747;
|
|
--canvas-dot-pattern: #965e29e1;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
body.theme-dark.vintage-theme .workspace-ribbon .sidebar-toggle-button .clickable-icon {
|
|
color: #F2E5BF
|
|
}
|
|
|
|
body.theme-dark.vintage-theme .clickable-icon:nth-child(4n + 1) {
|
|
color: #FFAD60;
|
|
}
|
|
|
|
body.theme-dark.vintage-theme .clickable-icon:nth-child(4n + 2) {
|
|
color: #FD8B51;
|
|
}
|
|
|
|
body.theme-dark.vintage-theme .clickable-icon:nth-child(4n + 3) {
|
|
color: #FFAD60;
|
|
}
|
|
|
|
body.theme-dark.vintage-theme .clickable-icon:nth-child(4n + 4) {
|
|
color: #79b1c7;
|
|
}
|
|
|
|
body.theme-dark.vintage-theme .canvas-control-item:nth-child(4n + 1) {
|
|
color: #F2E5BF;
|
|
}
|
|
|
|
body.theme-dark.vintage-theme .canvas-control-item:nth-child(4n + 2) {
|
|
color: #FFAD60;
|
|
}
|
|
|
|
body.theme-dark.vintage-theme .canvas-control-item:nth-child(4n + 3) {
|
|
color: #FD8B51;
|
|
}
|
|
|
|
body.theme-dark.vintage-theme .canvas-control-item:nth-child(4n + 4) {
|
|
color: #79b1c7;
|
|
}
|
|
|
|
body.theme-dark.vintage-theme .canvas-card-menu .canvas-card-menu-button:nth-child(1) {
|
|
color: #F2E5BF;
|
|
}
|
|
|
|
body.theme-dark.vintage-theme .canvas-card-menu .canvas-card-menu-button:nth-child(2) {
|
|
color: #FD8B51;
|
|
}
|
|
|
|
body.theme-dark.vintage-theme .canvas-card-menu .canvas-card-menu-button:nth-child(3) {
|
|
color: #FFAD60;
|
|
}
|
|
|
|
body.theme-dark.vintage-theme .nav-file-tag {
|
|
background-color: #5f514463;
|
|
color: #7e7e7e86;
|
|
}
|
|
|
|
|
|
/* hI i have
|
|
|
|
/* Defualt Style */
|
|
|
|
|
|
body.theme-light.default-theme {
|
|
--background-primary: #e4ddd3;
|
|
--background-secondary: #EAE4DD;
|
|
--interactive-normal: #f1ece5;
|
|
--text-normal: #333;
|
|
--background-modifier-border: var(--border-size) var(--border-style) #796e6e47;
|
|
--hr-color: #796e6e47;
|
|
--table-border-color: #796e6e47;
|
|
--canvas-dot-pattern: #796e6e47;
|
|
|
|
}
|
|
|
|
|
|
/* Warm Theme - Light Mode*/
|
|
|
|
body.theme-light.warm-theme {
|
|
--background-primary: #eeddc9;
|
|
--background-secondary: #faf0e8;
|
|
--text-normal: #705757;
|
|
--icon-color: #705757;
|
|
--text-muted: #6d5c5c;
|
|
--text-faint: #2d2121;
|
|
--text-accent: #a0662fdf;
|
|
--background-modifier-border: var(--border-size) var(--border-style) #99755f91;
|
|
--code-background: #4e3d32;
|
|
--code-keyword: #de895b;
|
|
--code-normal: #a8aeb0;
|
|
--code-operator: #b89cdd;
|
|
--code-value: #e3b750;
|
|
--code-function: #dcbb59;
|
|
--code-property: #d29a8c;
|
|
--code-string: #05a36e;
|
|
--canvas-dot-pattern: #70575777;
|
|
|
|
|
|
}
|
|
|
|
/* Eclipse Theme - Light Mode */
|
|
|
|
body.theme-light.eclipse-theme {
|
|
--background-primary: #f6f6f6;
|
|
--background-secondary: #ffffff;
|
|
--text-normal: #494949;
|
|
--text-faint: #939393;
|
|
--text-accent: #1cb6ca;
|
|
--icon-color: #797c6d;
|
|
--background-modifier-border: var(--border-size) var(--border-style) #9b9b9b84;
|
|
--code-background: #2f3039;
|
|
--code-keyword: #de895b;
|
|
--code-normal: #a8aeb0;
|
|
--code-operator: #b89cdd;
|
|
--code-value: #e3b750;
|
|
--code-function: #dcbb59;
|
|
--code-property: #d29a8c;
|
|
--code-string: #05a36e;
|
|
--nav-item-background-active: --background-modifier-border: var(--border-size) var(--border-style) #9b9b9b84;
|
|
--hr-color: #b9979747;
|
|
--table-border-color: #9b9b9b84;
|
|
--canvas-dot-pattern: #4949498b;
|
|
|
|
}
|
|
body.theme-light.rose-theme{
|
|
--background-primary: #e6e9ef;
|
|
--background-secondary: #ffffff;
|
|
--text-normal: #71657c;
|
|
--icon-color: #b28eb1;
|
|
--icon-color-focused:#e363b0;
|
|
--icon-color-active:#c448bc;
|
|
|
|
--text-accent: #c521ad;
|
|
--interactive-normal: #2a2420;
|
|
--background-modifier-border: var(--border-size) var(--border-style) #d9c3df;
|
|
--code-background: #251e19;
|
|
--code-keyword: #de895b;
|
|
--code-normal: #a8aeb0;
|
|
--code-operator: #b89cdd;
|
|
--code-value: #e3b750;
|
|
--code-function: #dcbb59;
|
|
--code-property: #d29a8c;
|
|
--code-string: #05a36e;
|
|
--scrollbar-bg: #d9d3f7;
|
|
--scrollbar-thumb-bg: #cfa9da4e;
|
|
|
|
--hr-color: #524055a7;
|
|
--table-border-color: #554a40;
|
|
--canvas-dot-pattern: #705757;
|
|
--checkbox-color: #a25bc3;
|
|
--checkbox-color-hover: #ab6ed1;
|
|
|
|
}
|
|
|
|
|
|
body.theme-light.warm-amber-theme{
|
|
--background-primary: #faf4ed;
|
|
--background-secondary: #fffaf3;
|
|
--text-normal: #817993;
|
|
--icon-color-focused:#c44848;
|
|
--icon-color-active:#c45d48;
|
|
--icon-color: #be8561;
|
|
--text-accent: #c37539;
|
|
--interactive-normal: #2a2420;
|
|
--background-modifier-border: var(--border-size) var(--border-style) #d8c7a6;
|
|
--code-background: #f6efe8;
|
|
--code-keyword: #de895b;
|
|
--code-normal: #978b83;
|
|
--code-operator: #9261d1;
|
|
--code-value: #ddae3f;
|
|
--code-function: #dcbb59;
|
|
--code-property: #d88672;
|
|
--code-string: #4f8a77;
|
|
--hr-color: #554a40;
|
|
--table-border-color: #796195;
|
|
--canvas-dot-pattern: #705757;
|
|
--table-border-color:#dac4e164;
|
|
--text-selection: rgba(189, 147, 98, 0.15);
|
|
|
|
--tab-text-color-focused-active:#86486d;
|
|
--checkbox-color: #c3755b;
|
|
--checkbox-color-hover: #d19e6e;
|
|
}
|
|
|
|
|
|
/* Dark Mode Theme Style */
|
|
body.theme-dark.default-theme {
|
|
--background-primary: #20242b;
|
|
--background-secondary: #252933;
|
|
--text-normal: #919191;
|
|
--border-color: var(--border-size) var(--border-style);
|
|
--hr-color: #6e72796d;
|
|
--table-border-color: #6e72796d;
|
|
--canvas-dot-pattern: #4f5a77;
|
|
|
|
}
|
|
|
|
body.theme-dark.rose-theme{
|
|
--background-primary: #181825;
|
|
--background-secondary: #1e1e2e;
|
|
--text-normal: #dac4e1;
|
|
--icon-color-focused:#eb6f92;
|
|
--icon-color: #b28eb1;
|
|
--text-accent: #eb6f92;
|
|
--interactive-normal: #2a2420;
|
|
--background-modifier-border: var(--border-size) var(--border-style) #504055;
|
|
--code-background: #18131f;
|
|
--code-keyword: #de895b;
|
|
--code-normal: #a8aeb0;
|
|
--code-operator: #b89cdd;
|
|
--code-value: #e3b750;
|
|
--code-function: #dcbb59;
|
|
--code-property: #d29a8c;
|
|
--code-string: #05a36e;
|
|
--hr-color: #554a40;
|
|
--table-border-color: #796195;
|
|
--text-selection: rgba(174, 98, 189, 0.15);
|
|
|
|
--canvas-dot-pattern: #705757;
|
|
--table-border-color:#dac4e164;
|
|
--tab-text-color-focused-active:#86486d;
|
|
--checkbox-color: #a25bc3;
|
|
--checkbox-color-hover: #ab6ed1;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
body.theme-dark.warm-amber-theme{
|
|
--background-primary: #1d2021;
|
|
--background-secondary: #282828;
|
|
--text-normal: #e1d1c4;
|
|
--icon-color-focused:#c44848;
|
|
--icon-color-active:#c44848;
|
|
--icon-color: #bc9777;
|
|
--text-accent: #c37539;
|
|
--interactive-normal: #2a2420;
|
|
--background-modifier-border: var(--border-size) var(--border-style) #554040;
|
|
--code-background: #1c1818;
|
|
--code-keyword: #de895b;
|
|
--code-normal: #a8aeb0;
|
|
--code-operator: #b89cdd;
|
|
--code-value: #e3b750;
|
|
--code-function: #dcbb59;
|
|
--code-property: #d29a8c;
|
|
--code-string: #05a36e;
|
|
--hr-color: #554a40;
|
|
--table-border-color: #796195;
|
|
--canvas-dot-pattern: #705757;
|
|
--table-border-color:#dac4e164;
|
|
--text-selection: rgba(189, 153, 98, 0.15);
|
|
|
|
--tab-text-color-focused-active:#86486d;
|
|
--checkbox-color: #c3755b;
|
|
--checkbox-color-hover: #d19e6e;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/* Warm Theme - Dark Mode */
|
|
|
|
body.theme-dark.warm-theme {
|
|
--background-primary: #2a2420;
|
|
--background-secondary: #322c27;
|
|
--text-normal: #b3a59a;
|
|
--icon-color: #705757;
|
|
--text-accent: #c57021;
|
|
--interactive-normal: #2a2420;
|
|
--background-modifier-border: var(--border-size) var(--border-style) #554a40;
|
|
--code-background: #251e19;
|
|
--code-keyword: #de895b;
|
|
--code-normal: #a8aeb0;
|
|
--code-operator: #b89cdd;
|
|
--code-value: #e3b750;
|
|
--code-function: #dcbb59;
|
|
--code-property: #d29a8c;
|
|
--code-string: #05a36e;
|
|
--hr-color: #554a40;
|
|
--table-border-color: #554a40;
|
|
--canvas-dot-pattern: #705757;
|
|
|
|
}
|
|
|
|
|
|
/* Eclipse Theme - Dark Mode*/
|
|
|
|
body.theme-dark.eclipse-theme {
|
|
--background-primary: #1a1c1d;
|
|
--background-secondary: #262729;
|
|
--text-normal: #a6a8aa;
|
|
--text-faint: #ffffff;
|
|
--text-accent: #1cb6ca;
|
|
--icon-color: #a6a6a6;
|
|
--background-modifier-border: var(--border-size) var(--border-style) #424242;
|
|
--code-background: #1c1d24;
|
|
--code-keyword: #de895b;
|
|
--code-normal: #a8aeb0;
|
|
--code-operator: #b89cdd;
|
|
--code-value: #e3b750;
|
|
--code-function: #dcbb59;
|
|
--code-property: #d29a8c;
|
|
--code-string: #05a36e;
|
|
--hr-color: #424242;
|
|
--table-border-color: #424242;
|
|
--canvas-dot-pattern: #4f5a77;
|
|
}
|
|
|
|
|
|
|
|
body {
|
|
--icon-size: 17px;
|
|
--icon-stroke: 2px;
|
|
--icon-xs: 15px;
|
|
--icon-l: 18px;
|
|
--ribbon-width: 60px;
|
|
--ribbon-padding: 10px;
|
|
--tab-curve: 0px;
|
|
--border-size: 1.2px;
|
|
--border-style: solid;
|
|
--border-radius: 11px;
|
|
--custom-border-size: calc(var(--border-size) * 1px);
|
|
--custom-border: var(--border-size) var(--border-style);
|
|
--modal-animation: modalAnimation 0.1s ease-in;
|
|
--ribbon-box-style-margin: 11%;
|
|
--box-style-sidebar-toggle-button-height: 58px;
|
|
--font-style: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
|
--h1-font-style::inherit;
|
|
--table-border-width:0.6px;
|
|
|
|
}
|
|
|
|
body {
|
|
font-family: var(--font-style) !important;
|
|
}
|
|
|
|
.cm-contentContainer,
|
|
.markdown-preview-view, .inline-title {
|
|
font-family: var(--font-style) !important;
|
|
}
|
|
|
|
|
|
/* Basic heading styles */
|
|
body.heading-style-basic .markdown-preview-view h1,
|
|
body.heading-style-basic .markdown-preview-view h2,
|
|
body.heading-style-basic .markdown-preview-view h3,
|
|
body.heading-style-basic .markdown-preview-view h4,
|
|
body.heading-style-basic .markdown-preview-view h5,
|
|
body.heading-style-basic .markdown-preview-view h6,
|
|
body.heading-style-basic .cm-header-1,
|
|
body.heading-style-basic .cm-header-2,
|
|
body.heading-style-basic .cm-header-3,
|
|
body.heading-style-basic .cm-header-4,
|
|
body.heading-style-basic .cm-header-5,
|
|
body.heading-style-basic .cm-header-6 {
|
|
color: var(--heading-color) !important;
|
|
font-family: var(--custom-heading-font) !important;
|
|
}
|
|
|
|
/* Advanced heading styles */
|
|
/* H1 */
|
|
body.heading-style-advanced .markdown-preview-view h1,
|
|
body.heading-style-advanced .cm-header-1 {
|
|
color: var(--h1-color) !important;
|
|
font-family: var(--custom-h1-font) !important;
|
|
}
|
|
|
|
/* H2 */
|
|
body.heading-style-advanced .markdown-preview-view h2,
|
|
body.heading-style-advanced .cm-header-2 {
|
|
color: var(--h2-color) !important;
|
|
font-family: var(--custom-h2-font) !important;
|
|
}
|
|
|
|
/* H3 */
|
|
body.heading-style-advanced .markdown-preview-view h3,
|
|
body.heading-style-advanced .cm-header-3 {
|
|
color: var(--h3-color) !important;
|
|
font-family: var(--custom-h3-font) !important;
|
|
}
|
|
|
|
/* H4 */
|
|
body.heading-style-advanced .markdown-preview-view h4,
|
|
body.heading-style-advanced .cm-header-4 {
|
|
color: var(--h4-color) !important;
|
|
font-family: var(--custom-h4-font) !important;
|
|
}
|
|
|
|
/* H5 */
|
|
body.heading-style-advanced .markdown-preview-view h5,
|
|
body.heading-style-advanced .cm-header-5 {
|
|
color: var(--h5-color) !important;
|
|
font-family: var(--custom-h5-font) !important;
|
|
}
|
|
|
|
/* H6 */
|
|
body.heading-style-advanced .markdown-preview-view h6,
|
|
body.heading-style-advanced .cm-header-6 {
|
|
color: var(--h6-color) !important;
|
|
font-family: var(--custom-h6-font) !important;
|
|
}
|
|
|
|
/* Reset styles when none is selected */
|
|
body.heading-style-none .markdown-preview-view h1,
|
|
body.heading-style-none .markdown-preview-view h2,
|
|
body.heading-style-none .markdown-preview-view h3,
|
|
body.heading-style-none .markdown-preview-view h4,
|
|
body.heading-style-none .markdown-preview-view h5,
|
|
body.heading-style-none .markdown-preview-view h6,
|
|
body.heading-style-none .cm-header {
|
|
color: inherit;
|
|
font-family: inherit;
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
body.disable-border * {
|
|
border: none !important;
|
|
}
|
|
|
|
.modal-bg {
|
|
background: var(--background-modifier-cover);
|
|
}
|
|
|
|
body.enable-modal-blur .modal-bg {
|
|
backdrop-filter: blur(var(--modal-blur-amount)) !important;
|
|
}
|
|
|
|
.prompt,
|
|
.modal {
|
|
animation: none;
|
|
}
|
|
|
|
body.enable-modal-animation .modal {
|
|
animation: var(--modal-animation);
|
|
}
|
|
|
|
body.enable-modal-animation .prompt {
|
|
animation: var(--modal-animation);
|
|
}
|
|
|
|
@keyframes modalAnimation {
|
|
|
|
0% {
|
|
opacity: 0;
|
|
transform: translateX(10px);
|
|
}
|
|
|
|
100% {
|
|
opacity: 1;
|
|
transform: translateX(0);
|
|
}
|
|
|
|
}
|
|
|
|
.workspace-ribbon.mod-left.is-collapsed,
|
|
.workspace-ribbon.mod-left {
|
|
margin-top: 12%;
|
|
}
|
|
|
|
.side-dock-settings,
|
|
.side-dock-actions {
|
|
margin-top: 25px;
|
|
gap: 15px;
|
|
}
|
|
|
|
|
|
|
|
/* Default Ribbon style */
|
|
body:not(.ribbon-box-style):not(.ribbon-edge-style) .workspace-ribbon,
|
|
body.ribbon-default-style .workspace-ribbon {
|
|
max-height: 550px;
|
|
background-color: var(--background-secondary);
|
|
border-top-right-radius: var(--border-radius);
|
|
border-bottom-right-radius: var(--border-radius);
|
|
margin-bottom: 35px;
|
|
}
|
|
|
|
body:not(.ribbon-box-style):not(.ribbon-edge-style) .workspace-ribbon.mod-left.is-collapsed,
|
|
body:not(.ribbon-box-style):not(.ribbon-edge-style) .workspace-ribbon.mod-left,
|
|
body.ribbon-default-style .workspace-ribbon.mod-left.is-collapsed,
|
|
body.ribbon-default-style .workspace-ribbon.mod-left {
|
|
background-color: var(--background-secondary);
|
|
margin-top: 11%;
|
|
border-right: var(--background-modifier-border);
|
|
border-bottom: var(--background-modifier-border);
|
|
border-top: var(--background-modifier-border);
|
|
}
|
|
|
|
body:not(.ribbon-box-style):not(.ribbon-edge-style) .workspace-ribbon .sidebar-toggle-button,
|
|
body.ribbon-default-style .workspace-ribbon .sidebar-toggle-button {
|
|
margin-top: 6%;
|
|
height: 50px;
|
|
background: var(--background-secondary);
|
|
border-right: var(--background-modifier-border);
|
|
border-bottom: var(--background-modifier-border);
|
|
border-top: var(--background-modifier-border);
|
|
border-top-right-radius: var(--border-radius);
|
|
border-bottom-right-radius: var(--border-radius);
|
|
margin-bottom: 50px;
|
|
}
|
|
|
|
/* Box Style */
|
|
body.ribbon-box-style .workspace-ribbon {
|
|
background-color: transparent;
|
|
max-height: none;
|
|
margin-bottom: 0;
|
|
border-radius: 0;
|
|
height: 430px;
|
|
}
|
|
|
|
body.ribbon-box-style .workspace-ribbon.mod-left.is-collapsed,
|
|
body.ribbon-box-style .workspace-ribbon.mod-left {
|
|
background-color: transparent;
|
|
margin-top: 11%;
|
|
border: none;
|
|
}
|
|
|
|
body.ribbon-box-style .workspace-ribbon .clickable-icon {
|
|
background-color: var(--background-secondary);
|
|
border-radius: var(--border-radius);
|
|
border: var(--background-modifier-border);
|
|
padding: 10px;
|
|
}
|
|
|
|
body.ribbon-box-style .workspace-ribbon .sidebar-toggle-button {
|
|
height: 58px;
|
|
margin-top: 7%;
|
|
background: transparent;
|
|
border: none;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
body.ribbon-box-style .side-dock-settings,
|
|
body.ribbon-box-style .side-dock-actions {
|
|
margin-top: 25px;
|
|
gap: 15px;
|
|
}
|
|
|
|
/* Edge Style */
|
|
body.ribbon-edge-style .workspace-ribbon {
|
|
position: relative;
|
|
margin: 10px;
|
|
max-height: 600px;
|
|
background-color: var(--background-secondary);
|
|
border: var(--background-modifier-border);
|
|
border-radius: var(--border-radius);
|
|
}
|
|
|
|
body.ribbon-edge-style .workspace-ribbon.mod-left.is-collapsed,
|
|
body.ribbon-edge-style .workspace-ribbon.mod-left {
|
|
background-color: var(--background-secondary);
|
|
margin-top: 8%;
|
|
border: var(--background-modifier-border);
|
|
}
|
|
|
|
body.ribbon-edge-style .workspace-ribbon .sidebar-toggle-button {
|
|
height: 50px;
|
|
background: var(--background-secondary);
|
|
border-bottom: var(--background-modifier-border);
|
|
margin-bottom: 50px;
|
|
margin-top: 0;
|
|
border-top: none;
|
|
border-right: none;
|
|
border-radius: 0;
|
|
}
|
|
|
|
.sidebar-toggle-button.mod-right{
|
|
background-color: var(--background-primary);
|
|
}
|
|
|
|
body.is-focused .sidebar-toggle-button, body.is-focused .workspace-tabs.mod-top{
|
|
background-color: var(--background-primary);
|
|
}
|
|
|
|
|
|
body.ribbon-edge-style .side-dock-settings,
|
|
body.ribbon-edge-style .side-dock-actions {
|
|
margin-top: 95px;
|
|
gap: 15px;
|
|
}
|
|
|
|
|
|
|
|
/* TitleBar Styel */
|
|
|
|
|
|
body.titlebar-defualt-style .mod-linux .titlebar-button,
|
|
.mod-windows .titlebar-button {
|
|
background-color: var(--background-primary);
|
|
}
|
|
|
|
|
|
body.titlebar-retro-style.mod-windows .titlebar-button,
|
|
body.titlebar-minimal-style.mod-windows .titlebar-button,
|
|
body.titlebar-vintage-style.mod-windows .titlebar-button {
|
|
border-radius: 50%;
|
|
border: var(--background-modifier-border);
|
|
padding: 7px;
|
|
height: 5px;
|
|
width: 5px;
|
|
cursor: pointer;
|
|
transition: all 0.3s ease;
|
|
}
|
|
|
|
body.titlebar-retro-style.mod-windows .titlebar-button:hover,
|
|
body.titlebar-minimal-style.mod-windows .titlebar-button:hover,
|
|
body.titlebar-vintage-style.mod-windows .titlebar-button:hover {
|
|
padding: 8px;
|
|
}
|
|
|
|
body.titlebar-retro-style.is-hidden-frameless:not(.is-fullscreen) .titlebar-button-container.mod-right,
|
|
body.titlebar-minimal-style.is-hidden-frameless:not(.is-fullscreen) .titlebar-button-container.mod-right,
|
|
body.titlebar-vintage-style.is-hidden-frameless:not(.is-fullscreen) .titlebar-button-container.mod-right {
|
|
background-color: var(--background-primary);
|
|
gap: 10px;
|
|
margin: 12px;
|
|
padding: 10px;
|
|
transition: all 0.3s ease;
|
|
}
|
|
|
|
|
|
/* Colorfule Style - Drak Mode */
|
|
|
|
|
|
body.theme-dark.titlebar-retro-style .titlebar .mod-close {
|
|
background-color: #a33705;
|
|
}
|
|
|
|
body.theme-dark.titlebar-retro-style .titlebar .mod-maximize {
|
|
background-color: #05a36e;
|
|
}
|
|
|
|
body.theme-dark.titlebar-retro-style .titlebar .mod-minimize {
|
|
background-color: #a37905;
|
|
}
|
|
|
|
|
|
|
|
/* Colorfule Style - Light Mode */
|
|
|
|
body.theme-light.titlebar-retro-style .titlebar .mod-close {
|
|
background-color: #db5314;
|
|
}
|
|
|
|
body.theme-light.titlebar-retro-style .titlebar .mod-maximize {
|
|
background-color: #0dc285;
|
|
}
|
|
|
|
body.theme-light.titlebar-retro-style .titlebar .mod-minimize {
|
|
background-color: #d6a110;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* Colorfule Style - Hover Effect */
|
|
|
|
body.titlebar-retro-style .titlebar .mod-close:hover {
|
|
background-color: #d45730;
|
|
}
|
|
|
|
body.titlebar-retro-style .titlebar .mod-maximize:hover {
|
|
background-color: #3bd8a4;
|
|
}
|
|
|
|
body.titlebar-retro-style .titlebar .mod-minimize:hover {
|
|
background-color: #dbae31;
|
|
}
|
|
|
|
|
|
|
|
/* Minimal Style */
|
|
|
|
body.titlebar-minimal-style .titlebar .mod-close,
|
|
body.titlebar-minimal-style .titlebar .mod-maximize,
|
|
body.titlebar-minimal-style .titlebar .mod-minimize {
|
|
background-color: var(--background-secondary);
|
|
}
|
|
|
|
/* Minimal Style - Hover Effect */
|
|
|
|
body.titlebar-minimal-style .titlebar .mod-close:hover {
|
|
background-color: #cc2323bd;
|
|
}
|
|
|
|
body.titlebar-minimal-style .titlebar .mod-maximize:hover {
|
|
background-color: #23cc2cbd;
|
|
}
|
|
|
|
body.titlebar-minimal-style .titlebar .mod-minimize:hover {
|
|
background-color: #bbcc23bd;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* Retro Style - Light Mode*/
|
|
|
|
body.theme-light.titlebar-vintage-style .titlebar .mod-close {
|
|
background-color: #FFAD60;
|
|
}
|
|
|
|
body.theme-light.titlebar-vintage-style .titlebar .mod-maximize {
|
|
background-color: #FFEEAD;
|
|
}
|
|
|
|
body.theme-light.titlebar-vintage-style .titlebar .mod-minimize {
|
|
background-color: #96CEB4;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* Retro Style - Dark Mode*/
|
|
|
|
body.theme-dark.titlebar-vintage-style .titlebar .mod-close {
|
|
background-color: #db9452;
|
|
}
|
|
|
|
body.theme-dark.titlebar-vintage-style .titlebar .mod-maximize {
|
|
background-color: #e9d78f;
|
|
}
|
|
|
|
body.theme-dark.titlebar-vintage-style .titlebar .mod-minimize {
|
|
background-color: #72b998;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* Retro Style - Hover Effect */
|
|
|
|
body.titlebar-vintage-style .titlebar .mod-close:hover {
|
|
background-color: #ffc997;
|
|
}
|
|
|
|
body.titlebar-vintage-style .titlebar .mod-maximize:hover {
|
|
background-color: #fff6d4;
|
|
}
|
|
|
|
body.titlebar-vintage-style .titlebar .mod-minimize:hover {
|
|
background-color: #c6ffe4;
|
|
}
|
|
|
|
/* Hide folder icons when disabled */
|
|
body.hide-folder-icons .nav-folder .nav-folder-title .nav-folder-title-content::before,
|
|
body.hide-folder-icons .nav-folder.is-collapsed .nav-folder-title .nav-folder-title-content::before {
|
|
display: none;
|
|
}
|
|
|
|
body.hide-file-icons .nav-file .nav-file-title .nav-file-title-content::before {
|
|
display: none;
|
|
}
|
|
|
|
/* default theme styling */
|
|
|
|
.theme-dark {
|
|
--background-primary: #20242b;
|
|
--background-primary-alt: #20242b;
|
|
--background-secondary: #252933;
|
|
--background-modifier-box-shadow: rgba(0, 0, 0, 0.1);
|
|
--background-modifier-success: #55af7f;
|
|
--background-modifier-error: rgb(163, 82, 82);
|
|
--background-modifier-error-rgb: 230, 135, 135;
|
|
--background-modifier-error-hover: #b35454;
|
|
--background-modifier-cover: rgba(0, 0, 0, 0.366);
|
|
--background-modifier-border: var(--border-size) solid #6e72796d;
|
|
--code-background: #2f3039;
|
|
--code-keyword: #de895b;
|
|
--code-normal: #a8aeb0;
|
|
--code-operator: #b89cdd;
|
|
--code-value: #e3b750;
|
|
--code-function: #dcbb59;
|
|
--code-property: #d29a8c;
|
|
--code-string: #05a36e;
|
|
--checkbox-marker-color: #fff;
|
|
--checkbox-color: #c37a5b;
|
|
--checkbox-color-hover: #d18c6e;
|
|
--tab-background-active: #fbfbfa;
|
|
--tab-outline-color: #7c7c7c37;
|
|
--text-accent: #ba7e47;
|
|
--text-accent-hover: #d18c6e;
|
|
--text-normal: #8f93a1;
|
|
--text-muted: #8e8e90;
|
|
--text-faint: #999999;
|
|
--text-error: #e75545;
|
|
--text-error-hover: #f86959;
|
|
--text-highlight-bg: rgba(216, 185, 85, 0.201);
|
|
--text-selection: rgba(0, 122, 255, 0.15);
|
|
--text-on-accent: #f2f2f2;
|
|
--titlebar-background-focused:#20242b;
|
|
--icon-color: #59607b;
|
|
--interactive-normal: #dae1ef;
|
|
--interactive-hover: #dbdbdc;
|
|
--interactive-accent-rgb: 21, 146, 255;
|
|
--interactive-accent-hover: hsl(var(--accent-h), calc(var(--accent-s) - 10%), calc(var(--accent-l) - 4%));
|
|
--scrollbar-active-thumb-bg: rgba(0, 0, 0, 0.2);
|
|
--scrollbar-bg: #d9d3f7;
|
|
--scrollbar-thumb-bg: #a9bdc64e;
|
|
--panel-border-color: #dbdbdc;
|
|
--hr-color: #6e72796d;
|
|
--table-border-color: #6e72796d;
|
|
--indentation-guide-color:#59607b44;
|
|
|
|
}
|
|
|
|
.theme-light {
|
|
--background-primary: #e4ddd3;
|
|
--background-primary-alt: #EAE4DD;
|
|
--background-secondary: #EAE4DD;
|
|
--background-modifier-border: var(--border-size) solid #796e6e47;
|
|
--background-modifier-box-shadow: rgba(0, 0, 0, 0.1);
|
|
--background-modifier-success: #A4E7C3;
|
|
--background-modifier-error: #e68787;
|
|
--background-modifier-error-rgb: 230, 135, 135;
|
|
--background-modifier-error-hover: #FF9494;
|
|
--background-modifier-cover: rgba(0, 0, 0, 0.507);
|
|
--code-background: #e2dcd5;
|
|
--code-keyword: #de895b;
|
|
--code-normal: #a8aeb0;
|
|
--code-operator: #b89cdd;
|
|
--code-value: #e3b750;
|
|
--code-function: #dcbb59;
|
|
--code-property: #d29a8c;
|
|
--code-string: #05a36e;
|
|
--checkbox-marker-color: #fff;
|
|
--checkbox-color: #c37a5b;
|
|
--checkbox-color-hover: #d18c6e;
|
|
--tab-background-active: #fbfbfa;
|
|
--tab-outline-color: #7c7c7c37;
|
|
--text-accent: #985c35;
|
|
--text-accent-hover: #bf7c50;
|
|
--text-normal: #383a42;
|
|
--text-muted: #8a7e69;
|
|
--text-faint: #957c57d4;
|
|
--text-error: #ba6d64;
|
|
--text-error-hover: #533232;
|
|
--text-highlight-bg: rgba(230, 192, 70, 0.4);
|
|
--text-selection: rgba(0, 122, 255, 0.15);
|
|
--text-on-accent: #f2f2f2;
|
|
--titlebar-background-focused:#e4ddd3;
|
|
--icon-color: #705757;
|
|
--interactive-normal: #eaeaeb;
|
|
--interactive-hover: #dbdbdc;
|
|
--interactive-accent-rgb: 21, 146, 255;
|
|
--interactive-accent-hover: hsl(var(--accent-h), calc(var(--accent-s) - 10%), calc(var(--accent-l) - 4%));
|
|
--scrollbar-active-thumb-bg: rgba(0, 0, 0, 0.2);
|
|
--scrollbar-bg: #F7EED3;
|
|
--scrollbar-thumb-bg: #c6bfa94e;
|
|
--panel-border-color: #dbdbdc;
|
|
--hr-color: #796e6e47;
|
|
--table-border-color: #91727271;
|
|
--indentation-guide-color:#957c5723;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.workspace-leaf-content,
|
|
.nav-header,
|
|
.search-result-container.mod-global-search,
|
|
.tag-container {
|
|
background-color: var(--background-secondary);
|
|
}
|
|
|
|
|
|
|
|
.workspace-leaf-content,
|
|
.mod-root .workspace-leaf,
|
|
.canvas-controls {
|
|
border-radius: var(--border-radius);
|
|
}
|
|
|
|
|
|
.workspace-leaf-content[data-type='file-explorer'],
|
|
[data-type='search'],
|
|
[data-type='bookmarks'] {
|
|
margin-bottom: 29px;
|
|
}
|
|
|
|
.theme-light .workspace,
|
|
.theme-dark .workspace {
|
|
background-color: var(--background-primary);
|
|
display: flex;
|
|
}
|
|
|
|
.workspace-leaf-content {
|
|
border: var(--background-modifier-border);
|
|
margin-bottom: 13px;
|
|
}
|
|
|
|
.workspace-tabs .workspace-leaf {
|
|
background-color: var(--background-primary);
|
|
}
|
|
|
|
/* .mod-root .workspace-leaf {
|
|
margin: 5px;
|
|
} */
|
|
|
|
.workspace-tabs.mod-top-right-space .workspace-tab-container {
|
|
margin-bottom:0 ;
|
|
}
|
|
|
|
.workspace-tabs.mod-top-right-space .workspace-leaf-content {
|
|
margin: 0;
|
|
}
|
|
|
|
.workspace-tabs.mod-top-left-space .workspace-tab-container {
|
|
margin-bottom:0 ;
|
|
}
|
|
|
|
.workspace-tabs.mod-top-left-space .workspace-leaf-content {
|
|
margin: 0;
|
|
}
|
|
|
|
.workspace-tab-container {
|
|
margin: 1px 10px 17px;
|
|
}
|
|
|
|
.workspace-tabs .workspace-leaf .view-content,
|
|
.nav-header,
|
|
.search-result-container.mod-global-search,
|
|
.tag-container {
|
|
background-color: var(--background-secondary);
|
|
}
|
|
|
|
/* I didn't send the label to daud for advice because I previously sent the label design to Daud for feedback, so I don't think I need to keep asking him for advice on the same design, */
|
|
|
|
|
|
.workspace-tab-header.is-active {
|
|
background-color: var(--tab-background-active);
|
|
border: var(--background-modifier-border);
|
|
box-shadow: none;
|
|
border-radius: var(--border-radius);
|
|
}
|
|
|
|
.theme-light .workspace-tab-header-container:not(.workspace-split) {
|
|
align-items: center;
|
|
position: relative;
|
|
border: none;
|
|
height: 62px;
|
|
background-color: var(--accent-color-bg);
|
|
}
|
|
|
|
|
|
.theme-dark .workspace-tab-header-container:not(.workspace-split) {
|
|
align-items: center;
|
|
position: relative;
|
|
border: none;
|
|
height: 62px;
|
|
background-color: var(--accent-color-bg_d);
|
|
}
|
|
|
|
.workspace .mod-root .workspace-tab-header {
|
|
cursor: pointer;
|
|
transition: all 0.3s ease;
|
|
}
|
|
|
|
.workspace .mod-root .workspace-tab-header:hover {
|
|
transform: translateY(5px);
|
|
}
|
|
|
|
.mod-root:not(.mod-left-split):not(.mod-right-split) .workspace-tabs:not(.mod-stacked) .workspace-tab-header.is-active {
|
|
background-color: var(--background-secondary);
|
|
height: 37px;
|
|
color: rgb(60, 60, 60);
|
|
text-align: center !important;
|
|
}
|
|
|
|
|
|
.mod-root:not(.mod-left-split):not(.mod-right-split) .workspace-tabs:not(.mod-stacked) .workspace-tab-header {
|
|
margin: 0 2.5px 5px 2.5px;
|
|
}
|
|
|
|
.workspace .mod-root .workspace-tab-header .workspace-tab-header-inner-close-button {
|
|
display: none;
|
|
}
|
|
|
|
.workspace .mod-root .workspace-tab-header-inner-title {
|
|
padding-top: 3px;
|
|
}
|
|
|
|
.workspace-tab-header-tab-list .clickable-icon,
|
|
.workspace-tab-header-new-tab .clickable-icon {
|
|
background-color: var(--background-secondary);
|
|
border-radius: 50%;
|
|
border: var(--background-modifier-border);
|
|
}
|
|
|
|
|
|
.workspace-tab-header-tab-list .clickable-icon {
|
|
background-color: var(--background-secondary);
|
|
border-radius: 50%;
|
|
border: var(--background-modifier-border);
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.view-header {
|
|
background-color: var(--background-secondary);
|
|
border-bottom: var(--background-modifier-border);
|
|
}
|
|
|
|
.is-focused .workspace-leaf.mod-active .view-header {
|
|
background-color: var(--background-secondary);
|
|
}
|
|
|
|
.view-header-left {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.view-header-nav-buttons {
|
|
align-items: center;
|
|
display: flex;
|
|
gap: 5px;
|
|
}
|
|
|
|
.view-header-nav-buttons .clickable-icon {
|
|
border: var(--background-modifier-border);
|
|
border-radius: var(--border-radius);
|
|
}
|
|
|
|
.view-header-title-container {
|
|
border-left: var(--background-modifier-border);
|
|
border-right: var(--background-modifier-border);
|
|
}
|
|
|
|
.mod-fade:not(.mod-at-end):after {
|
|
background: transparent;
|
|
}
|
|
|
|
.status-bar {
|
|
border: var(--background-modifier-border);
|
|
}
|
|
|
|
.nav-header {
|
|
border-bottom: var(--background-modifier-border);
|
|
padding: 12px;
|
|
}
|
|
|
|
.nav-files-container {
|
|
cursor: pointer;
|
|
background-color: var(--background-secondary);
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.nav-file-tag {
|
|
padding: 1px 5px;
|
|
text-align: center;
|
|
line-height: 2;
|
|
|
|
}
|
|
|
|
.nav-buttons-container {
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/* closed folder Icon */
|
|
|
|
|
|
.nav-folder.is-collapsed .nav-folder-title .nav-folder-title-content::before {
|
|
mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22 0%200%20256%20256%22%3E%3Cpath%20d%3D%22M216%2C72H131.31L104%2C44.69A15.86%2C15.86%2C0%2C0%2C0%2C92.69%2C40H40A16%2C16%2C0%2C0%2C0%2C24%2C56V200.62A15.4%2C15.4%2C0%2C0%2C0%2C39.38%2C216H216.89A15.13%2C15.13%2C0%2C0%2C0%2C232%2C200.89V88A16%2C16%2C0%2C0%2C0%2C216%2C72ZM40%2C56H92.69l16%2C16H40ZM216%2C200H40V88H216Z%22%2F%3E%3C%2Fsvg%3E");
|
|
mask-repeat: no-repeat;
|
|
mask-position: center;
|
|
}
|
|
|
|
.nav-folder.is-collapsed .nav-folder-title .nav-folder-title-content::before,
|
|
.nav-folder .nav-folder-title .nav-folder-title-content::before {
|
|
width: 20px;
|
|
height: 20px;
|
|
margin-right: 8px;
|
|
background-repeat: no-repeat;
|
|
vertical-align: -3px;
|
|
background-color: var(--icon-color);
|
|
opacity: 70%;
|
|
|
|
}
|
|
|
|
/* opened folder Icon */
|
|
|
|
.nav-folder .nav-folder-title .nav-folder-title-content::before {
|
|
display: inline-block;
|
|
width: 20px;
|
|
height: 20px;
|
|
background-size: 10px;
|
|
content: "";
|
|
font-size: 1rem;
|
|
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000000' viewBox='0 0 256 256'%3E%3Cpath d='M245,110.64A16,16,0,0,0,232,104H216V88a16,16,0,0,0-16-16H130.67L102.94,51.2a16.14,16.14,0,0,0-9.6-3.2H40A16,16,0,0,0,24,64V208h0a8,8,0,0,0,8,8H211.1a8,8,0,0,0,7.59-5.47l28.49-85.47A16.05,16.05,0,0,0,245,110.64ZM93.34,64,123.2,86.4A8,8,0,0,0,128,88h72v16H69.77a16,16,0,0,0-15.18,10.94L40,158.7V64Zm112,136H43.1l26.67-80H232Z'/%3E%3C/svg%3E");
|
|
mask-repeat: no-repeat;
|
|
mask-position: center;
|
|
}
|
|
|
|
.nav-file .nav-file-title .nav-file-title-content::before {
|
|
width: 20px;
|
|
height: 20px;
|
|
margin-right: 8px;
|
|
background-repeat: no-repeat;
|
|
vertical-align: -3px;
|
|
background-color: var(--icon-color);
|
|
opacity: 60%;
|
|
}
|
|
|
|
/* File Icon */
|
|
|
|
.nav-file .nav-file-title-content:before {
|
|
content: "";
|
|
position: relative;
|
|
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000000' viewBox='0 0 256 256'%3E%3Cpath d='M213.66,82.34l-56-56A8,8,0,0,0,152,24H56A16,16,0,0,0,40,40V216a16,16,0,0,0,16,16H200a16,16,0,0,0,16-16V88A8,8,0,0,0,213.66,82.34ZM160,51.31,188.69,80H160ZM200,216H56V40h88V88a8,8,0,0,0,8,8h48V216Z'/%3E%3C/svg%3E");
|
|
mask-repeat: no-repeat;
|
|
mask-position: center;
|
|
display: inline-block;
|
|
margin-right: 4px;
|
|
height: 14px;
|
|
width: 14px;
|
|
}
|
|
|
|
|
|
.collapse-icon svg.svg-icon{
|
|
color: var(--icon-color) ;
|
|
opacity: 45%;
|
|
}
|
|
.workspace-split.mod-horizontal {
|
|
background-color: var(--background-primary);
|
|
padding: 6px;
|
|
}
|
|
|
|
body.workspace-ribbon {
|
|
padding: 10px;
|
|
}
|
|
|
|
.workspace-ribbon.mod-left.is-collapsed,
|
|
.workspace-ribbon.mod-left {
|
|
background-color: transparent;
|
|
margin-top: 10%;
|
|
}
|
|
|
|
.workspace-ribbon.mod-left:before {
|
|
display: none;
|
|
}
|
|
|
|
|
|
|
|
.mod-left-split .workspace-tab-header-container-inner,
|
|
.mod-right-split .workspace-tab-header-container-inner {
|
|
width: 100%;
|
|
}
|
|
|
|
.mod-left-split .workspace-tab-header,
|
|
.mod-right-split .workspace-tab-header {
|
|
padding: 8.2px 2px;
|
|
margin-right: 5px;
|
|
border-radius: var(--border-radius);
|
|
border: var(--background-modifier-border);
|
|
}
|
|
|
|
.mod-left-split .workspace-tab-header.has-active-menu,
|
|
.mod-right-split .workspace-tab-header.has-active-menu,
|
|
.mod-left-split .workspace-tab-header.is-active,
|
|
.mod-right-split .workspace-tab-header.is-active {
|
|
background-color: var(--background-secondary);
|
|
}
|
|
|
|
body:not(.is-mobile) .workspace-split.mod-left-split .workspace-sidedock-vault-profile {
|
|
position: relative;
|
|
border: var(--background-modifier-border);
|
|
border-bottom-left-radius:var(--border-radius) ;
|
|
border-bottom-right-radius:var(--border-radius) ;
|
|
|
|
bottom: 1.1em;
|
|
width: 100%;
|
|
padding: 15px;
|
|
margin: 0 10px;
|
|
width: auto;
|
|
}
|
|
|
|
.workspace-split.mod-left-split>.workspace-leaf-resize-handle,
|
|
.workspace-split.mod-right-split>.workspace-leaf-resize-handle {
|
|
border: none;
|
|
opacity: 0;
|
|
background-color: transparent;
|
|
|
|
}
|
|
|
|
.workspace-leaf-resize-handle {
|
|
border: none;
|
|
opacity: 0;
|
|
background-color: transparent;
|
|
transition: all 0.3S ease-in;
|
|
|
|
}
|
|
|
|
.workspace-leaf-resize-handle:hover {
|
|
background-color: var;
|
|
opacity: 1;
|
|
}
|
|
|
|
.is-hidden-frameless:not(.is-fullscreen) .workspace-tabs.mod-top-right-space .workspace-tab-header-container {
|
|
padding-right: -1px;
|
|
}
|
|
|
|
|
|
|
|
/* Canvas */
|
|
|
|
|
|
.canvas-wrapper {
|
|
background-color: var(--background-secondary);
|
|
}
|
|
|
|
.canvas-control-item {
|
|
border-radius: var(--border-radius);
|
|
cursor: pointer;
|
|
box-shadow: none;
|
|
display: flex;
|
|
border: var(--background-modifier-border);
|
|
margin-bottom: 10px;
|
|
z-index: 10;
|
|
color: var(--icon-color);
|
|
background-color: var(--background-primary);
|
|
}
|
|
|
|
.canvas-control-group {
|
|
box-shadow: none;
|
|
background-color: transparent;
|
|
border: none;
|
|
}
|
|
|
|
.canvas-control-item:last-child {
|
|
border: var(--background-modifier-border);
|
|
}
|
|
|
|
.canvas-card-menu .canvas-card-menu-button {
|
|
background-color: var(--background-primary);
|
|
margin: 10px;
|
|
border: var(--background-modifier-border);
|
|
cursor: pointer;
|
|
border-radius: 10px;
|
|
color: var(--icon-color);
|
|
|
|
}
|
|
|
|
.canvas-card-menu {
|
|
background-color: transparent !important;
|
|
box-shadow: none;
|
|
}
|
|
|
|
.canvas-node-container {
|
|
box-shadow: none;
|
|
border: var(--background-modifier-border);
|
|
}
|
|
|
|
.canvas-menu {
|
|
border: var(--background-modifier-border);
|
|
}
|
|
|
|
|
|
/* Graph */
|
|
|
|
.graph-controls {
|
|
position: absolute;
|
|
border: var(--background-modifier-border);
|
|
padding: 0;
|
|
background-color: var(--background-primary);
|
|
}
|
|
|
|
.graph-controls.is-close {
|
|
width: auto;
|
|
background-color: var(--background-primary);
|
|
border: var(--background-modifier-border);
|
|
}
|
|
|
|
.graph-controls:not(.is-close) {
|
|
box-shadow: none;
|
|
border: var(--background-modifier-border);
|
|
}
|
|
|
|
|
|
/* Menu */
|
|
|
|
.menu {
|
|
border-radius: var(--background-modifier-border);
|
|
box-shadow: none;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.menu {
|
|
border: var(--background-modifier-border);
|
|
background-color: var(--background-primary);
|
|
}
|
|
|
|
.menu-separator {
|
|
border-bottom: var(--background-modifier-border);
|
|
}
|
|
|
|
.prompt {
|
|
animation: modalAnimation 0.1s ease-in;
|
|
border: var(--background-modifier-border);
|
|
}
|
|
|
|
input.prompt-input:hover,
|
|
input.prompt-input:focus,
|
|
input.prompt-input:focus-visible {
|
|
border-bottom: var(--background-modifier-border);
|
|
}
|
|
|
|
.prompt-instructions {
|
|
border-top: var(--background-modifier-border);
|
|
color: var(--text-muted);
|
|
}
|
|
|
|
|
|
|
|
|
|
/* MODAL */
|
|
|
|
.modal {
|
|
border: var(--background-modifier-border);
|
|
}
|
|
|
|
.modal-bg {
|
|
background: var(--background-modifier-cover) !important;
|
|
}
|
|
|
|
body.enable-modal-blur .modal-bg {
|
|
backdrop-filter: blur(var(--modal-blur-amount));
|
|
}
|
|
|
|
.modal.mod-settings .vertical-tab-header {
|
|
border-right: var(--background-modifier-border);
|
|
}
|
|
|
|
.vertical-tab-header {
|
|
padding: 10px;
|
|
}
|
|
|
|
.setting-item {
|
|
border-top: none;
|
|
}
|
|
|
|
.horizontal-tab-nav-item,
|
|
.vertical-tab-nav-item {
|
|
cursor: pointer;
|
|
padding: 10px;
|
|
}
|
|
|
|
.search-input-container input {
|
|
border: var(--background-modifier-border);
|
|
}
|
|
|
|
select,
|
|
button,
|
|
.dropdown {
|
|
background-color: var(--background-secondary);
|
|
border: var(--background-modifier-border);
|
|
box-shadow: none;
|
|
}
|
|
|
|
button:not(.clickable-icon) {
|
|
box-shadow: none;
|
|
}
|
|
|
|
.community-item {
|
|
border: var(--background-modifier-border);
|
|
}
|
|
|
|
body:not(.is-phone) .horizontal-tab-nav-item.is-active,
|
|
body:not(.is-phone) .vertical-tab-nav-item.is-active {
|
|
padding: 10px;
|
|
background-color: var(--background-primary);
|
|
border: var(--background-modifier-border);
|
|
color: var(--text-faint);
|
|
cursor: pointer;
|
|
}
|
|
|
|
input[type='text'],
|
|
input[type='search'],
|
|
input[type='email'],
|
|
input[type='password'],
|
|
input[type='number'] {
|
|
border: var(--background-modifier-border);
|
|
background-color: var(--background-primary);
|
|
}
|
|
|
|
button:not(.clickable-icon) {
|
|
background-color: var(--background-secondary);
|
|
color: var(--text-normal);
|
|
}
|
|
|
|
.style-settings-heading {
|
|
border: none;
|
|
background-color: transparent;
|
|
}
|
|
|
|
.style-settings-container .setting-item{
|
|
background-color: var(--background-secondary);
|
|
}
|
|
.style-settings-container {
|
|
background-color: var(--background-primary);
|
|
padding: 10px;
|
|
}
|
|
|
|
.style-settings-container .setting-item {
|
|
border: var(--background-modifier-border);
|
|
padding: 10px;
|
|
border-radius: 10px;
|
|
margin-bottom: 10px;
|
|
|
|
}
|
|
.setting-item-name, .setting-item-description{
|
|
margin-left: 19px;
|
|
}
|