diff --git a/fish/config.fish b/fish/config.fish new file mode 100644 index 0000000..4183bf1 --- /dev/null +++ b/fish/config.fish @@ -0,0 +1,27 @@ +if status is-interactive + # Commands to run in interactive sessions can go here +end + +alias ls="ls --color=auto" +alias grep="grep --color=auto" + +set -gx PATH /home/red/.config/herd-lite/bin $PATH +set -x ANDROID_HOME "home/red/Android/Sdk" +set -x ANDROID_SDK_ROOT "home/red/Android/Sdk" + +if set -q PHP_INI_SCAN_DIR + set -gx PHP_INI_SCAN_DIR "/home/red/.config/herd-lite/bin:$PHP_INI_SCAN_DIR" +else + set -gx PHP_INI_SCAN_DIR "/home/red/.config/herd-lite/bin" +end + +function sail + if test -f sail + sh sail $argv + else + sh vendor/bin/sail $argv + end +end + +export BUN_INSTALL="$HOME/.bun" +export PATH="$BUN_INSTALL/bin:$PATH" diff --git a/fish/fish_variables b/fish/fish_variables new file mode 100644 index 0000000..4e013f2 --- /dev/null +++ b/fish/fish_variables @@ -0,0 +1,42 @@ +# This file contains fish universal variable definitions. +# VERSION: 3.0 +SETUVAR __fish_initialized:3800 +SETUVAR fish_color_autosuggestion:FFC473 +SETUVAR fish_color_cancel:\x2d\x2dreverse +SETUVAR fish_color_command:FF9400 +SETUVAR fish_color_comment:A63100 +SETUVAR fish_color_cwd:green +SETUVAR fish_color_cwd_root:red +SETUVAR fish_color_end:FF4C00 +SETUVAR fish_color_error:FFDD73 +SETUVAR fish_color_escape:00a6b2 +SETUVAR fish_color_history_current:\x2d\x2dbold +SETUVAR fish_color_host:normal +SETUVAR fish_color_host_remote:\x1d +SETUVAR fish_color_keyword:\x1d +SETUVAR fish_color_match:\x2d\x2dbackground\x3dbrblue +SETUVAR fish_color_normal:normal +SETUVAR fish_color_operator:00a6b2 +SETUVAR fish_color_option:\x1d +SETUVAR fish_color_param:FFC000 +SETUVAR fish_color_quote:BF9C30 +SETUVAR fish_color_redirection:BF5B30 +SETUVAR fish_color_search_match:white\x1e\x2d\x2dbackground\x3dbrblack +SETUVAR fish_color_selection:white\x1e\x2d\x2dbold\x1e\x2d\x2dbackground\x3dbrblack +SETUVAR fish_color_status:red +SETUVAR fish_color_user:brgreen +SETUVAR fish_color_valid_path:\x2d\x2dunderline +SETUVAR fish_key_bindings:fish_default_key_bindings +SETUVAR fish_pager_color_background:\x1d +SETUVAR fish_pager_color_completion:normal +SETUVAR fish_pager_color_description:B3A06D +SETUVAR fish_pager_color_prefix:normal\x1e\x2d\x2dbold\x1e\x2d\x2dunderline +SETUVAR fish_pager_color_progress:brwhite\x1e\x2d\x2dbackground\x3dcyan +SETUVAR fish_pager_color_secondary_background:\x1d +SETUVAR fish_pager_color_secondary_completion:\x1d +SETUVAR fish_pager_color_secondary_description:\x1d +SETUVAR fish_pager_color_secondary_prefix:\x1d +SETUVAR fish_pager_color_selected_background:\x2d\x2dbackground\x3dbrblack +SETUVAR fish_pager_color_selected_completion:\x1d +SETUVAR fish_pager_color_selected_description:\x1d +SETUVAR fish_pager_color_selected_prefix:\x1d diff --git a/gtk-3.0/gtk.css b/gtk-3.0/gtk.css new file mode 100644 index 0000000..82cc104 --- /dev/null +++ b/gtk-3.0/gtk.css @@ -0,0 +1,3 @@ +#xfce4-terminal-notebook vte-terminal { + padding: 13px; +} diff --git a/gtk-3.0/settings.ini b/gtk-3.0/settings.ini new file mode 100755 index 0000000..bad41e0 --- /dev/null +++ b/gtk-3.0/settings.ini @@ -0,0 +1,17 @@ +[Settings] +gtk-theme-name=Arc-Dark +gtk-icon-theme-name=Qogir-dark +gtk-font-name=Noto Sans 10 +gtk-cursor-theme-name=Qogir-dark +gtk-cursor-theme-size=24 +gtk-toolbar-style=GTK_TOOLBAR_ICONS +gtk-toolbar-icon-size=GTK_ICON_SIZE_LARGE_TOOLBAR +gtk-button-images=0 +gtk-menu-images=0 +gtk-enable-event-sounds=1 +gtk-enable-input-feedback-sounds=0 +gtk-xft-antialias=1 +gtk-xft-hinting=1 +gtk-xft-hintstyle=hintslight +gtk-xft-rgba=rgb +gtk-application-prefer-dark-theme=0 diff --git a/gtk-4.0/assets/checkbox-checked-symbolic.svg b/gtk-4.0/assets/checkbox-checked-symbolic.svg new file mode 100644 index 0000000..c3eedb0 --- /dev/null +++ b/gtk-4.0/assets/checkbox-checked-symbolic.svg @@ -0,0 +1,44 @@ + + + + + + + + diff --git a/gtk-4.0/assets/checkbox-checked-symbolic@2.svg b/gtk-4.0/assets/checkbox-checked-symbolic@2.svg new file mode 100644 index 0000000..96be359 --- /dev/null +++ b/gtk-4.0/assets/checkbox-checked-symbolic@2.svg @@ -0,0 +1,45 @@ + + + + + + + + diff --git a/gtk-4.0/assets/checkbox-mixed-symbolic.svg b/gtk-4.0/assets/checkbox-mixed-symbolic.svg new file mode 100644 index 0000000..f016658 --- /dev/null +++ b/gtk-4.0/assets/checkbox-mixed-symbolic.svg @@ -0,0 +1,49 @@ + + + + + + + + diff --git a/gtk-4.0/assets/checkbox-mixed-symbolic@2.svg b/gtk-4.0/assets/checkbox-mixed-symbolic@2.svg new file mode 100644 index 0000000..1bc6987 --- /dev/null +++ b/gtk-4.0/assets/checkbox-mixed-symbolic@2.svg @@ -0,0 +1,50 @@ + + + + + + + + diff --git a/gtk-4.0/assets/close.svg b/gtk-4.0/assets/close.svg new file mode 100644 index 0000000..06201c3 --- /dev/null +++ b/gtk-4.0/assets/close.svg @@ -0,0 +1,38 @@ + + + + + + diff --git a/gtk-4.0/assets/cursor-handle-symbolic.svg b/gtk-4.0/assets/cursor-handle-symbolic.svg new file mode 100644 index 0000000..e2a252b --- /dev/null +++ b/gtk-4.0/assets/cursor-handle-symbolic.svg @@ -0,0 +1,3 @@ + + + diff --git a/gtk-4.0/assets/maximize.svg b/gtk-4.0/assets/maximize.svg new file mode 100644 index 0000000..39316eb --- /dev/null +++ b/gtk-4.0/assets/maximize.svg @@ -0,0 +1,38 @@ + + + + + + diff --git a/gtk-4.0/assets/minimize.svg b/gtk-4.0/assets/minimize.svg new file mode 100644 index 0000000..f3683b9 --- /dev/null +++ b/gtk-4.0/assets/minimize.svg @@ -0,0 +1,43 @@ + + + + + + diff --git a/gtk-4.0/assets/radio-checked-symbolic.svg b/gtk-4.0/assets/radio-checked-symbolic.svg new file mode 100644 index 0000000..d13b029 --- /dev/null +++ b/gtk-4.0/assets/radio-checked-symbolic.svg @@ -0,0 +1,45 @@ + + + + + + + + diff --git a/gtk-4.0/assets/radio-checked-symbolic@2.svg b/gtk-4.0/assets/radio-checked-symbolic@2.svg new file mode 100644 index 0000000..ed8d87a --- /dev/null +++ b/gtk-4.0/assets/radio-checked-symbolic@2.svg @@ -0,0 +1,45 @@ + + + + + + + + diff --git a/gtk-4.0/assets/radio-mixed-symbolic.svg b/gtk-4.0/assets/radio-mixed-symbolic.svg new file mode 120000 index 0000000..79b7355 --- /dev/null +++ b/gtk-4.0/assets/radio-mixed-symbolic.svg @@ -0,0 +1 @@ +checkbox-mixed-symbolic.svg \ No newline at end of file diff --git a/gtk-4.0/assets/radio-mixed-symbolic@2.svg b/gtk-4.0/assets/radio-mixed-symbolic@2.svg new file mode 120000 index 0000000..b68859d --- /dev/null +++ b/gtk-4.0/assets/radio-mixed-symbolic@2.svg @@ -0,0 +1 @@ +checkbox-mixed-symbolic@2.svg \ No newline at end of file diff --git a/gtk-4.0/assets/scale-horz-marks-after-slider-symbolic.svg b/gtk-4.0/assets/scale-horz-marks-after-slider-symbolic.svg new file mode 100644 index 0000000..de0d789 --- /dev/null +++ b/gtk-4.0/assets/scale-horz-marks-after-slider-symbolic.svg @@ -0,0 +1,53 @@ + + + + + + + + + + + diff --git a/gtk-4.0/assets/scale-horz-marks-before-slider-symbolic.svg b/gtk-4.0/assets/scale-horz-marks-before-slider-symbolic.svg new file mode 100644 index 0000000..7f0235f --- /dev/null +++ b/gtk-4.0/assets/scale-horz-marks-before-slider-symbolic.svg @@ -0,0 +1,47 @@ + + + + + + + + + + diff --git a/gtk-4.0/assets/scale-slider-hover-symbolic.svg b/gtk-4.0/assets/scale-slider-hover-symbolic.svg new file mode 100644 index 0000000..993f308 --- /dev/null +++ b/gtk-4.0/assets/scale-slider-hover-symbolic.svg @@ -0,0 +1,41 @@ + + + + + + diff --git a/gtk-4.0/assets/scale-slider-hover-symbolic@2.svg b/gtk-4.0/assets/scale-slider-hover-symbolic@2.svg new file mode 100644 index 0000000..740bc8b --- /dev/null +++ b/gtk-4.0/assets/scale-slider-hover-symbolic@2.svg @@ -0,0 +1,41 @@ + + + + + + diff --git a/gtk-4.0/assets/scale-slider-symbolic.svg b/gtk-4.0/assets/scale-slider-symbolic.svg new file mode 100644 index 0000000..73a1dbe --- /dev/null +++ b/gtk-4.0/assets/scale-slider-symbolic.svg @@ -0,0 +1,40 @@ + + + + + + diff --git a/gtk-4.0/assets/scale-slider-symbolic@2.svg b/gtk-4.0/assets/scale-slider-symbolic@2.svg new file mode 100644 index 0000000..bec2ee4 --- /dev/null +++ b/gtk-4.0/assets/scale-slider-symbolic@2.svg @@ -0,0 +1,41 @@ + + + + + + diff --git a/gtk-4.0/assets/scale-vert-marks-after-slider-symbolic.svg b/gtk-4.0/assets/scale-vert-marks-after-slider-symbolic.svg new file mode 100644 index 0000000..37d9c04 --- /dev/null +++ b/gtk-4.0/assets/scale-vert-marks-after-slider-symbolic.svg @@ -0,0 +1,52 @@ + + + + + + + + + + + diff --git a/gtk-4.0/assets/scale-vert-marks-before-slider-symbolic.svg b/gtk-4.0/assets/scale-vert-marks-before-slider-symbolic.svg new file mode 100644 index 0000000..1bc5cb6 --- /dev/null +++ b/gtk-4.0/assets/scale-vert-marks-before-slider-symbolic.svg @@ -0,0 +1,55 @@ + + + + + + + + + + + diff --git a/gtk-4.0/assets/small-checkbox-checked-symbolic.svg b/gtk-4.0/assets/small-checkbox-checked-symbolic.svg new file mode 100644 index 0000000..caed76f --- /dev/null +++ b/gtk-4.0/assets/small-checkbox-checked-symbolic.svg @@ -0,0 +1,45 @@ + + + + + + + + diff --git a/gtk-4.0/assets/small-checkbox-checked-symbolic@2.svg b/gtk-4.0/assets/small-checkbox-checked-symbolic@2.svg new file mode 100644 index 0000000..58aa5ff --- /dev/null +++ b/gtk-4.0/assets/small-checkbox-checked-symbolic@2.svg @@ -0,0 +1,46 @@ + + + + + + + + diff --git a/gtk-4.0/assets/small-checkbox-mixed-symbolic.svg b/gtk-4.0/assets/small-checkbox-mixed-symbolic.svg new file mode 100644 index 0000000..0e477a9 --- /dev/null +++ b/gtk-4.0/assets/small-checkbox-mixed-symbolic.svg @@ -0,0 +1,49 @@ + + + + + + + + diff --git a/gtk-4.0/assets/small-checkbox-mixed-symbolic@2.svg b/gtk-4.0/assets/small-checkbox-mixed-symbolic@2.svg new file mode 100644 index 0000000..d0980e2 --- /dev/null +++ b/gtk-4.0/assets/small-checkbox-mixed-symbolic@2.svg @@ -0,0 +1,49 @@ + + + + + + + + diff --git a/gtk-4.0/assets/small-radio-checked-symbolic.svg b/gtk-4.0/assets/small-radio-checked-symbolic.svg new file mode 100644 index 0000000..0fdb530 --- /dev/null +++ b/gtk-4.0/assets/small-radio-checked-symbolic.svg @@ -0,0 +1,41 @@ + + + + + + diff --git a/gtk-4.0/assets/small-radio-checked-symbolic@2.svg b/gtk-4.0/assets/small-radio-checked-symbolic@2.svg new file mode 100644 index 0000000..251e2f5 --- /dev/null +++ b/gtk-4.0/assets/small-radio-checked-symbolic@2.svg @@ -0,0 +1,41 @@ + + + + + + diff --git a/gtk-4.0/assets/small-radio-mixed-symbolic.svg b/gtk-4.0/assets/small-radio-mixed-symbolic.svg new file mode 120000 index 0000000..86dfcec --- /dev/null +++ b/gtk-4.0/assets/small-radio-mixed-symbolic.svg @@ -0,0 +1 @@ +small-checkbox-mixed-symbolic.svg \ No newline at end of file diff --git a/gtk-4.0/assets/small-radio-mixed-symbolic@2.svg b/gtk-4.0/assets/small-radio-mixed-symbolic@2.svg new file mode 120000 index 0000000..bafb558 --- /dev/null +++ b/gtk-4.0/assets/small-radio-mixed-symbolic@2.svg @@ -0,0 +1 @@ +small-checkbox-mixed-symbolic@2.svg \ No newline at end of file diff --git a/gtk-4.0/assets/unmaximize.svg b/gtk-4.0/assets/unmaximize.svg new file mode 100644 index 0000000..492d47a --- /dev/null +++ b/gtk-4.0/assets/unmaximize.svg @@ -0,0 +1,46 @@ + + + + + + + diff --git a/gtk-4.0/gtk-dark.css b/gtk-4.0/gtk-dark.css new file mode 100644 index 0000000..d062441 --- /dev/null +++ b/gtk-4.0/gtk-dark.css @@ -0,0 +1,8704 @@ +@keyframes ripple { + to { + background-size: 1000% 1000%; + } +} + +@keyframes ripple-on-slider { + to { + background-size: auto, 1000% 1000%; + } +} + +@keyframes ripple-on-headerbar { + from { + background-image: radial-gradient(circle, #89b4fa 0%, transparent 0%); + } + to { + background-image: radial-gradient(circle, #89b4fa 100%, transparent 100%); + } +} + +/*************** + * Base States * + ***************/ +.background { + background-color: #1e1e2e; + color: #eff1f5; +} + +dnd { + color: #eff1f5; +} + +.normal-icons { + -gtk-icon-size: 16px; +} + +.large-icons { + -gtk-icon-size: 32px; +} + +.aboutdialog .large-icons { + -gtk-icon-size: 128px; +} + +spinner:disabled, +arrow:disabled, +scrollbar:disabled, +check:disabled, +radio:disabled, +treeview.expander:disabled { + -gtk-icon-filter: opacity(0.5); +} + +iconview, +.view { + background-color: rgba(239, 241, 245, 0.04); + color: #eff1f5; +} + +iconview:disabled, +.view:disabled { + color: rgba(239, 241, 245, 0.5); +} + +iconview:selected, +.view:selected { + color: #eff1f5; +} + +textview text { + background-color: rgba(239, 241, 245, 0.04); +} + +textview border { + background-color: #313244; + color: rgba(239, 241, 245, 0.7); +} + +iconview:hover, iconview:selected { + border-radius: 6px; +} + +rubberband, .content-view rubberband, .content-view columnview.view > rubberband, +.content-view treeview.view > rubberband, +.content-view .rubberband, columnview.view > rubberband, +.content-view columnview.view > .rubberband, +treeview.view > rubberband, +.content-view treeview.view > .rubberband, gridview > rubberband, flowbox > rubberband { + border: 1px solid #89b4fa; + background-color: rgba(137, 180, 250, 0.3); +} + +flowbox > flowboxchild { + padding: 4px; + border-radius: 12px; +} + +.content-view .tile:selected { + background-color: transparent; +} + +gridview > child { + padding: 3px; +} + +gridview > child:selected { + outline-color: alpha(currentColor, 0.06); +} + +gridview > child box { + border-spacing: 8px; + margin: 12px; +} + +coverflow cover { + color: #eff1f5; + background-color: #313244; + border: 1px solid black; +} + +label.separator { + color: rgba(239, 241, 245, 0.7); +} + +label:disabled { + opacity: 1; + color: rgba(239, 241, 245, 0.5); +} + +headerbar label:disabled, tab label:disabled, button label:disabled { + color: inherit; + opacity: 1; +} + +label.osd { + border-radius: 12px; + background-color: rgba(24, 24, 37, 0.9); + color: #eff1f5; +} + + +.dim-label, +row.expander image.expander-row-arrow, +row label.subtitle { + color: rgba(239, 241, 245, 0.7); + opacity: 1; +} + +.accent { + color: #89b4fa; +} + +.success { + color: #40a02b; +} + +.warning { + color: #df8e1d; +} + +.error { + color: #d20f39; +} + +.large-title { + font-weight: 300; + font-size: 24pt; +} + +.title-1 { + font-weight: 800; + font-size: 20pt; +} + +.title-2 { + font-weight: 800; + font-size: 15pt; +} + +.title-3 { + font-weight: 700; + font-size: 15pt; +} + +.title-4 { + font-weight: 700; + font-size: 13pt; +} + +.heading { + font-weight: 700; + font-size: 11pt; +} + +.body { + font-weight: 400; + font-size: 11pt; +} + +.caption { + font-weight: 400; + font-size: 9pt; +} + +.caption-heading { + font-weight: 700; + font-size: 9pt; +} + +window.assistant .sidebar { + padding: 4px 0; +} + +window.assistant .sidebar label { + min-height: 34px; + padding: 0 12px; + color: rgba(239, 241, 245, 0.5); + font-weight: 500; +} + +window.assistant .sidebar label.highlight { + color: #eff1f5; +} + +.osd .scale-popup > arrow, +.osd .scale-popup > contents, .osd popover > arrow, +.osd popover > contents, popover.touch-selection > arrow, +popover.touch-selection > contents, popover.magnifier > arrow, +popover.magnifier > contents, .osd { + color: #eff1f5; + background-color: #313244; + background-clip: padding-box; + border-radius: 12px; + border: none; + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.15), 0 4px 3px 0 rgba(0, 0, 0, 0.18), 0 1px 6px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(239, 241, 245, 0.1); +} + +.osd { + padding: 6px; + margin: 6px; +} + +.osd.circular { + border-radius: 9999px; +} + +/********************* + * Spinner Animation * + *********************/ +@keyframes spin { + to { + transform: rotate(1turn); + } +} + +spinner { + background: none; + opacity: 0; + -gtk-icon-source: -gtk-icontheme("process-working-symbolic"); +} + +spinner:checked { + opacity: 1; + animation: spin 1s linear infinite; +} + +spinner:checked:disabled { + opacity: 0.5; +} + +/**************** + * Text Entries * + ****************/ + +entry headerbar popover.background entry, +headerbar popover.background entry entry, +entry { + min-height: 34px; + padding: 0 8px; + border-spacing: 6px; + border-radius: 12px; + caret-color: currentColor; + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(239, 241, 245, 0.08); + color: rgba(239, 241, 245, 0.7); + outline: 0 solid transparent; + outline-offset: 2px; +} + + +entry headerbar popover.background entry:focus-within, +headerbar popover.background entry entry:focus-within, +entry:focus-within { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + background-color: rgba(239, 241, 245, 0.08); + box-shadow: inset 0 0 0 2px transparent; + color: #eff1f5; + outline: 2px solid #89b4fa; + outline-offset: -2px; +} + + +entry headerbar popover.background entry:drop(active), +headerbar popover.background entry entry:drop(active), +entry headerbar popover.background entry:hover:not(:focus-within), +headerbar popover.background entry entry:hover:not(:focus-within), +entry:drop(active), +entry:hover:not(:focus-within) { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + background-color: alpha(currentColor, 0.08); + box-shadow: inset 0 0 0 2px alpha(currentColor, 0.08); + color: #eff1f5; + outline: 0 solid transparent; + outline-offset: 2px; +} + + +entry headerbar popover.background entry:disabled, +headerbar popover.background entry entry:disabled, +entry:disabled { + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(239, 241, 245, 0.08); + color: rgba(239, 241, 245, 0.5); + outline: none; +} + + +entry headerbar popover.background entry.flat:focus-within, +headerbar popover.background entry entry.flat:focus-within, +entry headerbar popover.background entry.flat:disabled, +headerbar popover.background entry entry.flat:disabled, +entry headerbar popover.background entry.flat:hover, +headerbar popover.background entry entry.flat:hover, +entry headerbar popover.background entry.flat, +headerbar popover.background entry entry.flat, +entry.flat:focus-within, +entry.flat:disabled, +entry.flat:hover, +entry.flat { + min-height: 0; + padding: 2px; + background-color: transparent; + box-shadow: none; + border-radius: 0; + outline: none; +} + + +entry headerbar popover.background entry image, +headerbar popover.background entry entry image, +entry image { + color: rgba(239, 241, 245, 0.7); +} + + +entry headerbar popover.background entry image:hover, +headerbar popover.background entry entry image:hover, +entry headerbar popover.background entry image:active, +headerbar popover.background entry entry image:active, +entry image:hover, +entry image:active { + color: #eff1f5; +} + + +entry headerbar popover.background entry image:disabled, +headerbar popover.background entry entry image:disabled, +entry image:disabled { + color: rgba(239, 241, 245, 0.5); +} + + +entry headerbar popover.background entry image.left, +headerbar popover.background entry entry image.left, +entry image.left { + margin: 0 6px 0 1px; +} + + +entry headerbar popover.background entry image.right, +headerbar popover.background entry entry image.right, +entry image.right { + margin: 0 1px 0 6px; +} + + +entry headerbar popover.background entry undershoot.left > undershoot.left, +headerbar popover.background entry entry undershoot.left > undershoot.left, +entry undershoot.left > undershoot.left { + border-radius: 0px 0 0 0px; + box-shadow: none; + background: linear-gradient(to right, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + + +entry headerbar popover.background entry undershoot.right > undershoot.right, +headerbar popover.background entry entry undershoot.right > undershoot.right, +entry undershoot.right > undershoot.right { + border-radius: 0 0px 0px 0; + box-shadow: none; + background: linear-gradient(to left, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + + +entry headerbar popover.background entry.error, +headerbar popover.background entry entry.error, +entry.error { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(210, 15, 57, 0.1); + color: rgba(210, 15, 57, 0.75); + outline: 0 solid transparent; + outline-offset: 2px; +} + + +entry headerbar popover.background entry.error:focus-within, +headerbar popover.background entry entry.error:focus-within, +entry.error:focus-within { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + background-color: rgba(210, 15, 57, 0.1); + box-shadow: inset 0 0 0 2px transparent; + color: #d20f39; + outline: 2px solid #d20f39; + outline-offset: -2px; +} + + +entry headerbar popover.background entry.error:drop(active), +headerbar popover.background entry entry.error:drop(active), +entry headerbar popover.background entry.error:hover:not(:focus-within), +headerbar popover.background entry entry.error:hover:not(:focus-within), +entry.error:drop(active), +entry.error:hover:not(:focus-within) { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + background-color: alpha(currentColor, 0.08); + box-shadow: inset 0 0 0 2px alpha(currentColor, 0.08); + color: #d20f39; + outline: 0 solid transparent; + outline-offset: 2px; +} + + +entry headerbar popover.background entry.error:disabled, +headerbar popover.background entry entry.error:disabled, +entry.error:disabled { + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(210, 15, 57, 0.1); + color: rgba(210, 15, 57, 0.35); + outline: none; +} + + +entry headerbar popover.background entry.error > text > selection, +headerbar popover.background entry entry.error > text > selection, +entry.error > text > selection { + background-color: rgba(210, 15, 57, 0.25); + color: #d20f39; +} + + +entry headerbar popover.background entry.error image, +headerbar popover.background entry entry.error image, +entry.error image { + color: rgba(210, 15, 57, 0.75); +} + + +entry headerbar popover.background entry.error image:hover, +headerbar popover.background entry entry.error image:hover, +entry headerbar popover.background entry.error image:active, +headerbar popover.background entry entry.error image:active, +entry.error image:hover, +entry.error image:active { + color: #d20f39; +} + + +entry headerbar popover.background entry.error image:disabled, +headerbar popover.background entry entry.error image:disabled, +entry.error image:disabled { + color: rgba(210, 15, 57, 0.35); +} + + +entry headerbar popover.background entry.warning, +headerbar popover.background entry entry.warning, +entry.warning { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(223, 142, 29, 0.1); + color: rgba(223, 142, 29, 0.75); + outline: 0 solid transparent; + outline-offset: 2px; +} + + +entry headerbar popover.background entry.warning:focus-within, +headerbar popover.background entry entry.warning:focus-within, +entry.warning:focus-within { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + background-color: rgba(223, 142, 29, 0.1); + box-shadow: inset 0 0 0 2px transparent; + color: #df8e1d; + outline: 2px solid #df8e1d; + outline-offset: -2px; +} + + +entry headerbar popover.background entry.warning:drop(active), +headerbar popover.background entry entry.warning:drop(active), +entry headerbar popover.background entry.warning:hover:not(:focus-within), +headerbar popover.background entry entry.warning:hover:not(:focus-within), +entry.warning:drop(active), +entry.warning:hover:not(:focus-within) { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + background-color: alpha(currentColor, 0.08); + box-shadow: inset 0 0 0 2px alpha(currentColor, 0.08); + color: #df8e1d; + outline: 0 solid transparent; + outline-offset: 2px; +} + + +entry headerbar popover.background entry.warning:disabled, +headerbar popover.background entry entry.warning:disabled, +entry.warning:disabled { + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(223, 142, 29, 0.1); + color: rgba(223, 142, 29, 0.35); + outline: none; +} + + +entry headerbar popover.background entry.warning > text > selection, +headerbar popover.background entry entry.warning > text > selection, +entry.warning > text > selection { + background-color: rgba(223, 142, 29, 0.25); + color: #df8e1d; +} + + +entry headerbar popover.background entry.warning image, +headerbar popover.background entry entry.warning image, +entry.warning image { + color: rgba(223, 142, 29, 0.75); +} + + +entry headerbar popover.background entry.warning image:hover, +headerbar popover.background entry entry.warning image:hover, +entry headerbar popover.background entry.warning image:active, +headerbar popover.background entry entry.warning image:active, +entry.warning image:hover, +entry.warning image:active { + color: #df8e1d; +} + + +entry headerbar popover.background entry.warning image:disabled, +headerbar popover.background entry entry.warning image:disabled, +entry.warning image:disabled { + color: rgba(223, 142, 29, 0.35); +} + + +entry headerbar popover.background entry.success, +headerbar popover.background entry entry.success, +entry.success { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(64, 160, 43, 0.1); + color: rgba(64, 160, 43, 0.75); + outline: 0 solid transparent; + outline-offset: 2px; +} + + +entry headerbar popover.background entry.success:focus-within, +headerbar popover.background entry entry.success:focus-within, +entry.success:focus-within { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + background-color: rgba(64, 160, 43, 0.1); + box-shadow: inset 0 0 0 2px transparent; + color: #40a02b; + outline: 2px solid #40a02b; + outline-offset: -2px; +} + + +entry headerbar popover.background entry.success:drop(active), +headerbar popover.background entry entry.success:drop(active), +entry headerbar popover.background entry.success:hover:not(:focus-within), +headerbar popover.background entry entry.success:hover:not(:focus-within), +entry.success:drop(active), +entry.success:hover:not(:focus-within) { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + background-color: alpha(currentColor, 0.08); + box-shadow: inset 0 0 0 2px alpha(currentColor, 0.08); + color: #40a02b; + outline: 0 solid transparent; + outline-offset: 2px; +} + + +entry headerbar popover.background entry.success:disabled, +headerbar popover.background entry entry.success:disabled, +entry.success:disabled { + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(64, 160, 43, 0.1); + color: rgba(64, 160, 43, 0.35); + outline: none; +} + + +entry headerbar popover.background entry.success > text > selection, +headerbar popover.background entry entry.success > text > selection, +entry.success > text > selection { + background-color: rgba(64, 160, 43, 0.25); + color: #40a02b; +} + + +entry headerbar popover.background entry.success image, +headerbar popover.background entry entry.success image, +entry.success image { + color: rgba(64, 160, 43, 0.75); +} + + +entry headerbar popover.background entry.success image:hover, +headerbar popover.background entry entry.success image:hover, +entry headerbar popover.background entry.success image:active, +headerbar popover.background entry entry.success image:active, +entry.success image:hover, +entry.success image:active { + color: #40a02b; +} + + +entry headerbar popover.background entry.success image:disabled, +headerbar popover.background entry entry.success image:disabled, +entry.success image:disabled { + color: rgba(64, 160, 43, 0.35); +} + + +entry > progress, +entry progress > trough > progress { + margin: 0 -4px; + border-bottom: 2px solid #89b4fa; + background-color: transparent; +} + + +entry button.image-button { + min-height: 24px; + min-width: 24px; + padding: 0; +} + +treeview entry.flat, treeview entry { + background-color: #313244; +} + +treeview entry.flat, treeview entry.flat:focus-within, treeview entry, treeview entry:focus-within { + border-image: none; + box-shadow: none; +} + +.entry-tag { + margin: 2px; + border-radius: 9999px; + box-shadow: none; + background-color: rgba(239, 241, 245, 0.12); + color: #eff1f5; +} + +.entry-tag:hover { + background-image: image(alpha(currentColor, 0.08)); +} + +:dir(ltr) .entry-tag { + margin-left: 4px; + margin-right: 0; + padding-left: 12px; + padding-right: 8px; +} + +:dir(rtl) .entry-tag { + margin-left: 0; + margin-right: 4px; + padding-left: 8px; + padding-right: 12px; +} + +.entry-tag.button { + box-shadow: none; + background-color: transparent; +} + +.entry-tag.button:not(:hover):not(:active) { + color: rgba(239, 241, 245, 0.7); +} + +editablelabel > stack > text { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(239, 241, 245, 0.08); + color: rgba(239, 241, 245, 0.7); + outline: 0 solid transparent; + outline-offset: 2px; +} + +/*********** + * Buttons * + ***********/ +@keyframes needs-attention { + from { + background-image: radial-gradient(farthest-side, #89b4fa 0%, rgba(137, 180, 250, 0) 0%); + } + to { + background-image: radial-gradient(farthest-side, #89b4fa 95%, rgba(137, 180, 250, 0)); + } +} + +infobar.warning > revealer > box button, infobar.warning:backdrop > revealer > box button, popover.touch-selection button, popover.magnifier button, headerbar.selection-mode button:not(.suggested-action):not(.destructive-action) { + color: rgba(239, 241, 245, 0.7); +} + +infobar.warning > revealer > box button:focus, popover.touch-selection button:focus, popover.magnifier button:focus, headerbar.selection-mode button:focus:not(.suggested-action):not(.destructive-action), infobar.warning > revealer > box button:hover, popover.touch-selection button:hover, popover.magnifier button:hover, headerbar.selection-mode button:hover:not(.suggested-action):not(.destructive-action), infobar.warning > revealer > box button:active, popover.touch-selection button:active, popover.magnifier button:active, headerbar.selection-mode button:active:not(.suggested-action):not(.destructive-action), infobar.warning > revealer > box button:checked, popover.touch-selection button:checked, popover.magnifier button:checked, headerbar.selection-mode button:checked:not(.suggested-action):not(.destructive-action) { + color: #eff1f5; +} + +infobar.warning > revealer > box button:disabled, popover.touch-selection button:disabled, popover.magnifier button:disabled, headerbar.selection-mode button:disabled:not(.suggested-action):not(.destructive-action) { + color: rgba(239, 241, 245, 0.32); +} + +infobar.warning > revealer > box button:checked:disabled, popover.touch-selection button:checked:disabled, popover.magnifier button:checked:disabled, headerbar.selection-mode button:checked:disabled:not(.suggested-action):not(.destructive-action) { + color: rgba(239, 241, 245, 0.5); +} + +placessidebar list.navigation-sidebar > row button.sidebar-button { + background-color: #313244; + color: #eff1f5; +} + +placessidebar list.navigation-sidebar > row button.sidebar-button:checked { + background-color: rgba(30, 30, 46, 0.87); + color: #e6e9ef; +} + +tabbar tab:not(:selected) button.image-button.tab-close-button, +dnd tab:not(:selected) button.image-button.tab-close-button, notebook > header > tabs > tab:not(:checked):not(:selected) button.small-button, notebook > header menubutton > button.flat { + color: rgba(30, 30, 46, 0.6); +} + +tabbar tab:not(:selected) button.image-button.tab-close-button:hover, +dnd tab:not(:selected) button.image-button.tab-close-button:hover, notebook > header > tabs > tab:not(:checked):not(:selected) button.small-button:hover, notebook > header menubutton > button.flat:hover, tabbar tab:not(:selected) button.image-button.tab-close-button:active, +dnd tab:not(:selected) button.image-button.tab-close-button:active, notebook > header > tabs > tab:not(:checked):not(:selected) button.small-button:active, notebook > header menubutton > button.flat:active, tabbar tab:not(:selected) button.image-button.tab-close-button:focus:not(:hover):not(:active) button.keyboard-activating.image-button.tab-close-button, +dnd tab:not(:selected) button.image-button.tab-close-button:focus:not(:hover):not(:active) button.keyboard-activating.image-button.tab-close-button, tabbar notebook > header > tabs > tab:not(:checked):not(:selected) button.small-button:focus:not(:hover):not(:active) button.keyboard-activating.image-button.tab-close-button, +dnd notebook > header > tabs > tab:not(:checked):not(:selected) button.small-button:focus:not(:hover):not(:active) button.keyboard-activating.image-button.tab-close-button, tabbar tab:not(:selected) button.image-button.tab-close-button:focus:not(:hover):not(:active) notebook > header > tabs > tab:not(:checked):not(:selected) button.keyboard-activating.small-button, +dnd tab:not(:selected) button.image-button.tab-close-button:focus:not(:hover):not(:active) notebook > header > tabs > tab:not(:checked):not(:selected) button.keyboard-activating.small-button, tabbar notebook > header > tabs > tab:not(:checked):not(:selected) button.image-button.tab-close-button:focus:not(:hover):not(:active) button.keyboard-activating.small-button, +dnd notebook > header > tabs > tab:not(:checked):not(:selected) button.image-button.tab-close-button:focus:not(:hover):not(:active) button.keyboard-activating.small-button, notebook > header > tabs > tab:not(:checked):not(:selected) button.small-button:focus:not(:hover):not(:active) button.keyboard-activating.small-button, notebook > header menubutton > button.flat:focus:not(:hover):not(:active) tabbar tab:not(:selected) button.keyboard-activating.image-button.tab-close-button, tabbar tab:not(:selected) notebook > header menubutton > button.flat:focus:not(:hover):not(:active) button.keyboard-activating.image-button.tab-close-button, +notebook > header menubutton > button.flat:focus:not(:hover):not(:active) dnd tab:not(:selected) button.keyboard-activating.image-button.tab-close-button, +dnd tab:not(:selected) notebook > header menubutton > button.flat:focus:not(:hover):not(:active) button.keyboard-activating.image-button.tab-close-button, notebook > header > tabs > tab:not(:checked):not(:selected) menubutton > button.flat:focus:not(:hover):not(:active) button.keyboard-activating.small-button, tabbar tab:not(:selected) button.image-button.tab-close-button:focus:not(:hover):not(:active) notebook > header menubutton > button.keyboard-activating.flat, +dnd tab:not(:selected) button.image-button.tab-close-button:focus:not(:hover):not(:active) notebook > header menubutton > button.keyboard-activating.flat, notebook > header > tabs > tab:not(:checked):not(:selected) button.small-button:focus:not(:hover):not(:active) notebook > header menubutton > button.keyboard-activating.flat, notebook > header tabbar tab:not(:selected) button.image-button.tab-close-button:focus:not(:hover):not(:active) menubutton > button.keyboard-activating.flat, tabbar tab:not(:selected) notebook > header button.image-button.tab-close-button:focus:not(:hover):not(:active) menubutton > button.keyboard-activating.flat, +notebook > header dnd tab:not(:selected) button.image-button.tab-close-button:focus:not(:hover):not(:active) menubutton > button.keyboard-activating.flat, +dnd tab:not(:selected) notebook > header button.image-button.tab-close-button:focus:not(:hover):not(:active) menubutton > button.keyboard-activating.flat, notebook > header > tabs > tab:not(:checked):not(:selected) button.small-button:focus:not(:hover):not(:active) menubutton > button.keyboard-activating.flat, notebook > header menubutton > button.flat:focus:not(:hover):not(:active) menubutton > button.keyboard-activating.flat { + color: rgba(30, 30, 46, 0.87); +} + +tabbar tab:not(:selected) button.image-button.tab-close-button:checked, +dnd tab:not(:selected) button.image-button.tab-close-button:checked, notebook > header > tabs > tab:not(:checked):not(:selected) button.small-button:checked, notebook > header menubutton > button.flat:checked { + background-color: rgba(30, 30, 46, 0.87); + color: #e6e9ef; +} + +tabbar tab:not(:selected) button.image-button.tab-close-button:disabled, +dnd tab:not(:selected) button.image-button.tab-close-button:disabled, notebook > header > tabs > tab:not(:checked):not(:selected) button.small-button:disabled, notebook > header menubutton > button.flat:disabled { + color: rgba(30, 30, 46, 0.3); +} + +headerbar popover.background button:not(.suggested-action):not(.destructive-action):not(.flat), button { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1); + background-color: rgba(239, 241, 245, 0.08); + background-image: radial-gradient(circle, transparent 10%, transparent 0%); + background-repeat: no-repeat; + background-position: center; + background-size: 1000% 1000%; + outline: 0 solid transparent; + outline-offset: 2px; + color: #eff1f5; +} + +headerbar popover.background button:focus:not(.suggested-action):not(.destructive-action):not(.flat), button:focus { + outline: 2px solid rgba(137, 180, 250, 0.35); + outline-offset: 0; +} + +headerbar popover.background button:hover:not(.suggested-action):not(.destructive-action):not(.flat), button:hover { + background-color: alpha(currentColor, 0.08); + color: #eff1f5; + outline: 0 solid transparent; + -gtk-icon-filter: brightness(1.2); +} + +headerbar popover.background button.keyboard-activating:not(.suggested-action):not(.destructive-action):not(.flat), button.keyboard-activating, headerbar popover.background button:active:not(.suggested-action):not(.destructive-action):not(.flat), button:active { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms, border 0ms; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + background-image: radial-gradient(circle, alpha(currentColor, 0.08) 10%, transparent 0%); + background-size: 0% 0%; + background-color: alpha(currentColor, 0.08); + color: #eff1f5; + outline: 0 solid transparent; +} + +headerbar popover.background button:disabled:not(.suggested-action):not(.destructive-action):not(.flat), button:disabled { + background-color: rgba(239, 241, 245, 0.04); + color: rgba(239, 241, 245, 0.5); + outline-color: transparent; +} + +headerbar popover.background button:checked:not(.suggested-action):not(.destructive-action):not(.flat), button:checked { + background-color: #89b4fa; + color: rgba(30, 30, 46, 0.87); +} + +headerbar popover.background button:checked:hover:not(.suggested-action):not(.destructive-action):not(.flat), button:checked:hover { + outline-color: transparent; + background-color: #a1c4fb; + color: rgba(30, 30, 46, 0.87); +} + +headerbar popover.background button:checked:disabled:not(.suggested-action):not(.destructive-action):not(.flat), button:checked:disabled { + outline-color: transparent; + background-color: rgba(137, 180, 250, 0.35); + color: rgba(30, 30, 46, 0.38); +} + +placessidebar list.navigation-sidebar > row button.sidebar-button, calendar > header > button, scrollbar button, notebook > header > tabs > arrow, popover modelbutton, spinbutton > button, splitbutton.flat > button, +splitbutton.flat > menubutton > button { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1); + background-image: radial-gradient(circle, transparent 10%, transparent 0%); + background-repeat: no-repeat; + background-position: center; + background-size: 1000% 1000%; + background-color: transparent; + outline: 0 solid transparent; + outline-offset: 2px; + color: rgba(239, 241, 245, 0.7); +} + +placessidebar list.navigation-sidebar > row button.sidebar-button:focus:not(:hover):not(:active), calendar > header > button:focus:not(:hover):not(:active), scrollbar button:focus:not(:hover):not(:active), notebook > header > tabs > arrow:focus:not(:hover):not(:active), popover modelbutton:focus:not(:hover):not(:active), spinbutton > button:focus:not(:hover):not(:active), splitbutton.flat > button:focus:not(:hover):not(:active), +splitbutton.flat > menubutton > button:focus:not(:hover):not(:active) { + color: #eff1f5; + outline: 2px solid transparent; + /* outline: 2px solid $fill; */ + outline-offset: -2px; +} + +placessidebar list.navigation-sidebar > row button.sidebar-button:hover, calendar > header > button:hover, scrollbar button:hover, notebook > header > tabs > arrow:hover, popover modelbutton:hover, spinbutton > button:hover, splitbutton.flat > button:hover, +splitbutton.flat > menubutton > button:hover { + background-color: alpha(currentColor, 0.08); + color: #eff1f5; +} + +placessidebar list.navigation-sidebar > row button.sidebar-button:active, calendar > header > button:active, scrollbar button:active, notebook > header > tabs > arrow:active, popover modelbutton:active, spinbutton > button:active, splitbutton.flat > button:active, +splitbutton.flat > menubutton > button:active { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + background-image: radial-gradient(circle, alpha(currentColor, 0.08) 10%, transparent 0%); + background-size: 0% 0%; + background-color: alpha(currentColor, 0.08); + color: #eff1f5; +} + +placessidebar list.navigation-sidebar > row button.sidebar-button:disabled, calendar > header > button:disabled, scrollbar button:disabled, notebook > header > tabs > arrow:disabled, popover modelbutton:disabled, spinbutton > button:disabled, splitbutton.flat > button:disabled, +splitbutton.flat > menubutton > button:disabled { + color: rgba(239, 241, 245, 0.32); + background-color: transparent; +} + +#NautilusPathButton, filechooser #pathbarbox > stack > box > button, window.messagedialog .response-area button, window.dialog.message .dialog-action-area > button, .app-notification button, .toolbar button, dropdown > .linked:not(.vertical) > button:not(:only-child), +combobox > .linked:not(.vertical) > button:not(:only-child), splitbutton.suggested-action > button, +splitbutton.suggested-action > menubutton > button, splitbutton.destructive-action > button, +splitbutton.destructive-action > menubutton > button, splitbutton.opaque > button, +splitbutton.opaque > menubutton > button, menubutton.suggested-action > button, menubutton.destructive-action > button, menubutton.opaque > button, menubutton.flat > button, button.flat { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1); + background-image: radial-gradient(circle, transparent 10%, transparent 0%); + background-repeat: no-repeat; + background-position: center; + background-size: 1000% 1000%; + background-color: transparent; + outline: 0 solid transparent; + outline-offset: 2px; + color: rgba(239, 241, 245, 0.7); +} + +#NautilusPathButton:focus:not(:hover):not(:active), filechooser #pathbarbox > stack > box > button:focus:not(:hover):not(:active), window.messagedialog .response-area button:focus:not(:hover):not(:active), window.dialog.message .dialog-action-area > button:focus:not(:hover):not(:active), .app-notification button:focus:not(:hover):not(:active), .toolbar button:focus:not(:hover):not(:active), dropdown > .linked:not(.vertical) > button:focus:not(:hover):not(:active):not(:only-child), +combobox > .linked:not(.vertical) > button:focus:not(:hover):not(:active):not(:only-child), splitbutton.suggested-action > button:focus:not(:hover):not(:active), +splitbutton.suggested-action > menubutton > button:focus:not(:hover):not(:active), splitbutton.destructive-action > button:focus:not(:hover):not(:active), +splitbutton.destructive-action > menubutton > button:focus:not(:hover):not(:active), splitbutton.opaque > button:focus:not(:hover):not(:active), +splitbutton.opaque > menubutton > button:focus:not(:hover):not(:active), menubutton.suggested-action > button:focus:not(:hover):not(:active), menubutton.destructive-action > button:focus:not(:hover):not(:active), menubutton.opaque > button:focus:not(:hover):not(:active), menubutton.flat > button:focus:not(:hover):not(:active), button.flat:focus:not(:hover):not(:active) { + color: #eff1f5; + outline: 2px solid transparent; + /* outline: 2px solid $fill; */ + outline-offset: -2px; +} + +#NautilusPathButton:hover, filechooser #pathbarbox > stack > box > button:hover, window.messagedialog .response-area button:hover, window.dialog.message .dialog-action-area > button:hover, .app-notification button:hover, .toolbar button:hover, dropdown > .linked:not(.vertical) > button:hover:not(:only-child), +combobox > .linked:not(.vertical) > button:hover:not(:only-child), splitbutton.suggested-action > button:hover, +splitbutton.suggested-action > menubutton > button:hover, splitbutton.destructive-action > button:hover, +splitbutton.destructive-action > menubutton > button:hover, splitbutton.opaque > button:hover, +splitbutton.opaque > menubutton > button:hover, menubutton.suggested-action > button:hover, menubutton.destructive-action > button:hover, menubutton.opaque > button:hover, menubutton.flat > button:hover, button.flat:hover { + background-color: alpha(currentColor, 0.08); + color: #eff1f5; +} + +#NautilusPathButton:active, filechooser #pathbarbox > stack > box > button:active, window.messagedialog .response-area button:active, window.dialog.message .dialog-action-area > button:active, .app-notification button:active, .toolbar button:active, dropdown > .linked:not(.vertical) > button:active:not(:only-child), +combobox > .linked:not(.vertical) > button:active:not(:only-child), splitbutton.suggested-action > button:active, +splitbutton.suggested-action > menubutton > button:active, splitbutton.destructive-action > button:active, +splitbutton.destructive-action > menubutton > button:active, splitbutton.opaque > button:active, +splitbutton.opaque > menubutton > button:active, menubutton.suggested-action > button:active, menubutton.destructive-action > button:active, menubutton.opaque > button:active, menubutton.flat > button:active, button.flat:active { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + background-image: radial-gradient(circle, alpha(currentColor, 0.08) 10%, transparent 0%); + background-size: 0% 0%; + background-color: alpha(currentColor, 0.08); + color: #eff1f5; +} + +#NautilusPathButton:disabled, filechooser #pathbarbox > stack > box > button:disabled, window.messagedialog .response-area button:disabled, window.dialog.message .dialog-action-area > button:disabled, .app-notification button:disabled, .toolbar button:disabled, dropdown > .linked:not(.vertical) > button:disabled:not(:only-child), +combobox > .linked:not(.vertical) > button:disabled:not(:only-child), splitbutton.suggested-action > button:disabled, +splitbutton.suggested-action > menubutton > button:disabled, splitbutton.destructive-action > button:disabled, +splitbutton.destructive-action > menubutton > button:disabled, splitbutton.opaque > button:disabled, +splitbutton.opaque > menubutton > button:disabled, menubutton.suggested-action > button:disabled, menubutton.destructive-action > button:disabled, menubutton.opaque > button:disabled, menubutton.flat > button:disabled, button.flat:disabled { + color: rgba(239, 241, 245, 0.32); + background-color: transparent; +} + +#NautilusPathButton:checked, filechooser #pathbarbox > stack > box > button:checked, window.messagedialog .response-area button:checked, window.dialog.message .dialog-action-area > button:checked, .app-notification button:checked, .toolbar button:checked, dropdown > .linked:not(.vertical) > button:checked:not(:only-child), +combobox > .linked:not(.vertical) > button:checked:not(:only-child), splitbutton.suggested-action > button:checked, +splitbutton.suggested-action > menubutton > button:checked, splitbutton.destructive-action > button:checked, +splitbutton.destructive-action > menubutton > button:checked, splitbutton.opaque > button:checked, +splitbutton.opaque > menubutton > button:checked, menubutton.suggested-action > button:checked, menubutton.destructive-action > button:checked, menubutton.opaque > button:checked, menubutton.flat > button:checked, button.flat:checked { + background-color: alpha(currentColor, 0.1); + color: #eff1f5; +} + +#NautilusPathButton:checked:disabled, filechooser #pathbarbox > stack > box > button:checked:disabled, window.messagedialog .response-area button:checked:disabled, window.dialog.message .dialog-action-area > button:checked:disabled, .app-notification button:checked:disabled, .toolbar button:checked:disabled, dropdown > .linked:not(.vertical) > button:checked:disabled:not(:only-child), +combobox > .linked:not(.vertical) > button:checked:disabled:not(:only-child), splitbutton.suggested-action > button:checked:disabled, +splitbutton.suggested-action > menubutton > button:checked:disabled, splitbutton.destructive-action > button:checked:disabled, +splitbutton.destructive-action > menubutton > button:checked:disabled, splitbutton.opaque > button:checked:disabled, +splitbutton.opaque > menubutton > button:checked:disabled, menubutton.suggested-action > button:checked:disabled, menubutton.destructive-action > button:checked:disabled, menubutton.opaque > button:checked:disabled, menubutton.flat > button:checked:disabled, button.flat:checked:disabled { + background-color: alpha(currentColor, 0.1); + color: rgba(239, 241, 245, 0.5); +} + +button.opaque { + box-shadow: none; +} + +.osd button.opaque:focus:focus-visible { + outline-color: rgba(239, 241, 245, 0.15); +} + +button.opaque:hover { + background-image: image(alpha(currentColor, 0.1)); +} + +button.keyboard-activating.opaque, button.opaque:active { + background-image: image(rgba(0, 0, 0, 0.2)); +} + +button.opaque:checked { + background-image: image(rgba(0, 0, 0, 0.15)); +} + +button.opaque:checked:hover { + background-image: image(rgba(0, 0, 0, 0.05)); +} + +button.opaque:checked.keyboard-activating, button.opaque:checked:active { + background-image: image(rgba(0, 0, 0, 0.3)); +} + +.nautilus-window .floating-bar button, placessidebar list.navigation-sidebar > row button.sidebar-button, notebook > header > tabs > tab button.flat, popover.menu box.circular-buttons button.circular.image-button.model, spinbutton > button { + min-height: 24px; + min-width: 24px; + padding: 0; + border-radius: 9999px; +} + +button { + min-height: 24px; + min-width: 16px; + padding: 5px 9px; + border-radius: 9px; + font-weight: 500; +} + +button:drop(active) { + background-color: alpha(currentColor, 0.08); + color: #eff1f5; + outline: 0 solid transparent; +} + +button separator { + margin: 4px 1px; +} + +button.opaque { + background-color: #484856; + color: #eff1f5; +} + +button.text-button { + min-width: 32px; + padding-left: 16px; + padding-right: 16px; +} + +button.image-button { + min-width: 24px; + padding: 5px; +} + +button.text-button.image-button, button.image-text-button { + min-width: 24px; + padding: 5px; + border-radius: 12px; +} + +button.text-button.image-button > box, +button.text-button.image-button > box > box, button.image-text-button > box, +button.image-text-button > box > box { + border-spacing: 4px; +} + +button.text-button.image-button > box > label, +button.text-button.image-button > box > box > label, button.image-text-button > box > label, +button.image-text-button > box > box > label { + padding-left: 2px; + padding-right: 2px; +} + +button.text-button.image-button label:first-child, button.image-text-button label:first-child { + margin-left: 11px; +} + +button.text-button.image-button label:last-child, button.image-text-button label:last-child { + margin-right: 11px; +} + +button.text-button.image-button.flat label:first-child, button.image-text-button.flat label:first-child { + margin-left: 7px; +} + +button.text-button.image-button.flat label:last-child, button.image-text-button.flat label:last-child { + margin-right: 7px; +} + +button.text-button.image-button image:not(:only-child), button.image-text-button image:not(:only-child) { + margin: 0 4px; +} + +button.arrow-button { + padding-left: 9px; + padding-right: 9px; +} + +button.arrow-button > box { + border-spacing: 4px; +} + +button.arrow-button.text-button { + padding-left: 16px; + padding-right: 16px; +} + +button.arrow-button.text-button > box { + border-spacing: 6px; +} + +menubutton.pill > button, button.pill { + padding: 9px 30px; + border-radius: 9999px; +} + +button.card { + background-color: #313244; + background-clip: padding-box; + font-weight: inherit; + border: 1px solid rgba(239, 241, 245, 0.12); + background-clip: border-box; +} + +button.card:hover { + background-image: none; + background-color: alpha(currentColor, 0.08); + color: #eff1f5; + outline: 0 solid transparent; +} + +button.card.keyboard-activating, button.card:active { + background-image: none; + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms, border 0ms; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + background-image: radial-gradient(circle, alpha(currentColor, 0.08) 10%, transparent 0%); + background-size: 0% 0%; + background-color: alpha(currentColor, 0.08); + color: #eff1f5; + outline: 0 solid transparent; +} + +button.card:checked { + background-image: none; + background-color: #89b4fa; + color: rgba(30, 30, 46, 0.87); + border-color: #89b4fa; +} + +button.card:checked:hover { + background-image: none; + outline-color: transparent; + background-color: #a1c4fb; + color: rgba(30, 30, 46, 0.87); +} + +button.card:checked:disabled { + outline-color: transparent; + background-color: rgba(137, 180, 250, 0.35); + color: rgba(30, 30, 46, 0.38); +} + +button.card:checked.keyboard-activating, button.card:checked:active { + background-image: none; +} + +button.card:checked.has-open-popup { + background-image: none; +} + +button.card:drop(active) { + color: #fab387; + box-shadow: inset 0 0 0 1px #fab387; +} + +.linked:not(.vertical) > button:focus, .linked.vertical > button:focus { + box-shadow: none; + outline: none; +} + +.linked:not(.vertical) > button.flat:not(:only-child), .linked.vertical > button.flat:not(:only-child) { + background-color: alpha(currentColor, 0.05); +} + +.linked:not(.vertical) > button.flat:focus, .linked.vertical > button.flat:focus { + box-shadow: none; + outline: none; +} + +.linked:not(.vertical) > menubutton > button { + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} + +button.osd { + min-width: 24px; + min-width: 24px; + padding: 5px; + box-shadow: none; + background-color: rgba(0, 0, 0, 0.35); + color: #eff1f5; +} + +button.osd > image { + padding: 0; +} + +button.osd.remove-button { + padding: 0; +} + +button.osd:focus { + outline-color: transparent; +} + +button.osd:hover { + background-color: rgba(0, 0, 0, 0.45); + color: #eff1f5; +} + +button.osd:active { + background-color: rgba(0, 0, 0, 0.65); + color: #eff1f5; +} + +button.osd:disabled { + background-color: rgba(0, 0, 0, 0.15); + color: rgba(239, 241, 245, 0.35); +} + +button.suggested-action { + background-color: #1e66f5; + color: #eff1f5; + box-shadow: none; +} + +button.suggested-action:hover { + background-color: #3374f5; +} + +button.suggested-action:disabled { + background-color: rgba(239, 241, 245, 0.04); + color: rgba(239, 241, 245, 0.5); + outline-color: transparent; +} + +button.suggested-action:checked { + background-color: #5d90f5; +} + +button.suggested-action:focus { + box-shadow: 0 0 0 2px rgba(30, 102, 245, 0.35); +} + +button.suggested-action.flat { + background-color: transparent; + color: #1e66f5; +} + +button.suggested-action.flat:disabled { + color: rgba(239, 241, 245, 0.32); + background-color: transparent; +} + +button.suggested-action.flat:checked { + background-color: rgba(30, 102, 245, 0.3); +} + +button.destructive-action { + background-color: #d20f39; + color: #eff1f5; + box-shadow: none; +} + +button.destructive-action:hover { + background-color: #d5264c; +} + +button.destructive-action:disabled { + background-color: rgba(239, 241, 245, 0.04); + color: rgba(239, 241, 245, 0.5); + outline-color: transparent; +} + +button.destructive-action:checked { + background-color: #db5371; +} + +button.destructive-action:focus { + box-shadow: 0 0 0 2px rgba(210, 15, 57, 0.35); +} + +button.destructive-action.flat { + background-color: transparent; + color: #d20f39; +} + +button.destructive-action.flat:disabled { + color: rgba(239, 241, 245, 0.32); + background-color: transparent; +} + +button.destructive-action.flat:checked { + background-color: rgba(210, 15, 57, 0.3); +} + +stackswitcher > button > label { + margin: 0 -6px; + padding: 0 6px; +} + +stackswitcher > button > image { + margin: -3px -6px; + padding: 3px 6px; +} + +stackswitcher > button.needs-attention:checked > label, +stackswitcher > button.needs-attention:checked > image { + animation: none; + background-image: none; +} + +button.font > box, button.file > box { + border-spacing: 6px; +} + +button.font > box > box > label, button.file > box > box > label { + font-weight: bold; +} + +windowcontrols > button:not(.suggested-action):not(.destructive-action), filechooser #pathbarbox > stack > box > button, menubutton.circular > button, button.close, button.circular { + border-radius: 9999px; +} + +windowcontrols > button:not(.suggested-action):not(.destructive-action) label, filechooser #pathbarbox > stack > box > button label, menubutton.circular > button label, button.close label, button.circular label { + padding: 0; +} + +menubutton.osd { + background: none; + color: inherit; +} + +menubutton.suggested-action { + background-color: #1e66f5; + color: #eff1f5; +} + +menubutton.destructive-action { + background-color: #d20f39; + color: #eff1f5; +} + +menubutton.opaque { + background-color: #484856; + color: #eff1f5; +} + +menubutton.suggested-action, menubutton.destructive-action, menubutton.opaque { + border-radius: 12px; +} + +menubutton.suggested-action.circular, menubutton.suggested-action.pill, menubutton.destructive-action.circular, menubutton.destructive-action.pill, menubutton.opaque.circular, menubutton.opaque.pill { + border-radius: 9999px; +} + +menubutton.suggested-action > button, menubutton.suggested-action > button:checked, menubutton.destructive-action > button, menubutton.destructive-action > button:checked, menubutton.opaque > button, menubutton.opaque > button:checked { + background-color: transparent; + color: inherit; +} + +menubutton.image-button > button { + min-width: 24px; + padding-left: 6px; + padding-right: 6px; +} + +menubutton arrow { + min-height: 16px; + min-width: 16px; +} + +menubutton arrow.none { + -gtk-icon-source: -gtk-icontheme("open-menu-symbolic"); +} + +menubutton arrow.down { + -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); +} + +menubutton arrow.up { + -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); +} + +menubutton arrow.left { + -gtk-icon-source: -gtk-icontheme("pan-start-symbolic"); +} + +menubutton arrow.right { + -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); +} + +splitbutton { + border-radius: 12px; +} + +splitbutton, splitbutton > separator { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1); + transition-property: background-color; +} + +splitbutton > separator { + min-width: 0; + margin-top: 6px; + margin-bottom: 6px; + background-color: transparent; + background: none; +} + +splitbutton > menubutton > button { + padding: 5px 9px; +} + +splitbutton.image-button > button { + min-width: 24px; + padding-left: 6px; + padding-right: 6px; +} + +splitbutton.text-button.image-button > button, splitbutton.image-text-button > button { + padding-left: 9px; + padding-right: 9px; +} + +splitbutton.text-button.image-button > button > box, splitbutton.image-text-button > button > box { + border-spacing: 6px; +} + +splitbutton > button:dir(ltr), +splitbutton > menubutton > button:dir(rtl) { + border-top-right-radius: 0; + border-bottom-right-radius: 0; + margin-right: 0; +} + +splitbutton > button:dir(rtl), +splitbutton > menubutton > button:dir(ltr) { + border-top-left-radius: 0; + border-bottom-left-radius: 0; + margin-left: 0; +} + +splitbutton.flat > separator { + background: rgba(239, 241, 245, 0.12); +} + +splitbutton.flat:hover, splitbutton.flat:active, splitbutton.flat:checked { + background: alpha(currentColor, 0.07); +} + +splitbutton.flat:hover > separator, splitbutton.flat:active > separator, splitbutton.flat:checked > separator { + background: none; +} + +splitbutton.flat:focus-within:focus-visible > separator { + background: none; +} + +splitbutton.flat > button, +splitbutton.flat > menubutton > button { + border-radius: 12px; +} + +splitbutton.suggested-action { + background-color: #1e66f5; + color: #eff1f5; +} + +splitbutton.destructive-action { + background-color: #d20f39; + color: #eff1f5; +} + +splitbutton.opaque { + background-color: #484856; + color: #eff1f5; +} + +splitbutton.suggested-action > button, splitbutton.suggested-action > button:checked, +splitbutton.suggested-action > menubutton > button, +splitbutton.suggested-action > menubutton > button:checked, splitbutton.destructive-action > button, splitbutton.destructive-action > button:checked, +splitbutton.destructive-action > menubutton > button, +splitbutton.destructive-action > menubutton > button:checked, splitbutton.opaque > button, splitbutton.opaque > button:checked, +splitbutton.opaque > menubutton > button, +splitbutton.opaque > menubutton > button:checked { + color: inherit; + background-color: transparent; +} + +splitbutton.suggested-action > menubutton > button:dir(ltr), splitbutton.destructive-action > menubutton > button:dir(ltr), splitbutton.opaque > menubutton > button:dir(ltr) { + box-shadow: inset 1px 0 rgba(239, 241, 245, 0.12); +} + +splitbutton.suggested-action > menubutton > button:dir(rtl), splitbutton.destructive-action > menubutton > button:dir(rtl), splitbutton.opaque > menubutton > button:dir(rtl) { + box-shadow: inset -1px 0 rgba(239, 241, 245, 0.12); +} + +splitbutton > menubutton > button > arrow.none { + -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); +} + +buttoncontent { + border-spacing: 6px; +} + +buttoncontent > label { + font-weight: bold; +} + +buttoncontent > label:dir(ltr) { + padding-right: 2px; +} + +buttoncontent > label:dir(rtl) { + padding-left: 2px; +} + +.arrow-button > box > buttoncontent > label:dir(ltr), splitbutton > button > buttoncontent > label:dir(ltr) { + padding-right: 0; +} + +.arrow-button > box > buttoncontent > label:dir(rtl), splitbutton > button > buttoncontent > label:dir(rtl) { + padding-left: 0; +} + +button.color { + min-height: 24px; + min-width: 24px; + padding: 6px; +} + +stacksidebar row.needs-attention > label, stackswitcher > button.needs-attention > label, +stackswitcher > button.needs-attention > image { + animation: needs-attention 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + background-repeat: no-repeat; + background-position: right 3px; + background-size: 6px 6px; +} + +stacksidebar row.needs-attention > label:dir(rtl), stackswitcher > button.needs-attention > label:dir(rtl), +stackswitcher > button.needs-attention > image:dir(rtl) { + background-position: left 3px; +} + +.linked:not(.vertical) > entry, .linked:not(.vertical) > button, .linked:not(.vertical) > button.image-button { + border-radius: 0; +} + +.linked:not(.vertical) > entry:first-child, .linked:not(.vertical) > button:first-child { + border-top-left-radius: 12px; + border-bottom-left-radius: 12px; +} + +.linked:not(.vertical) > entry:last-child, .linked:not(.vertical) > button:last-child { + border-top-right-radius: 12px; + border-bottom-right-radius: 12px; +} + +.linked:not(.vertical) > entry:only-child, .linked:not(.vertical) > button:only-child { + border-radius: 12px; +} + +.linked.vertical > entry, .linked.vertical > button, .linked.vertical > button.image-button { + border-radius: 0; +} + +.linked.vertical > entry:first-child, .linked.vertical > button:first-child { + border-top-left-radius: 12px; + border-top-right-radius: 12px; +} + +.linked.vertical > entry:last-child, .linked.vertical > button:last-child { + border-bottom-left-radius: 12px; + border-bottom-right-radius: 12px; +} + +.linked.vertical > entry:only-child, .linked.vertical > button:only-child { + border-radius: 12px; +} + +.linked:not(.vertical) > button:dir(ltr):not(:first-child), .linked:not(.vertical) > button:dir(rtl):not(:last-child) { + border-top-left-radius: 3px; + border-bottom-left-radius: 3px; + margin-left: 1px; +} + +.linked:not(.vertical) > button:dir(ltr):not(:last-child), .linked:not(.vertical) > button:dir(rtl):not(:first-child) { + border-top-right-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked.vertical button:not(:first-child) { + border-top-left-radius: 3px; + border-top-right-radius: 3px; + margin-top: 1px; +} + +.linked.vertical button:not(:last-child) { + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked:not(.vertical) > menubutton:dir(ltr):not(:first-child) > button, .linked:not(.vertical) > menubutton:dir(rtl):not(:last-child) > button { + border-top-left-radius: 3px; + border-bottom-left-radius: 3px; + margin-left: 1px; +} + +.linked:not(.vertical) > menubutton:dir(ltr):not(:last-child) > button, .linked:not(.vertical) > menubutton:dir(rtl):not(:first-child) > button { + border-top-right-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked.vertical menubutton:not(:first-child) > button { + border-top-left-radius: 3px; + border-top-right-radius: 3px; + margin-top: 1px; +} + +.linked.vertical menubutton:not(:last-child) > button { + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked:not(.vertical) > dropdown:dir(ltr):not(:first-child) > button, .linked:not(.vertical) > dropdown:dir(rtl):not(:last-child) > button { + border-top-left-radius: 3px; + border-bottom-left-radius: 3px; + margin-left: 1px; +} + +.linked:not(.vertical) > dropdown:dir(ltr):not(:last-child) > button, .linked:not(.vertical) > dropdown:dir(rtl):not(:first-child) > button { + border-top-right-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked.vertical dropdown:not(:first-child) > button { + border-top-left-radius: 3px; + border-top-right-radius: 3px; + margin-top: 1px; +} + +.linked.vertical dropdown:not(:last-child) > button { + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked:not(.vertical) > colorbutton:dir(ltr):not(:first-child) > button, .linked:not(.vertical) > colorbutton:dir(rtl):not(:last-child) > button { + border-top-left-radius: 3px; + border-bottom-left-radius: 3px; + margin-left: 1px; +} + +.linked:not(.vertical) > colorbutton:dir(ltr):not(:last-child) > button, .linked:not(.vertical) > colorbutton:dir(rtl):not(:first-child) > button { + border-top-right-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked.vertical colorbutton:not(:first-child) > button { + border-top-left-radius: 3px; + border-top-right-radius: 3px; + margin-top: 1px; +} + +.linked.vertical colorbutton:not(:last-child) > button { + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked:not(.vertical) > fontbutton:dir(ltr):not(:first-child) > button, .linked:not(.vertical) > fontbutton:dir(rtl):not(:last-child) > button { + border-top-left-radius: 3px; + border-bottom-left-radius: 3px; + margin-left: 1px; +} + +.linked:not(.vertical) > fontbutton:dir(ltr):not(:last-child) > button, .linked:not(.vertical) > fontbutton:dir(rtl):not(:first-child) > button { + border-top-right-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked.vertical fontbutton:not(:first-child) > button { + border-top-left-radius: 3px; + border-top-right-radius: 3px; + margin-top: 1px; +} + +.linked.vertical fontbutton:not(:last-child) > button { + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked:not(.vertical) > tabbutton:dir(ltr):not(:first-child) > button, .linked:not(.vertical) > tabbutton:dir(rtl):not(:last-child) > button { + border-top-left-radius: 3px; + border-bottom-left-radius: 3px; + margin-left: 1px; +} + +.linked:not(.vertical) > tabbutton:dir(ltr):not(:last-child) > button, .linked:not(.vertical) > tabbutton:dir(rtl):not(:first-child) > button { + border-top-right-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked.vertical tabbutton:not(:first-child) > button { + border-top-left-radius: 3px; + border-top-right-radius: 3px; + margin-top: 1px; +} + +.linked.vertical tabbutton:not(:last-child) > button { + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked:not(.vertical) > entry:dir(ltr):not(:first-child), .linked:not(.vertical) > entry:dir(rtl):not(:last-child) { + border-top-left-radius: 3px; + border-bottom-left-radius: 3px; + margin-left: 1px; +} + +.linked:not(.vertical) > entry:dir(ltr):not(:last-child), .linked:not(.vertical) > entry:dir(rtl):not(:first-child) { + border-top-right-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked.vertical entry:not(:first-child) { + border-top-left-radius: 3px; + border-top-right-radius: 3px; + margin-top: 1px; +} + +.linked.vertical entry:not(:last-child) { + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked:not(.vertical) > combobox:dir(ltr):not(:first-child) > box > button.combo, .linked:not(.vertical) > combobox:dir(rtl):not(:last-child) > box > button.combo { + border-top-left-radius: 3px; + border-bottom-left-radius: 3px; + margin-left: 1px; +} + +.linked:not(.vertical) > combobox:dir(ltr):not(:last-child) > box > button.combo, .linked:not(.vertical) > combobox:dir(rtl):not(:first-child) > box > button.combo { + border-top-right-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked.vertical combobox:not(:first-child) > box > button.combo { + border-top-left-radius: 3px; + border-top-right-radius: 3px; + margin-top: 1px; +} + +.linked.vertical combobox:not(:last-child) > box > button.combo { + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked:not(.vertical) > appchooserbutton:dir(ltr):not(:first-child) > combobox > box > button.combo, .linked:not(.vertical) > appchooserbutton:dir(rtl):not(:last-child) > combobox > box > button.combo { + border-top-left-radius: 3px; + border-bottom-left-radius: 3px; + margin-left: 1px; +} + +.linked:not(.vertical) > appchooserbutton:dir(ltr):not(:last-child) > combobox > box > button.combo, .linked:not(.vertical) > appchooserbutton:dir(rtl):not(:first-child) > combobox > box > button.combo { + border-top-right-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked.vertical appchooserbutton:not(:first-child) > combobox > box > button.combo { + border-top-left-radius: 3px; + border-top-right-radius: 3px; + margin-top: 1px; +} + +.linked.vertical appchooserbutton:not(:last-child) > combobox > box > button.combo { + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; +} + + +list > row button.image-button:not(.flat) { + background-color: transparent; + box-shadow: none; + border: none; +} + + +list > row button.image-button:not(.flat):hover { + background-color: alpha(currentColor, 0.08); + color: #eff1f5; + outline: 0 solid transparent; +} + + +list > row button.image-button:not(.flat):active, +list > row button.image-button:not(.flat):checked { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms, border 0ms; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + background-image: radial-gradient(circle, alpha(currentColor, 0.08) 10%, transparent 0%); + background-size: 0% 0%; + background-color: alpha(currentColor, 0.08); + color: #eff1f5; + outline: 0 solid transparent; +} + + +list > row button.image-button:not(.flat).suggested-action { + background-color: #1e66f5; + color: #eff1f5; +} + + +list > row button.image-button:not(.flat).destructive-action { + background-color: #d20f39; + color: #eff1f5; +} + +/********* + * Links * + *********/ +link { + color: #8fcbe8; +} + +link:visited { + color: #8839ef; +} + +button.link:link, button.link:link:focus, button.link:link:hover, button.link:link:active { + color: #8fcbe8; +} + +button.link:visited, button.link:visited:focus, button.link:visited:hover, button.link:visited:active { + color: #8839ef; +} + +button.link > label { + text-decoration-line: underline; +} + +/***************** + * GtkSpinButton * + *****************/ +spinbutton { + border-radius: 12px; + padding: 0; + border-spacing: 0; + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(239, 241, 245, 0.08); + color: rgba(239, 241, 245, 0.7); + outline: 0 solid transparent; + outline-offset: 2px; +} + +spinbutton:focus-within { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + background-color: rgba(239, 241, 245, 0.08); + box-shadow: inset 0 0 0 2px transparent; + color: #eff1f5; + outline: 2px solid #89b4fa; + outline-offset: -2px; +} + +spinbutton:disabled { + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(239, 241, 245, 0.08); + color: rgba(239, 241, 245, 0.5); + outline: none; +} + +spinbutton > text { + border-image: none; + border-radius: 0; + box-shadow: none; + background-color: transparent; + margin: 0; +} + +spinbutton > button { + border: none; +} + +spinbutton > button:focus:not(:hover):not(:active):not(:disabled) { + box-shadow: none; +} + +spinbutton:not(.vertical) > text { + min-width: 30px; + padding-left: 12px; +} + +spinbutton:not(.vertical) > button { + padding: 0; + margin: 6px; +} + +spinbutton:not(.vertical) > button.up:dir(ltr), spinbutton:not(.vertical) > button.down:dir(rtl) { + margin-left: 3px; +} + +spinbutton:not(.vertical) > button.up:dir(rtl), spinbutton:not(.vertical) > button.down:dir(ltr) { + margin-right: 3px; +} + +cell.activatable spinbutton:not(.vertical) { + margin: 3px 0; +} + +cell.activatable spinbutton:not(.vertical) > button { + margin: 0; + padding: 0; + min-height: 24px; + border-radius: 0; +} + +cell.activatable spinbutton:not(.vertical) > button:last-child { + border-radius: 0 12px 12px 0; +} + +cell.activatable spinbutton:not(.vertical) > button.up:dir(ltr), cell.activatable spinbutton:not(.vertical) > button.down:dir(rtl) { + margin-left: 0; +} + +cell.activatable spinbutton:not(.vertical) > button.up:dir(rtl), cell.activatable spinbutton:not(.vertical) > button.down:dir(ltr) { + margin-right: 0; +} + +spinbutton.vertical > text { + min-height: 34px; + min-width: 40px; + padding: 0; +} + +spinbutton.vertical > button { + padding: 0; + margin: 6px 8px; +} + +/************** + * ComboBoxes * + **************/ +dropdown > button > box { + border-spacing: 6px; +} + +dropdown arrow, +combobox arrow { + -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); + min-height: 16px; + min-width: 16px; +} + +dropdown > popover.menu > contents modelbutton, +combobox > popover.menu > contents modelbutton { + padding-left: 9px; + padding-right: 9px; +} + +dropdown button.combo cellview:dir(ltr), +combobox button.combo cellview:dir(ltr) { + margin-left: -1px; +} + +dropdown button.combo cellview:dir(rtl), +combobox button.combo cellview:dir(rtl) { + margin-right: -1px; +} + +dropdown popover, +combobox popover { + margin-top: 4px; + padding: 0; +} + +dropdown popover listview, +combobox popover listview { + margin: 0; +} + +dropdown popover listview > row, +combobox popover listview > row { + padding: 6px; +} + +dropdown popover listview > row:selected, +combobox popover listview > row:selected { + color: #eff1f5; + background-color: alpha(currentColor, 0.06); +} + +dropdown popover .dropdown-searchbar, +combobox popover .dropdown-searchbar { + padding: 6px; +} + +dropdown.linked button:nth-child(2):dir(ltr), +combobox.linked button:nth-child(2):dir(ltr) { + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} + +dropdown.linked button:nth-child(2):dir(rtl), +combobox.linked button:nth-child(2):dir(rtl) { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} + +dropdown > .linked:not(.vertical) > entry:not(:only-child), +combobox > .linked:not(.vertical) > entry:not(:only-child) { + border-radius: 12px; +} + +dropdown > .linked:not(.vertical) > entry:not(:only-child):first-child, +combobox > .linked:not(.vertical) > entry:not(:only-child):first-child { + margin-right: -34px; + padding-right: 34px; +} + +dropdown > .linked:not(.vertical) > entry:not(:only-child):last-child, +combobox > .linked:not(.vertical) > entry:not(:only-child):last-child { + margin-left: -34px; + padding-left: 34px; +} + +dropdown > .linked:not(.vertical) > button:not(:only-child), +combobox > .linked:not(.vertical) > button:not(:only-child) { + min-height: 16px; + min-width: 16px; + margin: 5px; + padding: 4px; + border-radius: 12px; +} + +.linked:not(.vertical) > combobox:not(:first-child) > box > button.combo { + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} + +.linked:not(.vertical) > combobox:not(:last-child) > box > button.combo { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} + +.linked.vertical > combobox:not(:first-child) > box > button.combo { + border-top-left-radius: 0; + border-top-right-radius: 0; +} + +.linked.vertical > combobox:not(:last-child) > box > button.combo { + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; +} + +button.combo:only-child { + border-radius: 12px; + font-weight: normal; + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(239, 241, 245, 0.08); + color: rgba(239, 241, 245, 0.7); + outline: 0 solid transparent; + outline-offset: 2px; +} + +button.combo:only-child:focus { + color: #eff1f5; + outline: 2px solid transparent; + /* outline: 2px solid $fill; */ + outline-offset: -2px; +} + +button.combo:only-child:hover { + background-color: alpha(currentColor, 0.08); + color: #eff1f5; +} + +button.combo:only-child:active { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + background-image: radial-gradient(circle, alpha(currentColor, 0.08) 10%, transparent 0%); + background-size: 0% 0%; + background-color: alpha(currentColor, 0.08); + color: #eff1f5; +} + +button.combo:only-child:checked { + background-color: alpha(currentColor, 0.1); + color: #eff1f5; +} + +button.combo:only-child:disabled { + background-color: rgba(239, 241, 245, 0.04); + color: rgba(239, 241, 245, 0.5); + outline-color: transparent; +} + +/************ + * Toolbars * + ************/ +.toolbar { + padding: 6px; + border-spacing: 6px; +} + +.toolbar .linked button:not(:hover):not(:active):not(:checked):not(:disabled) { + background-color: rgba(239, 241, 245, 0.04); +} + +.osd .toolbar { + background-color: transparent; +} + +.app-notification, .toolbar.osd { + transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); + padding: 6px; + border-radius: 12px; + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.05), 0 4px 6px 0 rgba(0, 0, 0, 0.06), 0 1px 10px 0 rgba(0, 0, 0, 0.05), inset 0 1px rgba(239, 241, 245, 0.1); + background-color: #292c3c; + color: #eff1f5; + border: none; +} + +.app-notification:backdrop, .toolbar.osd:backdrop { + box-shadow: 0 3px 2px -3px rgba(0, 0, 0, 0.2), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(239, 241, 245, 0.1); +} + +.left.app-notification, .right.app-notification, .top.app-notification, .bottom.app-notification, .toolbar.osd.left, .toolbar.osd.right, .toolbar.osd.top, .toolbar.osd.bottom { + border-radius: 0; +} + +.bottom.app-notification, .toolbar.osd.bottom { + box-shadow: none; + background-color: transparent; + background-image: linear-gradient(to bottom, transparent, rgba(0, 0, 0, 0.1) 30%, rgba(0, 0, 0, 0.2) 50%, rgba(0, 0, 0, 0.4)); +} + +.toolbar.horizontal > separator { + margin: 2px; +} + +.toolbar.vertical > separator { + margin: 2px; +} + +.toolbar entry, +.toolbar splitbutton, +.toolbar button, +.toolbar scalebutton { + border-radius: 9px; +} + +.toolbar entry, +.toolbar spinbutton, +.toolbar splitbutton, +.toolbar separator:not(.sidebar), +.toolbar button, +.toolbar menubutton, +.toolbar scalebutton { + margin-top: 0; + margin-bottom: 0; +} + +.toolbar menubutton > button, +.toolbar splitbutton > button, +.toolbar splitbutton > menubutton, +.toolbar scalebutton > button { + margin-top: 0; + margin-bottom: 0; +} + +.toolbar switch { + margin-top: 4px; + margin-bottom: 4px; +} + +.toolbar spinbutton entry, +.toolbar spinbutton button { + margin: 0; +} + +.toolbar popover.menu separator:not(.sidebar) { + margin-top: 6px; + margin-bottom: 6px; +} + +searchbar > revealer > box { + padding: 6px; + border-spacing: 6px; + border: none; + background-color: transparent; + box-shadow: none; +} + +searchbar > revealer > box entry, +searchbar > revealer > box button, +searchbar > revealer > box menubutton { + margin: 0; +} + +/*************** + * Header bars * + ***************/ +headerbar button:not(.suggested-action):not(.destructive-action) { + color: rgba(239, 241, 245, 0.7); + /* background-color: if( */ + /* $variant == 'light', */ + /* rgba($base_alt, 0.5), */ + /* $titlebar-fill */ + /* ); */ + background-color: transparent; + border-radius: 12px; + border: none; + outline: none; +} + +headerbar .linked > button:not(.suggested-action):not(.destructive-action) { + border-radius: 0; +} + +headerbar .linked > button:first-child:not(.suggested-action):not(.destructive-action) { + border-top-left-radius: 9999px; + border-bottom-left-radius: 9999px; +} + +headerbar .linked > button:last-child:not(.suggested-action):not(.destructive-action) { + border-top-right-radius: 9999px; + border-bottom-right-radius: 9999px; +} + +headerbar .linked > button:only-child:not(.suggested-action):not(.destructive-action) { + border-radius: 9999px; +} + +headerbar button:hover:not(.suggested-action):not(.destructive-action) { + background-color: rgba(239, 241, 245, 0.12); +} + +headerbar button:focus:not(.suggested-action):not(.destructive-action), headerbar button:hover:not(.suggested-action):not(.destructive-action), headerbar button:active:not(.suggested-action):not(.destructive-action) { + color: #eff1f5; + outline: none; +} + +headerbar button:disabled:not(.suggested-action):not(.destructive-action) { + color: rgba(239, 241, 245, 0.32); +} + +headerbar button:checked:not(.suggested-action):not(.destructive-action) { + background-color: #89b4fa; + color: rgba(30, 30, 46, 0.87); + outline: none; +} + +headerbar button:checked:hover:not(.suggested-action):not(.destructive-action) { + box-shadow: inset 0 0 0 1000px rgba(30, 30, 46, 0.04); + color: rgba(30, 30, 46, 0.87); +} + +headerbar button:checked:focus:not(.suggested-action):not(.destructive-action) { + color: rgba(30, 30, 46, 0.87); +} + +headerbar button:checked:disabled:not(.suggested-action):not(.destructive-action) { + background-color: rgba(230, 233, 239, 0.5); + color: rgba(30, 30, 46, 0.38); +} + +headerbar button:backdrop:not(.suggested-action):not(.destructive-action) { + color: rgba(239, 241, 245, 0.5); +} + +headerbar button:backdrop:focus:not(.suggested-action):not(.destructive-action), headerbar button:backdrop:hover:not(.suggested-action):not(.destructive-action), headerbar button:backdrop:active:not(.suggested-action):not(.destructive-action) { + color: rgba(239, 241, 245, 0.7); +} + +headerbar button:backdrop:disabled:not(.suggested-action):not(.destructive-action) { + color: rgba(239, 241, 245, 0.32); +} + +headerbar button:backdrop:checked:not(.suggested-action):not(.destructive-action) { + color: rgba(30, 30, 46, 0.6); +} + +headerbar button:backdrop:checked:disabled:not(.suggested-action):not(.destructive-action) { + color: rgba(30, 30, 46, 0.3); +} + +headerbar entry { + background-color: rgba(239, 241, 245, 0.04); + color: #eff1f5; + border-radius: 12px; +} + +headerbar entry:disabled { + background-color: rgba(239, 241, 245, 0.04); + color: rgba(239, 241, 245, 0.5); +} + +headerbar entry image { + color: rgba(239, 241, 245, 0.7); +} + +headerbar entry image:hover, headerbar entry image:active { + color: #eff1f5; +} + +headerbar entry image:disabled { + color: rgba(239, 241, 245, 0.5); +} + +headerbar { + transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1), color 75ms cubic-bezier(0, 0, 0.2, 1); + background-color: transparent; + color: #eff1f5; + min-height: 46px; + border: none; + box-shadow: none; + padding: 0; + margin: 0; +} + +headerbar:disabled { + color: rgba(239, 241, 245, 0.5); +} + +headerbar:backdrop { + background-color: transparent; + color: rgba(239, 241, 245, 0.7); +} + +headerbar:backdrop:disabled { + color: rgba(239, 241, 245, 0.32); +} + +headerbar.flat, headerbar.flat:backdrop { + background: none; + box-shadow: none; + transition: none; +} + +headerbar .title { + /* padding: 0 $space-size * 2; */ + padding: 0; + margin: 0 -20px; + font-weight: bold; +} + +headerbar .subtitle { + /* padding: 0 $space-size * 2; */ + padding: 0; + font-size: smaller; +} + +headerbar .subtitle, +headerbar .dim-label, +headerbar row.expander image.expander-row-arrow, +row.expander headerbar image.expander-row-arrow, +headerbar row label.subtitle, +row headerbar label.subtitle { + transition: color 75ms cubic-bezier(0, 0, 0.2, 1); + color: rgba(239, 241, 245, 0.7); +} + +headerbar .subtitle:backdrop, +headerbar .dim-label:backdrop, +headerbar row.expander image.expander-row-arrow:backdrop, +row.expander headerbar image.expander-row-arrow:backdrop, +headerbar row label.subtitle:backdrop, +row headerbar label.subtitle:backdrop { + color: rgba(239, 241, 245, 0.5); +} + +headerbar .titlebar { + background-color: transparent; + box-shadow: none; +} + +headerbar headerbar + separator { + background-color: rgba(239, 241, 245, 0.12); +} + +headerbar > windowhandle > box { + padding: 0 12px; +} + +headerbar > windowhandle > box, +headerbar > windowhandle > box > box.start, +headerbar > windowhandle > box > box.end { + border-spacing: 6px; +} + +headerbar entry, +headerbar spinbutton, +headerbar button, +headerbar menubutton, +headerbar stackswitcher, +headerbar separator:not(.sidebar) { + margin-top: 6px; + margin-bottom: 6px; +} + +headerbar menubutton > button, +headerbar spinbutton > button, +headerbar splitbutton > button, +headerbar splitbutton > menubutton, +headerbar .linked > menubutton, +headerbar entry > menubutton { + margin-top: 0; + margin-bottom: 0; +} + +headerbar button.suggested-action:disabled, +headerbar button.destructive-action:disabled { + background-color: rgba(239, 241, 245, 0.04); + color: rgba(239, 241, 245, 0.5); + opacity: 1; +} + +headerbar splitbutton { + /* background-color: if( */ + /* $variant == 'light', */ + /* rgba($base_alt, 0.5), */ + /* $titlebar-fill */ + /* ); */ + background-color: transparent; + border-radius: 12px; +} + +headerbar splitbutton button:not(.suggested-action):not(.destructive-action):not(:hover):not(:active):not(:checked) { + background-color: transparent; +} + +headerbar splitbutton > separator { + background-color: transparent; +} + +headerbar .linked:not(.vertical) > entry:not(:only-child) { + border-radius: 12px; +} + +headerbar .entry-tag { + margin-top: 5px; + margin-bottom: 5px; +} + +headerbar stackswitcher { + background-color: rgba(239, 241, 245, 0.04); +} + +headerbar stackswitcher:checked { + background-color: #e6e9ef; + color: rgba(30, 30, 46, 0.87); +} + +headerbar stackswitcher:checked:hover { + background-color: white; +} + +headerbar stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action) { + border-radius: 9999px; +} + +headerbar popover.background button.suggested-action:disabled, +headerbar popover.background button.destructive-action:disabled { + background-color: rgba(239, 241, 245, 0.04); + color: rgba(239, 241, 245, 0.5); +} + +headerbar popover.background entry, +headerbar popover.background spinbutton, +headerbar popover.background button, +headerbar popover.background menubutton, +headerbar popover.background stackswitcher { + margin-top: 0; + margin-bottom: 0; +} + +headerbar separator:not(.sidebar) { + background-color: rgba(239, 241, 245, 0.12); +} + +headerbar switch { + margin: 11px 6px; +} + +headerbar.selection-mode { + transition: background-color 0.1ms 225ms, color 75ms cubic-bezier(0, 0, 0.2, 1); + background-color: #89b4fa; + color: rgba(30, 30, 46, 0.87); +} + +headerbar.selection-mode:backdrop { + color: rgba(30, 30, 46, 0.6); +} + +headerbar.selection-mode .subtitle:link { + color: rgba(30, 30, 46, 0.87); +} + +headerbar.selection-mode .selection-menu { + padding-left: 16px; + padding-right: 16px; +} + +headerbar.selection-mode .selection-menu .arrow { + -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); +} + +headerbar.default-decoration { + min-height: 34px; + padding: 0; + margin: 0; + border-radius: 12px 12px 0 0; + box-shadow: inset 0 1px rgba(239, 241, 245, 0.1); + border: none; + outline: none; +} + +.solid-csd headerbar.default-decoration, .maximized headerbar.default-decoration { + border-radius: 0; + box-shadow: none; +} + +window > .titlebar:not(.flat) { + box-shadow: none; +} + +window > .titlebar headerbar:not(.flat) { + box-shadow: none; +} + +window.devel headerbar { + background: #1e1e2e cross-fade(10%-gtk-icontheme("system-run-symbolic"), image(transparent)) 90% 0/256px 256px no-repeat, linear-gradient(to right, transparent 65%, rgba(137, 180, 250, 0.1)), linear-gradient(to top, #242437 3px, #28283d); +} + +window.devel headerbar:backdrop { + background: #1e1e2e cross-fade(10%-gtk-icontheme("system-run-symbolic"), image(transparent)) 90% 0/256px 256px no-repeat, image(#1e1e2e); + /* background-color would flash */ +} + +/************ + * Pathbars * + ************/ + +pathbar > button { + padding-left: 5px; + padding-right: 5px; + border-radius: 12px; + background-color: alpha(currentColor, 0.08); + border: none; + box-shadow: none; +} + + +pathbar > button:disabled { + background-color: alpha(currentColor, 0.05); +} + + +pathbar > button:checked { + background-color: alpha(currentColor, 0.1); + color: #eff1f5; +} + + +pathbar > button:checked:hover { + background-color: alpha(currentColor, 0.16); + color: #eff1f5; +} + + +pathbar > button label, +pathbar > button image { + margin-left: 3px; + margin-right: 3px; +} + + +pathbar > button.slider-button { + padding-left: 4px; + padding-right: 4px; +} + +.pathbar { + background-color: rgba(239, 241, 245, 0.04); + color: rgba(239, 241, 245, 0.7); + border: none; + border-radius: 12px; + padding: 2px; +} + +headerbar .pathbar { + margin-top: 6px; + margin-bottom: 6px; + background-color: rgba(239, 241, 245, 0.04); + color: rgba(239, 241, 245, 0.7); +} + +.pathbar > button { + margin-top: 0; + margin-bottom: 0; + min-height: 20px; + border-radius: 10px; + border: none; + box-shadow: none; +} + +.pathbar > button:last-child { + background-color: alpha(currentColor, 0.1); + color: #eff1f5; +} + +/************** + * Tree Views * + **************/ +columnview.view, +treeview.view { + border-left-color: #4a4b5a; + border-top-color: #4a4b5a; +} + +columnview.view:hover, columnview.view:selected, +treeview.view:hover, +treeview.view:selected { + border-radius: 0; +} + +columnview.view:focus, +treeview.view:focus { + box-shadow: none; + outline: none; +} + +columnview.view.separator, +treeview.view.separator { + min-height: 5px; + color: rgba(239, 241, 245, 0.12); +} + +columnview.view:drop(active), +treeview.view:drop(active) { + box-shadow: none; +} + +columnview.view:drop(active).after, +treeview.view:drop(active).after { + border-top-style: none; +} + +columnview.view:drop(active).before, +treeview.view:drop(active).before { + border-bottom-style: none; +} + +columnview.view > dndtarget:drop(active), +treeview.view > dndtarget:drop(active) { + border-style: solid none; + border-width: 1px; + border-color: alpha(currentColor, 0.06); +} + +columnview.view > dndtarget:drop(active).after, +treeview.view > dndtarget:drop(active).after { + border-top-style: none; +} + +columnview.view > dndtarget:drop(active).before, +treeview.view > dndtarget:drop(active).before { + border-bottom-style: none; +} + +columnview.view.expander, +treeview.view.expander { + min-width: 16px; + min-height: 16px; + -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); + color: rgba(239, 241, 245, 0.7); +} + +columnview.view.expander:dir(rtl), +treeview.view.expander:dir(rtl) { + -gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl"); +} + +columnview.view.expander:hover, +treeview.view.expander:hover { + color: #eff1f5; +} + +columnview.view.expander:selected, +treeview.view.expander:selected { + color: #eff1f5; +} + +columnview.view.expander:selected:hover, +treeview.view.expander:selected:hover { + color: #eff1f5; +} + +columnview.view.expander:checked, +treeview.view.expander:checked { + -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); +} + +columnview.view.expander:disabled, +treeview.view.expander:disabled { + color: rgba(239, 241, 245, 0.32); +} + +columnview.view.progressbar, +treeview.view.progressbar { + border-bottom: 6px solid #89b4fa; + box-shadow: none; + background-color: transparent; + background-image: none; +} + +columnview.view.progressbar:selected:hover, +treeview.view.progressbar:selected:hover { + box-shadow: none; +} + +columnview.view.trough, +treeview.view.trough { + border-bottom: 6px solid rgba(239, 241, 245, 0.12); + box-shadow: none; + background-color: transparent; + background-image: none; +} + +columnview.view.trough:selected:hover, +treeview.view.trough:selected:hover { + box-shadow: none; +} + +columnview.view > header > button, +treeview.view > header > button { + padding: 2px 6px; + border-style: solid; + border-width: 0 1px 0 0; + border-color: transparent; + border-radius: 0; + background-clip: border-box; + border-image: linear-gradient(to bottom, transparent 20%, rgba(239, 241, 245, 0.12) 20%, rgba(239, 241, 245, 0.12) 80%, transparent 80%) 0 1 0 0/0 1px 0 0 stretch; +} + +columnview.view > header > button:not(:focus):not(:hover):not(:active), +treeview.view > header > button:not(:focus):not(:hover):not(:active) { + color: rgba(239, 241, 245, 0.7); +} + +columnview.view > header > button, columnview.view > header > button:disabled, +treeview.view > header > button, +treeview.view > header > button:disabled { + background-color: transparent; +} + +columnview.view > header > button:last-child, columnview.view > header > button:only-child, +treeview.view > header > button:last-child, +treeview.view > header > button:only-child { + border-right: none; + border-image: none; +} + +columnview.view button.dnd, +columnview.view header.button.dnd, +treeview.view button.dnd, +treeview.view header.button.dnd { + padding: 2px 6px; + border-style: none solid solid; + border-width: 1px; + border-color: rgba(239, 241, 245, 0.12); + border-radius: 0; + box-shadow: none; + background-color: #313244; + background-clip: border-box; + color: #89b4fa; +} + +columnview.view acceleditor > label, +treeview.view acceleditor > label { + background-color: #89b4fa; +} + +stack.view treeview.view { + min-height: 34px; +} + +/********* + * Menus * + *********/ +menubar { + padding: 0; + background-color: #1e1e2e; + color: #eff1f5; +} + +menubar:backdrop { + background-color: #1e1e2e; + color: rgba(239, 241, 245, 0.7); +} + +.csd menubar { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1); +} + +menubar > item { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1); + min-height: 20px; + padding: 4px 8px; + color: rgba(239, 241, 245, 0.7); +} + +menubar > item:selected { + transition: none; + background-color: alpha(currentColor, 0.1); + color: #eff1f5; +} + +menubar > item:disabled { + color: rgba(239, 241, 245, 0.32); +} + +menubar > item label:disabled { + color: inherit; +} + +menubar > item popover.menu popover.menu { + margin-left: 9px; +} + +menubar > item popover.menu.background popover.menu.background > contents { + margin: 0; + border-radius: 12px; +} + +/********************** + * Popover Base Menus * + **********************/ +popover.menu box.inline-buttons { + color: #eff1f5; + padding: 0 6px; +} + +popover.menu box.inline-buttons button.image-button.model { + min-height: 28px; + min-width: 28px; + padding: 0; + border: none; + outline: none; + transition: none; + border-radius: 12px; +} + +popover.menu box.inline-buttons button.image-button.model:selected { + background-image: image(alpha(currentColor, 0.06)); +} + +popover.menu box.circular-buttons { + padding: 6px; +} + +popover.menu box.circular-buttons button.circular.image-button.model { + padding: 6px; + border-radius: 12px; +} + +popover.menu box.circular-buttons button.circular.image-button.model:focus { + background-color: alpha(currentColor, 0.06); +} + +popover.menu arrow.left, +popover.menu radio.left, +popover.menu check.left { + margin-left: 0; + margin-right: 0; +} + +popover.menu arrow.right, +popover.menu radio.right, +popover.menu check.right { + margin-left: 0; + margin-right: 0; +} + +popover.menu label.title { + font-weight: bold; + padding: 4px 26px; +} + +/************ + * Popovers * + ************/ +popover.background { + font: initial; +} + +popover.background, popover.background:backdrop { + background-color: transparent; +} + +popover > arrow, +popover > contents { + transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); + padding: 6px; + background-color: #232634; + border-radius: 12px; + color: #eff1f5; + border: none; + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 15px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12), 0 0 0 2px #89b4fa, 0 0 36px transparent; +} + +popover > arrow { + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 15px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12), 0 0 0 2px #89b4fa, 0 0 36px transparent; +} + +popover > contents > list, +popover > contents > .view, +popover > contents > toolbar { + border-style: none; + box-shadow: none; + background-color: transparent; +} + +popover > contents separator { + background-color: rgba(239, 241, 245, 0.12); + margin: 15px 10px; +} + +popover > contents list separator { + margin: 0; +} + +popover > contents list > row { + border-radius: 12px; +} + +popover > contents stack > box { + padding: 0; +} + +popover > contents > box > button { + margin: 0; +} + +popover .view:not(:selected), +popover toolbar { + background-color: #232634; +} + +popover button, +popover entry, +popover combobox { + border-radius: 12px; +} + +popover .linked > button:not(.radio) { + border-radius: 0; +} + +popover .linked > button:not(.radio):first-child { + border-radius: 12px 0 0 12px; +} + +popover .linked > button:not(.radio):last-child { + border-radius: 0 12px 12px 0; +} + +popover .linked > button:not(.radio):only-child { + border-radius: 12px; +} + +popover.menu button, +popover button.model { + min-height: 32px; + padding: 0 8px; +} + +popover modelbutton { + transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1); + min-height: 22px; + min-width: 56px; + padding: 3px 9px; + color: #eff1f5; + font: initial; + border-radius: 12px; +} + +popover modelbutton:hover { + transition: none; + background-color: rgba(239, 241, 245, 0.04); + color: #89b4fa; +} + +popover modelbutton:hover accelerator { + color: #89b4fa; +} + +popover modelbutton:hover accelerator:disabled { + color: rgba(239, 241, 245, 0.5); +} + +popover modelbutton:focus:not(:hover) { + transition: none; + box-shadow: none; + outline: none; +} + +popover modelbutton:disabled { + color: rgba(239, 241, 245, 0.5); +} + +popover modelbutton accelerator { + color: rgba(239, 241, 245, 0.5); + margin-left: 30px; +} + +popover modelbutton accelerator:disabled { + color: rgba(239, 241, 245, 0.12); +} + +popover modelbutton arrow.left { + -gtk-icon-source: -gtk-icontheme("go-previous-symbolic"); +} + +popover modelbutton arrow.right { + -gtk-icon-source: -gtk-icontheme("go-next-symbolic"); +} + +.osd popover, popover.touch-selection, popover.magnifier { + background-color: transparent; +} + +magnifier { + background-color: #313244; +} + +/************* + * Notebooks * + *************/ +tabbar tab, tabbar tabbox > tabboxchild > tab, notebook > header > tabs > tab { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms; + min-height: 24px; + min-width: 24px; + padding: 3px 12px; + border: none; + outline: none; + background-clip: padding-box; + color: #eff1f5; + font-weight: 500; + border-radius: 9px; +} + +tabbar tab:hover:not(:checked):not(:selected), notebook > header > tabs > tab:hover:not(:checked):not(:selected) { + background-color: rgba(239, 241, 245, 0.04); + color: #89b4fa; + box-shadow: none; +} + +tabbar tab:disabled, notebook > header > tabs > tab:disabled { + color: rgba(30, 30, 46, 0.3); +} + +tabbar tab:active, notebook > header > tabs > tab:active { + background-color: #313244; + color: #eff1f5; + box-shadow: none; +} + +tabbar tab:checked:not(:active), notebook > header > tabs > tab:checked:not(:active), tabbar tab:selected:not(:active), notebook > header > tabs > tab:selected:not(:active) { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms, background-color 0ms; + background-color: rgba(239, 241, 245, 0.04); + color: #89b4fa; + box-shadow: none; +} + +tabbar tab:checked:not(:active):disabled, notebook > header > tabs > tab:checked:not(:active):disabled, tabbar tab:selected:not(:active):disabled, notebook > header > tabs > tab:selected:not(:active):disabled { + color: rgba(239, 241, 245, 0.5); +} + +notebook, notebook.frame { + background-color: rgba(239, 241, 245, 0.04); + border-radius: 9px; +} + +notebook.frame frame > border { + border: none; + border-radius: 9px; +} + +notebook.frame frame > list row.activatable { + border-radius: 12px; +} + +frame > paned > notebook > header, notebook.frame > header { + background-color: rgba(239, 241, 245, 0.04); +} + +notebook > header { + border: none; + background-color: rgba(239, 241, 245, 0.04); + margin: 3px; + border-radius: 12px; +} + +notebook > header.top > tabs > arrow { + border-top-style: none; +} + +notebook > header.bottom > tabs > arrow { + border-bottom-style: none; +} + +notebook > header.top > tabs > arrow, notebook > header.bottom > tabs > arrow { + padding-left: 4px; + padding-right: 4px; +} + +notebook > header.top > tabs > arrow.down, notebook > header.bottom > tabs > arrow.down { + margin-left: 0; + -gtk-icon-source: -gtk-icontheme("pan-start-symbolic"); +} + +notebook > header.top > tabs > arrow.up, notebook > header.bottom > tabs > arrow.up { + margin-right: 0; + -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); +} + +notebook > header.left > tabs > arrow { + border-left-style: none; +} + +notebook > header.right > tabs > arrow { + border-right-style: none; +} + +notebook > header.left > tabs > arrow, notebook > header.right > tabs > arrow { + padding-top: 4px; + padding-bottom: 4px; +} + +notebook > header.left > tabs > arrow.down, notebook > header.right > tabs > arrow.down { + margin-top: 0; + -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); +} + +notebook > header.left > tabs > arrow.up, notebook > header.right > tabs > arrow.up { + margin-bottom: 0; + -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); +} + +notebook > header > tabs > arrow { + min-height: 16px; + min-width: 16px; + border-radius: 12px; +} + +notebook > header > tabs > tab { + margin: 3px; +} + +notebook > header > tabs > tab > box { + transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1); + margin: -6px -12px; + padding: 6px 12px; +} + +notebook > header > tabs > tab > box:drop(active) { + background-color: rgba(239, 241, 245, 0.12); + color: #eff1f5; +} + +notebook > header > tabs > tab button.flat:last-child { + margin-left: 6px; + margin-right: -3px; +} + +notebook > header > tabs > tab button.flat:first-child { + margin-left: -3px; + margin-right: 6px; +} + +notebook > header > tabs > tab button.small-button { + min-width: 24px; + min-height: 24px; +} + +notebook > header.top > tabs, notebook > header.bottom > tabs { + padding-left: 0; + padding-right: 0; +} + +notebook > header.top > tabs:not(:only-child):first-child, notebook > header.bottom > tabs:not(:only-child):first-child { + margin-left: 0; +} + +notebook > header.top > tabs:not(:only-child):last-child, notebook > header.bottom > tabs:not(:only-child):last-child { + margin-right: 0; +} + +notebook > header.top > tabs > tab:not(:last-child), notebook > header.bottom > tabs > tab:not(:last-child) { + margin-right: 0; +} + +notebook > header.top > tabs tab.reorderable-page, notebook > header.bottom > tabs tab.reorderable-page { + border-style: solid; +} + +notebook > header.left > tabs, notebook > header.right > tabs { + padding-top: 0; + padding-bottom: 0; +} + +notebook > header.left > tabs:not(:only-child):first-child, notebook > header.right > tabs:not(:only-child):first-child { + margin-top: 0; +} + +notebook > header.left > tabs:not(:only-child):last-child, notebook > header.right > tabs:not(:only-child):last-child { + margin-bottom: 0; +} + +notebook > header.left > tabs > tab:not(:last-child), notebook > header.right > tabs > tab:not(:last-child) { + margin-bottom: 0; +} + +notebook > header.left > tabs tab.reorderable-page, notebook > header.right > tabs tab.reorderable-page { + border-style: solid; +} + +notebook > header > menubutton > button.image-button { + padding: 3px; + min-width: 24px; + min-height: 24px; + margin: 0 3px; +} + +notebook > stack:not(:only-child) { + background-color: transparent; + border-radius: 12px; +} + +tabbar > revealer > box { + box-shadow: none; +} + +tabbar .box { + min-height: 34px; + background-color: rgba(239, 241, 245, 0.04); + background-image: none; + padding: 0; + margin: 3px; + border-radius: 12px; + border: none; + box-shadow: none; +} + +tabbar scrolledwindow.pinned undershoot { + border: 0 solid rgba(239, 241, 245, 0.12); +} + +tabbar scrolledwindow.pinned:dir(rtl) undershoot.left { + border-left-width: 1px; +} + +tabbar scrolledwindow.pinned:dir(ltr) undershoot.right { + border-right-width: 1px; +} + +tabbar scrolledwindow.pinned tabbox { + padding: 3px 3px 3px 0; +} + +tabbar scrolledwindow.pinned tabbox > tabboxchild { + margin: 0; +} + +tabbar scrolledwindow.pinned tabbox > background:dir(ltr) { + box-shadow: inset -1px 0 rgba(239, 241, 245, 0.12); +} + +tabbar scrolledwindow.pinned tabbox > background:dir(rtl) { + box-shadow: inset 1px 0 rgba(239, 241, 245, 0.12); +} + +tabbar scrolledwindow:not(.pinned) tabbox { + padding: 3px 0; +} + +tabbar scrolledwindow:not(.pinned) tabbox > tabboxchild { + margin: 0 -2px; +} + +tabbar scrolledwindow:not(.pinned) tabbox > tabboxchild + separator + tabboxchild { + margin-left: 0; +} + +tabbar undershoot { + transition: background 150ms ease-in-out; +} + +tabbar undershoot.left { + background: linear-gradient(to right, #313244, rgba(0, 0, 0, 0) 20px); +} + +tabbar undershoot.right { + background: linear-gradient(to left, #313244, rgba(0, 0, 0, 0) 20px); +} + +tabbar .needs-attention-left undershoot.left { + background: linear-gradient(to right, alpha(#89b4fa, 0.5), alpha(#89b4fa, 0.3) 1px, alpha(#89b4fa, 0) 20px); +} + +tabbar .needs-attention-right undershoot.right { + background: linear-gradient(to left, alpha(#89b4fa, 0.5), alpha(#89b4fa, 0.3) 1px, alpha(#89b4fa, 0) 20px); +} + +tabbar tabbox { + background-color: transparent; + background-image: none; + padding: 0; + margin: 0; + border: none; + box-shadow: none; +} + +tabbar tabbox > background { + background: none; +} + +tabbar tabbox > separator { + margin: 9px 0; + min-width: 1px; + background-color: rgba(30, 30, 46, 0.12); + transition: opacity 150ms ease-in-out; +} + +tabbar tabbox > separator.hidden { + opacity: 0; +} + +tabbar tabbox > tabboxchild { + padding: 0; +} + +tabbar tabbox > tabboxchild > tab { + margin: 0; +} + +tabbar tab.needs-attention { + background-image: radial-gradient(ellipse at bottom, rgba(239, 241, 245, 0.8), alpha(#89b4fa, 0.4) 10%, alpha(#89b4fa, 0) 30%); +} + +tabbar tab.needs-attention:hover { + background-image: image(alpha(currentColor, 0.03)), radial-gradient(ellipse at bottom, rgba(239, 241, 245, 0.8), alpha(#89b4fa, 0.4) 10%, alpha(#89b4fa, 0) 30%); +} + +tabbar .start-action, +tabbar .end-action { + background-color: rgba(239, 241, 245, 0.04); + background-clip: padding-box; + border-color: rgba(239, 241, 245, 0.12); + border-style: solid; + transition: background 150ms ease-in-out; +} + +tabbar .start-action button, +tabbar .end-action button { + border: none; + border-radius: 0; +} + +tabbar .start-action:dir(ltr), +tabbar .end-action:dir(rtl) { + border-right-width: 1px; +} + +tabbar .start-action:dir(rtl), +tabbar .end-action:dir(ltr) { + border-left-width: 1px; +} + +tabbar:not(.inline) scrolledwindow.pinned undershoot { + border-color: rgba(239, 241, 245, 0.12); +} + +tabbar:not(.inline) undershoot.left { + background: linear-gradient(to right, #1e1e2e, rgba(0, 0, 0, 0) 20px); +} + +tabbar:not(.inline) undershoot.right { + background: linear-gradient(to left, #1e1e2e, rgba(0, 0, 0, 0) 20px); +} + +tabbar:not(.inline) .needs-attention-left undershoot.left { + background: linear-gradient(to right, alpha(#89b4fa, 0.5), alpha(#89b4fa, 0.3) 1px, alpha(#89b4fa, 0) 20px); +} + +tabbar:not(.inline) .needs-attention-right undershoot.right { + background: linear-gradient(to left, alpha(#89b4fa, 0.5), alpha(#89b4fa, 0.3) 1px, alpha(#89b4fa, 0) 20px); +} + +tabbar:not(.inline) tabbox > background { + background-color: #1e1e2e; +} + +tabbar:not(.inline) .start-action, +tabbar:not(.inline) .end-action { + background-color: alpha(#1e1e2e, 0.6); + border-color: rgba(239, 241, 245, 0.12); +} + +dnd tab { + min-height: 24px; + background-color: #1e1e2e; + color: #eff1f5; + box-shadow: 0 1px 5px 1px rgba(0, 0, 0, 0.09), 0 2px 14px 3px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(0, 0, 0, 0.05); + outline: 1px solid rgba(30, 30, 46, 0.75); + outline-offset: -1px; + margin: 24px; +} + +dnd tab.needs-attention { + background-image: radial-gradient(ellipse at bottom, rgba(239, 241, 245, 0.8), alpha(#89b4fa, 0.4) 10%, alpha(#89b4fa, 0) 30%); +} + +tabbar tab, +dnd tab { + padding: 6px; +} + +tabbar tab button.image-button, +dnd tab button.image-button { + padding: 0; + margin: 0; + min-width: 24px; + min-height: 24px; + border-radius: 9999px; +} + +tabbar tab button.image-button.tab-close-button, +dnd tab button.image-button.tab-close-button { + margin-right: -3px; +} + +tabview:drop(active), +tabbox:drop(active) { + box-shadow: none; +} + +/************** + * Scrollbars * + **************/ +scrollbar { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1); + background-color: #313244; + box-shadow: none; + outline: none; +} + +scrollbar.top { + border-bottom: 1px solid transparent; +} + +scrollbar.bottom { + border-top: 1px solid transparent; +} + +scrollbar.left { + border-right: 1px solid transparent; +} + +scrollbar.right { + border-left: 1px solid transparent; +} + +scrollbar > range > trough { + outline: none; + background: none; +} + +scrollbar > range > trough > slider { + transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1); + min-width: 8px; + min-height: 8px; + border: 4px solid transparent; + border-radius: 9999px; + background-clip: padding-box; + box-shadow: none; + outline: none; + background-color: #232634; +} + +scrollbar > range > trough > slider:hover { + background-color: #292c3c; +} + +scrollbar > range > trough > slider:active { + background-color: #292c3c; +} + +scrollbar > range > trough > slider:disabled { + background-color: #1e1e2e; +} + +scrollbar > range.fine-tune > trough > slider { + min-width: 4px; + min-height: 4px; +} + +scrollbar > range.fine-tune.horizontal > trough > slider { + margin: 2px 0; +} + +scrollbar > range.fine-tune.vertical > trough > slider { + margin: 0 2px; +} + +scrollbar.overlay-indicator:not(.fine-tune) > range > trough > slider { + transition-property: background-color, min-height, min-width; +} + +scrollbar.overlay-indicator:not(.dragging):not(.hovering) { + border-color: transparent; + background-color: transparent; +} + +scrollbar.overlay-indicator:not(.dragging):not(.hovering) > range > trough > slider { + min-width: 4px; + min-height: 4px; + margin: 2px; + border: none; +} + +scrollbar.overlay-indicator:not(.dragging):not(.hovering) button { + min-width: 4px; + min-height: 4px; + margin: 2px; + border: 1px solid rgba(49, 50, 68, 0.3); + border-radius: 9999px; + background-color: rgba(239, 241, 245, 0.5); + background-clip: padding-box; + -gtk-icon-source: none; +} + +scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled { + background-color: rgba(239, 241, 245, 0.32); +} + +scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal > range > trough > slider { + min-width: 24px; +} + +scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal button { + min-width: 8px; +} + +scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical > range > trough > slider { + min-height: 24px; +} + +scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical button { + min-height: 8px; +} + +scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering { + background-color: #1e1e2e; +} + +scrollbar.horizontal > range > trough > slider { + min-width: 24px; +} + +scrollbar.vertical > range > trough > slider { + min-height: 24px; +} + +scrollbar button { + min-width: 16px; + min-height: 16px; + padding: 0; + border-radius: 0; +} + +scrollbar.vertical button.down { + -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); +} + +scrollbar.vertical button.up { + -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); +} + +scrollbar.horizontal button.down { + -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); +} + +scrollbar.horizontal button.up { + -gtk-icon-source: -gtk-icontheme("pan-start-symbolic"); +} + +/********** + * Switch * + **********/ +switch { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1); + padding: 3px; + border: none; + border-radius: 12px; + background-color: rgba(239, 241, 245, 0.5); +} + +switch:checked { + background-color: #89b4fa; +} + +switch:disabled { + opacity: 0.5; +} + +switch > slider { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1); + min-width: 18px; + min-height: 18px; + border-radius: 9999px; + outline: none; + box-shadow: 0 0 0 0 transparent, 0 3px 2px -2px rgba(0, 0, 0, 0.05), 0 2px 3px -1px rgba(0, 0, 0, 0.06), 0 1px 4px 0 rgba(0, 0, 0, 0.05); + background-color: #1e1e2e; + border: none; +} + +switch:focus slider, switch:hover slider, switch:focus:hover slider { + box-shadow: 0 0 0 6px rgba(239, 241, 245, 0.6), 0 3px 3px -2px transparent, 0 2px 3px -1px transparent, 0 1px 4px 0 transparent; +} + +/************************* + * Check and Radio items * + *************************/ +checkbutton, +radiobutton { + outline: none; + border-spacing: 3px; +} + +check, +radio { + min-height: 20px; + min-width: 20px; + margin: 3px; + padding: 0; + border-radius: 9999px; + border: none; + color: transparent; + background-color: rgba(239, 241, 245, 0.12); + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), box-shadow 150ms cubic-bezier(0, 0, 0.2, 1); +} + +check:hover, +radio:hover { + box-shadow: 0 0 0 6px rgba(239, 241, 245, 0.04); + background-color: rgba(239, 241, 245, 0.15); +} + +check:active, +radio:active { + box-shadow: 0 0 0 6px rgba(239, 241, 245, 0.12); + background-color: rgba(239, 241, 245, 0.2); +} + +check:disabled, +radio:disabled { + background-color: rgba(239, 241, 245, 0.04); +} + +check:checked, check:indeterminate, +radio:checked, +radio:indeterminate { + color: rgba(30, 30, 46, 0.6); + background-color: #89b4fa; +} + +check:checked:hover, check:indeterminate:hover, +radio:checked:hover, +radio:indeterminate:hover { + box-shadow: 0 0 0 6px rgba(137, 180, 250, 0.15); + background-color: #bad3fc; +} + +check:checked:active, check:indeterminate:active, +radio:checked:active, +radio:indeterminate:active { + box-shadow: 0 0 0 6px rgba(137, 180, 250, 0.2); + background-color: #89b4fa; +} + +check:checked:disabled, check:indeterminate:disabled, +radio:checked:disabled, +radio:indeterminate:disabled { + color: rgba(30, 30, 46, 0.6); + background-color: rgba(137, 180, 250, 0.35); +} + +popover modelbutton.flat check, popover modelbutton.flat check:focus, popover modelbutton.flat check:hover, popover modelbutton.flat check:focus:hover, popover modelbutton.flat check:active, popover modelbutton.flat check:disabled, popover modelbutton.flat radio, popover modelbutton.flat radio:focus, popover modelbutton.flat radio:hover, popover modelbutton.flat radio:focus:hover, popover modelbutton.flat radio:active, popover modelbutton.flat radio:disabled { + transition: none; + box-shadow: none; + background-image: none; +} + +popover modelbutton.flat check.left:dir(rtl), popover modelbutton.flat radio.left:dir(rtl) { + margin-left: -3px; + margin-right: 6px; +} + +popover modelbutton.flat check.right:dir(ltr), popover modelbutton.flat radio.right:dir(ltr) { + margin-left: 6px; + margin-right: -3px; +} + +popover.menu check, popover.menu radio { + transition: none; + margin: 0; + padding: 0; +} + +popover.menu check:dir(ltr), popover.menu radio:dir(ltr) { + margin-right: 6px; + margin-left: -3px; +} + +popover.menu check:dir(rtl), popover.menu radio:dir(rtl) { + margin-left: 6px; + margin-right: -3px; +} + +popover.menu check, popover.menu check:hover, popover.menu check:disabled, popover.menu check:checked:hover, popover.menu check:indeterminate:hover, popover.menu radio, popover.menu radio:hover, popover.menu radio:disabled, popover.menu radio:checked:hover, popover.menu radio:indeterminate:hover { + box-shadow: none; +} + + +check { + -gtk-icon-size: 20px; +} + + +check:checked { + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/checkbox-checked-symbolic.svg")), -gtk-recolor(url("assets/checkbox-checked-symbolic@2.svg"))); +} + + +check:indeterminate { + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/checkbox-mixed-symbolic.svg")), -gtk-recolor(url("assets/checkbox-mixed-symbolic@2.svg"))); +} + + +radio { + -gtk-icon-size: 20px; +} + + +radio:checked { + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/radio-checked-symbolic.svg")), -gtk-recolor(url("assets/radio-checked-symbolic@2.svg"))); +} + + +radio:indeterminate { + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/radio-mixed-symbolic.svg")), -gtk-recolor(url("assets/radio-mixed-symbolic@2.svg"))); +} + + +popover.menu check { + min-height: 16px; + min-width: 16px; + -gtk-icon-size: 16px; +} + + +popover.menu check:checked { + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/small-checkbox-checked-symbolic.svg")), -gtk-recolor(url("assets/small-checkbox-checked-symbolic@2.svg"))); +} + + +popover.menu check:indeterminate { + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/small-checkbox-mixed-symbolic.svg")), -gtk-recolor(url("assets/small-checkbox-mixed-symbolic@2.svg"))); +} + + +popover.menu radio { + min-height: 16px; + min-width: 16px; + -gtk-icon-size: 16px; +} + + +popover.menu radio:checked { + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/small-radio-checked-symbolic.svg")), -gtk-recolor(url("assets/small-radio-checked-symbolic@2.svg"))); +} + + +popover.menu radio:indeterminate { + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/small-radio-mixed-symbolic.svg")), -gtk-recolor(url("assets/small-radio-mixed-symbolic@2.svg"))); +} + +check:not(:checked):active { + -gtk-icon-transform: rotate(90deg); +} + +treeview.view radio, +treeview.view check, +columnview.view radio, +columnview.view check { + padding: 0; + margin: 0; + transition: none; +} + +treeview.view radio, treeview.view radio:hover, treeview.view radio:disabled, treeview.view radio:checked:hover, treeview.view radio:indeterminate:hover, +treeview.view check, +treeview.view check:hover, +treeview.view check:disabled, +treeview.view check:checked:hover, +treeview.view check:indeterminate:hover, +columnview.view radio, +columnview.view radio:hover, +columnview.view radio:disabled, +columnview.view radio:checked:hover, +columnview.view radio:indeterminate:hover, +columnview.view check, +columnview.view check:hover, +columnview.view check:disabled, +columnview.view check:checked:hover, +columnview.view check:indeterminate:hover { + box-shadow: none; +} + +treeview.view:hover check, +treeview.view:hover radio, treeview.view:selected check, +treeview.view:selected radio, treeview.view:focus check, +treeview.view:focus radio, +columnview.view:hover check, +columnview.view:hover radio, +columnview.view:selected check, +columnview.view:selected radio, +columnview.view:focus check, +columnview.view:focus radio { + box-shadow: none; +} + +treeview.view:hover check:checked, +treeview.view:hover radio:checked, treeview.view:selected check:checked, +treeview.view:selected radio:checked, treeview.view:focus check:checked, +treeview.view:focus radio:checked, +columnview.view:hover check:checked, +columnview.view:hover radio:checked, +columnview.view:selected check:checked, +columnview.view:selected radio:checked, +columnview.view:focus check:checked, +columnview.view:focus radio:checked { + color: rgba(30, 30, 46, 0.87); + background-color: #89b4fa; +} + +checkbutton.selection-mode { + border-radius: 9999px; +} + +checkbutton.selection-mode check, +checkbutton.selection-mode radio { + padding: 6px; + border-radius: 9999px; +} + +checkbutton.selection-mode check:checked, checkbutton.selection-mode check:indeterminate, +checkbutton.selection-mode radio:checked, +checkbutton.selection-mode radio:indeterminate { + color: rgba(30, 30, 46, 0.87); + background-color: #89b4fa; +} + +checkbutton.selection-mode label:dir(ltr) { + margin-right: 6px; +} + +checkbutton.selection-mode label:dir(rtl) { + margin-left: 6px; +} + +/************ + * GtkScale * + ************/ +scale { + min-height: 2px; + min-width: 2px; +} + +scale.horizontal { + padding: 16px 12px; +} + +scale.vertical { + padding: 12px 16px; +} + +scale > trough { + transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1); + outline: none; + background-color: rgba(239, 241, 245, 0.3); +} + +scale > trough:disabled { + background-color: rgba(239, 241, 245, 0.12); +} + +scale > trough > highlight { + transition: background-image 75ms cubic-bezier(0, 0, 0.2, 1); + background-image: image(#89b4fa); +} + +scale > trough > highlight:disabled { + background-color: #1e1e2e; + background-image: image(rgba(239, 241, 245, 0.32)); +} + +scale > trough > fill { + transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1); + background-color: rgba(239, 241, 245, 0.3); +} + +scale > trough > fill:disabled { + background-color: transparent; +} + +scale > trough > slider { + min-height: 18px; + min-width: 18px; + margin: -8px; + transition: all 75ms cubic-bezier(0, 0, 0.2, 1); + border-radius: 9999px; + color: #89b4fa; + background-color: #313244; + box-shadow: inset 0 0 0 2px #89b4fa; +} + +scale > trough > slider:hover { + box-shadow: inset 0 0 0 2px #89b4fa, 0 0 0 8px rgba(239, 241, 245, 0.12); +} + +scale > trough > slider:active { + box-shadow: inset 0 0 0 4px #89b4fa, 0 0 0 8px rgba(239, 241, 245, 0.12); +} + +scale > trough > slider:disabled { + box-shadow: inset 0 0 0 2px rgba(239, 241, 245, 0.32); +} + +scale.fine-tune.horizontal { + min-height: 4px; + padding-top: 15px; + padding-bottom: 15px; +} + +scale.fine-tune.vertical { + min-width: 4px; + padding-left: 15px; + padding-right: 15px; +} + +scale.fine-tune > trough > slider { + margin: -7px; +} + +scale > marks, +scale > value { + color: rgba(239, 241, 245, 0.7); +} + +scale indicator { + background-color: rgba(239, 241, 245, 0.3); + color: transparent; +} + +scale.marks-before:not(.marks-after) > trough > slider, scale.marks-after:not(.marks-before) > trough > slider { + transform: rotate(45deg); + border-bottom-right-radius: 0; +} + +scale.horizontal indicator { + min-height: 8px; + min-width: 1px; +} + +scale.vertical indicator { + min-height: 1px; + min-width: 8px; +} + +scale.color { + min-height: 0; + min-width: 0; +} + +scale.color.horizontal { + padding: 0 0 12px 0; +} + +scale.color.horizontal > trough > slider:dir(ltr), scale.color.horizontal > trough > slider:dir(rtl) { + margin-bottom: -13.5px; + margin-top: 11.5px; +} + +scale.color.vertical:dir(ltr) { + padding: 0 0 0 12px; +} + +scale.color.vertical:dir(ltr) slider { + margin-left: -13.5px; + margin-right: 11.5px; +} + +scale.color.vertical:dir(rtl) { + padding: 0 12px 0 0; +} + +scale.color.vertical:dir(rtl) > trough > slider { + margin-right: -13.5px; + margin-left: 11.5px; +} + +/***************** + * Progress bars * + *****************/ +progressbar { + color: rgba(239, 241, 245, 0.7); + font-size: smaller; +} + +progressbar.horizontal trough, +progressbar.horizontal progress { + min-height: 6px; +} + +progressbar.vertical trough, +progressbar.vertical progress { + min-width: 6px; +} + +progressbar trough { + border-radius: 12px; + background-color: rgba(239, 241, 245, 0.12); +} + +progressbar progress { + border-radius: 12px; + background-color: #89b4fa; +} + +progressbar.osd { + min-width: 6px; + min-height: 6px; + background-color: transparent; + box-shadow: none; + margin: 0; + padding: 0; +} + +progressbar.osd trough { + background-color: transparent; +} + +progressbar.osd progress { + background-color: #89b4fa; +} + +progressbar trough.empty progress { + all: unset; +} + +/************* + * Level Bar * + *************/ +levelbar.horizontal block { + min-height: 6px; +} + +levelbar.horizontal.discrete block { + min-width: 34px; +} + +levelbar.horizontal.discrete block:not(:last-child) { + margin-right: 2px; +} + +levelbar.vertical block { + min-width: 6px; +} + +levelbar.vertical.discrete block { + min-height: 34px; +} + +levelbar.vertical.discrete block:not(:last-child) { + margin-bottom: 2px; +} + +levelbar trough { + border-radius: 12px; +} + +levelbar block.low { + background-color: #df8e1d; +} + +levelbar block.high, levelbar block:not(.empty) { + background-color: #89b4fa; +} + +levelbar block.full { + background-color: #40a02b; +} + +levelbar block.empty { + background-color: rgba(239, 241, 245, 0.12); +} + +/**************** + * Print dialog * +*****************/ +window.dialog.print drawing { + color: #eff1f5; + background: none; + border: none; + padding: 0; +} + +window.dialog.print drawing paper { + padding: 0; + border: 1px solid rgba(239, 241, 245, 0.12); + background-color: #313244; + color: #eff1f5; +} + +window.dialog.print .dialog-action-box { + margin: 12px; +} + +/********** + * Frames * + **********/ +frame, +.frame { + border: 1px solid rgba(239, 241, 245, 0.12); +} + +frame > list, +.frame > list { + border: none; +} + +frame.view, +.frame.view { + border-radius: 12px; +} + +frame.flat, +.frame.flat { + border-style: none; +} + +frame { + border-radius: 12px; +} + +frame > label { + margin: 4px; +} + +frame.flat > border, statusbar frame > border { + border: none; +} + +actionbar { + box-shadow: none; +} + +actionbar > revealer > box { + padding: 6px; + border-spacing: 6px; + box-shadow: none; + background-color: #313244; + background-clip: border-box; + border: none; + color: #eff1f5; +} + +actionbar > revealer > box button, +actionbar > revealer > box entry, +actionbar > revealer > box menubutton, +actionbar > revealer > box menubutton > button, +actionbar > revealer > box splitbutton, +actionbar > revealer > box splitbutton > button, +actionbar > revealer > box spinbutton { + margin: 0; +} + +statusbar { + padding: 6px 18px; +} + +scrolledwindow viewport.frame { + border: none; +} + +stack scrolledwindow.frame viewport.frame list { + border: none; +} + +scrolledwindow > overshoot.top { + background-image: radial-gradient(farthest-side at top, alpha(currentColor, 0.12) 85%, alpha(currentColor, 0)), radial-gradient(farthest-side at top, alpha(currentColor, 0.05), alpha(currentColor, 0)); + background-size: 100% 3%, 100% 50%; + background-repeat: no-repeat; + background-position: top; + background-color: transparent; + border: none; + box-shadow: none; +} + +scrolledwindow > overshoot.bottom { + background-image: radial-gradient(farthest-side at bottom, alpha(currentColor, 0.12) 85%, alpha(currentColor, 0)), radial-gradient(farthest-side at bottom, alpha(currentColor, 0.05), alpha(currentColor, 0)); + background-size: 100% 3%, 100% 50%; + background-repeat: no-repeat; + background-position: bottom; + background-color: transparent; + border: none; + box-shadow: none; +} + +scrolledwindow > overshoot.left { + background-image: radial-gradient(farthest-side at left, alpha(currentColor, 0.12) 85%, alpha(currentColor, 0)), radial-gradient(farthest-side at left, alpha(currentColor, 0.05), alpha(currentColor, 0)); + background-size: 3% 100%, 50% 100%; + background-repeat: no-repeat; + background-position: left; + background-color: transparent; + border: none; + box-shadow: none; +} + +scrolledwindow > overshoot.right { + background-image: radial-gradient(farthest-side at right, alpha(currentColor, 0.12) 85%, alpha(currentColor, 0)), radial-gradient(farthest-side at right, alpha(currentColor, 0.05), alpha(currentColor, 0)); + background-size: 3% 100%, 50% 100%; + background-repeat: no-repeat; + background-position: right; + background-color: transparent; + border: none; + box-shadow: none; +} + +scrolledwindow.undershoot-top > undershoot.top { + border-radius: 0px 0px 0 0; + box-shadow: none; + background: linear-gradient(to bottom, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +scrolledwindow.undershoot-bottom > undershoot.bottom { + border-radius: 0 0 0px 0px; + box-shadow: none; + background: linear-gradient(to top, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +scrolledwindow.undershoot-start:dir(ltr) > undershoot.left { + border-radius: 0px 0 0 0px; + box-shadow: none; + background: linear-gradient(to right, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +scrolledwindow.undershoot-start:dir(rtl) > undershoot.right { + border-radius: 0 0px 0px 0; + box-shadow: none; + background: linear-gradient(to left, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +scrolledwindow.undershoot-end:dir(ltr) > undershoot.right { + border-radius: 0 0px 0px 0; + box-shadow: none; + background: linear-gradient(to left, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +scrolledwindow.undershoot-end:dir(rtl) > undershoot.left { + border-radius: 0px 0 0 0px; + box-shadow: none; + background: linear-gradient(to right, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +scrolledwindow > undershoot { + background-image: none; + box-shadow: none; + border: none; +} + +separator { + min-width: 1px; + min-height: 1px; + background-color: transparent; +} + +stacksidebar + separator.vertical, +stacksidebar separator.horizontal, button.font separator, button.file separator, separator.spacer, separator.sidebar { + min-width: 0; + min-height: 0; + background-color: transparent; + background-image: none; +} + +/********* + * Lists * + *********/ +list.content, +list.boxed-list { + border-radius: 12px; + box-shadow: none; + border: none; + background-color: transparent; +} + +list.content > row, +list.boxed-list > row { + border: none; + border-radius: 3px; + background-color: rgba(239, 241, 245, 0.04); +} + +list.content > row:hover, +list.boxed-list > row:hover, list.content > row.has-open-popup, +list.boxed-list > row.has-open-popup, list.content > row:focus, +list.boxed-list > row:focus { + background-color: rgba(239, 241, 245, 0.04); +} + +list.content > row:active, +list.boxed-list > row:active { + background-color: alpha(currentColor, 0.12); +} + +list.content > row:not(:first-child), +list.boxed-list > row:not(:first-child) { + margin-top: 3px; +} + +list.content > row:first-child, +list.boxed-list > row:first-child { + border-radius: 12px 12px 3px 3px; +} + +list.content > row:last-child, +list.boxed-list > row:last-child { + border-radius: 3px 3px 12px 12px; +} + +list.content > row:only-child, +list.boxed-list > row:only-child { + border-radius: 12px; +} + +listview, +list { + border-color: rgba(239, 241, 245, 0.12); + background-color: rgba(239, 241, 245, 0.04); + background-clip: padding-box; +} + +listview > row, +list > row { + padding: 6px; + background-clip: padding-box; +} + +listview > row.expander, +list > row.expander { + padding: 0px; +} + +listview > row.expander .row-header, +list > row.expander .row-header { + padding: 2px; +} + +listview.horizontal row.separator:not(:last-child), listview.separators.horizontal > row:not(.separator):not(:last-child), +list.horizontal row.separator:not(:last-child), +list.separators.horizontal > row:not(.separator):not(:last-child) { + border-left: 1px solid rgba(239, 241, 245, 0.12); +} + +listview:not(.horizontal) row.separator:not(:last-child), listview.separators:not(.horizontal) > row:not(.separator):not(:last-child), +list:not(.horizontal) row.separator:not(:last-child), +list.separators:not(.horizontal) > row:not(.separator):not(:last-child) { + border-bottom: 1px solid rgba(239, 241, 245, 0.12); +} + +leaflet scrolledwindow listview, leaflet scrolledwindow list { + background-color: transparent; +} + +list.frame { + border-radius: 12px; +} + +listview.view { + color: #eff1f5; + background-color: transparent; +} + +popover.menu listview.view { + padding: 0; +} + +popover.menu listview.view > row { + margin-left: 0; + margin-right: 0; + border-radius: 12px; +} + +row { + color: rgba(239, 241, 245, 0.7); + background-clip: padding-box; +} + +row label.subtitle { + font-size: smaller; +} + +row > box.header { + margin-left: 12px; + margin-right: 12px; + min-height: 46px; +} + +row > box.header > .icon:disabled { + filter: opacity(0.35); +} + +row > box.header > box.title { + margin-top: 6px; + margin-bottom: 6px; + border-spacing: 3px; +} + +.nautilus-window .nautilus-grid-view child.activatable, columnview.view > header > button, +treeview.view > header > button, row.activatable { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1), font-weight 0; + outline: none; + box-shadow: none; + background-color: transparent; + background-image: radial-gradient(circle, transparent 10%, transparent 0%); + background-repeat: no-repeat; + background-position: center; + background-size: 1000% 1000%; + outline: none; +} + +.nautilus-window .nautilus-grid-view child.activatable:focus, columnview.view > header > button:focus, +treeview.view > header > button:focus, row.activatable:focus { + color: #eff1f5; + background-color: transparent; + box-shadow: none; + outline: none; +} + +.nautilus-window .nautilus-grid-view child.activatable:hover, columnview.view > header > button:hover, +treeview.view > header > button:hover, .nautilus-window .nautilus-grid-view child.has-open-popup.activatable, columnview.view > header > button.has-open-popup, +treeview.view > header > button.has-open-popup, row.activatable:hover, row.activatable.has-open-popup { + color: #eff1f5; + background-color: alpha(currentColor, 0.05); + box-shadow: none; +} + +.nautilus-window .nautilus-grid-view child.activatable:active, columnview.view > header > button:active, +treeview.view > header > button:active, row.activatable:active { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms, font-weight 0ms; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + background-image: radial-gradient(circle, alpha(currentColor, 0.05) 10%, transparent 0%); + background-size: 0% 0%; + background-color: alpha(currentColor, 0.05); + color: #eff1f5; + box-shadow: none; +} + +.nautilus-window .nautilus-grid-view child.activatable:selected, columnview.view > header > button:selected, +treeview.view > header > button:selected, row.activatable:selected { + background-color: alpha(currentColor, 0.06); +} + +.nautilus-window .nautilus-grid-view child.activatable:selected:hover, columnview.view > header > button:selected:hover, +treeview.view > header > button:selected:hover, row.activatable:selected:hover { + background-color: alpha(currentColor, 0.08); +} + +button row.activatable:focus, button row.activatable:hover, button row.activatable:active { + box-shadow: none; + background: none; +} + +button:checked row.activatable { + color: rgba(30, 30, 46, 0.87); +} + +row:selected { + background-color: alpha(currentColor, 0.06); + color: inherit; + box-shadow: none; +} + +row:selected:hover { + background-color: alpha(currentColor, 0.08); +} + +row:selected:focus, row:selected:focus-visible:focus-within { + outline: none; + background-color: alpha(currentColor, 0.08); +} + +row:selected:focus:hover, row:selected:focus-visible:focus-within:hover { + background-color: alpha(currentColor, 0.16); +} + +row:selected image, +row:selected label { + color: #eff1f5; +} + +row:selected button image, +row:selected button label { + color: inherit; +} + +row:selected:disabled image, +row:selected:disabled label { + color: rgba(239, 241, 245, 0.5); +} + +.rich-list { + /* rich lists usually containing other widgets than just labels/text */ +} + +.rich-list > row { + padding: 9px 12px; + min-height: 32px; + /* should be tall even when only containing a label */ +} + +.rich-list > row:last-child { + border-bottom: none; +} + +.rich-list > row > box { + border-spacing: 12px; +} + +row label.subtitle { + font-size: smaller; +} + +row > box.header { + margin-left: 12px; + margin-right: 12px; + border-spacing: 6px; + min-height: 50px; +} + +row > box.header > .icon:disabled { + filter: opacity(0.45); +} + +row > box.header > box.title { + margin-top: 6px; + margin-bottom: 6px; + border-spacing: 3px; + padding: 0; +} + +row > box.header > box.title, +row > box.header > box.title > .title { + padding: 0; + font-weight: bold; + color: #eff1f5; +} + +row > box.header > box.title > .subtitle { + padding: 2px 0; + font-weight: normal; + color: rgba(239, 241, 245, 0.7); +} + +row > box.header > .prefixes, +row > box.header > .suffixes { + border-spacing: 6px; +} + +row > box.header > .icon:dir(ltr), +row > box.header > .prefixes:dir(ltr) { + margin-right: 6px; +} + +row > box.header > .icon:dir(rtl), +row > box.header > .prefixes:dir(rtl) { + margin-left: 6px; +} + +row.entry .edit-icon, +row.entry .indicator { + min-width: 24px; + min-height: 24px; + padding: 5px; +} + +row.entry .edit-icon:disabled { + opacity: 0.5; +} + +row.entry .indicator { + opacity: 0.65; +} + +row.entry.monospace { + font-family: inherit; +} + +row.entry.monospace text { + font-family: monospace; +} + +row.entry.error text > selection:focus-within { + background-color: alpha(#d20f39, 0.2); +} + +row.entry.error text > cursor-handle > contents { + background-color: currentColor; +} + +row.entry.warning text > selection:focus-within { + background-color: alpha(#df8e1d, 0.2); +} + +row.entry.warning text > cursor-handle > contents { + background-color: currentColor; +} + +row.entry.success text > selection:focus-within { + background-color: alpha(#40a02b, 0.2); +} + +row.entry.success text > cursor-handle > contents { + background-color: currentColor; +} + +row.combo image.dropdown-arrow:disabled { + filter: opacity(0.45); +} + +row.combo listview.inline { + background: none; + border: none; + box-shadow: none; + color: inherit; +} + +row.combo listview.inline, row.combo listview.inline:disabled { + background: none; + color: inherit; +} + +row.combo popover > contents { + min-width: 120px; +} + +row.expander { + background: none; + padding: 0px; +} + +row.expander > box > list { + background: none; + color: inherit; +} + +row.expander list.nested { + color: inherit; + background-color: transparent; +} + +row.expander list.nested > row { + background-color: transparent; + border: none; + background-image: none; + transition: none; + animation: none; +} + +row.expander image.expander-row-arrow { + transition: -gtk-icon-transform 200ms cubic-bezier(0, 0, 0.2, 1); +} + +row.expander image.expander-row-arrow:dir(ltr) { + margin-left: 6px; +} + +row.expander image.expander-row-arrow:dir(rtl) { + margin-right: 6px; +} + +row.expander image.expander-row-arrow:dir(ltr) { + -gtk-icon-transform: rotate(0.5turn); +} + +row.expander image.expander-row-arrow:dir(rtl) { + -gtk-icon-transform: rotate(-0.5turn); +} + +row.expander image.expander-row-arrow:disabled { + filter: opacity(0.45); +} + +row.expander:checked image.expander-row-arrow { + -gtk-icon-transform: rotate(0turn); + opacity: 1; +} + +row.expander:checked image.expander-row-arrow:not(:disabled) { + color: #89b4fa; +} + +.osd row.expander:checked image.expander-row-arrow:not(:disabled) { + color: inherit; +} + +list.content > row.expander row.header, +list.boxed-list > row.expander row.header { + background-color: transparent; + border: none; + box-shadow: none; +} + +list.content > row.expander, +list.boxed-list > row.expander { + border: none; +} + +columnview > listview > row { + padding: 0; +} + +columnview > listview > row > cell { + padding: 8px 6px; +} + +columnview > listview > row > cell:not(:first-child) { + border-left: 1px solid transparent; +} + +columnview.column-separators > listview > row > cell { + border-left-color: rgba(239, 241, 245, 0.12); +} + +columnview.data-table > listview > row > cell { + padding-top: 2px; + padding-bottom: 2px; +} + +treeexpander { + border-spacing: 6px; +} + +columnview row:not(:selected) cell editablelabel:not(.editing):focus-within { + outline: 2px solid alpha(currentColor, 0.06); +} + +columnview row:not(:selected) cell editablelabel.editing:focus-within { + outline: 2px solid #89b4fa; +} + +columnview row:not(:selected) cell editablelabel.editing text selection { + color: rgba(30, 30, 46, 0.87); + background-color: #89b4fa; +} + +/********************* + * App Notifications * + *********************/ +.app-notification { + margin: 6px; + border-spacing: 0; + padding: 0; + border: none; + background-image: none; +} + +.app-notification button.text-button:not(:disabled) { + color: #89b4fa; +} + +.app-notification > box > label { + margin-left: 9px; +} + +.app-notification.frame, +.app-notification border { + border: none; +} + +/************* + * Expanders * + *************/ +expander { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1); + min-width: 16px; + min-height: 16px; + color: rgba(239, 241, 245, 0.7); + -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); +} + +expander:dir(rtl) { + -gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl"); +} + +expander:hover, expander:active { + color: #eff1f5; +} + +expander:checked { + -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); +} + +expander:disabled { + color: rgba(239, 241, 245, 0.32); +} + +expander-widget > box > title { + border-radius: 12px; +} + +expander-widget > box > title:hover > expander { + color: rgba(239, 241, 245, 0.7); +} + +.navigation-sidebar:not(decoration):not(window):drop(active):focus, .navigation-sidebar:not(decoration):not(window):drop(active), +placessidebar:not(decoration):not(window):drop(active):focus, +placessidebar:not(decoration):not(window):drop(active), +stackswitcher:not(decoration):not(window):drop(active):focus, +stackswitcher:not(decoration):not(window):drop(active), +expander-widget:not(decoration):not(window):drop(active):focus, +expander-widget:not(decoration):not(window):drop(active) { + box-shadow: none; +} + +/************ + * Calendar * + ************/ +calendar { + padding: 0; + border: 1px solid rgba(239, 241, 245, 0.12); + border-radius: 12px; + color: #eff1f5; +} + +calendar:disabled { + color: rgba(239, 241, 245, 0.5); +} + +calendar:selected { + border-radius: 12px; +} + +calendar > header { + padding: 3px; + border-bottom: 1px solid rgba(239, 241, 245, 0.12); +} + +calendar > header > button { + min-height: 24px; +} + +calendar > grid { + margin: 3px; +} + +calendar > grid > label { + border-radius: 12px; + margin: 0; +} + +calendar > grid > label.today:selected { + box-shadow: none; +} + +calendar > grid > label:focus { + outline-style: none; +} + +calendar > grid > label.day-number { + padding: 6px; +} + +calendar > grid > label.day-number.other-month { + color: alpha(currentColor, 0.3); +} + +/*********** + * Dialogs * + ***********/ +window.messagedialog .response-area button, window.dialog.message .dialog-action-area > button { + border-radius: 9px; + min-height: 28px; + padding: 6px 12px; + margin: 0; + border: none; +} + +window.dialog.message.background { + background-color: #292c3c; +} + +window.dialog.message box.dialog-vbox.vertical { + margin-top: 6px; + border-spacing: 24px; +} + +window.dialog.message box.dialog-vbox.vertical > box.vertical { + margin-bottom: 6px; +} + +window.dialog.message box.dialog-vbox.vertical > box > box > box > label.title { + font-weight: 800; + font-size: 15pt; +} + +window.dialog.message .titlebar { + min-height: 24px; + border-style: none; + box-shadow: inset 0 1px rgba(239, 241, 245, 0.1); + background-color: #292c3c; + color: #eff1f5; +} + +window.dialog.message .titlebar:backdrop { + background-color: #292c3c; + color: rgba(239, 241, 245, 0.7); +} + +window.dialog.message .dialog-action-area { + border: none; + margin: 0; + padding: 6px; + border-spacing: 6px; +} + +window.dialog.message .dialog-action-area > button { + border: none; +} + +window.dialog.message .dialog-action-area > button.suggested-action:not(:disabled) { + color: #1e66f5; +} + +window.dialog.message .dialog-action-area > button.destructive-action:not(:disabled) { + color: #d20f39; +} + +window.aboutdialog.background.csd scrolledwindow.frame, +window.aboutdialog.background.csd scrolledwindow.frame > viewport.view, +window.aboutdialog.background.csd scrolledwindow.frame > textview.view, +window.aboutdialog.background.csd scrolledwindow.frame > textview.view > text { + border-radius: 12px; +} + +/******************** + * AdwMessageDialog * + ********************/ +window.messagedialog { + background-color: #292c3c; + color: #eff1f5; + padding: 6px; +} + +window.messagedialog .message-area { + padding: 24px 30px; + border-spacing: 10px; +} + +window.messagedialog .response-area { + border-spacing: 6px; +} + +window.messagedialog .response-area button.suggested { + color: #89b4fa; +} + +window.messagedialog .response-area button.destructive { + color: #d20f39; +} + +window.messagedialog .response-area separator { + background: none; + margin: 3px; +} + +/*********** + * Sidebar * + ***********/ +.sidebar { + border: none; +} + +.sidebar listview.view, +.sidebar list { + background-color: transparent; + color: inherit; +} + +leaflet.unfolded > box > stacksidebar.sidebar { + border: none; +} + +stacksidebar list { + padding: 6px; + background-color: transparent; +} + +stacksidebar row { + min-height: 24px; + padding: 6px; + border-radius: 6px; +} + +stacksidebar row:selected { + font-weight: 500; + background-color: rgba(239, 241, 245, 0.04); +} + +stacksidebar row + row { + margin-top: 3px; +} + +stacksidebar row > label { + padding-left: 6px; + padding-right: 6px; + color: inherit; +} + +separator.sidebar { + background-color: rgba(239, 241, 245, 0.12); + border-right: none; +} + +separator.sidebar.selection-mode, .selection-mode separator.sidebar { + background-color: rgba(239, 241, 245, 0.12); +} + +/********************** + * Navigation Sidebar * + **********************/ +.navigation-sidebar { + /* padding: $space-size - 4 $space-size - 2; //only vertical padding. horizontal row size would clip */ + padding: 0 6px; + border-right: none; +} + +.navigation-sidebar, .navigation-sidebar.view, .navigation-sidebar.background { + background-color: transparent; + color: inherit; +} + +.navigation-sidebar > separator { + background-color: rgba(239, 241, 245, 0.12); + margin: 10px 15px; +} + +.navigation-sidebar row.activatable label.dim-label { + color: rgba(239, 241, 245, 0.32); +} + +.navigation-sidebar > row { + min-height: 24px; + /* padding: 0 $space-size 0 $space-size; */ + padding: 0 6px; + margin: 0; + border-radius: 9px; +} + +.navigation-sidebar > row:hover, .navigation-sidebar > row:focus-visible:focus-within { + background-color: alpha(currentColor, 0.08); +} + +.navigation-sidebar > row:active { + background-color: alpha(currentColor, 0.12); +} + +.navigation-sidebar > row:selected { + background-color: alpha(currentColor, 0.08); + box-shadow: none; +} + +.navigation-sidebar > row:selected label, +.navigation-sidebar > row:selected image { + color: #89b4fa; + font-weight: 700; +} + +.navigation-sidebar > row:selected:hover { + background-color: alpha(currentColor, 0.08); +} + +.navigation-sidebar > row:selected:focus-visible:focus-within { + outline: none; + background-color: alpha(currentColor, 0.08); +} + +.navigation-sidebar > row:selected:focus-visible:focus-within:hover { + background-color: alpha(currentColor, 0.16); +} + +.navigation-sidebar > row:disabled { + color: rgba(239, 241, 245, 0.5); +} + +.navigation-sidebar > row:not(:first-child) { + margin-top: 3px; +} + +/**************** + * File chooser * + ****************/ +filechooser paned > separator { + background: rgba(239, 241, 245, 0.12); +} + +filechooser paned > box #pathbarbox.view, +filechooser paned > box stack.view, +filechooser paned > box columnview.view, +filechooser paned > box gridview.view { + background-color: transparent; +} + +filechooser .dialog-action-box { + border: none; +} + +filechooser #pathbarbox { + border: none; + background-color: transparent; +} + +filechooser stack.view frame > border { + border: none; +} + +filechooserbutton > button > box { + border-spacing: 6px; +} + +filechooserbutton:drop(active) { + box-shadow: none; + border-color: transparent; +} + +filechooser child.activatable filelistcell.dim-label { + color: rgba(239, 241, 245, 0.7); +} + +placessidebar { + background-color: transparent; +} + +placessidebar > viewport.frame { + border-style: none; +} + +placessidebar list.navigation-sidebar > row image.sidebar-icon { + color: inherit; +} + +placessidebar list.navigation-sidebar > row image.sidebar-icon:dir(ltr) { + padding-right: 8px; +} + +placessidebar list.navigation-sidebar > row image.sidebar-icon:dir(rtl) { + padding-left: 8px; +} + +placessidebar list.navigation-sidebar > row label.sidebar-label { + color: inherit; +} + +placessidebar list.navigation-sidebar > row label.sidebar-label:dir(ltr) { + padding-right: 2px; +} + +placessidebar list.navigation-sidebar > row label.sidebar-label:dir(rtl) { + padding-left: 2px; +} + +placessidebar list.navigation-sidebar > row.sidebar-placeholder-row { + background-color: alpha(currentColor, 0.08); +} + +placessidebar list.navigation-sidebar > row.sidebar-new-bookmark-row { + color: #89b4fa; +} + +placessidebar list.navigation-sidebar > row.sidebar-new-bookmark-row image.sidebar-icon { + color: #89b4fa; +} + +placessidebar list.navigation-sidebar > row:drop(active) { + background-color: alpha(currentColor, 0.08); +} + +placesview .server-list-button > image { + transition: 200ms cubic-bezier(0, 0, 0.2, 1); + -gtk-icon-transform: rotate(0turn); +} + +placesview .server-list-button:checked > image { + transition: 200ms cubic-bezier(0, 0, 0.2, 1); + -gtk-icon-transform: rotate(-0.5turn); +} + +placesview > actionbar > revealer > box > label { + border-spacing: 6px; +} + +/********* + * Paned * + *********/ +paned > separator { + min-width: 1px; + min-height: 1px; + -gtk-icon-source: none; + border-style: none; + background-color: transparent; + background-image: image(#4a4b5a); + background-size: 1px 1px; + background-clip: content-box; + box-shadow: none; +} + +paned > separator.wide { + min-width: 6px; + min-height: 6px; + background-color: #1e1e2e; + background-image: image(#4a4b5a), image(#4a4b5a); + background-size: 1px 1px, 1px 1px; +} + +paned.horizontal > separator { + background-repeat: repeat-y; +} + +paned.horizontal > separator:dir(ltr) { + margin: 0 -8px 0 0; + padding: 0 8px 0 0; + background-position: left; +} + +paned.horizontal > separator:dir(rtl) { + margin: 0 0 0 -8px; + padding: 0 0 0 8px; + background-position: right; +} + +paned.horizontal > separator.wide { + margin: 0; + padding: 0; + background-repeat: repeat-y, repeat-y; + background-position: left, right; +} + +paned.vertical > separator { + margin: 0 0 -8px 0; + padding: 0 0 8px 0; + background-repeat: repeat-x; + background-position: top; +} + +paned.vertical > separator.wide { + margin: 0; + padding: 0; + background-repeat: repeat-x, repeat-x; + background-position: bottom, top; +} + +/************ + * GtkVideo * + ************/ +video { + background: black; + border-radius: 12px; +} + +video image.osd { + min-width: 64px; + min-height: 64px; + border-radius: 9999px; + border: none; +} + +/************** + * GtkInfoBar * + **************/ +infobar > revealer > box { + padding: 6px; + border-spacing: 12px; + border-bottom: 1px solid rgba(239, 241, 245, 0.12); + box-shadow: none; +} + +infobar.info > revealer > box, infobar.info:hover > revealer > box, infobar.info:backdrop > revealer > box { + background-color: #313244; + color: #eff1f5; +} + +infobar.info > revealer > box button.text-button:not(:disabled):not(.suggested-action):not( +.destructive-action +), infobar.info:hover > revealer > box button.text-button:not(:disabled):not(.suggested-action):not( +.destructive-action +), infobar.info:backdrop > revealer > box button.text-button:not(:disabled):not(.suggested-action):not( +.destructive-action +) { + color: #89b4fa; +} + +infobar.action > revealer > box, infobar.action:backdrop > revealer > box, infobar.question > revealer > box, infobar.question:backdrop > revealer > box { + background-color: transparent; + color: #eff1f5; + border-radius: 9px; + border: none; +} + +infobar.action > revealer > box button, infobar.action > revealer > box button:hover, infobar.action > revealer > box button:focus, infobar.action > revealer > box button:active, infobar.action > revealer > box button:checked, infobar.action > revealer > box button.text-button:not(:disabled), infobar.action:backdrop > revealer > box button, infobar.action:backdrop > revealer > box button:hover, infobar.action:backdrop > revealer > box button:focus, infobar.action:backdrop > revealer > box button:active, infobar.action:backdrop > revealer > box button:checked, infobar.action:backdrop > revealer > box button.text-button:not(:disabled), infobar.question > revealer > box button, infobar.question > revealer > box button:hover, infobar.question > revealer > box button:focus, infobar.question > revealer > box button:active, infobar.question > revealer > box button:checked, infobar.question > revealer > box button.text-button:not(:disabled), infobar.question:backdrop > revealer > box button, infobar.question:backdrop > revealer > box button:hover, infobar.question:backdrop > revealer > box button:focus, infobar.question:backdrop > revealer > box button:active, infobar.question:backdrop > revealer > box button:checked, infobar.question:backdrop > revealer > box button.text-button:not(:disabled) { + color: #eff1f5; +} + +infobar.action > revealer > box *:link, infobar.action:backdrop > revealer > box *:link, infobar.question > revealer > box *:link, infobar.question:backdrop > revealer > box *:link { + color: #eff1f5; +} + +infobar.action:hover > revealer > box, infobar.question:hover > revealer > box { + background-color: rgba(239, 241, 245, 0.04); +} + +infobar.warning > revealer > box, infobar.warning:backdrop > revealer > box { + background-color: #df8e1d; + color: #eff1f5; +} + +infobar.warning > revealer > box button, infobar.warning > revealer > box button:hover, infobar.warning > revealer > box button:focus, infobar.warning > revealer > box button:active, infobar.warning > revealer > box button:checked, infobar.warning > revealer > box button.text-button:not(:disabled), infobar.warning:backdrop > revealer > box button, infobar.warning:backdrop > revealer > box button:hover, infobar.warning:backdrop > revealer > box button:focus, infobar.warning:backdrop > revealer > box button:active, infobar.warning:backdrop > revealer > box button:checked, infobar.warning:backdrop > revealer > box button.text-button:not(:disabled) { + color: #eff1f5; +} + +infobar.warning > revealer > box *:link, infobar.warning:backdrop > revealer > box *:link { + color: #eff1f5; +} + +infobar.warning:hover > revealer > box { + background-color: #c8801a; +} + +infobar.error > revealer > box, infobar.error:backdrop > revealer > box { + background-color: #d20f39; + color: #eff1f5; +} + +infobar.error > revealer > box button, infobar.error > revealer > box button:hover, infobar.error > revealer > box button:focus, infobar.error > revealer > box button:active, infobar.error > revealer > box button:checked, infobar.error > revealer > box button.text-button:not(:disabled), infobar.error:backdrop > revealer > box button, infobar.error:backdrop > revealer > box button:hover, infobar.error:backdrop > revealer > box button:focus, infobar.error:backdrop > revealer > box button:active, infobar.error:backdrop > revealer > box button:checked, infobar.error:backdrop > revealer > box button.text-button:not(:disabled) { + color: #eff1f5; +} + +infobar.error > revealer > box *:link, infobar.error:backdrop > revealer > box *:link { + color: #eff1f5; +} + +infobar.error:hover > revealer > box { + background-color: #ba0d33; +} + +/************ + * Tooltips * + ************/ +tooltip { + padding: 6px 12px; + box-shadow: none; + border: none; +} + +tooltip.background { + background-color: rgba(24, 24, 37, 0.9); + color: #eff1f5; + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.05), 0 2px 3px -1px rgba(0, 0, 0, 0.06), 0 1px 4px 0 rgba(0, 0, 0, 0.05); + border-radius: 12px; + margin: 2px 6px 8px 6px; +} + +tooltip > box { + border-spacing: 6px; +} + +/***************** + * Color Chooser * + *****************/ +colorswatch.top { + border-top-left-radius: 12px; + border-top-right-radius: 12px; +} + +colorswatch.top overlay { + border-top-left-radius: 12px; + border-top-right-radius: 12px; +} + +colorswatch.bottom { + border-bottom-left-radius: 12px; + border-bottom-right-radius: 12px; +} + +colorswatch.bottom overlay { + border-bottom-left-radius: 12px; + border-bottom-right-radius: 12px; +} + +colorswatch.left, colorswatch:first-child:not(.top) { + border-top-left-radius: 12px; + border-bottom-left-radius: 12px; +} + +colorswatch.left overlay, colorswatch:first-child:not(.top) overlay { + border-top-left-radius: 12px; + border-bottom-left-radius: 12px; +} + +colorswatch.right, colorswatch:last-child:not(.bottom) { + border-top-right-radius: 12px; + border-bottom-right-radius: 12px; +} + +colorswatch.right overlay, colorswatch:last-child:not(.bottom) overlay { + border-top-right-radius: 12px; + border-bottom-right-radius: 12px; +} + +colorswatch.dark { + color: #eff1f5; +} + +colorswatch.light { + color: rgba(30, 30, 46, 0.87); +} + +colorchooser colorswatch:hover { + transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); + box-shadow: 0 0 0 2px #89b4fa; +} + +colorswatch#add-color-button { + border-radius: 12px 0 0 12px; + color: #eff1f5; +} + +colorswatch#add-color-button:only-child { + border-radius: 12px; +} + +colorswatch#add-color-button overlay { + background-color: rgba(239, 241, 245, 0.04); +} + +colorswatch#add-color-button overlay:hover { + background-color: rgba(239, 241, 245, 0.12); + box-shadow: none; +} + +colorswatch#add-color-button overlay:active { + background-color: rgba(239, 241, 245, 0.3); +} + +colorswatch:disabled { + opacity: 0.5; +} + +colorswatch:disabled overlay { + box-shadow: none; +} + +colorswatch#editor-color-sample { + border-radius: 12px; +} + +colorswatch#editor-color-sample overlay { + border-radius: 12px; +} + +colorswatch#editor-color-sample overlay:hover { + box-shadow: 0 2px 3px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -1px rgba(0, 0, 0, 0.17); +} + +colorchooser .popover.osd { + transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); + border-radius: 12px; + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.15), 0 4px 3px 0 rgba(0, 0, 0, 0.18), 0 1px 6px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(239, 241, 245, 0.1); + background-color: #292c3c; +} + +colorchooser .popover.osd:backdrop { + box-shadow: 0 3px 2px -3px rgba(0, 0, 0, 0.2), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(239, 241, 245, 0.1); +} + +/******** + * Misc * + ********/ +.content-view { + background-color: #1e1e2e; +} + +/********************** + * Window Decorations * + **********************/ +window { + border: none; +} + +window.csd { + border-radius: 12px; + outline: none; + margin: 0; + transition: none; + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 15px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12), 0 0 0 2px #89b4fa, 0 0 36px transparent; +} + +window.csd:backdrop { + transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.15), 0 4px 3px 0 rgba(0, 0, 0, 0.18), 0 1px 6px 0 rgba(0, 0, 0, 0.12), 0 0 0 2px #292c3c, 0 0 36px transparent; +} + +window.csd.maximized, window.csd.fullscreen, window.csd.tiled, window.csd.tiled-top, window.csd.tiled-right, window.csd.tiled-bottom, window.csd.tiled-left { + border-radius: 0; + transition: none; +} + +window.csd.maximized, window.csd.fullscreen { + box-shadow: none; + outline: none; +} + +window.solid-csd { + margin: 0; + padding: 2px; + border-radius: 0; + background-color: #1e1e2e; + border: 1px solid #4a4b5a; +} + +window.solid-csd:backdrop { + background-color: #1e1e2e; +} + +window.ssd { + box-shadow: inset 0 1px rgba(239, 241, 245, 0.1); +} + +windowcontrols > button:not(.suggested-action):not(.destructive-action) { + min-height: 22px; + min-width: 22px; + padding: 6px 0; + margin-left: 0px; + margin-right: 0px; +} + +windowcontrols > button.minimize:not(.suggested-action):not(.destructive-action), windowcontrols > button.maximize:not(.suggested-action):not(.destructive-action), windowcontrols > button.close:not(.suggested-action):not(.destructive-action) { + color: rgba(239, 241, 245, 0.7); +} + +windowcontrols > button.minimize:not(.suggested-action):not(.destructive-action), windowcontrols > button.maximize:not(.suggested-action):not(.destructive-action), windowcontrols > button.close:not(.suggested-action):not(.destructive-action) { + background: none; + box-shadow: none; +} + +windowcontrols > button.minimize:not(.suggested-action):not(.destructive-action) > image, windowcontrols > button.maximize:not(.suggested-action):not(.destructive-action) > image, windowcontrols > button.close:not(.suggested-action):not(.destructive-action) > image { + background-color: alpha(currentColor, 0.1); +} + +windowcontrols > button.minimize:hover:not(.suggested-action):not(.destructive-action), windowcontrols > button.maximize:hover:not(.suggested-action):not(.destructive-action), windowcontrols > button.close:hover:not(.suggested-action):not(.destructive-action) { + color: #eff1f5; +} + +windowcontrols > button.minimize:hover:not(.suggested-action):not(.destructive-action) > image, windowcontrols > button.maximize:hover:not(.suggested-action):not(.destructive-action) > image, windowcontrols > button.close:hover:not(.suggested-action):not(.destructive-action) > image { + background-color: alpha(currentColor, 0.15); +} + +windowcontrols > button.minimize:active:not(.suggested-action):not(.destructive-action), windowcontrols > button.maximize:active:not(.suggested-action):not(.destructive-action), windowcontrols > button.close:active:not(.suggested-action):not(.destructive-action) { + color: #eff1f5; +} + +windowcontrols > button.minimize:active:not(.suggested-action):not(.destructive-action) > image, windowcontrols > button.maximize:active:not(.suggested-action):not(.destructive-action) > image, windowcontrols > button.close:active:not(.suggested-action):not(.destructive-action) > image { + background-color: alpha(currentColor, 0.2); +} + +windowcontrols > button.minimize:backdrop:not(.suggested-action):not(.destructive-action), windowcontrols > button.maximize:backdrop:not(.suggested-action):not(.destructive-action), windowcontrols > button.close:backdrop:not(.suggested-action):not(.destructive-action) { + opacity: 0.65; +} + +windowcontrols { + border-spacing: 6px; +} + +windowcontrols:not(.empty).start:dir(ltr), windowcontrols:not(.empty).end:dir(rtl) { + margin-right: 6px; + margin-left: 6px; +} + +windowcontrols:not(.empty).start:dir(rtl), windowcontrols:not(.empty).end:dir(ltr) { + margin-left: 6px; + margin-right: 6px; +} + +windowcontrols > button:not(.suggested-action):not(.destructive-action) > image { + border-radius: 100%; + padding: 0; +} + + +.view:selected, iconview:selected, gridview > child:selected, columnview.view:selected, +treeview.view:selected, calendar:selected, calendar > grid > label.day-number:selected { + background-color: alpha(currentColor, 0.06); +} + +flowbox > flowboxchild:selected, .link selection, calendar > grid > label.today { + color: #89b4fa; + background-color: rgba(137, 180, 250, 0.2); +} + +textview text selection:focus, textview text selection, label > selection, +entry > text > selection, spinbutton > text > selection, +entry headerbar popover.background entry > text > selection, +headerbar popover.background entry entry > text > selection, calendar > grid > label.today:selected { + color: rgba(30, 30, 46, 0.87); + background-color: #89b4fa; +} + +.monospace { + font-family: monospace; +} + +/********************** + * Touch Copy & Paste * + **********************/ +cursor-handle { + color: #89b4fa; + -gtk-icon-source: -gtk-recolor(url("assets/cursor-handle-symbolic.svg")); +} + +cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) { + padding-top: 6px; +} + +shortcuts-section { + margin: 20px; +} + +.shortcuts-search-results { + margin: 20px; + border-spacing: 24px; +} + +shortcut { + border-spacing: 6px; +} + +shortcut > .keycap { + min-width: 12px; + min-height: 26px; + margin-top: 2px; + padding-bottom: 2px; + padding-left: 8px; + padding-right: 8px; + border: solid 1px rgba(239, 241, 245, 0.12); + border-radius: 13px; + box-shadow: inset 0 -2px rgba(239, 241, 245, 0.12); + background-color: #292c3c; + color: #eff1f5; + font-size: smaller; +} + +:not(decoration):not(window):drop(active) { + caret-color: #89b4fa; +} + +stackswitcher { + min-height: 0; + padding: 0; + border-radius: 15px; + background-color: rgba(239, 241, 245, 0.04); + border: none; +} + +stackswitcher.linked > button:not(.suggested-action):not(.destructive-action) { + margin: 0; + border-radius: 9999px; +} + +stackswitcher.linked > button:not(.suggested-action):not(.destructive-action).text-button { + min-width: 100px; +} + +stackswitcher.linked > button:not(.suggested-action):not(.destructive-action):not(:hover):not(:active):not(:checked) { + background-color: transparent; +} + +stackswitcher.linked > button:not(.suggested-action):not(.destructive-action):focus:not(:hover):not(:checked) { + box-shadow: none; +} + +stackswitcher.linked > button:not(.suggested-action):not(.destructive-action):checked { + background-color: #e6e9ef; + color: rgba(30, 30, 46, 0.87); +} + +stackswitcher.linked > button:not(.suggested-action):not(.destructive-action):checked:hover { + box-shadow: none; + background-color: white; +} + +stackswitcher button.text-button { + min-width: 100px; +} + +stackswitcher button.circular, +stackswitcher button.text-button.circular { + min-width: 34px; + min-height: 34px; + padding: 0; +} + +/************* + * App Icons * + *************/ +.lowres-icon { + -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); +} + +.icon-dropshadow { + -gtk-icon-shadow: 0 1px 12px rgba(0, 0, 0, 0.05), 0 1px 6px rgba(0, 0, 0, 0.1); +} + +/********* + * Emoji * + *********/ +popover.emoji-picker { + padding: 0; +} + +popover.emoji-picker > contents { + padding: 0; +} + +.emoji-searchbar { + padding: 6px; + border-spacing: 6px; + background: none; +} + +.emoji-searchbar entry text { + background: none; + box-shadow: none; +} + +.emoji-toolbar { + padding: 3px; + border-spacing: 0; + background: none; +} + +.emoji-toolbar > flowboxchild { + padding: 3px; +} + +.emoji-toolbar > flowboxchild > button { + padding: 6px; +} + +button.emoji-section { + margin: 0; + padding: 6px; + border-radius: 12px; +} + +button.emoji-section:checked { + color: #89b4fa; +} + +popover.emoji-picker emoji { + font-size: x-large; + padding: 6px; + transition: all 75ms cubic-bezier(0, 0, 0.2, 1); + border-radius: 9px; +} + +popover.emoji-picker emoji:focus, popover.emoji-picker emoji:hover { + background: alpha(currentColor, 0.08); +} + +emoji-completion-row { + min-height: 28px; + padding: 0 12px; +} + +emoji-completion-row > box { + border-spacing: 6px; + padding: 2px 6px; +} + +emoji-completion-row:focus, emoji-completion-row:hover, +emoji-completion-row emoji:hover, +emoji-completion-row emoji:focus { + background-color: alpha(currentColor, 0.08); + color: #eff1f5; +} + +popover.entry-completion > contents { + padding: 0; +} + +.nautilus-window.view { + background-color: #1e1e2e; +} + +.nautilus-window .sidebar-pane { + background-color: #1e1e2e; + color: #eff1f5; +} + +.nautilus-window .sidebar-pane:backdrop { + background-color: #1e1e2e; + transition: none; +} + +.nautilus-window placesview label { + color: rgba(239, 241, 245, 0.7); +} + +.nautilus-window flap > separator { + background-color: transparent; +} + +.nautilus-window .nautilus-grid-view, +.nautilus-window .nautilus-list-view { + /* @extend %content_style; */ +} + +.nautilus-window .nautilus-grid-view .view, +.nautilus-window .nautilus-list-view .view { + background-color: transparent; +} + +.nautilus-window .nautilus-grid-view row.activatable > cell, +.nautilus-window .nautilus-list-view row.activatable > cell { + padding: 0px; + margin: 0px; +} + +.nautilus-window .nautilus-grid-view gridview.view { + margin: 10px 5px; + padding: 10px 5px; +} + +.nautilus-window tabbar .box { + background-color: transparent; + box-shadow: none; + padding: 0; +} + +.nautilus-window tabbar .box:backdrop { + background-color: transparent; + box-shadow: none; +} + +.nautilus-window tabbox, .nautilus-window tabbox:backdrop { + transition: none; + background-color: transparent; +} + +.nautilus-window tabbox > tabboxchild > tab { + color: rgba(239, 241, 245, 0.7); +} + +.nautilus-window tabbox > tabboxchild > tab:hover { + background-color: rgba(239, 241, 245, 0.04); + color: #eff1f5; +} + +.nautilus-window tabbox > tabboxchild > tab:disabled { + color: rgba(239, 241, 245, 0.32); +} + +.nautilus-window tabbox > tabboxchild > tab:checked, .nautilus-window tabbox > tabboxchild > tab:selected { + background-color: rgba(239, 241, 245, 0.04); + color: #89b4fa; + box-shadow: none; +} + +.nautilus-window tabbox > tabboxchild > tab:checked:disabled, .nautilus-window tabbox > tabboxchild > tab:selected:disabled { + color: rgba(239, 241, 245, 0.5); +} + +.nautilus-window tabbox > tabboxchild > tab button.tab-close-button { + color: #eff1f5; +} + +.nautilus-window tabbox > tabboxchild > tab button.tab-close-button:hover, .nautilus-window tabbox > tabboxchild > tab button.tab-close-button:active { + color: #eff1f5; +} + +.nautilus-window tabbox > tabboxchild > tab button.tab-close-button:disabled { + color: #eff1f5; +} + +.nautilus-window .floating-bar { + min-height: 32px; + padding: 0; + margin: 6px; + border-style: none; + border-radius: 9px; + background-color: rgba(49, 50, 68, 0.95); + color: #89b4fa; + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.05), 0 2px 3px -1px rgba(0, 0, 0, 0.06), 0 1px 4px 0 rgba(0, 0, 0, 0.05); +} + +.nautilus-window .floating-bar button { + margin: 4px; + color: rgba(30, 30, 46, 0.87); +} + +.nautilus-window banner > revealer > widget { + color: #eff1f5; + background-color: rgba(49, 50, 68, 0.5); + border-radius: 9px; + margin: 9px; +} + +.nautilus-window banner > revealer > widget:hover { + background-color: #313244; + border-radius: 9px; + margin: 9px; +} + +.nautilus-window banner > revealer > widget button { + color: #eff1f5; + background-color: rgba(137, 180, 250, 0.3); +} + +.nautilus-window banner > revealer > widget button:hover { + background-color: rgba(137, 180, 250, 0.6); +} + +#NautilusQueryEditor > menubutton > button.image-button { + min-width: 24px; + min-height: 24px; + padding: 3px; + margin-right: -5px; +} + +#NautilusQueryEditor > menubutton > button.image-button:checked image { + color: rgba(30, 30, 46, 0.87); +} + +#NautilusQueryEditor > text, +#NautilusQueryEditor > box, +#NautilusQueryEditor > menubutton { + margin: 3px 0; +} + +#NautilusQueryEditorTag { + background-color: rgba(239, 241, 245, 0.12); +} + +#NautilusQueryEditorTag > button.image-button { + margin: 0; + padding: 0; +} + +#NautilusPathBar { + background-color: rgba(239, 241, 245, 0.04); + border-radius: 12px; + margin: 6px 0; +} + +#NautilusPathButton { + margin: 0 3px; + border-radius: 12px; +} + +#NautilusPathButton.current-dir { + color: #89b4fa; +} + +#NautilusPathButton.current-dir:hover, #NautilusPathButton.current-dir:active { + background: none; + box-shadow: none; +} + +#NautilusPathButton:first-child { + margin-left: 0; +} + +#NautilusViewCell clamp box { + margin: 0; + border-spacing: 0; +} + +#NautilusFileChooser gridview.view { + background-color: transparent; + margin: 10px 5px; + padding: 10px 5px; +} + +#NautilusFileChooser columnview.view, +row.activatable > cell { + background-color: transparent; + padding: 1px 10px; +} + +#NautilusProgressIndicator popover label { + color: rgba(239, 241, 245, 0.7); +} + +#NautilusProgressIndicator popover image { + color: rgba(239, 241, 245, 0.7); +} + +/* Nautilus Progress Indicator */ +windowhandle box.vertical box.toolbar { + background-color: #1e1e2e; + border: none; + outline: none; +} + +windowhandle box.toolbar menubutton button.toggle { + background-color: #1e1e2e; + border: none; + outline: none; +} + +window.dialog > box > stack > box > box > notebook.frame { + border-width: 0 0 0 1px; + border-radius: 0; +} + +.display-container.card { + background-color: #313244; +} + +.small .display-container.card { + border-radius: 0; + box-shadow: none; + border-width: 0 0 1px 0; +} + +.display-container .history-view { + background-color: transparent; +} + +.display-container #displayitem { + padding: 0 12px 8px 0; + font-size: 1.4em; + border-top: 1px solid rgba(239, 241, 245, 0.12); +} + +.math-buttons button { + font-size: 1.1em; + padding: 2px 6px; +} + +.math-buttons button.text-button { + padding-left: 16px; + padding-right: 16px; +} + +leaflet button.number-button { + background-color: rgba(239, 241, 245, 0.1); +} + +leaflet button.number-button:hover { + background-color: rgba(239, 241, 245, 0.2); +} + +leaflet button.number-button:active { + background-color: rgba(239, 241, 245, 0.3); +} + +label.primary-label, label.month-name, label.secondary-label { + font-size: 16pt; + font-weight: bold; + padding: 12px; +} + +label.primary-label, label.month-name { + color: #89b4fa; +} + +label.secondary-label { + color: rgba(239, 241, 245, 0.5); +} + +toastoverlay datechooser.view, +toastoverlay agenda-view.view, +toastoverlay agenda-view.view list, +toastoverlay stack.view { + background-color: transparent; +} + +calendar-view { + font-size: 10pt; +} + +calendar-view:selected { + color: #89b4fa; + font-weight: bold; +} + +calendar-view.header, +label.header { + font-size: 10pt; + font-weight: bold; + color: rgba(239, 241, 245, 0.5); +} + +calendar-view.current, +weekgrid.current { + background-color: alpha(#89b4fa, 0.3); +} + +popover.events { + background-color: #292c3c; + padding: 0; +} + +popover.events box { + border-top-left-radius: 12px; + border-top-right-radius: 12px; +} + +popover.events list { + background-color: #313244; + border-radius: 12px; +} + +popover.events scrolledwindow { + border-width: 0; +} + +popover.events button { + border-radius: 12px; + border-top-left-radius: 0; + border-top-right-radius: 0; + border-style: solid none none; + box-shadow: none; +} + +event { + margin: 1px; + font-size: 0.9rem; +} + +event widget.content { + margin: 4px; +} + +event.timed, event:not(.slanted):not(.slanted-start):not(.slanted-end) { + border-radius: 12px; +} + +event.timed widget.edge { + border-radius: 6px; + min-width: 5px; +} + +event.slanted-start, event.slanted-end:dir(rtl) { + padding-left: 16px; + border-radius: 0 6px 6px 0; +} + +event.slanted-end, event.slanted-start:dir(rtl) { + padding-right: 16px; + border-radius: 6px 0 0 6px; +} + +event:not(.timed).color-dark { + color: white; + outline-color: rgba(0, 0, 0, 0.3); +} + +event.timed, event:not(.timed).color-light { + color: alpha(black, 0.75); + outline-color: rgba(255, 255, 255, 0.5); +} + +popover.event-popover, +popover.event-popover > contents { + padding: 0; +} + +.search-viewport { + background-color: #313244; +} + +.calendar-list { + background-color: transparent; +} + +.calendar-list > list { + border-radius: 4px; +} + +menubutton.flat.sources-button { + margin-top: 0; + margin-bottom: 0; + border-radius: 0; + border-top-style: none; + border-bottom-style: none; +} + +menubutton.flat.sources-button:hover:not(:backdrop) { + background-image: none; + text-shadow: none; +} + +menubutton.flat.sources-button > button { + border-radius: 0 0 12px 12px; +} + +.calendar-color-image { + -gtk-icon-filter: none; +} + +image.calendar-color-image, +button:active:not(:backdrop) .calendar-color-image, +button:checked:not(:backdrop) .calendar-color-image, +.calendars-list .calendar-color-image:not(:backdrop):not(:disabled), +.calendar-list .calendar-color-image:not(:backdrop):not(:disabled), +.sources-button:not(:backdrop):not(:disabled) .calendar-color-image { + -gtk-icon-shadow: 0 1px alpha(black, 0.1); +} + +datechooser { + padding: 6px; +} + +datechooser .current-week { + background-color: rgba(239, 241, 245, 0.04); + color: #eff1f5; + border-radius: 12px; +} + +datechooser navigator { + margin-right: 6px; + margin-left: 6px; + margin-bottom: 6px; +} + +datechooser navigator label { + font-weight: bold; +} + +datechooser navigator button.flat, +datechooser navigator button.image-button { + min-height: 34px; + min-width: 34px; + padding: 0; +} + +datechooser .weeknum, +datechooser .weekday { + color: rgba(239, 241, 245, 0.5); + font-size: smaller; +} + +datechooser button.day { + font-size: 10pt; + font-weight: normal; + margin: 3px; + padding: 0; + min-height: 34px; + min-width: 34px; + transition: none; +} + +datechooser button.day dot { + background-color: #eff1f5; + border-radius: 50%; + min-height: 3px; + min-width: 3px; +} + +datechooser button.day:selected, datechooser button.day.today:selected { + background-color: #89b4fa; + color: rgba(30, 30, 46, 0.87); + font-weight: bold; +} + +datechooser button.day:selected dot, datechooser button.day.today:selected dot { + background-color: rgba(30, 30, 46, 0.87); +} + +datechooser button.day.today { + color: #89b4fa; +} + +datechooser button.day.today dot { + background-color: #89b4fa; +} + +datechooser button.day.other-month:not(:hover), datechooser button.day.other-month:backdrop { + color: rgba(239, 241, 245, 0.32); +} + +datechooser button.day.other-month:not(:hover) dot, datechooser button.day.other-month:backdrop dot { + background-color: rgba(239, 241, 245, 0.32); +} + +datechooser button.day.other-month:hover:not(:backdrop) { + color: rgba(239, 241, 245, 0.5); +} + +datechooser button.day.other-month:hover:not(:backdrop) dot { + background-color: rgba(239, 241, 245, 0.5); +} + +.week-header { + padding: 0; +} + +.week-header > box:first-child { + border-bottom: 1px solid rgba(239, 241, 245, 0.12); +} + +.week-header .week-number { + font-size: 16pt; + font-weight: bold; + padding: 12px 12px 18px 12px; + color: rgba(239, 241, 245, 0.3); +} + +.week-header.week-temperature { + font-size: 10pt; + font-weight: bold; + color: rgba(239, 241, 245, 0.5); +} + +.week-header.lines { + color: rgba(239, 241, 245, 0.12); +} + +weekhourbar > label { + font-size: 10pt; + padding: 4px 6px; +} + +.week-view .lines { + color: rgba(239, 241, 245, 0.12); +} + +weekgrid > widget.now-strip { + background-color: alpha(#89b4fa, 0.8); + margin: 0 0 0 1px; + min-height: 3px; +} + +weekgrid:selected, weekgrid.dnd, +.week-header:selected, +.week-header.dnd { + background-color: alpha(#89b4fa, 0.25); +} + +monthcell { + border: solid 1px rgba(239, 241, 245, 0.12); + border-width: 1px 0 0 1px; + background-color: transparent; + transition: background-color 200ms; +} + +monthcell:hover:not(.out-of-month):not(.today) { + background-color: #313244; + transition: background-color 200ms; + color: #eff1f5; +} + +monthcell:selected { + background-color: alpha(#89b4fa, 0.1); +} + +monthcell:selected:hover { + background-color: alpha(#89b4fa, 0.2); +} + +monthcell:selected label.day-label { + font-weight: bold; +} + +monthcell:nth-child(7n + 1) { + border-left-width: 0; +} + +monthcell.today { + background-color: alpha(#89b4fa, 0.2); +} + +monthcell.today:hover { + background-color: alpha(#89b4fa, 0.3); + color: #89b4fa; +} + +monthcell.today:selected { + background-color: alpha(#89b4fa, 0.25); +} + +monthcell.today:selected:hover { + background-color: alpha(#89b4fa, 0.35); +} + +monthcell label { + color: #eff1f5; + font-size: 0.9rem; +} + +monthcell label.day-label { + font-size: 1rem; +} + +monthcell.out-of-month { + background-color: rgba(239, 241, 245, 0.04); +} + +monthcell.out-of-month label { + color: rgba(239, 241, 245, 0.7); +} + +monthcell button { + padding: 0 6px; + border-radius: 0; + border-bottom: none; + border-right: none; +} + +monthpopover > box { + margin: 0; + padding: 0; + background-color: transparent; +} + +.notes-section box > textview { + border-radius: 12px; + padding: 6px; +} + +.notes-section box > textview > text { + background: none; +} + +agenda-view list.background > row { + padding: 2px 12px; +} + +agenda-view list.background > label { + padding: 6px 12px; +} + +label.no-events { + font-style: italic; +} + +searchbutton > popover > arrow { + background: none; + border: none; +} + +menubutton stack > box { + border-spacing: 6px; +} + +#TweakPreferencesPage.tweak-group label.subtitle { + color: rgba(239, 241, 245, 0.32); +} + +#TweakPreferencesPage label.dim-label { + color: rgba(239, 241, 245, 0.32); +} + +.tweak-titlebar-left { + box-shadow: inset 0 1px rgba(239, 241, 245, 0.1); + border-top-left-radius: 12px; +} + +.tweak-titlebar-left > windowhandle > box { + padding: 0px; + margin: 0 5px 0 15px; +} + +.tweak-titlebar-left > windowhandle widget > box.start { + padding: 0px; + margin: 0 2px 0 0; +} + +.tweak-titlebar-left > windowhandle widget > box, +.tweak-titlebar-left windowtitle { + padding: 0px; + margin: 0 -3px 0 10px; +} + +.tweak-titlebar-left:backdrop { + box-shadow: inset 0 1px rgba(239, 241, 245, 0.1); + border-top-left-radius: 12px; +} + +.sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow .dim-label, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow row label.subtitle, row .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow label.subtitle, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow row.expander image.expander-row-arrow, row.expander .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow image.expander-row-arrow { + color: rgba(30, 30, 46, 0.38); +} + +.details-page { + margin: 24px 0px; +} + +.installed-overlay-box { + font-size: smaller; + background-color: #89b4fa; + border-radius: 0; + color: rgba(30, 30, 46, 0.87); + text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2); +} + +screenshot-carousel box.frame { + border-width: 1px 0; + border-radius: 0; +} + +screenshot-carousel button, +.featured-carousel button { + margin: 12px; +} + +carousel.card { + border: none; + background-color: rgba(239, 241, 245, 0.04); +} + +.smaller { + font-size: smaller; +} + +.screenshot-image-main .image1, +.screenshot-image-main .image2 { + margin-top: 6px; + margin-bottom: 12px; + margin-left: 6px; + margin-right: 6px; +} + +.app-tile-label { + font-size: 105%; +} + +gs-summary-tile image.loading-icon { + background-color: rgba(239, 241, 245, 0.12); + border-radius: 12px; +} + +.review-row > box { + margin: 12px; + border-spacing: 3px; +} + +.review-row textview { + background: none; +} + +.review-row .edit-icon { + min-width: 24px; + min-height: 24px; + padding: 6px; +} + +.review-textbox { + padding: 6px; +} + +.origin-rounded-box { + background-color: rgba(239, 241, 245, 0.12); + border-radius: 9999px; + padding: 4px; +} + +.origin-beta { + color: #df8e1d; +} + +.origin-button > button { + padding: 3px 9px; +} + +clamp.medium .category-tile:not(.category-tile-iconless) { + font-size: large; +} + +clamp.large .category-tile:not(.category-tile-iconless) { + font-size: larger; +} + +flowboxchild.card:not(.category-tile) { + padding: 0; + box-shadow: none; + border: none; + background-color: transparent; + background-image: none; +} + +.category-tile.card { + padding: 21px; + border: none; + border-radius: 12px; + min-width: 140px; + font-weight: 900; + font-size: larger; +} + +.category-tile.card:not(.category-tile-iconless), .category-tile.card:not(.category-tile-iconless):active { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1); + animation: none; +} + +.category-tile.card.category-tile-iconless { + padding: 9px 15px; + min-width: 130px; + font-size: 105%; + font-weight: normal; +} + +.category-tile.card.category-create { + background: linear-gradient(180deg, #ce8cd7 0%, #2861c6 100%); + color: white; +} + +.category-tile.card.category-create:hover { + background: linear-gradient(180deg, shade(#ce8cd7, 1.07) 0%, shade(#2861c6, 1.1) 100%); + color: white; +} + +.category-tile.card.category-create:active { + background: linear-gradient(180deg, shade(#ce8cd7, 0.95) 0%, shade(#2861c6, 0.95) 100%); + color: white; +} + +.category-tile.card.category-develop { + background-color: #5e5c64; + color: white; +} + +.category-tile.card.category-develop:hover { + background-color: shade(#5e5c64, 1.2); + color: white; +} + +.category-tile.card.category-develop:active { + background-color: shade(#5e5c64, 0.95); + color: white; +} + +.category-tile.card.category-learn { + background: linear-gradient(180deg, #2ec27e 30%, #27a66c 100%); + color: white; +} + +.category-tile.card.category-learn:hover { + background: linear-gradient(180deg, shade(#2ec27e, 1.06) 30%, shade(#27a66c, 1.06) 100%); + color: white; +} + +.category-tile.card.category-learn:active { + background: linear-gradient(180deg, shade(#2ec27e, 0.95) 30%, shade(#27a66c, 0.95) 100%); + color: white; +} + +.category-tile.card.category-play { + background: linear-gradient(75deg, #f9e2a7 0%, #eb5ec3 50%, #6d53e0 100%); + color: #393484; +} + +.category-tile.card.category-play:hover { + background: linear-gradient(75deg, shade(#f9e2a7, 1.07) 0%, shade(#eb5ec3, 1.07) 50%, shade(#6d53e0, 1.07) 100%); + color: #393484; +} + +.category-tile.card.category-play:active { + background: linear-gradient(75deg, shade(#f9e2a7, 0.97) 0%, shade(#eb5ec3, 0.95) 50%, shade(#6d53e0, 1.07) 100%); + color: #393484; +} + +.category-tile.card.category-socialize { + background: linear-gradient(90deg, #ef4e9b 0%, #f77466 100%); + color: rgba(239, 241, 245, 0.7); +} + +.category-tile.card.category-socialize:hover { + background: linear-gradient(90deg, shade(#ef4e9b, 1.08) 0%, shade(#f77466, 1.08) 100%); +} + +.category-tile.card.category-socialize:active { + background: linear-gradient(90deg, shade(#ef4e9b, 0.95) 0%, shade(#f77466, 0.95) 100%); +} + +.category-tile.card.category-work { + padding: 1px; + /* FIXME: work around https://gitlab.gnome.org/GNOME/gtk/-/issues/4324 */ + color: #1c71d8; + background-color: #fdf8d7; + background-image: linear-gradient(rgba(239, 241, 245, 0.12) 1px, transparent 1px), linear-gradient(90deg, rgba(239, 241, 245, 0.12) 1px, transparent 1px); + background-size: 10px 10px, 10px 10px; + background-position: -1px -4px, center -1px; + background-repeat: repeat; +} + +.category-tile.card.category-work:hover { + color: #1c71d8; + background-color: #fefcef; + background-image: linear-gradient(rgba(239, 241, 245, 0.12) 1px, transparent 1px), linear-gradient(90deg, rgba(239, 241, 245, 0.12) 1px, transparent 1px); +} + +.category-tile.card.category-work:active { + color: #1c71d8; + background-color: #fcf4bf; + background-image: linear-gradient(rgba(239, 241, 245, 0.12) 1px, transparent 1px), linear-gradient(90deg, rgba(239, 241, 245, 0.12) 1px, transparent 1px); + background-size: 10px 10px, 10px 10px; + background-position: -1px -4px, center -1px; + background-repeat: repeat; +} + +.featured-tile { + padding: 0; + box-shadow: none; + color: #eff1f5; +} + +.featured-tile label.title-1 { + margin-top: 6px; + margin-bottom: 6px; +} + +.featured-tile.narrow label.title-1 { + font-size: 16pt; +} + +.application-details-infobar, .application-details-infobar.info { + background-color: rgba(239, 241, 245, 0.04); + color: #eff1f5; + border: 1px solid rgba(239, 241, 245, 0.12); +} + +.application-details-infobar.warning { + background-color: #df8e1d; + color: #eff1f5; + border: 1px solid rgba(239, 241, 245, 0.12); +} + +.card.info { + background-color: #1f1f2f; + color: #eff1f5; +} + +.card.warning { + background-color: #1f1f2e; + color: #eff1f5; +} + +.infobox { + border-spacing: 6px; + padding: 12px; +} + +@keyframes install-progress-unknown-move { + 0% { + background-position: 0%; + } + 50% { + background-position: 100%; + } + 100% { + background-position: 0%; + } +} + +.application-details-description .button { + padding-left: 24px; + padding-right: 24px; +} + +.install-progress { + background-image: linear-gradient(to top, #89b4fa 2px, alpha(#89b4fa, 0) 2px); + background-repeat: no-repeat; + background-position: 0 bottom; + background-size: 0; + transition: none; +} + +.install-progress:dir(rtl) { + background-position: 100% bottom; +} + +.review-row > * { + margin: 12px; +} + +.review-row button { + font-size: smaller; +} + +.review-row .vote-buttons button { + margin-right: -1px; +} + +.review-row .vote-buttons button:not(:first-child) { + border-image: linear-gradient(to top, rgba(239, 241, 245, 0.12), rgba(239, 241, 245, 0.12)) 0 0 0 1/5px 0 5px 1px; +} + +.review-row .vote-buttons button:hover, +.review-row .vote-buttons button:active, +.review-row .vote-buttons button:hover + button, +.review-row .vote-buttons button:active + button { + border-image: none; +} + +review-bar { + color: rgba(239, 241, 245, 0.5); + background-image: none; + background-color: rgba(239, 241, 245, 0.3); +} + +.review-histogram star-image { + color: rgba(239, 241, 245, 0.5); +} + +.version-arrow-label { + font-size: x-small; +} + +.overview-more-button { + font-size: smaller; + padding: 0 16px; +} + +.app-row-origin-text { + font-size: smaller; +} + +.app-listbox-header { + padding: 6px; + border-bottom: 1px solid rgba(239, 241, 245, 0.12); +} + +.image-list { + background-color: transparent; +} + +box.star { + background-color: transparent; + background-image: none; +} + +button.star { + outline-offset: 0; + background-color: transparent; + background-image: none; + border-image: none; + border-radius: 0; + border-width: 0; + padding: 0; + box-shadow: none; + outline-offset: -1px; +} + +flowboxchild { + padding: 0px; +} + +star-image > image.starred { + color: #f9e2af; + transition-duration: 200ms; +} + +star-image > image.starred:hover { + color: #df8e1d; +} + +star-image > image.non-starred { + opacity: 0.2; + transition-duration: 200ms; +} + +star-image > image.non-starred:hover { + color: #f9e2af; + opacity: 0.7; +} + +.dimmer-label { + opacity: 0.25; +} + +.update-failed-details { + font-family: Monospace; + font-size: smaller; + padding: 16px; +} + +.upgrade-banner { + padding: 0px; + border-radius: 12px; + border: none; +} + +.upgrade-banner-background { + background: linear-gradient(to bottom, #40a02b, #1e66f5); + color: white; +} + +.upgrade-buttons #button_upgrades_install, +.upgrade-buttons #button_upgrades_install_cancel { + padding-left: 16px; + padding-right: 16px; +} + +scrolledwindow.list-page > viewport > clamp > box { + margin: 24px 12px; + border-spacing: 24px; +} + +.update-preferences preferencesgroup > box > box { + margin-top: 18px; +} + +.section > label:not(:first-child) { + margin-top: 6px; +} + +.section > box:not(:first-child) { + margin-top: 12px; +} + +clamp.status-page { + margin: 36px 12px; +} + +clamp.status-page .iconbox { + min-height: 128px; + min-width: 128px; +} + +clamp.status-page .icon { + color: rgba(239, 241, 245, 0.5); + min-height: 32px; + min-width: 32px; +} + +clamp.status-page .icon:not(:last-child) { + margin-bottom: 36px; +} + +clamp.status-page .title:not(:last-child) { + margin-bottom: 12px; +} + +app-context-bar .context-tile { + border: 1px solid rgba(239, 241, 245, 0.12); + background-color: transparent; + border-radius: 0; + padding: 24px 12px 21px 12px; + outline-offset: 5px; + transition-property: outline, outline-offset, background-image; + border-bottom: none; + border-right: none; +} + +app-context-bar .context-tile:hover { + background-image: none; + background-color: alpha(currentColor, 0.08); +} + +app-context-bar .context-tile.keyboard-activating, app-context-bar .context-tile:active { + background-color: alpha(currentColor, 0.12); +} + +app-context-bar .context-tile:focus:focus-visible { + outline-offset: -1px; +} + +app-context-bar.horizontal box:first-child .context-tile:first-child, app-context-bar.vertical .context-tile:first-child { + border-left: none; +} + +app-context-bar.horizontal .context-tile, app-context-bar.vertical box:first-child .context-tile { + border-top: none; +} + +app-context-bar > box:not(:first-child) > button.flat { + border-radius: 0; +} + +app-context-bar > box:not(:first-child) > button.flat:last-child { + border-radius: 0 12px 12px 0; +} + +app-context-bar > box:first-child > button.flat { + border-radius: 0; +} + +app-context-bar > box:first-child > button.flat:first-child { + border-radius: 12px 0 0 12px; +} + +app-context-bar > box > button.flat { + border-left-color: rgba(239, 241, 245, 0.12); +} + +.context-tile-lozenge { + min-height: 28px; + min-width: 28px; + padding: 6px; + font-size: 18px; + font-weight: bold; + border-radius: 9999px; +} + +.context-tile-lozenge.large { + font-size: 24px; + padding: 16px; + min-width: 24px; + /* 60px minus the left and right padding */ + min-height: 24px; + /* 60px minus the top and bottom padding */ +} + +.context-tile-lozenge.wide-image image { + margin-top: -28px; + margin-bottom: -28px; +} + +.context-tile-lozenge image { + -gtk-icon-style: symbolic; +} + +.context-tile-lozenge.grey { + color: #eff1f5; + background-color: rgba(239, 241, 245, 0.12); +} + +.context-tile-lozenge.green, .context-tile-lozenge.details-rating-0 { + color: #28641b; + background-color: rgba(64, 160, 43, 0.15); +} + +.context-tile-lozenge.blue, .context-tile-lozenge.details-rating-5 { + color: #1e66f5; + background-color: rgba(30, 102, 245, 0.15); +} + +.context-tile-lozenge.yellow, .context-tile-lozenge.details-rating-12 { + color: #9b6314; + background-color: rgba(223, 142, 29, 0.15); +} + +.context-tile-lozenge.details-rating-15 { + color: #fe640b; + background-color: rgba(254, 100, 11, 0.15); +} + +.context-tile-lozenge.red, .context-tile-lozenge.details-rating-18 { + color: #8b0a26; + background-color: rgba(210, 15, 57, 0.15); +} + +.eol-red { + font-weight: bold; + color: #d20f39; +} + +window.narrow .app-title { + font-size: 16pt; +} + +window.narrow .app-developer { + font-size: small; +} + +.install-progress-label { + font-size: smaller; + font-feature-settings: 'tnum'; +} + +scrolledwindow.fake-adw-status-page > viewport > box { + margin: 36px 12px; +} + +scrolledwindow.fake-adw-status-page +> viewport +> box +> clamp:not(:last-child) +> box { + margin-bottom: 36px; +} + +scrolledwindow.fake-adw-status-page +> viewport +> box +> clamp +> box +> .icon:not(:last-child) { + margin-bottom: 36px; +} + +scrolledwindow.fake-adw-status-page +> viewport +> box +> clamp +> box +> .title:not(:last-child) { + margin-bottom: 12px; +} + +statuspage.icon-dropshadow image.icon { + -gtk-icon-shadow: 0 1px 12px rgba(0, 0, 0, 0.05), 0 -1px rgba(0, 0, 0, 0.05), 1px 0 rgba(0, 0, 0, 0.1), 0 1px rgba(0, 0, 0, 0.3), -1px 0 rgba(0, 0, 0, 0.1); +} + +window.info scrollbar.vertical { + margin-top: 48px; + background: none; + box-shadow: none; +} + +window.info scrollbar.vertical trough { + margin-top: 0; +} + +row.app > box.header { + margin-left: 12px; + margin-right: 12px; +} + +row.app > box.header { + border-spacing: 12px; +} + +row.app > box.header > image { + margin-top: 12px; + margin-bottom: 12px; +} + +row.app label.warning { + color: #d20f39; +} + +@keyframes pre-delay { + from { + opacity: 0; + } + to { + opacity: 0; + } +} + +@keyframes fade-in { + from { + filter: opacity(0%); + } +} + +/* Give a fade-in animation to spinners. */ +spinner.fade-in:checked { + animation: pre-delay 0.5s linear 1, fade-in 1s linear 1, spin 1s linear infinite; + animation-delay: 0s, 0.5s, 0.5s; +} + +window > contents > leaflet > box > stack.background { + background-color: transparent; + background-image: linear-gradient(to bottom, transparent, transparent 46px, #1e1e2e 46px, #1e1e2e); +} + +@define-color weather_temp_chart_fill_color rgba(223, 142, 29, 0.5); +@define-color weather_temp_chart_stroke_color #b27117; +@define-color weather_thermometer_warm_color #df8e1d; +@define-color weather_thermometer_cold_color #1e66f5; +#places-label { + font-weight: bold; +} + +#temperature-label { + font-size: 32pt; + font-weight: 900; + margin-left: 9px; +} + +#conditions-grid *:backdrop { + color: rgba(239, 241, 245, 0.7); +} + +.content-view.cell { + font-weight: bold; +} + +#locationEntry { + margin: 6px; +} + +.weather-popover { + margin-top: 6px; +} + +.forecast-card { + transition: border-radius 100ms ease-out; + border-radius: 12px; +} + +.forecast-card separator { + background-color: #1e1e2e; +} + +#daily-forecast-box > separator:last-child { + background-color: transparent; + min-width: 0; +} + +#conditions-grid, +#attributionGrid { + margin-left: 18px; + margin-right: 18px; +} + +#weather-page .small .forecast-card { + margin-left: 0; + margin-right: 0; + border-radius: 0; + border-width: 1px 0; +} + +.forecast-temperature-label { + font-weight: bold; + color: #ae7b03; +} + +WeatherThermometer { + margin-bottom: 12px; +} + +WeatherThermometer > label.high { + font-weight: bold; + color: #df8e1d; +} + +WeatherThermometer > label.low { + font-weight: bold; + color: #1e66f5; +} + +.forecast-button { + margin: 0 12px; +} + +.forecast-graphic { + margin: 18px; +} + +button.osd.circular { + border-radius: 9999px; + min-width: 24px; + min-height: 24px; +} + +button.osd.circular > image { + padding: 0; +} + +scrolledwindow.inline list, +scrolledwindow.inline listview { + background: none; + color: inherit; +} + +scrolledwindow.inline undershoot.top { + box-shadow: inset 0 1px rgba(239, 241, 245, 0.12); +} + +.search-view { + background-color: #89b4fa; + color: rgba(30, 30, 46, 0.87); +} + +.search-view menubutton button:focus:focus-visible { + outline-color: rgba(255, 255, 255, 0.3); +} + +image.circular { + min-width: 34px; + min-height: 34px; + padding: 0; + border-radius: 9999px; +} + +#gnome-system-monitor.background.csd { + background-color: #1e1e2e; +} + +.large-button { + padding: 6px; +} + +.alarm-time { + font-size: 2.5em; + font-weight: 300; +} + +.clocks-ampm-toggle-button, +.clocks-secondary-standalone-label { + font-size: 18pt; +} + +.clocks-standalone-label, +.clocks-ringing-label { + font-size: 6em; + font-weight: 300; +} + +.clocks-ringing-title { + font-size: 1.5em; + font-weight: bold; +} + +.clocks-alarm-setup-time { + font-size: 32pt; +} + +.clocks-timer-label, +.clocks-spinbutton { + font-size: 48pt; +} + +.timer-panel .timer-header { + font-size: 20pt; + font-weight: 300; +} + +.timer-countdown { + font-size: 40pt; + font-weight: 300; +} + +/* Stopwatch Panel */ +.lap-time { + font-weight: bold; +} + +.stopped-stopwatch label, +.running-stopwatch label, +.paused-stopwatch label { + font-size: 70px; + font-weight: lighter; +} + +.stopped-stopwatch .seconds-label { + font-weight: 300; +} + +.running-stopwatch .seconds-label, +.running-stopwatch .miliseconds-label { + color: #89b4fa; +} + +.stopped-stopwatch .miliseconds-label, +.running-stopwatch .miliseconds-label, +.paused-stopwatch .miliseconds-label { + font-size: 50px; +} + +.running-stopwatch .seconds-label, +.paused-stopwatch .seconds-label { + font-weight: 300; +} + +.clock-location { + font-weight: bolder; +} + +.hidden { + opacity: 0; +} + +.clock-time { + font-size: 2em; + padding: 0.2em 0.5em; + border-radius: 1em; +} + +.none .clock-time { + background: alpha(currentColor, 0.2); +} + +.night .clock-time { + color: #89b4fa; + background-color: alpha(#1e66f5, 0.25); +} + +.naut .clock-time, +.astro .clock-time { + color: #fab387; + background-color: alpha(#fe640b, 0.25); +} + +.civil .clock-time, +.day .clock-time { + color: #f9e2af; + background: alpha(#df8e1d, 0.25); +} + +headerbar splitbutton notification button { + margin: 0; + min-height: 24px; + min-width: 24px; + padding: 0; +} + +popover.background.global-search > arrow, +popover.background.global-search > contents { + padding: 0; +} + +panelframeswitcher { + padding: 3px; +} + +.frameheader.header { + min-height: 24px; + background-color: #313244; +} + +.frameheader.header > button { + border: none; + margin: 0; + padding: 3px; +} + +.frameheader.header tabbar.inline > revealer > box { + min-height: 24px; +} + +.frameheader.header tabbar.inline > revealer > box .start-action { + padding: 0; + border: none; +} + +.frameheader.header tabbar.inline > revealer > box .end-action { + padding: 0; + border-left: 1px solid rgba(239, 241, 245, 0.12); +} + +.frameheader.header tabbar.inline > revealer > box tabbox { + border: none; + background: none; +} + +panelstatusbar > menubutton > button, +panelstatusbar > paneltogglebutton button { + border-radius: 0; +} + +.style-variant { + padding: 0 12px; +} + +.style-variant button.toggle { + padding: 0; +} + +.style-variant button.toggle, .style-variant button.toggle:hover, .style-variant button.toggle:focus, .style-variant button.toggle:active, .style-variant button.toggle:checked { + background: none; + outline: none; + border: none; + box-shadow: none; +} + +.style-variant button.toggle > stylevariantpreview > .wallpaper { + border-radius: 12px; + outline-color: transparent; + outline-width: 3px; + outline-offset: 3px; + outline-style: solid; + box-shadow: none; +} + +.style-variant button.toggle:hover > stylevariantpreview > .wallpaper { + outline-color: rgba(239, 241, 245, 0.04); +} + +.style-variant button.toggle:active > stylevariantpreview > .wallpaper { + outline-color: rgba(239, 241, 245, 0.3); +} + +.style-variant button.toggle:checked > stylevariantpreview > .wallpaper { + outline-color: #89b4fa; +} + +playlistview scrollbar.overlay-indicator.dragging, playlistview scrollbar.overlay-indicator.hovering { + background-color: transparent; +} + +playlistview queuerow picture.cover, +playlistview queuerow image.card { + border: none; +} + +window.dialog > .dialog-vbox > box > scrolledwindow > viewport > widget > list.boxed-list { + border: none; + border-radius: 0; +} + +window.dialog > .dialog-vbox > box > scrolledwindow > viewport > widget > list.boxed-list > row:first-child, window.dialog > .dialog-vbox > box > scrolledwindow > viewport > widget > list.boxed-list > row:last-child { + border-radius: 0; +} + +/* Tagger */ +list.music-list { + margin: -40px 0; + background-color: transparent; +} + +/* Nicotine+ */ +notebook scrolledwindow treeview.treeview-spacing { + background-color: #1e1e2e; +} + +.account-switcher-row label { + color: #eff1f5; +} + +.account-switcher-row label.dim-label { + color: rgba(239, 241, 245, 0.7); +} + +avatar { + border-radius: 9999px; + font-weight: bold; +} + +avatar.color1 { + background-image: linear-gradient(#83b6ec, #337fdc); + color: #cfe1f5; +} + +avatar.color2 { + background-image: linear-gradient(#7ad9f1, #0f9ac8); + color: #caeaf2; +} + +avatar.color3 { + background-image: linear-gradient(#8de6b1, #29ae74); + color: #cef8d8; +} + +avatar.color4 { + background-image: linear-gradient(#b5e98a, #6ab85b); + color: #e6f9d7; +} + +avatar.color5 { + background-image: linear-gradient(#f8e359, #d29d09); + color: #f9f4e1; +} + +avatar.color6 { + background-image: linear-gradient(#ffcb62, #d68400); + color: #ffead1; +} + +avatar.color7 { + background-image: linear-gradient(#ffa95a, #ed5b00); + color: #ffe5c5; +} + +avatar.color8 { + background-image: linear-gradient(#f78773, #e62d42); + color: #f8d2ce; +} + +avatar.color9 { + background-image: linear-gradient(#e973ab, #e33b6a); + color: #fac7de; +} + +avatar.color10 { + background-image: linear-gradient(#cb78d4, #9945b5); + color: #e7c2e8; +} + +avatar.color11 { + background-image: linear-gradient(#9e91e8, #7a59ca); + color: #d5d2f5; +} + +avatar.color12 { + background-image: linear-gradient(#e3cf9c, #b08952); + color: #f2eade; +} + +avatar.color13 { + background-image: linear-gradient(#be916d, #785336); + color: #e5d6ca; +} + +avatar.color14 { + background-image: linear-gradient(#c0bfbc, #6e6d71); + color: #d8d7d3; +} + +avatar.contrasted { + color: #eff1f5; +} + +avatar.image { + background: none; +} + +.card { + border-radius: 12px; + border: none; + background-clip: border-box; + color: rgba(239, 241, 245, 0.7); + box-shadow: none; + outline: none; + background-color: rgba(239, 241, 245, 0.04); + color: #eff1f5; +} + +.card.activatable { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1); + background-color: rgba(239, 241, 245, 0.08); + background-image: radial-gradient(circle, transparent 10%, transparent 0%); + background-repeat: no-repeat; + background-position: center; + background-size: 1000% 1000%; + outline: 0 solid transparent; + outline-offset: 2px; + color: #eff1f5; + background-color: rgba(239, 241, 245, 0.04); +} + +.card.activatable:hover { + background-color: alpha(currentColor, 0.08); + color: #eff1f5; + outline: 0 solid transparent; +} + +.card.activatable:active { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms, border 0ms; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + background-image: radial-gradient(circle, alpha(currentColor, 0.08) 10%, transparent 0%); + background-size: 0% 0%; + background-color: alpha(currentColor, 0.08); + color: #eff1f5; + outline: 0 solid transparent; +} + +toast { + margin: 12px; + margin-bottom: 24px; + border-radius: 9999px; + border-spacing: 6px; + padding: 6px; + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.1), 0 4px 6px 0 rgba(0, 0, 0, 0.12), 0 1px 10px 0 rgba(0, 0, 0, 0.1), inset 0 1px rgba(239, 241, 245, 0.1); + background-color: #292c3c; + color: #eff1f5; + border: none; +} + +toast:dir(ltr) { + padding-left: 12px; +} + +toast:dir(rtl) { + padding-right: 12px; +} + +toast > label { + margin: 0 6px; +} + +viewswitcher { + margin: 2px; + border-spacing: 3px; +} + +viewswitcher.wide button.toggle { + border-radius: 3px; +} + +viewswitcher.wide button.toggle:first-child { + border-top-left-radius: 17px; + border-bottom-left-radius: 17px; +} + +viewswitcher.wide button.toggle:last-child { + border-top-right-radius: 17px; + border-bottom-right-radius: 17px; +} + +viewswitcher.narrow button.toggle { + border-radius: 0 0 3px 3px; + margin: 0; +} + +viewswitcher.narrow button.toggle:first-child { + border-bottom-left-radius: 12px; +} + +viewswitcher.narrow button.toggle:last-child { + border-bottom-right-radius: 12px; +} + +viewswitcher button.toggle { + font-weight: bold; + padding: 0; +} + +viewswitcher button.toggle:focus:not(:hover):not(:active) { + box-shadow: none; + outline: none; +} + +viewswitcher button.toggle > stack > box.narrow { + font-size: 0.75rem; + padding-top: 8px; + padding-bottom: 4px; + border-spacing: 3px; +} + +viewswitcher button.toggle > stack > box.narrow > stack > label { + padding-left: 6px; + padding-right: 6px; +} + +viewswitcher button.toggle > stack > box.wide { + padding: 2px 12px; + border-spacing: 6px; +} + +viewswitcherbar actionbar > revealer > box { + padding: 0; +} + +viewswitcherbar actionbar > revealer > box viewswitcher.narrow button.toggle { + border-radius: 12px; + margin: 3px 0; +} + +viewswitcherbar actionbar > revealer > box viewswitcher.narrow button.toggle > stack > box.narrow { + padding-top: 5px; + padding-bottom: 1px; + border-spacing: 0; +} + +viewswitchertitle { + margin-top: 0; + margin-bottom: 0; +} + +viewswitchertitle viewswitcher { + margin-left: 12px; + margin-right: 12px; +} + +viewswitchertitle viewswitcher.narrow { + margin-top: 0; + margin-bottom: 0; +} + +viewswitchertitle viewswitcher.narrow button.toggle > stack > box.narrow { + padding-top: 0; + padding-bottom: 0; + border-spacing: 0; +} + +viewswitchertitle viewswitcher.wide { + margin-top: 0; + margin-bottom: 0; +} + +viewswitchertitle windowtitle { + margin-top: 0; + margin-bottom: 0; +} + +indicatorbin > indicator, +indicatorbin > mask { + min-width: 6px; + min-height: 6px; + border-radius: 9999px; +} + +indicatorbin > indicator { + margin: 1px; + background-color: alpha(currentColor, 0.4); +} + +indicatorbin > indicator > label { + font-size: 0.6rem; + font-weight: bold; + padding: 1px 4px; + color: #eff1f5; +} + +indicatorbin > mask { + padding: 1px; + background: black; +} + +indicatorbin.needs-attention > indicator { + background-color: #89b4fa; +} + +indicatorbin.needs-attention > indicator > label { + color: rgba(30, 30, 46, 0.87); +} + +preferencespage > scrolledwindow > viewport > clamp > box { + margin: 24px 12px; + border-spacing: 24px; +} + +preferencesgroup > box background-preview widget.sidebar, +preferencesgroup > box widget.header-bar:not(.editable-area) { + background-color: #11111b; +} + +preferencesgroup > box, +preferencesgroup > box .labels { + border-spacing: 6px; +} + +preferencesgroup > box > box.header:not(.single-line) { + margin-bottom: 6px; +} + +preferencesgroup > box > box.single-line { + min-height: 34px; +} + +preferencesgroup > box button.background-preview-button.toggle { + padding: 0; + background: none; + box-shadow: none; + outline-color: transparent; + outline-width: 3px; + outline-offset: 3px; + outline-style: solid; +} + +preferencesgroup > box button.background-preview-button.toggle, +preferencesgroup > box button.background-preview-button.toggle > background-preview { + border-radius: 12px; +} + +preferencesgroup > box button.background-preview-button.toggle:hover { + outline-color: rgba(239, 241, 245, 0.04); +} + +preferencesgroup > box button.background-preview-button.toggle:active { + outline-color: rgba(239, 241, 245, 0.3); +} + +preferencesgroup > box button.background-preview-button.toggle:checked { + outline-color: #89b4fa; +} + +preferencesgroup > box .cutout-button { + background-color: #313244; +} + +preferencesgroup > box button.accent-button { + min-height: 24px; + min-width: 24px; + padding: 3px; + border-radius: 9px; + background: var(--accent-bg-color); + outline: none; + background-clip: content-box; + box-shadow: none; +} + +preferencesgroup > box button.accent-button:hover { + box-shadow: 0 0 0 3px alpha(currentColor, 0.08); +} + +preferencesgroup > box button.accent-button:checked { + box-shadow: 0 0 0 3px #89b4fa; +} + +preferencesgroup > box button.accent-button.blue, preferencesgroup > box button.accent-button.teal, preferencesgroup > box button.accent-button.green, preferencesgroup > box button.accent-button.yellow, preferencesgroup > box button.accent-button.orange, preferencesgroup > box button.accent-button.red, preferencesgroup > box button.accent-button.pink, preferencesgroup > box button.accent-button.purple, preferencesgroup > box button.accent-button.slate { + --accent-color: oklab( + from var(--accent-bg-color) var(--standalone-color-oklab) + ); +} + +preferencesgroup > box button.accent-button.blue { + --accent-bg-color: var(--accent-blue); +} + +preferencesgroup > box button.accent-button.teal { + --accent-bg-color: var(--accent-teal); +} + +preferencesgroup > box button.accent-button.green { + --accent-bg-color: var(--accent-green); +} + +preferencesgroup > box button.accent-button.yellow { + --accent-bg-color: var(--accent-yellow); +} + +preferencesgroup > box button.accent-button.orange { + --accent-bg-color: var(--accent-orange); +} + +preferencesgroup > box button.accent-button.red { + --accent-bg-color: var(--accent-red); +} + +preferencesgroup > box button.accent-button.pink { + --accent-bg-color: var(--accent-pink); +} + +preferencesgroup > box button.accent-button.purple { + --accent-bg-color: var(--accent-purple); +} + +preferencesgroup > box button.accent-button.slate { + --accent-bg-color: var(--accent-slate); +} + +preferencesgroup > box box > list.boxed-list-separate { + background-color: transparent; + border-radius: 12px; +} + +preferencesgroup > box box > list.boxed-list-separate row { + color: #eff1f5; + background-color: rgba(239, 241, 245, 0.04); + border-radius: 12px 12px 0 0; + margin-top: 0px; + margin-bottom: 2px; +} + +preferencesgroup > box box > list.boxed-list-separate row:first-child { + border-radius: 12px 12px 0 0; +} + +preferencesgroup > box box > list.boxed-list-separate row:last-child { + border-radius: 0 0 12px 12px; + margin-bottom: 0; +} + +preferencesgroup > box box > list.boxed-list-separate row + row { + margin-top: 2px; +} + +preferencesgroup > box box > list.boxed-list-separate row:hover, preferencesgroup > box box > list.boxed-list-separate row:focus { + color: rgba(239, 241, 245, 0.7); + background-color: rgba(239, 241, 245, 0.04); +} + +window.about .main-page > viewport > clamp > box { + margin: 12px; + border-spacing: 6px; +} + +window.about .main-page > viewport > clamp > box > box { + margin-top: 18px; + border-spacing: 18px; + margin-bottom: 6px; +} + +window.about .main-page .app-version { + padding: 3px 18px; + color: #89b4fa; + border-radius: 12px; + margin-top: 3px; +} + +window.about .subpage > viewport > clamp > box { + margin: 18px 12px; + border-spacing: 18px; +} + +window.about .subpage > clamp > textview { + background: none; + color: inherit; +} + +statuspage > scrolledwindow > viewport > box { + margin: 36px 12px; + border-spacing: 36px; +} + +statuspage > scrolledwindow > viewport > box > clamp > box { + border-spacing: 12px; +} + +statuspage > scrolledwindow > viewport > box > clamp > box > .icon { + -gtk-icon-size: 128px; + color: alpha(currentColor, 0.55); +} + +statuspage > scrolledwindow > viewport > box > clamp > box > .icon:disabled { + opacity: 0.35; +} + +statuspage > scrolledwindow > viewport > box > clamp > box > .icon:not(:last-child) { + margin-bottom: 24px; +} + +statuspage.compact > scrolledwindow > viewport > box { + margin: 24px 12px; + border-spacing: 24px; +} + +statuspage.compact > scrolledwindow > viewport > box > clamp > box > .icon { + -gtk-icon-size: 96px; +} + +statuspage.compact > scrolledwindow > viewport > box > clamp > box > .icon:not(:last-child) { + margin-bottom: 12px; +} + +statuspage.compact > scrolledwindow > viewport > box > clamp > box > .title { + font-size: 18pt; +} + +flap > dimming, +leaflet > dimming, +navigation-view > dimming, +overlay-split-view > dimming { + background-color: rgba(30, 30, 46, 0.2); + background-image: none; +} + +flap > border, +leaflet > border, +navigation-view > border, +overlay-split-view > border { + background-color: transparent; + background-image: none; +} + +flap > shadow, +leaflet > shadow, +navigation-view > shadow, +overlay-split-view > shadow { + min-width: 56px; + min-height: 56px; +} + +flap > shadow.left, +leaflet > shadow.left, +navigation-view > shadow.left, +overlay-split-view > shadow.left { + background-image: linear-gradient(to right, alpha(rgba(30, 30, 46, 0.2), 0.7), alpha(rgba(30, 30, 46, 0.2), 0.14) 40px, alpha(rgba(30, 30, 46, 0.2), 0) 56px), linear-gradient(to right, alpha(rgba(30, 30, 46, 0.2), 0.4), alpha(rgba(30, 30, 46, 0.2), 0.14) 7px, alpha(rgba(30, 30, 46, 0.2), 0) 24px); +} + +flap > shadow.right, +leaflet > shadow.right, +navigation-view > shadow.right, +overlay-split-view > shadow.right { + background-image: linear-gradient(to left, alpha(rgba(30, 30, 46, 0.2), 0.7), alpha(rgba(30, 30, 46, 0.2), 0.14) 40px, alpha(rgba(30, 30, 46, 0.2), 0) 56px), linear-gradient(to left, alpha(rgba(30, 30, 46, 0.2), 0.4), alpha(rgba(30, 30, 46, 0.2), 0.14) 7px, alpha(rgba(30, 30, 46, 0.2), 0) 24px); +} + +flap > shadow.up, +leaflet > shadow.up, +navigation-view > shadow.up, +overlay-split-view > shadow.up { + background-image: linear-gradient(to bottom, alpha(rgba(30, 30, 46, 0.2), 0.7), alpha(rgba(30, 30, 46, 0.2), 0.14) 40px, alpha(rgba(30, 30, 46, 0.2), 0) 56px), linear-gradient(to bottom, alpha(rgba(30, 30, 46, 0.2), 0.4), alpha(rgba(30, 30, 46, 0.2), 0.14) 7px, alpha(rgba(30, 30, 46, 0.2), 0) 24px); +} + +flap > shadow.down, +leaflet > shadow.down, +navigation-view > shadow.down, +overlay-split-view > shadow.down { + background-image: linear-gradient(to top, alpha(rgba(30, 30, 46, 0.2), 0.7), alpha(rgba(30, 30, 46, 0.2), 0.14) 40px, alpha(rgba(30, 30, 46, 0.2), 0) 56px), linear-gradient(to top, alpha(rgba(30, 30, 46, 0.2), 0.4), alpha(rgba(30, 30, 46, 0.2), 0.14) 7px, alpha(rgba(30, 30, 46, 0.2), 0) 24px); +} + +.sidebar-pane .sidebar > scrolledwindow, +.sidebar-pane toolbarview > scrolledwindow, +.sidebar-pane navigation-view-page stack > scrolledwindow, .sidebar-pane, .toolbar, filechooser paned > box, placessidebar > scrolledwindow, agenda-view list.background, .tweak-titlebar-left, .tweak-titlebar-left:backdrop, leaflet.unfolded > box > scrolledwindow, leaflet.unfolded .contacts-contact-list > scrolledwindow, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow { + background-color: #181825; + color: #eff1f5; + border-radius: 0; + margin: 0; +} + +.sidebar-pane .sidebar > scrolledwindow .dim-label, +.sidebar-pane toolbarview > scrolledwindow .dim-label, +.sidebar-pane navigation-view-page stack > scrolledwindow .dim-label, .sidebar-pane .dim-label, .toolbar .dim-label, filechooser paned > box .dim-label, placessidebar > scrolledwindow .dim-label, agenda-view list.background .dim-label, .tweak-titlebar-left .dim-label, leaflet.unfolded > box > scrolledwindow .dim-label, leaflet.unfolded .contacts-contact-list > scrolledwindow .dim-label, .sidebar-pane row label.subtitle, row .sidebar-pane label.subtitle, .toolbar row label.subtitle, row .toolbar label.subtitle, filechooser paned > box row label.subtitle, row filechooser paned > box label.subtitle, placessidebar > scrolledwindow row label.subtitle, row placessidebar > scrolledwindow label.subtitle, agenda-view list.background row label.subtitle, row agenda-view list.background label.subtitle, .tweak-titlebar-left row label.subtitle, row .tweak-titlebar-left label.subtitle, leaflet.unfolded > box > scrolledwindow row label.subtitle, row leaflet.unfolded > box > scrolledwindow label.subtitle, leaflet.unfolded .contacts-contact-list > scrolledwindow row label.subtitle, row leaflet.unfolded .contacts-contact-list > scrolledwindow label.subtitle, .sidebar-pane row.expander image.expander-row-arrow, row.expander .sidebar-pane image.expander-row-arrow, .toolbar row.expander image.expander-row-arrow, row.expander .toolbar image.expander-row-arrow, filechooser paned > box row.expander image.expander-row-arrow, row.expander filechooser paned > box image.expander-row-arrow, placessidebar > scrolledwindow row.expander image.expander-row-arrow, row.expander placessidebar > scrolledwindow image.expander-row-arrow, agenda-view list.background row.expander image.expander-row-arrow, row.expander agenda-view list.background image.expander-row-arrow, .tweak-titlebar-left row.expander image.expander-row-arrow, row.expander .tweak-titlebar-left image.expander-row-arrow, leaflet.unfolded > box > scrolledwindow row.expander image.expander-row-arrow, row.expander leaflet.unfolded > box > scrolledwindow image.expander-row-arrow, leaflet.unfolded .contacts-contact-list > scrolledwindow row.expander image.expander-row-arrow, row.expander leaflet.unfolded .contacts-contact-list > scrolledwindow image.expander-row-arrow { + color: rgba(30, 30, 46, 0.38); +} + +.nautilus-window placessidebar > scrolledwindow { + background-color: #1e1e2e; + color: #eff1f5; + border-radius: 0; + margin: 0 6px 0 0; +} + +.nautilus-window placessidebar > scrolledwindow .dim-label, .nautilus-window placessidebar > scrolledwindow row label.subtitle, row .nautilus-window placessidebar > scrolledwindow label.subtitle, .nautilus-window placessidebar > scrolledwindow row.expander image.expander-row-arrow, row.expander .nautilus-window placessidebar > scrolledwindow image.expander-row-arrow { + color: rgba(30, 30, 46, 0.38); +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar > range > trough, +.sidebar-pane toolbarview > scrolledwindow > scrollbar > range > trough, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar > range > trough, placessidebar > scrolledwindow > scrollbar > range > trough, .nautilus-window placessidebar scrollbar > range > trough, leaflet.unfolded > box > scrolledwindow > scrollbar > range > trough, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar > range > trough, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > scrollbar > range > trough { + margin: 0 -8px 0 0; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar > range > trough > slider, +.sidebar-pane toolbarview > scrolledwindow > scrollbar > range > trough > slider, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar > range > trough > slider, placessidebar > scrolledwindow > scrollbar > range > trough > slider, .nautilus-window placessidebar scrollbar > range > trough > slider, leaflet.unfolded > box > scrolledwindow > scrollbar > range > trough > slider, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar > range > trough > slider, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > scrollbar > range > trough > slider { + background-color: #232634; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar > range > trough > slider:hover, +.sidebar-pane toolbarview > scrolledwindow > scrollbar > range > trough > slider:hover, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar > range > trough > slider:hover, placessidebar > scrolledwindow > scrollbar > range > trough > slider:hover, .nautilus-window placessidebar scrollbar > range > trough > slider:hover, leaflet.unfolded > box > scrolledwindow > scrollbar > range > trough > slider:hover, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar > range > trough > slider:hover { + background-color: #292c3c; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar > range > trough > slider:active, +.sidebar-pane toolbarview > scrolledwindow > scrollbar > range > trough > slider:active, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar > range > trough > slider:active, placessidebar > scrolledwindow > scrollbar > range > trough > slider:active, .nautilus-window placessidebar scrollbar > range > trough > slider:active, leaflet.unfolded > box > scrolledwindow > scrollbar > range > trough > slider:active, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar > range > trough > slider:active { + background-color: #292c3c; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar > range > trough > slider:disabled, +.sidebar-pane toolbarview > scrolledwindow > scrollbar > range > trough > slider:disabled, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar > range > trough > slider:disabled, placessidebar > scrolledwindow > scrollbar > range > trough > slider:disabled, .nautilus-window placessidebar scrollbar > range > trough > slider:disabled, leaflet.unfolded > box > scrolledwindow > scrollbar > range > trough > slider:disabled, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar > range > trough > slider:disabled { + background-color: #1e1e2e; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, +.sidebar-pane toolbarview > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, placessidebar > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, .nautilus-window placessidebar scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, leaflet.unfolded > box > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button { + background-color: rgba(30, 30, 46, 0.38); +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled, +.sidebar-pane toolbarview > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled, placessidebar > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled, .nautilus-window placessidebar scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled, leaflet.unfolded > box > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled { + background-color: rgba(30, 30, 46, 0.3); +} + +calendar-view { + margin: 6px; +} + +.nautilus-window .nautilus-grid-view, +.nautilus-window .nautilus-list-view { + background-color: rgba(239, 241, 245, 0.04); + border-radius: 12px; + margin: 0 6px 6px 6px; +} + +placessidebar list.navigation-sidebar, .nautilus-window placessidebar > scrolledwindow > viewport > .navigation-sidebar, leaflet.unfolded .contacts-contact-list > scrolledwindow > viewport > .navigation-sidebar, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > .navigation-sidebar { + padding: 6px 0 6px 6px; + background: none; + color: rgba(239, 241, 245, 0.7); +} + +placessidebar list.navigation-sidebar > separator, .nautilus-window placessidebar > scrolledwindow > viewport > .navigation-sidebar > separator, leaflet.unfolded .contacts-contact-list > scrolledwindow > viewport > .navigation-sidebar > separator, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > .navigation-sidebar > separator { + background-color: rgba(239, 241, 245, 0.12); + margin: 10px 15px; +} + +placessidebar list.navigation-sidebar > row, .nautilus-window placessidebar > scrolledwindow > viewport > .navigation-sidebar > row, leaflet.unfolded .contacts-contact-list > scrolledwindow > viewport > .navigation-sidebar > row, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > .navigation-sidebar > row { + color: rgba(30, 30, 46, 0.6); + border-radius: 9px; + color: #eff1f5; + padding: 6px 0; +} + +placessidebar list.navigation-sidebar > row:hover, .nautilus-window placessidebar > scrolledwindow > viewport > .navigation-sidebar > row:hover, leaflet.unfolded .contacts-contact-list > scrolledwindow > viewport > .navigation-sidebar > row:hover, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > .navigation-sidebar > row:hover, placessidebar list.navigation-sidebar > row:active, .nautilus-window placessidebar > scrolledwindow > viewport > .navigation-sidebar > row:active, leaflet.unfolded .contacts-contact-list > scrolledwindow > viewport > .navigation-sidebar > row:active, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > .navigation-sidebar > row:active, placessidebar list.navigation-sidebar > row:focus, .nautilus-window placessidebar > scrolledwindow > viewport > .navigation-sidebar > row:focus, leaflet.unfolded .contacts-contact-list > scrolledwindow > viewport > .navigation-sidebar > row:focus, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > .navigation-sidebar > row:focus { + color: #eff1f5; +} + +placessidebar list.navigation-sidebar > row:selected, .nautilus-window placessidebar > scrolledwindow > viewport > .navigation-sidebar > row:selected, leaflet.unfolded .contacts-contact-list > scrolledwindow > viewport > .navigation-sidebar > row:selected, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > .navigation-sidebar > row:selected { + /* background-color: if($variant == 'light', rgba($base, 0.4), $fill); */ + background-color: alpha(currentColor, 0.08); + color: #89b4fa; + font-weight: 500; + /* border-left: 3px solid $primary; */ +} + +placessidebar list.navigation-sidebar > row:selected:hover, .nautilus-window placessidebar > scrolledwindow > viewport > .navigation-sidebar > row:selected:hover, leaflet.unfolded .contacts-contact-list > scrolledwindow > viewport > .navigation-sidebar > row:selected:hover, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > .navigation-sidebar > row:selected:hover, placessidebar list.navigation-sidebar > row:selected:focus, .nautilus-window placessidebar > scrolledwindow > viewport > .navigation-sidebar > row:selected:focus, leaflet.unfolded .contacts-contact-list > scrolledwindow > viewport > .navigation-sidebar > row:selected:focus, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > .navigation-sidebar > row:selected:focus { + /* background-color: rgba($base, 0.9); */ + background-color: alpha(currentColor, 0.08); + color: #eff1f5; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar.top, +.sidebar-pane toolbarview > scrolledwindow > scrollbar.top, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar.top, filechooser paned > box scrolledwindow scrollbar.top, placessidebar > scrolledwindow > scrollbar.top, .nautilus-window placessidebar scrollbar.top, .nautilus-window .nautilus-grid-view scrolledwindow scrollbar.top, +.nautilus-window .nautilus-list-view scrolledwindow scrollbar.top, leaflet.unfolded > box > scrolledwindow > scrollbar.top, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar.top, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > scrollbar.top { + border-bottom: none; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar.bottom, +.sidebar-pane toolbarview > scrolledwindow > scrollbar.bottom, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar.bottom, filechooser paned > box scrolledwindow scrollbar.bottom, placessidebar > scrolledwindow > scrollbar.bottom, .nautilus-window placessidebar scrollbar.bottom, .nautilus-window .nautilus-grid-view scrolledwindow scrollbar.bottom, +.nautilus-window .nautilus-list-view scrolledwindow scrollbar.bottom, leaflet.unfolded > box > scrolledwindow > scrollbar.bottom, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar.bottom, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > scrollbar.bottom { + border-top: none; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar.left, +.sidebar-pane toolbarview > scrolledwindow > scrollbar.left, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar.left, filechooser paned > box scrolledwindow scrollbar.left, placessidebar > scrolledwindow > scrollbar.left, .nautilus-window placessidebar scrollbar.left, .nautilus-window .nautilus-grid-view scrolledwindow scrollbar.left, +.nautilus-window .nautilus-list-view scrolledwindow scrollbar.left, leaflet.unfolded > box > scrolledwindow > scrollbar.left, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar.left, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > scrollbar.left { + border-right: none; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar.right, +.sidebar-pane toolbarview > scrolledwindow > scrollbar.right, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar.right, filechooser paned > box scrolledwindow scrollbar.right, placessidebar > scrolledwindow > scrollbar.right, .nautilus-window placessidebar scrollbar.right, .nautilus-window .nautilus-grid-view scrolledwindow scrollbar.right, +.nautilus-window .nautilus-list-view scrolledwindow scrollbar.right, leaflet.unfolded > box > scrolledwindow > scrollbar.right, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar.right, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > scrollbar.right { + border-left: none; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar > range > trough > slider, +.sidebar-pane toolbarview > scrolledwindow > scrollbar > range > trough > slider, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar > range > trough > slider, filechooser paned > box scrolledwindow scrollbar > range > trough > slider, placessidebar > scrolledwindow > scrollbar > range > trough > slider, .nautilus-window placessidebar scrollbar > range > trough > slider, .nautilus-window .nautilus-grid-view scrolledwindow scrollbar > range > trough > slider, +.nautilus-window .nautilus-list-view scrolledwindow scrollbar > range > trough > slider, leaflet.unfolded > box > scrolledwindow > scrollbar > range > trough > slider, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar > range > trough > slider, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > scrollbar > range > trough > slider { + border: 4px solid transparent; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering), +.sidebar-pane toolbarview > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering), +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering), filechooser paned > box scrolledwindow scrollbar.overlay-indicator:not(.dragging):not(.hovering), placessidebar > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering), .nautilus-window placessidebar scrollbar.overlay-indicator:not(.dragging):not(.hovering), .nautilus-window .nautilus-grid-view scrolledwindow scrollbar.overlay-indicator:not(.dragging):not(.hovering), +.nautilus-window .nautilus-list-view scrolledwindow scrollbar.overlay-indicator:not(.dragging):not(.hovering), leaflet.unfolded > box > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering), leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering), .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) { + border-color: transparent; + background-color: transparent; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) > range > trough > slider, +.sidebar-pane toolbarview > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) > range > trough > slider, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) > range > trough > slider, filechooser paned > box scrolledwindow scrollbar.overlay-indicator:not(.dragging):not(.hovering) > range > trough > slider, placessidebar > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) > range > trough > slider, .nautilus-window placessidebar scrollbar.overlay-indicator:not(.dragging):not(.hovering) > range > trough > slider, .nautilus-window .nautilus-grid-view scrolledwindow scrollbar.overlay-indicator:not(.dragging):not(.hovering) > range > trough > slider, +.nautilus-window .nautilus-list-view scrolledwindow scrollbar.overlay-indicator:not(.dragging):not(.hovering) > range > trough > slider, leaflet.unfolded > box > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) > range > trough > slider, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) > range > trough > slider { + border: none; + margin: 1px; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, +.sidebar-pane toolbarview > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, filechooser paned > box scrolledwindow scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, placessidebar > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, .nautilus-window placessidebar scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, .nautilus-window .nautilus-grid-view scrolledwindow scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, +.nautilus-window .nautilus-list-view scrolledwindow scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, leaflet.unfolded > box > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button { + border: none; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar.overlay-indicator.dragging, +.sidebar-pane toolbarview > scrolledwindow > scrollbar.overlay-indicator.dragging, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar.overlay-indicator.dragging, filechooser paned > box scrolledwindow scrollbar.overlay-indicator.dragging, placessidebar > scrolledwindow > scrollbar.overlay-indicator.dragging, .nautilus-window placessidebar scrollbar.overlay-indicator.dragging, .nautilus-window .nautilus-grid-view scrolledwindow scrollbar.overlay-indicator.dragging, +.nautilus-window .nautilus-list-view scrolledwindow scrollbar.overlay-indicator.dragging, leaflet.unfolded > box > scrolledwindow > scrollbar.overlay-indicator.dragging, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar.overlay-indicator.dragging, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > scrollbar.overlay-indicator.dragging, .sidebar-pane .sidebar > scrolledwindow > scrollbar.overlay-indicator.hovering, +.sidebar-pane toolbarview > scrolledwindow > scrollbar.overlay-indicator.hovering, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar.overlay-indicator.hovering, filechooser paned > box scrolledwindow scrollbar.overlay-indicator.hovering, placessidebar > scrolledwindow > scrollbar.overlay-indicator.hovering, .nautilus-window placessidebar scrollbar.overlay-indicator.hovering, .nautilus-window .nautilus-grid-view scrolledwindow scrollbar.overlay-indicator.hovering, +.nautilus-window .nautilus-list-view scrolledwindow scrollbar.overlay-indicator.hovering, leaflet.unfolded > box > scrolledwindow > scrollbar.overlay-indicator.hovering, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar.overlay-indicator.hovering, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > scrollbar.overlay-indicator.hovering { + background-color: transparent; +} + +.nautilus-window .nautilus-grid-view scrolledwindow.undershoot-top > undershoot.top, +.nautilus-window .nautilus-list-view scrolledwindow.undershoot-top > undershoot.top { + border-radius: 12px 12px 0 0; + box-shadow: none; + background: linear-gradient(to bottom, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +.nautilus-window .nautilus-grid-view scrolledwindow.undershoot-bottom > undershoot.bottom, +.nautilus-window .nautilus-list-view scrolledwindow.undershoot-bottom > undershoot.bottom { + border-radius: 0 0 12px 12px; + box-shadow: none; + background: linear-gradient(to top, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +.nautilus-window .nautilus-grid-view scrolledwindow.undershoot-start:dir(ltr) > undershoot.left, +.nautilus-window .nautilus-list-view scrolledwindow.undershoot-start:dir(ltr) > undershoot.left { + border-radius: 12px 0 0 12px; + box-shadow: none; + background: linear-gradient(to right, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +.nautilus-window .nautilus-grid-view scrolledwindow.undershoot-start:dir(rtl) > undershoot.right, +.nautilus-window .nautilus-list-view scrolledwindow.undershoot-start:dir(rtl) > undershoot.right { + border-radius: 0 12px 12px 0; + box-shadow: none; + background: linear-gradient(to left, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +.nautilus-window .nautilus-grid-view scrolledwindow.undershoot-end:dir(ltr) > undershoot.right, +.nautilus-window .nautilus-list-view scrolledwindow.undershoot-end:dir(ltr) > undershoot.right { + border-radius: 0 12px 12px 0; + box-shadow: none; + background: linear-gradient(to left, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +.nautilus-window .nautilus-grid-view scrolledwindow.undershoot-end:dir(rtl) > undershoot.left, +.nautilus-window .nautilus-list-view scrolledwindow.undershoot-end:dir(rtl) > undershoot.left { + border-radius: 12px 0 0 12px; + box-shadow: none; + background: linear-gradient(to right, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +.sidebar-pane { + color: #eff1f5; + border-top-left-radius: 12px; +} + +.sidebar-pane .sidebar-pane { + background-color: transparent; + color: inherit; +} + +.sidebar-pane headerbar, +.sidebar-pane .navigation-sidebar, +.sidebar-pane searchbar > revealer > box { + background-color: transparent; + box-shadow: none; + border: none; +} + +.sidebar-pane .navigation-sidebar { + padding: 2px 4px; + background: none; + color: rgba(239, 241, 245, 0.7); +} + +.sidebar-pane:dir(ltr), +.sidebar-pane:dir(ltr) banner > revealer > widget, .sidebar-pane.end:dir(rtl), +.sidebar-pane.end:dir(rtl) banner > revealer > widget { + box-shadow: inset 0 1px rgba(239, 241, 245, 0.1); + border-right: none; +} + +/* Middle pane in three-pane setups */ +.content-pane .sidebar-pane, +.sidebar-pane .content-pane { + background-color: transparent; + color: #eff1f5; +} + +.content-pane .sidebar-pane:backdrop, +.sidebar-pane .content-pane:backdrop { + background-color: transparent; + transition: none; +} + +.content-pane { + background-color: #1e1e2e; + color: #eff1f5; + border-top-right-radius: 12px; + box-shadow: inset 0 1px rgba(239, 241, 245, 0.1); +} + +.content-pane headerbar, .content-pane headerbar:backdrop { + background-color: transparent; + box-shadow: none; + border: none; +} + +.maximized .content-pane, .fullscreen .content-pane, .tiled .content-pane, .tiled-top .content-pane, .tiled-right .content-pane, .tiled-bottom .content-pane, .tiled-left .content-pane { + border-radius: 0; + box-shadow: inset 0 1px rgba(239, 241, 245, 0.1); +} + +.top-bar { + box-shadow: none; + background: none; + border: none; +} + +.top-bar headerbar, .top-bar headerbar:backdrop { + background-color: transparent; + box-shadow: none; +} + +.top-bar .collapse-spacing { + padding: 0; +} + +themeselector, +panelthemeselector { + margin: 9px; +} + +themeselector checkbutton, +panelthemeselector checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(239, 241, 245, 0.12); +} + +themeselector checkbutton.follow:checked, themeselector checkbutton.light:checked, themeselector checkbutton.dark:checked, +panelthemeselector checkbutton.follow:checked, +panelthemeselector checkbutton.light:checked, +panelthemeselector checkbutton.dark:checked { + box-shadow: inset 0 0 0 2px #89b4fa; +} + +themeselector checkbutton.follow, +panelthemeselector checkbutton.follow { + background-image: linear-gradient(to bottom right, #eff1f5 50%, #232634 50%); +} + +themeselector checkbutton.light, +panelthemeselector checkbutton.light { + background-color: #eff1f5; +} + +themeselector checkbutton.dark, +panelthemeselector checkbutton.dark { + background-color: #232634; +} + +themeselector checkbutton.theme-selector radio, +panelthemeselector checkbutton.theme-selector radio { + -gtk-icon-source: none; + border: none; + background: none; + box-shadow: none; + min-height: 20px; + min-width: 20px; + padding: 0; +} + +themeselector checkbutton.theme-selector radio:hover, themeselector checkbutton.theme-selector radio:active, themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:hover, +panelthemeselector checkbutton.theme-selector radio:active, +panelthemeselector checkbutton.theme-selector radio:checked { + background-color: transparent; +} + +themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked { + -gtk-icon-size: 20px; + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/checkbox-checked-symbolic.svg")), -gtk-recolor(url("assets/checkbox-checked-symbolic@2.svg"))); + color: rgba(30, 30, 46, 0.87); + background-color: #89b4fa; +} + +themeselector checkbutton.theme-selector radio:checked, themeselector checkbutton.theme-selector radio:checked:hover, themeselector checkbutton.theme-selector radio:checked:active, +panelthemeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked:hover, +panelthemeselector checkbutton.theme-selector radio:checked:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher { + padding: 6px; +} + +themeswitcher .check { + min-height: 20px; + min-width: 20px; + background: none; + padding: 0; + margin: 0; + border-radius: 9999px; + color: rgba(30, 30, 46, 0.87); + background-color: #89b4fa; +} + +themeswitcher .check, themeswitcher .check:hover, themeswitcher .check:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(239, 241, 245, 0.12); +} + +themeswitcher checkbutton:checked { + box-shadow: inset 0 0 0 2px #89b4fa; +} + +themeswitcher checkbutton radio, themeswitcher checkbutton radio:hover, themeswitcher checkbutton radio:active, themeswitcher checkbutton radio:checked, themeswitcher checkbutton radio:checked:hover, themeswitcher checkbutton radio:checked:active { + background-color: transparent; + border: none; + background: none; + box-shadow: none; + color: transparent; + -gtk-icon-source: none; + -gtk-icon-size: 0; +} + +themeswitcher checkbutton.system { + background: linear-gradient(-45deg, #1e1e2e 50%, #eff1f5 50%); +} + +themeswitcher checkbutton.light { + color: alpha(black, 0.8); + background-color: #eff1f5; +} + +themeswitcher checkbutton.dark { + color: #eff1f5; + background-color: #1e1e2e; +} + +/* GTK NAMED COLORS + ---------------- + use responsibly! */ +/* widget text/foreground color */ +@define-color theme_fg_color #eff1f5; +/* text color for entries, views and content in general */ +@define-color theme_text_color #eff1f5; +/* widget base background color */ +@define-color theme_bg_color #1e1e2e; +/* text widgets and the like base background color */ +@define-color theme_base_color #313244; +/* base background color of selections */ +@define-color theme_selected_bg_color #89b4fa; +/* text/foreground color of selections */ +@define-color theme_selected_fg_color rgba(30, 30, 46, 0.87); +/* base background color of insensitive widgets */ +@define-color insensitive_bg_color #1e1e2e; +/* text foreground color of insensitive widgets */ +@define-color insensitive_fg_color rgba(239, 241, 245, 0.5); +/* insensitive text widgets and the like base background color */ +@define-color insensitive_base_color #313244; +/* widget text/foreground color on backdrop windows */ +@define-color theme_unfocused_fg_color #eff1f5; +/* text color for entries, views and content in general on backdrop windows */ +@define-color theme_unfocused_text_color #eff1f5; +/* widget base background color on backdrop windows */ +@define-color theme_unfocused_bg_color #1e1e2e; +/* text widgets and the like base background color on backdrop windows */ +@define-color theme_unfocused_base_color #313244; +/* base background color of selections on backdrop windows */ +@define-color theme_unfocused_selected_bg_color #89b4fa; +/* text/foreground color of selections on backdrop windows */ +@define-color theme_unfocused_selected_fg_color rgba(30, 30, 46, 0.87); +/* insensitive color on backdrop windows */ +@define-color unfocused_insensitive_color rgba(239, 241, 245, 0.5); +/* widgets main borders color */ +@define-color borders rgba(239, 241, 245, 0.12); +/* widgets main borders color on backdrop windows */ +@define-color unfocused_borders rgba(239, 241, 245, 0.12); +/* these are pretty self explicative */ +@define-color warning_color #df8e1d; +@define-color error_color #d20f39; +@define-color success_color #40a02b; +/* these colors are exported for the window manager and shouldn't be used in applications, +read if you used those and something break with a version upgrade you're on your own... */ +@define-color wm_focused_title #eff1f5; +@define-color wm_unfocused_title rgba(239, 241, 245, 0.7); +@define-color wm_highlight rgba(239, 241, 245, 0.1); +@define-color wm_border #0a0a0e; +@define-color wm_focused_bg #1e1e2e; +@define-color wm_unfocused_bg #1e1e2e; +@define-color wm_button_icon #eff1f5; +@define-color wm_button_focused_bg #2b2b3a; +@define-color wm_button_unfocused_bg #2b2b3a; +@define-color wm_button_hover_fg rgba(30, 30, 46, 0.87); +@define-color wm_button_active_fg rgba(30, 30, 46, 0.87); +@define-color wm_button_hover_bg #e6e9ef; +@define-color wm_button_active_bg #e7eaf0; +/* FIXME this is really an API */ +@define-color content_view_bg #313244; +@define-color placeholder_text_color #b6b8c0; +/* Very contrasty background for text views (@theme_text_color foreground) */ +@define-color text_view_bg #313244; +@define-color budgie_tasklist_indicator_color rgba(121, 122, 133, 0.7); +@define-color budgie_tasklist_indicator_color_active #89b4fa; +@define-color budgie_tasklist_indicator_color_active_window rgba(108, 140, 195, 0.816); +@define-color budgie_tasklist_indicator_color_attention #df8e1d; +@define-color STRAWBERRY_100 #FF9262; +@define-color STRAWBERRY_300 #FF793E; +@define-color STRAWBERRY_500 #F15D22; +@define-color STRAWBERRY_700 #CF3B00; +@define-color STRAWBERRY_900 #AC1800; +@define-color ORANGE_100 #FFDB91; +@define-color ORANGE_300 #FFCA40; +@define-color ORANGE_500 #FAA41A; +@define-color ORANGE_700 #DE8800; +@define-color ORANGE_900 #C26C00; +@define-color BANANA_100 #FFFFA8; +@define-color BANANA_300 #FFFA7D; +@define-color BANANA_500 #FFCE51; +@define-color BANANA_700 #D1A023; +@define-color BANANA_900 #A27100; +@define-color LIME_100 #A2F3BE; +@define-color LIME_300 #8ADBA6; +@define-color LIME_500 #73C48F; +@define-color LIME_700 #479863; +@define-color LIME_900 #1C6D38; +@define-color BLUEBERRY_100 #94A6FF; +@define-color BLUEBERRY_300 #6A7CE0; +@define-color BLUEBERRY_500 #3F51B5; +@define-color BLUEBERRY_700 #213397; +@define-color BLUEBERRY_900 #031579; +@define-color GRAPE_100 #D25DE6; +@define-color GRAPE_300 #B84ACB; +@define-color GRAPE_500 #9C27B0; +@define-color GRAPE_700 #830E97; +@define-color GRAPE_900 #6A007E; +@define-color COCOA_100 #9F9792; +@define-color COCOA_300 #7B736E; +@define-color COCOA_500 #574F4A; +@define-color COCOA_700 #463E39; +@define-color COCOA_900 #342C27; +@define-color SILVER_100 #EEE; +@define-color SILVER_300 #CCC; +@define-color SILVER_500 #AAA; +@define-color SILVER_700 #888; +@define-color SILVER_900 #666; +@define-color SLATE_100 #888; +@define-color SLATE_300 #666; +@define-color SLATE_500 #444; +@define-color SLATE_700 #222; +@define-color SLATE_900 #111; +@define-color BLACK_100 #474341; +@define-color BLACK_300 #403C3A; +@define-color BLACK_500 #393634; +@define-color BLACK_700 #33302F; +@define-color BLACK_900 #2B2928; +@define-color blue_1 #99c1f1; +@define-color blue_2 #62a0ea; +@define-color blue_3 #3584e4; +@define-color blue_4 #1c71d8; +@define-color blue_5 #1a5fb4; +@define-color green_1 #8ff0a4; +@define-color green_2 #57e389; +@define-color green_3 #33d17a; +@define-color green_4 #2ec27e; +@define-color green_5 #26a269; +@define-color yellow_1 #f9f06b; +@define-color yellow_2 #f8e45c; +@define-color yellow_3 #f6d32d; +@define-color yellow_4 #f5c211; +@define-color yellow_5 #e5a50a; +@define-color orange_1 #ffbe6f; +@define-color orange_2 #ffa348; +@define-color orange_3 #ff7800; +@define-color orange_4 #e66100; +@define-color orange_5 #c64600; +@define-color red_1 #f66151; +@define-color red_2 #ed333b; +@define-color red_3 #e01b24; +@define-color red_4 #c01c28; +@define-color red_5 #a51d2d; +@define-color purple_1 #dc8add; +@define-color purple_2 #c061cb; +@define-color purple_3 #9141ac; +@define-color purple_4 #813d9c; +@define-color purple_5 #613583; +@define-color brown_1 #cdab8f; +@define-color brown_2 #b5835a; +@define-color brown_3 #986a44; +@define-color brown_4 #865e3c; +@define-color brown_5 #63452c; +@define-color light_1 #ffffff; +@define-color light_2 #f6f5f4; +@define-color light_3 #deddda; +@define-color light_4 #c0bfbc; +@define-color light_5 #9a9996; +@define-color dark_1 #77767b; +@define-color dark_2 #5e5c64; +@define-color dark_3 #3d3846; +@define-color dark_4 #241f31; +@define-color dark_5 #000000; +/* GTK NAMED COLORS + ---------------- + use responsibly! */ +@define-color accent_bg_color #89b4fa; +@define-color accent_fg_color rgba(30, 30, 46, 0.87); +@define-color accent_color #89b4fa; +@define-color destructive_bg_color #d20f39; +@define-color destructive_fg_color #eff1f5; +@define-color destructive_color #d20f39; +@define-color success_bg_color #40a02b; +@define-color success_fg_color #eff1f5; +@define-color success_color #40a02b; +@define-color warning_bg_color #df8e1d; +@define-color warning_fg_color #eff1f5; +@define-color warning_color #df8e1d; +@define-color error_bg_color #d20f39; +@define-color error_fg_color #eff1f5; +@define-color error_color #d20f39; +@define-color window_bg_color #1e1e2e; +@define-color window_fg_color #eff1f5; +@define-color view_bg_color #313244; +@define-color view_fg_color #eff1f5; +@define-color headerbar_bg_color #1e1e2e; +@define-color headerbar_fg_color #eff1f5; +@define-color headerbar_border_color rgba(239, 241, 245, 0.12); +@define-color headerbar_backdrop_color #1e1e2e; +@define-color headerbar_shade_color rgba(239, 241, 245, 0.12); +@define-color card_bg_color #313244; +@define-color card_fg_color #eff1f5; +@define-color card_shade_color rgba(239, 241, 245, 0.12); +@define-color dialog_bg_color #313244; +@define-color dialog_fg_color #eff1f5; +@define-color popover_bg_color #292c3c; +@define-color popover_fg_color #eff1f5; +@define-color shade_color rgba(239, 241, 245, 0.12); +@define-color scrollbar_outline_color rgba(239, 241, 245, 0.12); diff --git a/gtk-4.0/gtk.css b/gtk-4.0/gtk.css new file mode 100644 index 0000000..d062441 --- /dev/null +++ b/gtk-4.0/gtk.css @@ -0,0 +1,8704 @@ +@keyframes ripple { + to { + background-size: 1000% 1000%; + } +} + +@keyframes ripple-on-slider { + to { + background-size: auto, 1000% 1000%; + } +} + +@keyframes ripple-on-headerbar { + from { + background-image: radial-gradient(circle, #89b4fa 0%, transparent 0%); + } + to { + background-image: radial-gradient(circle, #89b4fa 100%, transparent 100%); + } +} + +/*************** + * Base States * + ***************/ +.background { + background-color: #1e1e2e; + color: #eff1f5; +} + +dnd { + color: #eff1f5; +} + +.normal-icons { + -gtk-icon-size: 16px; +} + +.large-icons { + -gtk-icon-size: 32px; +} + +.aboutdialog .large-icons { + -gtk-icon-size: 128px; +} + +spinner:disabled, +arrow:disabled, +scrollbar:disabled, +check:disabled, +radio:disabled, +treeview.expander:disabled { + -gtk-icon-filter: opacity(0.5); +} + +iconview, +.view { + background-color: rgba(239, 241, 245, 0.04); + color: #eff1f5; +} + +iconview:disabled, +.view:disabled { + color: rgba(239, 241, 245, 0.5); +} + +iconview:selected, +.view:selected { + color: #eff1f5; +} + +textview text { + background-color: rgba(239, 241, 245, 0.04); +} + +textview border { + background-color: #313244; + color: rgba(239, 241, 245, 0.7); +} + +iconview:hover, iconview:selected { + border-radius: 6px; +} + +rubberband, .content-view rubberband, .content-view columnview.view > rubberband, +.content-view treeview.view > rubberband, +.content-view .rubberband, columnview.view > rubberband, +.content-view columnview.view > .rubberband, +treeview.view > rubberband, +.content-view treeview.view > .rubberband, gridview > rubberband, flowbox > rubberband { + border: 1px solid #89b4fa; + background-color: rgba(137, 180, 250, 0.3); +} + +flowbox > flowboxchild { + padding: 4px; + border-radius: 12px; +} + +.content-view .tile:selected { + background-color: transparent; +} + +gridview > child { + padding: 3px; +} + +gridview > child:selected { + outline-color: alpha(currentColor, 0.06); +} + +gridview > child box { + border-spacing: 8px; + margin: 12px; +} + +coverflow cover { + color: #eff1f5; + background-color: #313244; + border: 1px solid black; +} + +label.separator { + color: rgba(239, 241, 245, 0.7); +} + +label:disabled { + opacity: 1; + color: rgba(239, 241, 245, 0.5); +} + +headerbar label:disabled, tab label:disabled, button label:disabled { + color: inherit; + opacity: 1; +} + +label.osd { + border-radius: 12px; + background-color: rgba(24, 24, 37, 0.9); + color: #eff1f5; +} + + +.dim-label, +row.expander image.expander-row-arrow, +row label.subtitle { + color: rgba(239, 241, 245, 0.7); + opacity: 1; +} + +.accent { + color: #89b4fa; +} + +.success { + color: #40a02b; +} + +.warning { + color: #df8e1d; +} + +.error { + color: #d20f39; +} + +.large-title { + font-weight: 300; + font-size: 24pt; +} + +.title-1 { + font-weight: 800; + font-size: 20pt; +} + +.title-2 { + font-weight: 800; + font-size: 15pt; +} + +.title-3 { + font-weight: 700; + font-size: 15pt; +} + +.title-4 { + font-weight: 700; + font-size: 13pt; +} + +.heading { + font-weight: 700; + font-size: 11pt; +} + +.body { + font-weight: 400; + font-size: 11pt; +} + +.caption { + font-weight: 400; + font-size: 9pt; +} + +.caption-heading { + font-weight: 700; + font-size: 9pt; +} + +window.assistant .sidebar { + padding: 4px 0; +} + +window.assistant .sidebar label { + min-height: 34px; + padding: 0 12px; + color: rgba(239, 241, 245, 0.5); + font-weight: 500; +} + +window.assistant .sidebar label.highlight { + color: #eff1f5; +} + +.osd .scale-popup > arrow, +.osd .scale-popup > contents, .osd popover > arrow, +.osd popover > contents, popover.touch-selection > arrow, +popover.touch-selection > contents, popover.magnifier > arrow, +popover.magnifier > contents, .osd { + color: #eff1f5; + background-color: #313244; + background-clip: padding-box; + border-radius: 12px; + border: none; + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.15), 0 4px 3px 0 rgba(0, 0, 0, 0.18), 0 1px 6px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(239, 241, 245, 0.1); +} + +.osd { + padding: 6px; + margin: 6px; +} + +.osd.circular { + border-radius: 9999px; +} + +/********************* + * Spinner Animation * + *********************/ +@keyframes spin { + to { + transform: rotate(1turn); + } +} + +spinner { + background: none; + opacity: 0; + -gtk-icon-source: -gtk-icontheme("process-working-symbolic"); +} + +spinner:checked { + opacity: 1; + animation: spin 1s linear infinite; +} + +spinner:checked:disabled { + opacity: 0.5; +} + +/**************** + * Text Entries * + ****************/ + +entry headerbar popover.background entry, +headerbar popover.background entry entry, +entry { + min-height: 34px; + padding: 0 8px; + border-spacing: 6px; + border-radius: 12px; + caret-color: currentColor; + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(239, 241, 245, 0.08); + color: rgba(239, 241, 245, 0.7); + outline: 0 solid transparent; + outline-offset: 2px; +} + + +entry headerbar popover.background entry:focus-within, +headerbar popover.background entry entry:focus-within, +entry:focus-within { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + background-color: rgba(239, 241, 245, 0.08); + box-shadow: inset 0 0 0 2px transparent; + color: #eff1f5; + outline: 2px solid #89b4fa; + outline-offset: -2px; +} + + +entry headerbar popover.background entry:drop(active), +headerbar popover.background entry entry:drop(active), +entry headerbar popover.background entry:hover:not(:focus-within), +headerbar popover.background entry entry:hover:not(:focus-within), +entry:drop(active), +entry:hover:not(:focus-within) { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + background-color: alpha(currentColor, 0.08); + box-shadow: inset 0 0 0 2px alpha(currentColor, 0.08); + color: #eff1f5; + outline: 0 solid transparent; + outline-offset: 2px; +} + + +entry headerbar popover.background entry:disabled, +headerbar popover.background entry entry:disabled, +entry:disabled { + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(239, 241, 245, 0.08); + color: rgba(239, 241, 245, 0.5); + outline: none; +} + + +entry headerbar popover.background entry.flat:focus-within, +headerbar popover.background entry entry.flat:focus-within, +entry headerbar popover.background entry.flat:disabled, +headerbar popover.background entry entry.flat:disabled, +entry headerbar popover.background entry.flat:hover, +headerbar popover.background entry entry.flat:hover, +entry headerbar popover.background entry.flat, +headerbar popover.background entry entry.flat, +entry.flat:focus-within, +entry.flat:disabled, +entry.flat:hover, +entry.flat { + min-height: 0; + padding: 2px; + background-color: transparent; + box-shadow: none; + border-radius: 0; + outline: none; +} + + +entry headerbar popover.background entry image, +headerbar popover.background entry entry image, +entry image { + color: rgba(239, 241, 245, 0.7); +} + + +entry headerbar popover.background entry image:hover, +headerbar popover.background entry entry image:hover, +entry headerbar popover.background entry image:active, +headerbar popover.background entry entry image:active, +entry image:hover, +entry image:active { + color: #eff1f5; +} + + +entry headerbar popover.background entry image:disabled, +headerbar popover.background entry entry image:disabled, +entry image:disabled { + color: rgba(239, 241, 245, 0.5); +} + + +entry headerbar popover.background entry image.left, +headerbar popover.background entry entry image.left, +entry image.left { + margin: 0 6px 0 1px; +} + + +entry headerbar popover.background entry image.right, +headerbar popover.background entry entry image.right, +entry image.right { + margin: 0 1px 0 6px; +} + + +entry headerbar popover.background entry undershoot.left > undershoot.left, +headerbar popover.background entry entry undershoot.left > undershoot.left, +entry undershoot.left > undershoot.left { + border-radius: 0px 0 0 0px; + box-shadow: none; + background: linear-gradient(to right, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + + +entry headerbar popover.background entry undershoot.right > undershoot.right, +headerbar popover.background entry entry undershoot.right > undershoot.right, +entry undershoot.right > undershoot.right { + border-radius: 0 0px 0px 0; + box-shadow: none; + background: linear-gradient(to left, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + + +entry headerbar popover.background entry.error, +headerbar popover.background entry entry.error, +entry.error { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(210, 15, 57, 0.1); + color: rgba(210, 15, 57, 0.75); + outline: 0 solid transparent; + outline-offset: 2px; +} + + +entry headerbar popover.background entry.error:focus-within, +headerbar popover.background entry entry.error:focus-within, +entry.error:focus-within { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + background-color: rgba(210, 15, 57, 0.1); + box-shadow: inset 0 0 0 2px transparent; + color: #d20f39; + outline: 2px solid #d20f39; + outline-offset: -2px; +} + + +entry headerbar popover.background entry.error:drop(active), +headerbar popover.background entry entry.error:drop(active), +entry headerbar popover.background entry.error:hover:not(:focus-within), +headerbar popover.background entry entry.error:hover:not(:focus-within), +entry.error:drop(active), +entry.error:hover:not(:focus-within) { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + background-color: alpha(currentColor, 0.08); + box-shadow: inset 0 0 0 2px alpha(currentColor, 0.08); + color: #d20f39; + outline: 0 solid transparent; + outline-offset: 2px; +} + + +entry headerbar popover.background entry.error:disabled, +headerbar popover.background entry entry.error:disabled, +entry.error:disabled { + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(210, 15, 57, 0.1); + color: rgba(210, 15, 57, 0.35); + outline: none; +} + + +entry headerbar popover.background entry.error > text > selection, +headerbar popover.background entry entry.error > text > selection, +entry.error > text > selection { + background-color: rgba(210, 15, 57, 0.25); + color: #d20f39; +} + + +entry headerbar popover.background entry.error image, +headerbar popover.background entry entry.error image, +entry.error image { + color: rgba(210, 15, 57, 0.75); +} + + +entry headerbar popover.background entry.error image:hover, +headerbar popover.background entry entry.error image:hover, +entry headerbar popover.background entry.error image:active, +headerbar popover.background entry entry.error image:active, +entry.error image:hover, +entry.error image:active { + color: #d20f39; +} + + +entry headerbar popover.background entry.error image:disabled, +headerbar popover.background entry entry.error image:disabled, +entry.error image:disabled { + color: rgba(210, 15, 57, 0.35); +} + + +entry headerbar popover.background entry.warning, +headerbar popover.background entry entry.warning, +entry.warning { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(223, 142, 29, 0.1); + color: rgba(223, 142, 29, 0.75); + outline: 0 solid transparent; + outline-offset: 2px; +} + + +entry headerbar popover.background entry.warning:focus-within, +headerbar popover.background entry entry.warning:focus-within, +entry.warning:focus-within { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + background-color: rgba(223, 142, 29, 0.1); + box-shadow: inset 0 0 0 2px transparent; + color: #df8e1d; + outline: 2px solid #df8e1d; + outline-offset: -2px; +} + + +entry headerbar popover.background entry.warning:drop(active), +headerbar popover.background entry entry.warning:drop(active), +entry headerbar popover.background entry.warning:hover:not(:focus-within), +headerbar popover.background entry entry.warning:hover:not(:focus-within), +entry.warning:drop(active), +entry.warning:hover:not(:focus-within) { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + background-color: alpha(currentColor, 0.08); + box-shadow: inset 0 0 0 2px alpha(currentColor, 0.08); + color: #df8e1d; + outline: 0 solid transparent; + outline-offset: 2px; +} + + +entry headerbar popover.background entry.warning:disabled, +headerbar popover.background entry entry.warning:disabled, +entry.warning:disabled { + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(223, 142, 29, 0.1); + color: rgba(223, 142, 29, 0.35); + outline: none; +} + + +entry headerbar popover.background entry.warning > text > selection, +headerbar popover.background entry entry.warning > text > selection, +entry.warning > text > selection { + background-color: rgba(223, 142, 29, 0.25); + color: #df8e1d; +} + + +entry headerbar popover.background entry.warning image, +headerbar popover.background entry entry.warning image, +entry.warning image { + color: rgba(223, 142, 29, 0.75); +} + + +entry headerbar popover.background entry.warning image:hover, +headerbar popover.background entry entry.warning image:hover, +entry headerbar popover.background entry.warning image:active, +headerbar popover.background entry entry.warning image:active, +entry.warning image:hover, +entry.warning image:active { + color: #df8e1d; +} + + +entry headerbar popover.background entry.warning image:disabled, +headerbar popover.background entry entry.warning image:disabled, +entry.warning image:disabled { + color: rgba(223, 142, 29, 0.35); +} + + +entry headerbar popover.background entry.success, +headerbar popover.background entry entry.success, +entry.success { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(64, 160, 43, 0.1); + color: rgba(64, 160, 43, 0.75); + outline: 0 solid transparent; + outline-offset: 2px; +} + + +entry headerbar popover.background entry.success:focus-within, +headerbar popover.background entry entry.success:focus-within, +entry.success:focus-within { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + background-color: rgba(64, 160, 43, 0.1); + box-shadow: inset 0 0 0 2px transparent; + color: #40a02b; + outline: 2px solid #40a02b; + outline-offset: -2px; +} + + +entry headerbar popover.background entry.success:drop(active), +headerbar popover.background entry entry.success:drop(active), +entry headerbar popover.background entry.success:hover:not(:focus-within), +headerbar popover.background entry entry.success:hover:not(:focus-within), +entry.success:drop(active), +entry.success:hover:not(:focus-within) { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + background-color: alpha(currentColor, 0.08); + box-shadow: inset 0 0 0 2px alpha(currentColor, 0.08); + color: #40a02b; + outline: 0 solid transparent; + outline-offset: 2px; +} + + +entry headerbar popover.background entry.success:disabled, +headerbar popover.background entry entry.success:disabled, +entry.success:disabled { + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(64, 160, 43, 0.1); + color: rgba(64, 160, 43, 0.35); + outline: none; +} + + +entry headerbar popover.background entry.success > text > selection, +headerbar popover.background entry entry.success > text > selection, +entry.success > text > selection { + background-color: rgba(64, 160, 43, 0.25); + color: #40a02b; +} + + +entry headerbar popover.background entry.success image, +headerbar popover.background entry entry.success image, +entry.success image { + color: rgba(64, 160, 43, 0.75); +} + + +entry headerbar popover.background entry.success image:hover, +headerbar popover.background entry entry.success image:hover, +entry headerbar popover.background entry.success image:active, +headerbar popover.background entry entry.success image:active, +entry.success image:hover, +entry.success image:active { + color: #40a02b; +} + + +entry headerbar popover.background entry.success image:disabled, +headerbar popover.background entry entry.success image:disabled, +entry.success image:disabled { + color: rgba(64, 160, 43, 0.35); +} + + +entry > progress, +entry progress > trough > progress { + margin: 0 -4px; + border-bottom: 2px solid #89b4fa; + background-color: transparent; +} + + +entry button.image-button { + min-height: 24px; + min-width: 24px; + padding: 0; +} + +treeview entry.flat, treeview entry { + background-color: #313244; +} + +treeview entry.flat, treeview entry.flat:focus-within, treeview entry, treeview entry:focus-within { + border-image: none; + box-shadow: none; +} + +.entry-tag { + margin: 2px; + border-radius: 9999px; + box-shadow: none; + background-color: rgba(239, 241, 245, 0.12); + color: #eff1f5; +} + +.entry-tag:hover { + background-image: image(alpha(currentColor, 0.08)); +} + +:dir(ltr) .entry-tag { + margin-left: 4px; + margin-right: 0; + padding-left: 12px; + padding-right: 8px; +} + +:dir(rtl) .entry-tag { + margin-left: 0; + margin-right: 4px; + padding-left: 8px; + padding-right: 12px; +} + +.entry-tag.button { + box-shadow: none; + background-color: transparent; +} + +.entry-tag.button:not(:hover):not(:active) { + color: rgba(239, 241, 245, 0.7); +} + +editablelabel > stack > text { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(239, 241, 245, 0.08); + color: rgba(239, 241, 245, 0.7); + outline: 0 solid transparent; + outline-offset: 2px; +} + +/*********** + * Buttons * + ***********/ +@keyframes needs-attention { + from { + background-image: radial-gradient(farthest-side, #89b4fa 0%, rgba(137, 180, 250, 0) 0%); + } + to { + background-image: radial-gradient(farthest-side, #89b4fa 95%, rgba(137, 180, 250, 0)); + } +} + +infobar.warning > revealer > box button, infobar.warning:backdrop > revealer > box button, popover.touch-selection button, popover.magnifier button, headerbar.selection-mode button:not(.suggested-action):not(.destructive-action) { + color: rgba(239, 241, 245, 0.7); +} + +infobar.warning > revealer > box button:focus, popover.touch-selection button:focus, popover.magnifier button:focus, headerbar.selection-mode button:focus:not(.suggested-action):not(.destructive-action), infobar.warning > revealer > box button:hover, popover.touch-selection button:hover, popover.magnifier button:hover, headerbar.selection-mode button:hover:not(.suggested-action):not(.destructive-action), infobar.warning > revealer > box button:active, popover.touch-selection button:active, popover.magnifier button:active, headerbar.selection-mode button:active:not(.suggested-action):not(.destructive-action), infobar.warning > revealer > box button:checked, popover.touch-selection button:checked, popover.magnifier button:checked, headerbar.selection-mode button:checked:not(.suggested-action):not(.destructive-action) { + color: #eff1f5; +} + +infobar.warning > revealer > box button:disabled, popover.touch-selection button:disabled, popover.magnifier button:disabled, headerbar.selection-mode button:disabled:not(.suggested-action):not(.destructive-action) { + color: rgba(239, 241, 245, 0.32); +} + +infobar.warning > revealer > box button:checked:disabled, popover.touch-selection button:checked:disabled, popover.magnifier button:checked:disabled, headerbar.selection-mode button:checked:disabled:not(.suggested-action):not(.destructive-action) { + color: rgba(239, 241, 245, 0.5); +} + +placessidebar list.navigation-sidebar > row button.sidebar-button { + background-color: #313244; + color: #eff1f5; +} + +placessidebar list.navigation-sidebar > row button.sidebar-button:checked { + background-color: rgba(30, 30, 46, 0.87); + color: #e6e9ef; +} + +tabbar tab:not(:selected) button.image-button.tab-close-button, +dnd tab:not(:selected) button.image-button.tab-close-button, notebook > header > tabs > tab:not(:checked):not(:selected) button.small-button, notebook > header menubutton > button.flat { + color: rgba(30, 30, 46, 0.6); +} + +tabbar tab:not(:selected) button.image-button.tab-close-button:hover, +dnd tab:not(:selected) button.image-button.tab-close-button:hover, notebook > header > tabs > tab:not(:checked):not(:selected) button.small-button:hover, notebook > header menubutton > button.flat:hover, tabbar tab:not(:selected) button.image-button.tab-close-button:active, +dnd tab:not(:selected) button.image-button.tab-close-button:active, notebook > header > tabs > tab:not(:checked):not(:selected) button.small-button:active, notebook > header menubutton > button.flat:active, tabbar tab:not(:selected) button.image-button.tab-close-button:focus:not(:hover):not(:active) button.keyboard-activating.image-button.tab-close-button, +dnd tab:not(:selected) button.image-button.tab-close-button:focus:not(:hover):not(:active) button.keyboard-activating.image-button.tab-close-button, tabbar notebook > header > tabs > tab:not(:checked):not(:selected) button.small-button:focus:not(:hover):not(:active) button.keyboard-activating.image-button.tab-close-button, +dnd notebook > header > tabs > tab:not(:checked):not(:selected) button.small-button:focus:not(:hover):not(:active) button.keyboard-activating.image-button.tab-close-button, tabbar tab:not(:selected) button.image-button.tab-close-button:focus:not(:hover):not(:active) notebook > header > tabs > tab:not(:checked):not(:selected) button.keyboard-activating.small-button, +dnd tab:not(:selected) button.image-button.tab-close-button:focus:not(:hover):not(:active) notebook > header > tabs > tab:not(:checked):not(:selected) button.keyboard-activating.small-button, tabbar notebook > header > tabs > tab:not(:checked):not(:selected) button.image-button.tab-close-button:focus:not(:hover):not(:active) button.keyboard-activating.small-button, +dnd notebook > header > tabs > tab:not(:checked):not(:selected) button.image-button.tab-close-button:focus:not(:hover):not(:active) button.keyboard-activating.small-button, notebook > header > tabs > tab:not(:checked):not(:selected) button.small-button:focus:not(:hover):not(:active) button.keyboard-activating.small-button, notebook > header menubutton > button.flat:focus:not(:hover):not(:active) tabbar tab:not(:selected) button.keyboard-activating.image-button.tab-close-button, tabbar tab:not(:selected) notebook > header menubutton > button.flat:focus:not(:hover):not(:active) button.keyboard-activating.image-button.tab-close-button, +notebook > header menubutton > button.flat:focus:not(:hover):not(:active) dnd tab:not(:selected) button.keyboard-activating.image-button.tab-close-button, +dnd tab:not(:selected) notebook > header menubutton > button.flat:focus:not(:hover):not(:active) button.keyboard-activating.image-button.tab-close-button, notebook > header > tabs > tab:not(:checked):not(:selected) menubutton > button.flat:focus:not(:hover):not(:active) button.keyboard-activating.small-button, tabbar tab:not(:selected) button.image-button.tab-close-button:focus:not(:hover):not(:active) notebook > header menubutton > button.keyboard-activating.flat, +dnd tab:not(:selected) button.image-button.tab-close-button:focus:not(:hover):not(:active) notebook > header menubutton > button.keyboard-activating.flat, notebook > header > tabs > tab:not(:checked):not(:selected) button.small-button:focus:not(:hover):not(:active) notebook > header menubutton > button.keyboard-activating.flat, notebook > header tabbar tab:not(:selected) button.image-button.tab-close-button:focus:not(:hover):not(:active) menubutton > button.keyboard-activating.flat, tabbar tab:not(:selected) notebook > header button.image-button.tab-close-button:focus:not(:hover):not(:active) menubutton > button.keyboard-activating.flat, +notebook > header dnd tab:not(:selected) button.image-button.tab-close-button:focus:not(:hover):not(:active) menubutton > button.keyboard-activating.flat, +dnd tab:not(:selected) notebook > header button.image-button.tab-close-button:focus:not(:hover):not(:active) menubutton > button.keyboard-activating.flat, notebook > header > tabs > tab:not(:checked):not(:selected) button.small-button:focus:not(:hover):not(:active) menubutton > button.keyboard-activating.flat, notebook > header menubutton > button.flat:focus:not(:hover):not(:active) menubutton > button.keyboard-activating.flat { + color: rgba(30, 30, 46, 0.87); +} + +tabbar tab:not(:selected) button.image-button.tab-close-button:checked, +dnd tab:not(:selected) button.image-button.tab-close-button:checked, notebook > header > tabs > tab:not(:checked):not(:selected) button.small-button:checked, notebook > header menubutton > button.flat:checked { + background-color: rgba(30, 30, 46, 0.87); + color: #e6e9ef; +} + +tabbar tab:not(:selected) button.image-button.tab-close-button:disabled, +dnd tab:not(:selected) button.image-button.tab-close-button:disabled, notebook > header > tabs > tab:not(:checked):not(:selected) button.small-button:disabled, notebook > header menubutton > button.flat:disabled { + color: rgba(30, 30, 46, 0.3); +} + +headerbar popover.background button:not(.suggested-action):not(.destructive-action):not(.flat), button { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1); + background-color: rgba(239, 241, 245, 0.08); + background-image: radial-gradient(circle, transparent 10%, transparent 0%); + background-repeat: no-repeat; + background-position: center; + background-size: 1000% 1000%; + outline: 0 solid transparent; + outline-offset: 2px; + color: #eff1f5; +} + +headerbar popover.background button:focus:not(.suggested-action):not(.destructive-action):not(.flat), button:focus { + outline: 2px solid rgba(137, 180, 250, 0.35); + outline-offset: 0; +} + +headerbar popover.background button:hover:not(.suggested-action):not(.destructive-action):not(.flat), button:hover { + background-color: alpha(currentColor, 0.08); + color: #eff1f5; + outline: 0 solid transparent; + -gtk-icon-filter: brightness(1.2); +} + +headerbar popover.background button.keyboard-activating:not(.suggested-action):not(.destructive-action):not(.flat), button.keyboard-activating, headerbar popover.background button:active:not(.suggested-action):not(.destructive-action):not(.flat), button:active { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms, border 0ms; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + background-image: radial-gradient(circle, alpha(currentColor, 0.08) 10%, transparent 0%); + background-size: 0% 0%; + background-color: alpha(currentColor, 0.08); + color: #eff1f5; + outline: 0 solid transparent; +} + +headerbar popover.background button:disabled:not(.suggested-action):not(.destructive-action):not(.flat), button:disabled { + background-color: rgba(239, 241, 245, 0.04); + color: rgba(239, 241, 245, 0.5); + outline-color: transparent; +} + +headerbar popover.background button:checked:not(.suggested-action):not(.destructive-action):not(.flat), button:checked { + background-color: #89b4fa; + color: rgba(30, 30, 46, 0.87); +} + +headerbar popover.background button:checked:hover:not(.suggested-action):not(.destructive-action):not(.flat), button:checked:hover { + outline-color: transparent; + background-color: #a1c4fb; + color: rgba(30, 30, 46, 0.87); +} + +headerbar popover.background button:checked:disabled:not(.suggested-action):not(.destructive-action):not(.flat), button:checked:disabled { + outline-color: transparent; + background-color: rgba(137, 180, 250, 0.35); + color: rgba(30, 30, 46, 0.38); +} + +placessidebar list.navigation-sidebar > row button.sidebar-button, calendar > header > button, scrollbar button, notebook > header > tabs > arrow, popover modelbutton, spinbutton > button, splitbutton.flat > button, +splitbutton.flat > menubutton > button { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1); + background-image: radial-gradient(circle, transparent 10%, transparent 0%); + background-repeat: no-repeat; + background-position: center; + background-size: 1000% 1000%; + background-color: transparent; + outline: 0 solid transparent; + outline-offset: 2px; + color: rgba(239, 241, 245, 0.7); +} + +placessidebar list.navigation-sidebar > row button.sidebar-button:focus:not(:hover):not(:active), calendar > header > button:focus:not(:hover):not(:active), scrollbar button:focus:not(:hover):not(:active), notebook > header > tabs > arrow:focus:not(:hover):not(:active), popover modelbutton:focus:not(:hover):not(:active), spinbutton > button:focus:not(:hover):not(:active), splitbutton.flat > button:focus:not(:hover):not(:active), +splitbutton.flat > menubutton > button:focus:not(:hover):not(:active) { + color: #eff1f5; + outline: 2px solid transparent; + /* outline: 2px solid $fill; */ + outline-offset: -2px; +} + +placessidebar list.navigation-sidebar > row button.sidebar-button:hover, calendar > header > button:hover, scrollbar button:hover, notebook > header > tabs > arrow:hover, popover modelbutton:hover, spinbutton > button:hover, splitbutton.flat > button:hover, +splitbutton.flat > menubutton > button:hover { + background-color: alpha(currentColor, 0.08); + color: #eff1f5; +} + +placessidebar list.navigation-sidebar > row button.sidebar-button:active, calendar > header > button:active, scrollbar button:active, notebook > header > tabs > arrow:active, popover modelbutton:active, spinbutton > button:active, splitbutton.flat > button:active, +splitbutton.flat > menubutton > button:active { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + background-image: radial-gradient(circle, alpha(currentColor, 0.08) 10%, transparent 0%); + background-size: 0% 0%; + background-color: alpha(currentColor, 0.08); + color: #eff1f5; +} + +placessidebar list.navigation-sidebar > row button.sidebar-button:disabled, calendar > header > button:disabled, scrollbar button:disabled, notebook > header > tabs > arrow:disabled, popover modelbutton:disabled, spinbutton > button:disabled, splitbutton.flat > button:disabled, +splitbutton.flat > menubutton > button:disabled { + color: rgba(239, 241, 245, 0.32); + background-color: transparent; +} + +#NautilusPathButton, filechooser #pathbarbox > stack > box > button, window.messagedialog .response-area button, window.dialog.message .dialog-action-area > button, .app-notification button, .toolbar button, dropdown > .linked:not(.vertical) > button:not(:only-child), +combobox > .linked:not(.vertical) > button:not(:only-child), splitbutton.suggested-action > button, +splitbutton.suggested-action > menubutton > button, splitbutton.destructive-action > button, +splitbutton.destructive-action > menubutton > button, splitbutton.opaque > button, +splitbutton.opaque > menubutton > button, menubutton.suggested-action > button, menubutton.destructive-action > button, menubutton.opaque > button, menubutton.flat > button, button.flat { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1); + background-image: radial-gradient(circle, transparent 10%, transparent 0%); + background-repeat: no-repeat; + background-position: center; + background-size: 1000% 1000%; + background-color: transparent; + outline: 0 solid transparent; + outline-offset: 2px; + color: rgba(239, 241, 245, 0.7); +} + +#NautilusPathButton:focus:not(:hover):not(:active), filechooser #pathbarbox > stack > box > button:focus:not(:hover):not(:active), window.messagedialog .response-area button:focus:not(:hover):not(:active), window.dialog.message .dialog-action-area > button:focus:not(:hover):not(:active), .app-notification button:focus:not(:hover):not(:active), .toolbar button:focus:not(:hover):not(:active), dropdown > .linked:not(.vertical) > button:focus:not(:hover):not(:active):not(:only-child), +combobox > .linked:not(.vertical) > button:focus:not(:hover):not(:active):not(:only-child), splitbutton.suggested-action > button:focus:not(:hover):not(:active), +splitbutton.suggested-action > menubutton > button:focus:not(:hover):not(:active), splitbutton.destructive-action > button:focus:not(:hover):not(:active), +splitbutton.destructive-action > menubutton > button:focus:not(:hover):not(:active), splitbutton.opaque > button:focus:not(:hover):not(:active), +splitbutton.opaque > menubutton > button:focus:not(:hover):not(:active), menubutton.suggested-action > button:focus:not(:hover):not(:active), menubutton.destructive-action > button:focus:not(:hover):not(:active), menubutton.opaque > button:focus:not(:hover):not(:active), menubutton.flat > button:focus:not(:hover):not(:active), button.flat:focus:not(:hover):not(:active) { + color: #eff1f5; + outline: 2px solid transparent; + /* outline: 2px solid $fill; */ + outline-offset: -2px; +} + +#NautilusPathButton:hover, filechooser #pathbarbox > stack > box > button:hover, window.messagedialog .response-area button:hover, window.dialog.message .dialog-action-area > button:hover, .app-notification button:hover, .toolbar button:hover, dropdown > .linked:not(.vertical) > button:hover:not(:only-child), +combobox > .linked:not(.vertical) > button:hover:not(:only-child), splitbutton.suggested-action > button:hover, +splitbutton.suggested-action > menubutton > button:hover, splitbutton.destructive-action > button:hover, +splitbutton.destructive-action > menubutton > button:hover, splitbutton.opaque > button:hover, +splitbutton.opaque > menubutton > button:hover, menubutton.suggested-action > button:hover, menubutton.destructive-action > button:hover, menubutton.opaque > button:hover, menubutton.flat > button:hover, button.flat:hover { + background-color: alpha(currentColor, 0.08); + color: #eff1f5; +} + +#NautilusPathButton:active, filechooser #pathbarbox > stack > box > button:active, window.messagedialog .response-area button:active, window.dialog.message .dialog-action-area > button:active, .app-notification button:active, .toolbar button:active, dropdown > .linked:not(.vertical) > button:active:not(:only-child), +combobox > .linked:not(.vertical) > button:active:not(:only-child), splitbutton.suggested-action > button:active, +splitbutton.suggested-action > menubutton > button:active, splitbutton.destructive-action > button:active, +splitbutton.destructive-action > menubutton > button:active, splitbutton.opaque > button:active, +splitbutton.opaque > menubutton > button:active, menubutton.suggested-action > button:active, menubutton.destructive-action > button:active, menubutton.opaque > button:active, menubutton.flat > button:active, button.flat:active { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + background-image: radial-gradient(circle, alpha(currentColor, 0.08) 10%, transparent 0%); + background-size: 0% 0%; + background-color: alpha(currentColor, 0.08); + color: #eff1f5; +} + +#NautilusPathButton:disabled, filechooser #pathbarbox > stack > box > button:disabled, window.messagedialog .response-area button:disabled, window.dialog.message .dialog-action-area > button:disabled, .app-notification button:disabled, .toolbar button:disabled, dropdown > .linked:not(.vertical) > button:disabled:not(:only-child), +combobox > .linked:not(.vertical) > button:disabled:not(:only-child), splitbutton.suggested-action > button:disabled, +splitbutton.suggested-action > menubutton > button:disabled, splitbutton.destructive-action > button:disabled, +splitbutton.destructive-action > menubutton > button:disabled, splitbutton.opaque > button:disabled, +splitbutton.opaque > menubutton > button:disabled, menubutton.suggested-action > button:disabled, menubutton.destructive-action > button:disabled, menubutton.opaque > button:disabled, menubutton.flat > button:disabled, button.flat:disabled { + color: rgba(239, 241, 245, 0.32); + background-color: transparent; +} + +#NautilusPathButton:checked, filechooser #pathbarbox > stack > box > button:checked, window.messagedialog .response-area button:checked, window.dialog.message .dialog-action-area > button:checked, .app-notification button:checked, .toolbar button:checked, dropdown > .linked:not(.vertical) > button:checked:not(:only-child), +combobox > .linked:not(.vertical) > button:checked:not(:only-child), splitbutton.suggested-action > button:checked, +splitbutton.suggested-action > menubutton > button:checked, splitbutton.destructive-action > button:checked, +splitbutton.destructive-action > menubutton > button:checked, splitbutton.opaque > button:checked, +splitbutton.opaque > menubutton > button:checked, menubutton.suggested-action > button:checked, menubutton.destructive-action > button:checked, menubutton.opaque > button:checked, menubutton.flat > button:checked, button.flat:checked { + background-color: alpha(currentColor, 0.1); + color: #eff1f5; +} + +#NautilusPathButton:checked:disabled, filechooser #pathbarbox > stack > box > button:checked:disabled, window.messagedialog .response-area button:checked:disabled, window.dialog.message .dialog-action-area > button:checked:disabled, .app-notification button:checked:disabled, .toolbar button:checked:disabled, dropdown > .linked:not(.vertical) > button:checked:disabled:not(:only-child), +combobox > .linked:not(.vertical) > button:checked:disabled:not(:only-child), splitbutton.suggested-action > button:checked:disabled, +splitbutton.suggested-action > menubutton > button:checked:disabled, splitbutton.destructive-action > button:checked:disabled, +splitbutton.destructive-action > menubutton > button:checked:disabled, splitbutton.opaque > button:checked:disabled, +splitbutton.opaque > menubutton > button:checked:disabled, menubutton.suggested-action > button:checked:disabled, menubutton.destructive-action > button:checked:disabled, menubutton.opaque > button:checked:disabled, menubutton.flat > button:checked:disabled, button.flat:checked:disabled { + background-color: alpha(currentColor, 0.1); + color: rgba(239, 241, 245, 0.5); +} + +button.opaque { + box-shadow: none; +} + +.osd button.opaque:focus:focus-visible { + outline-color: rgba(239, 241, 245, 0.15); +} + +button.opaque:hover { + background-image: image(alpha(currentColor, 0.1)); +} + +button.keyboard-activating.opaque, button.opaque:active { + background-image: image(rgba(0, 0, 0, 0.2)); +} + +button.opaque:checked { + background-image: image(rgba(0, 0, 0, 0.15)); +} + +button.opaque:checked:hover { + background-image: image(rgba(0, 0, 0, 0.05)); +} + +button.opaque:checked.keyboard-activating, button.opaque:checked:active { + background-image: image(rgba(0, 0, 0, 0.3)); +} + +.nautilus-window .floating-bar button, placessidebar list.navigation-sidebar > row button.sidebar-button, notebook > header > tabs > tab button.flat, popover.menu box.circular-buttons button.circular.image-button.model, spinbutton > button { + min-height: 24px; + min-width: 24px; + padding: 0; + border-radius: 9999px; +} + +button { + min-height: 24px; + min-width: 16px; + padding: 5px 9px; + border-radius: 9px; + font-weight: 500; +} + +button:drop(active) { + background-color: alpha(currentColor, 0.08); + color: #eff1f5; + outline: 0 solid transparent; +} + +button separator { + margin: 4px 1px; +} + +button.opaque { + background-color: #484856; + color: #eff1f5; +} + +button.text-button { + min-width: 32px; + padding-left: 16px; + padding-right: 16px; +} + +button.image-button { + min-width: 24px; + padding: 5px; +} + +button.text-button.image-button, button.image-text-button { + min-width: 24px; + padding: 5px; + border-radius: 12px; +} + +button.text-button.image-button > box, +button.text-button.image-button > box > box, button.image-text-button > box, +button.image-text-button > box > box { + border-spacing: 4px; +} + +button.text-button.image-button > box > label, +button.text-button.image-button > box > box > label, button.image-text-button > box > label, +button.image-text-button > box > box > label { + padding-left: 2px; + padding-right: 2px; +} + +button.text-button.image-button label:first-child, button.image-text-button label:first-child { + margin-left: 11px; +} + +button.text-button.image-button label:last-child, button.image-text-button label:last-child { + margin-right: 11px; +} + +button.text-button.image-button.flat label:first-child, button.image-text-button.flat label:first-child { + margin-left: 7px; +} + +button.text-button.image-button.flat label:last-child, button.image-text-button.flat label:last-child { + margin-right: 7px; +} + +button.text-button.image-button image:not(:only-child), button.image-text-button image:not(:only-child) { + margin: 0 4px; +} + +button.arrow-button { + padding-left: 9px; + padding-right: 9px; +} + +button.arrow-button > box { + border-spacing: 4px; +} + +button.arrow-button.text-button { + padding-left: 16px; + padding-right: 16px; +} + +button.arrow-button.text-button > box { + border-spacing: 6px; +} + +menubutton.pill > button, button.pill { + padding: 9px 30px; + border-radius: 9999px; +} + +button.card { + background-color: #313244; + background-clip: padding-box; + font-weight: inherit; + border: 1px solid rgba(239, 241, 245, 0.12); + background-clip: border-box; +} + +button.card:hover { + background-image: none; + background-color: alpha(currentColor, 0.08); + color: #eff1f5; + outline: 0 solid transparent; +} + +button.card.keyboard-activating, button.card:active { + background-image: none; + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms, border 0ms; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + background-image: radial-gradient(circle, alpha(currentColor, 0.08) 10%, transparent 0%); + background-size: 0% 0%; + background-color: alpha(currentColor, 0.08); + color: #eff1f5; + outline: 0 solid transparent; +} + +button.card:checked { + background-image: none; + background-color: #89b4fa; + color: rgba(30, 30, 46, 0.87); + border-color: #89b4fa; +} + +button.card:checked:hover { + background-image: none; + outline-color: transparent; + background-color: #a1c4fb; + color: rgba(30, 30, 46, 0.87); +} + +button.card:checked:disabled { + outline-color: transparent; + background-color: rgba(137, 180, 250, 0.35); + color: rgba(30, 30, 46, 0.38); +} + +button.card:checked.keyboard-activating, button.card:checked:active { + background-image: none; +} + +button.card:checked.has-open-popup { + background-image: none; +} + +button.card:drop(active) { + color: #fab387; + box-shadow: inset 0 0 0 1px #fab387; +} + +.linked:not(.vertical) > button:focus, .linked.vertical > button:focus { + box-shadow: none; + outline: none; +} + +.linked:not(.vertical) > button.flat:not(:only-child), .linked.vertical > button.flat:not(:only-child) { + background-color: alpha(currentColor, 0.05); +} + +.linked:not(.vertical) > button.flat:focus, .linked.vertical > button.flat:focus { + box-shadow: none; + outline: none; +} + +.linked:not(.vertical) > menubutton > button { + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} + +button.osd { + min-width: 24px; + min-width: 24px; + padding: 5px; + box-shadow: none; + background-color: rgba(0, 0, 0, 0.35); + color: #eff1f5; +} + +button.osd > image { + padding: 0; +} + +button.osd.remove-button { + padding: 0; +} + +button.osd:focus { + outline-color: transparent; +} + +button.osd:hover { + background-color: rgba(0, 0, 0, 0.45); + color: #eff1f5; +} + +button.osd:active { + background-color: rgba(0, 0, 0, 0.65); + color: #eff1f5; +} + +button.osd:disabled { + background-color: rgba(0, 0, 0, 0.15); + color: rgba(239, 241, 245, 0.35); +} + +button.suggested-action { + background-color: #1e66f5; + color: #eff1f5; + box-shadow: none; +} + +button.suggested-action:hover { + background-color: #3374f5; +} + +button.suggested-action:disabled { + background-color: rgba(239, 241, 245, 0.04); + color: rgba(239, 241, 245, 0.5); + outline-color: transparent; +} + +button.suggested-action:checked { + background-color: #5d90f5; +} + +button.suggested-action:focus { + box-shadow: 0 0 0 2px rgba(30, 102, 245, 0.35); +} + +button.suggested-action.flat { + background-color: transparent; + color: #1e66f5; +} + +button.suggested-action.flat:disabled { + color: rgba(239, 241, 245, 0.32); + background-color: transparent; +} + +button.suggested-action.flat:checked { + background-color: rgba(30, 102, 245, 0.3); +} + +button.destructive-action { + background-color: #d20f39; + color: #eff1f5; + box-shadow: none; +} + +button.destructive-action:hover { + background-color: #d5264c; +} + +button.destructive-action:disabled { + background-color: rgba(239, 241, 245, 0.04); + color: rgba(239, 241, 245, 0.5); + outline-color: transparent; +} + +button.destructive-action:checked { + background-color: #db5371; +} + +button.destructive-action:focus { + box-shadow: 0 0 0 2px rgba(210, 15, 57, 0.35); +} + +button.destructive-action.flat { + background-color: transparent; + color: #d20f39; +} + +button.destructive-action.flat:disabled { + color: rgba(239, 241, 245, 0.32); + background-color: transparent; +} + +button.destructive-action.flat:checked { + background-color: rgba(210, 15, 57, 0.3); +} + +stackswitcher > button > label { + margin: 0 -6px; + padding: 0 6px; +} + +stackswitcher > button > image { + margin: -3px -6px; + padding: 3px 6px; +} + +stackswitcher > button.needs-attention:checked > label, +stackswitcher > button.needs-attention:checked > image { + animation: none; + background-image: none; +} + +button.font > box, button.file > box { + border-spacing: 6px; +} + +button.font > box > box > label, button.file > box > box > label { + font-weight: bold; +} + +windowcontrols > button:not(.suggested-action):not(.destructive-action), filechooser #pathbarbox > stack > box > button, menubutton.circular > button, button.close, button.circular { + border-radius: 9999px; +} + +windowcontrols > button:not(.suggested-action):not(.destructive-action) label, filechooser #pathbarbox > stack > box > button label, menubutton.circular > button label, button.close label, button.circular label { + padding: 0; +} + +menubutton.osd { + background: none; + color: inherit; +} + +menubutton.suggested-action { + background-color: #1e66f5; + color: #eff1f5; +} + +menubutton.destructive-action { + background-color: #d20f39; + color: #eff1f5; +} + +menubutton.opaque { + background-color: #484856; + color: #eff1f5; +} + +menubutton.suggested-action, menubutton.destructive-action, menubutton.opaque { + border-radius: 12px; +} + +menubutton.suggested-action.circular, menubutton.suggested-action.pill, menubutton.destructive-action.circular, menubutton.destructive-action.pill, menubutton.opaque.circular, menubutton.opaque.pill { + border-radius: 9999px; +} + +menubutton.suggested-action > button, menubutton.suggested-action > button:checked, menubutton.destructive-action > button, menubutton.destructive-action > button:checked, menubutton.opaque > button, menubutton.opaque > button:checked { + background-color: transparent; + color: inherit; +} + +menubutton.image-button > button { + min-width: 24px; + padding-left: 6px; + padding-right: 6px; +} + +menubutton arrow { + min-height: 16px; + min-width: 16px; +} + +menubutton arrow.none { + -gtk-icon-source: -gtk-icontheme("open-menu-symbolic"); +} + +menubutton arrow.down { + -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); +} + +menubutton arrow.up { + -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); +} + +menubutton arrow.left { + -gtk-icon-source: -gtk-icontheme("pan-start-symbolic"); +} + +menubutton arrow.right { + -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); +} + +splitbutton { + border-radius: 12px; +} + +splitbutton, splitbutton > separator { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1); + transition-property: background-color; +} + +splitbutton > separator { + min-width: 0; + margin-top: 6px; + margin-bottom: 6px; + background-color: transparent; + background: none; +} + +splitbutton > menubutton > button { + padding: 5px 9px; +} + +splitbutton.image-button > button { + min-width: 24px; + padding-left: 6px; + padding-right: 6px; +} + +splitbutton.text-button.image-button > button, splitbutton.image-text-button > button { + padding-left: 9px; + padding-right: 9px; +} + +splitbutton.text-button.image-button > button > box, splitbutton.image-text-button > button > box { + border-spacing: 6px; +} + +splitbutton > button:dir(ltr), +splitbutton > menubutton > button:dir(rtl) { + border-top-right-radius: 0; + border-bottom-right-radius: 0; + margin-right: 0; +} + +splitbutton > button:dir(rtl), +splitbutton > menubutton > button:dir(ltr) { + border-top-left-radius: 0; + border-bottom-left-radius: 0; + margin-left: 0; +} + +splitbutton.flat > separator { + background: rgba(239, 241, 245, 0.12); +} + +splitbutton.flat:hover, splitbutton.flat:active, splitbutton.flat:checked { + background: alpha(currentColor, 0.07); +} + +splitbutton.flat:hover > separator, splitbutton.flat:active > separator, splitbutton.flat:checked > separator { + background: none; +} + +splitbutton.flat:focus-within:focus-visible > separator { + background: none; +} + +splitbutton.flat > button, +splitbutton.flat > menubutton > button { + border-radius: 12px; +} + +splitbutton.suggested-action { + background-color: #1e66f5; + color: #eff1f5; +} + +splitbutton.destructive-action { + background-color: #d20f39; + color: #eff1f5; +} + +splitbutton.opaque { + background-color: #484856; + color: #eff1f5; +} + +splitbutton.suggested-action > button, splitbutton.suggested-action > button:checked, +splitbutton.suggested-action > menubutton > button, +splitbutton.suggested-action > menubutton > button:checked, splitbutton.destructive-action > button, splitbutton.destructive-action > button:checked, +splitbutton.destructive-action > menubutton > button, +splitbutton.destructive-action > menubutton > button:checked, splitbutton.opaque > button, splitbutton.opaque > button:checked, +splitbutton.opaque > menubutton > button, +splitbutton.opaque > menubutton > button:checked { + color: inherit; + background-color: transparent; +} + +splitbutton.suggested-action > menubutton > button:dir(ltr), splitbutton.destructive-action > menubutton > button:dir(ltr), splitbutton.opaque > menubutton > button:dir(ltr) { + box-shadow: inset 1px 0 rgba(239, 241, 245, 0.12); +} + +splitbutton.suggested-action > menubutton > button:dir(rtl), splitbutton.destructive-action > menubutton > button:dir(rtl), splitbutton.opaque > menubutton > button:dir(rtl) { + box-shadow: inset -1px 0 rgba(239, 241, 245, 0.12); +} + +splitbutton > menubutton > button > arrow.none { + -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); +} + +buttoncontent { + border-spacing: 6px; +} + +buttoncontent > label { + font-weight: bold; +} + +buttoncontent > label:dir(ltr) { + padding-right: 2px; +} + +buttoncontent > label:dir(rtl) { + padding-left: 2px; +} + +.arrow-button > box > buttoncontent > label:dir(ltr), splitbutton > button > buttoncontent > label:dir(ltr) { + padding-right: 0; +} + +.arrow-button > box > buttoncontent > label:dir(rtl), splitbutton > button > buttoncontent > label:dir(rtl) { + padding-left: 0; +} + +button.color { + min-height: 24px; + min-width: 24px; + padding: 6px; +} + +stacksidebar row.needs-attention > label, stackswitcher > button.needs-attention > label, +stackswitcher > button.needs-attention > image { + animation: needs-attention 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + background-repeat: no-repeat; + background-position: right 3px; + background-size: 6px 6px; +} + +stacksidebar row.needs-attention > label:dir(rtl), stackswitcher > button.needs-attention > label:dir(rtl), +stackswitcher > button.needs-attention > image:dir(rtl) { + background-position: left 3px; +} + +.linked:not(.vertical) > entry, .linked:not(.vertical) > button, .linked:not(.vertical) > button.image-button { + border-radius: 0; +} + +.linked:not(.vertical) > entry:first-child, .linked:not(.vertical) > button:first-child { + border-top-left-radius: 12px; + border-bottom-left-radius: 12px; +} + +.linked:not(.vertical) > entry:last-child, .linked:not(.vertical) > button:last-child { + border-top-right-radius: 12px; + border-bottom-right-radius: 12px; +} + +.linked:not(.vertical) > entry:only-child, .linked:not(.vertical) > button:only-child { + border-radius: 12px; +} + +.linked.vertical > entry, .linked.vertical > button, .linked.vertical > button.image-button { + border-radius: 0; +} + +.linked.vertical > entry:first-child, .linked.vertical > button:first-child { + border-top-left-radius: 12px; + border-top-right-radius: 12px; +} + +.linked.vertical > entry:last-child, .linked.vertical > button:last-child { + border-bottom-left-radius: 12px; + border-bottom-right-radius: 12px; +} + +.linked.vertical > entry:only-child, .linked.vertical > button:only-child { + border-radius: 12px; +} + +.linked:not(.vertical) > button:dir(ltr):not(:first-child), .linked:not(.vertical) > button:dir(rtl):not(:last-child) { + border-top-left-radius: 3px; + border-bottom-left-radius: 3px; + margin-left: 1px; +} + +.linked:not(.vertical) > button:dir(ltr):not(:last-child), .linked:not(.vertical) > button:dir(rtl):not(:first-child) { + border-top-right-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked.vertical button:not(:first-child) { + border-top-left-radius: 3px; + border-top-right-radius: 3px; + margin-top: 1px; +} + +.linked.vertical button:not(:last-child) { + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked:not(.vertical) > menubutton:dir(ltr):not(:first-child) > button, .linked:not(.vertical) > menubutton:dir(rtl):not(:last-child) > button { + border-top-left-radius: 3px; + border-bottom-left-radius: 3px; + margin-left: 1px; +} + +.linked:not(.vertical) > menubutton:dir(ltr):not(:last-child) > button, .linked:not(.vertical) > menubutton:dir(rtl):not(:first-child) > button { + border-top-right-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked.vertical menubutton:not(:first-child) > button { + border-top-left-radius: 3px; + border-top-right-radius: 3px; + margin-top: 1px; +} + +.linked.vertical menubutton:not(:last-child) > button { + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked:not(.vertical) > dropdown:dir(ltr):not(:first-child) > button, .linked:not(.vertical) > dropdown:dir(rtl):not(:last-child) > button { + border-top-left-radius: 3px; + border-bottom-left-radius: 3px; + margin-left: 1px; +} + +.linked:not(.vertical) > dropdown:dir(ltr):not(:last-child) > button, .linked:not(.vertical) > dropdown:dir(rtl):not(:first-child) > button { + border-top-right-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked.vertical dropdown:not(:first-child) > button { + border-top-left-radius: 3px; + border-top-right-radius: 3px; + margin-top: 1px; +} + +.linked.vertical dropdown:not(:last-child) > button { + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked:not(.vertical) > colorbutton:dir(ltr):not(:first-child) > button, .linked:not(.vertical) > colorbutton:dir(rtl):not(:last-child) > button { + border-top-left-radius: 3px; + border-bottom-left-radius: 3px; + margin-left: 1px; +} + +.linked:not(.vertical) > colorbutton:dir(ltr):not(:last-child) > button, .linked:not(.vertical) > colorbutton:dir(rtl):not(:first-child) > button { + border-top-right-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked.vertical colorbutton:not(:first-child) > button { + border-top-left-radius: 3px; + border-top-right-radius: 3px; + margin-top: 1px; +} + +.linked.vertical colorbutton:not(:last-child) > button { + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked:not(.vertical) > fontbutton:dir(ltr):not(:first-child) > button, .linked:not(.vertical) > fontbutton:dir(rtl):not(:last-child) > button { + border-top-left-radius: 3px; + border-bottom-left-radius: 3px; + margin-left: 1px; +} + +.linked:not(.vertical) > fontbutton:dir(ltr):not(:last-child) > button, .linked:not(.vertical) > fontbutton:dir(rtl):not(:first-child) > button { + border-top-right-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked.vertical fontbutton:not(:first-child) > button { + border-top-left-radius: 3px; + border-top-right-radius: 3px; + margin-top: 1px; +} + +.linked.vertical fontbutton:not(:last-child) > button { + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked:not(.vertical) > tabbutton:dir(ltr):not(:first-child) > button, .linked:not(.vertical) > tabbutton:dir(rtl):not(:last-child) > button { + border-top-left-radius: 3px; + border-bottom-left-radius: 3px; + margin-left: 1px; +} + +.linked:not(.vertical) > tabbutton:dir(ltr):not(:last-child) > button, .linked:not(.vertical) > tabbutton:dir(rtl):not(:first-child) > button { + border-top-right-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked.vertical tabbutton:not(:first-child) > button { + border-top-left-radius: 3px; + border-top-right-radius: 3px; + margin-top: 1px; +} + +.linked.vertical tabbutton:not(:last-child) > button { + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked:not(.vertical) > entry:dir(ltr):not(:first-child), .linked:not(.vertical) > entry:dir(rtl):not(:last-child) { + border-top-left-radius: 3px; + border-bottom-left-radius: 3px; + margin-left: 1px; +} + +.linked:not(.vertical) > entry:dir(ltr):not(:last-child), .linked:not(.vertical) > entry:dir(rtl):not(:first-child) { + border-top-right-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked.vertical entry:not(:first-child) { + border-top-left-radius: 3px; + border-top-right-radius: 3px; + margin-top: 1px; +} + +.linked.vertical entry:not(:last-child) { + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked:not(.vertical) > combobox:dir(ltr):not(:first-child) > box > button.combo, .linked:not(.vertical) > combobox:dir(rtl):not(:last-child) > box > button.combo { + border-top-left-radius: 3px; + border-bottom-left-radius: 3px; + margin-left: 1px; +} + +.linked:not(.vertical) > combobox:dir(ltr):not(:last-child) > box > button.combo, .linked:not(.vertical) > combobox:dir(rtl):not(:first-child) > box > button.combo { + border-top-right-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked.vertical combobox:not(:first-child) > box > button.combo { + border-top-left-radius: 3px; + border-top-right-radius: 3px; + margin-top: 1px; +} + +.linked.vertical combobox:not(:last-child) > box > button.combo { + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked:not(.vertical) > appchooserbutton:dir(ltr):not(:first-child) > combobox > box > button.combo, .linked:not(.vertical) > appchooserbutton:dir(rtl):not(:last-child) > combobox > box > button.combo { + border-top-left-radius: 3px; + border-bottom-left-radius: 3px; + margin-left: 1px; +} + +.linked:not(.vertical) > appchooserbutton:dir(ltr):not(:last-child) > combobox > box > button.combo, .linked:not(.vertical) > appchooserbutton:dir(rtl):not(:first-child) > combobox > box > button.combo { + border-top-right-radius: 3px; + border-bottom-right-radius: 3px; +} + +.linked.vertical appchooserbutton:not(:first-child) > combobox > box > button.combo { + border-top-left-radius: 3px; + border-top-right-radius: 3px; + margin-top: 1px; +} + +.linked.vertical appchooserbutton:not(:last-child) > combobox > box > button.combo { + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; +} + + +list > row button.image-button:not(.flat) { + background-color: transparent; + box-shadow: none; + border: none; +} + + +list > row button.image-button:not(.flat):hover { + background-color: alpha(currentColor, 0.08); + color: #eff1f5; + outline: 0 solid transparent; +} + + +list > row button.image-button:not(.flat):active, +list > row button.image-button:not(.flat):checked { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms, border 0ms; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + background-image: radial-gradient(circle, alpha(currentColor, 0.08) 10%, transparent 0%); + background-size: 0% 0%; + background-color: alpha(currentColor, 0.08); + color: #eff1f5; + outline: 0 solid transparent; +} + + +list > row button.image-button:not(.flat).suggested-action { + background-color: #1e66f5; + color: #eff1f5; +} + + +list > row button.image-button:not(.flat).destructive-action { + background-color: #d20f39; + color: #eff1f5; +} + +/********* + * Links * + *********/ +link { + color: #8fcbe8; +} + +link:visited { + color: #8839ef; +} + +button.link:link, button.link:link:focus, button.link:link:hover, button.link:link:active { + color: #8fcbe8; +} + +button.link:visited, button.link:visited:focus, button.link:visited:hover, button.link:visited:active { + color: #8839ef; +} + +button.link > label { + text-decoration-line: underline; +} + +/***************** + * GtkSpinButton * + *****************/ +spinbutton { + border-radius: 12px; + padding: 0; + border-spacing: 0; + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(239, 241, 245, 0.08); + color: rgba(239, 241, 245, 0.7); + outline: 0 solid transparent; + outline-offset: 2px; +} + +spinbutton:focus-within { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + background-color: rgba(239, 241, 245, 0.08); + box-shadow: inset 0 0 0 2px transparent; + color: #eff1f5; + outline: 2px solid #89b4fa; + outline-offset: -2px; +} + +spinbutton:disabled { + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(239, 241, 245, 0.08); + color: rgba(239, 241, 245, 0.5); + outline: none; +} + +spinbutton > text { + border-image: none; + border-radius: 0; + box-shadow: none; + background-color: transparent; + margin: 0; +} + +spinbutton > button { + border: none; +} + +spinbutton > button:focus:not(:hover):not(:active):not(:disabled) { + box-shadow: none; +} + +spinbutton:not(.vertical) > text { + min-width: 30px; + padding-left: 12px; +} + +spinbutton:not(.vertical) > button { + padding: 0; + margin: 6px; +} + +spinbutton:not(.vertical) > button.up:dir(ltr), spinbutton:not(.vertical) > button.down:dir(rtl) { + margin-left: 3px; +} + +spinbutton:not(.vertical) > button.up:dir(rtl), spinbutton:not(.vertical) > button.down:dir(ltr) { + margin-right: 3px; +} + +cell.activatable spinbutton:not(.vertical) { + margin: 3px 0; +} + +cell.activatable spinbutton:not(.vertical) > button { + margin: 0; + padding: 0; + min-height: 24px; + border-radius: 0; +} + +cell.activatable spinbutton:not(.vertical) > button:last-child { + border-radius: 0 12px 12px 0; +} + +cell.activatable spinbutton:not(.vertical) > button.up:dir(ltr), cell.activatable spinbutton:not(.vertical) > button.down:dir(rtl) { + margin-left: 0; +} + +cell.activatable spinbutton:not(.vertical) > button.up:dir(rtl), cell.activatable spinbutton:not(.vertical) > button.down:dir(ltr) { + margin-right: 0; +} + +spinbutton.vertical > text { + min-height: 34px; + min-width: 40px; + padding: 0; +} + +spinbutton.vertical > button { + padding: 0; + margin: 6px 8px; +} + +/************** + * ComboBoxes * + **************/ +dropdown > button > box { + border-spacing: 6px; +} + +dropdown arrow, +combobox arrow { + -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); + min-height: 16px; + min-width: 16px; +} + +dropdown > popover.menu > contents modelbutton, +combobox > popover.menu > contents modelbutton { + padding-left: 9px; + padding-right: 9px; +} + +dropdown button.combo cellview:dir(ltr), +combobox button.combo cellview:dir(ltr) { + margin-left: -1px; +} + +dropdown button.combo cellview:dir(rtl), +combobox button.combo cellview:dir(rtl) { + margin-right: -1px; +} + +dropdown popover, +combobox popover { + margin-top: 4px; + padding: 0; +} + +dropdown popover listview, +combobox popover listview { + margin: 0; +} + +dropdown popover listview > row, +combobox popover listview > row { + padding: 6px; +} + +dropdown popover listview > row:selected, +combobox popover listview > row:selected { + color: #eff1f5; + background-color: alpha(currentColor, 0.06); +} + +dropdown popover .dropdown-searchbar, +combobox popover .dropdown-searchbar { + padding: 6px; +} + +dropdown.linked button:nth-child(2):dir(ltr), +combobox.linked button:nth-child(2):dir(ltr) { + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} + +dropdown.linked button:nth-child(2):dir(rtl), +combobox.linked button:nth-child(2):dir(rtl) { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} + +dropdown > .linked:not(.vertical) > entry:not(:only-child), +combobox > .linked:not(.vertical) > entry:not(:only-child) { + border-radius: 12px; +} + +dropdown > .linked:not(.vertical) > entry:not(:only-child):first-child, +combobox > .linked:not(.vertical) > entry:not(:only-child):first-child { + margin-right: -34px; + padding-right: 34px; +} + +dropdown > .linked:not(.vertical) > entry:not(:only-child):last-child, +combobox > .linked:not(.vertical) > entry:not(:only-child):last-child { + margin-left: -34px; + padding-left: 34px; +} + +dropdown > .linked:not(.vertical) > button:not(:only-child), +combobox > .linked:not(.vertical) > button:not(:only-child) { + min-height: 16px; + min-width: 16px; + margin: 5px; + padding: 4px; + border-radius: 12px; +} + +.linked:not(.vertical) > combobox:not(:first-child) > box > button.combo { + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} + +.linked:not(.vertical) > combobox:not(:last-child) > box > button.combo { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} + +.linked.vertical > combobox:not(:first-child) > box > button.combo { + border-top-left-radius: 0; + border-top-right-radius: 0; +} + +.linked.vertical > combobox:not(:last-child) > box > button.combo { + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; +} + +button.combo:only-child { + border-radius: 12px; + font-weight: normal; + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0, 0, 0.2, 1); + box-shadow: inset 0 0 0 2px transparent; + background-color: rgba(239, 241, 245, 0.08); + color: rgba(239, 241, 245, 0.7); + outline: 0 solid transparent; + outline-offset: 2px; +} + +button.combo:only-child:focus { + color: #eff1f5; + outline: 2px solid transparent; + /* outline: 2px solid $fill; */ + outline-offset: -2px; +} + +button.combo:only-child:hover { + background-color: alpha(currentColor, 0.08); + color: #eff1f5; +} + +button.combo:only-child:active { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + background-image: radial-gradient(circle, alpha(currentColor, 0.08) 10%, transparent 0%); + background-size: 0% 0%; + background-color: alpha(currentColor, 0.08); + color: #eff1f5; +} + +button.combo:only-child:checked { + background-color: alpha(currentColor, 0.1); + color: #eff1f5; +} + +button.combo:only-child:disabled { + background-color: rgba(239, 241, 245, 0.04); + color: rgba(239, 241, 245, 0.5); + outline-color: transparent; +} + +/************ + * Toolbars * + ************/ +.toolbar { + padding: 6px; + border-spacing: 6px; +} + +.toolbar .linked button:not(:hover):not(:active):not(:checked):not(:disabled) { + background-color: rgba(239, 241, 245, 0.04); +} + +.osd .toolbar { + background-color: transparent; +} + +.app-notification, .toolbar.osd { + transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); + padding: 6px; + border-radius: 12px; + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.05), 0 4px 6px 0 rgba(0, 0, 0, 0.06), 0 1px 10px 0 rgba(0, 0, 0, 0.05), inset 0 1px rgba(239, 241, 245, 0.1); + background-color: #292c3c; + color: #eff1f5; + border: none; +} + +.app-notification:backdrop, .toolbar.osd:backdrop { + box-shadow: 0 3px 2px -3px rgba(0, 0, 0, 0.2), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(239, 241, 245, 0.1); +} + +.left.app-notification, .right.app-notification, .top.app-notification, .bottom.app-notification, .toolbar.osd.left, .toolbar.osd.right, .toolbar.osd.top, .toolbar.osd.bottom { + border-radius: 0; +} + +.bottom.app-notification, .toolbar.osd.bottom { + box-shadow: none; + background-color: transparent; + background-image: linear-gradient(to bottom, transparent, rgba(0, 0, 0, 0.1) 30%, rgba(0, 0, 0, 0.2) 50%, rgba(0, 0, 0, 0.4)); +} + +.toolbar.horizontal > separator { + margin: 2px; +} + +.toolbar.vertical > separator { + margin: 2px; +} + +.toolbar entry, +.toolbar splitbutton, +.toolbar button, +.toolbar scalebutton { + border-radius: 9px; +} + +.toolbar entry, +.toolbar spinbutton, +.toolbar splitbutton, +.toolbar separator:not(.sidebar), +.toolbar button, +.toolbar menubutton, +.toolbar scalebutton { + margin-top: 0; + margin-bottom: 0; +} + +.toolbar menubutton > button, +.toolbar splitbutton > button, +.toolbar splitbutton > menubutton, +.toolbar scalebutton > button { + margin-top: 0; + margin-bottom: 0; +} + +.toolbar switch { + margin-top: 4px; + margin-bottom: 4px; +} + +.toolbar spinbutton entry, +.toolbar spinbutton button { + margin: 0; +} + +.toolbar popover.menu separator:not(.sidebar) { + margin-top: 6px; + margin-bottom: 6px; +} + +searchbar > revealer > box { + padding: 6px; + border-spacing: 6px; + border: none; + background-color: transparent; + box-shadow: none; +} + +searchbar > revealer > box entry, +searchbar > revealer > box button, +searchbar > revealer > box menubutton { + margin: 0; +} + +/*************** + * Header bars * + ***************/ +headerbar button:not(.suggested-action):not(.destructive-action) { + color: rgba(239, 241, 245, 0.7); + /* background-color: if( */ + /* $variant == 'light', */ + /* rgba($base_alt, 0.5), */ + /* $titlebar-fill */ + /* ); */ + background-color: transparent; + border-radius: 12px; + border: none; + outline: none; +} + +headerbar .linked > button:not(.suggested-action):not(.destructive-action) { + border-radius: 0; +} + +headerbar .linked > button:first-child:not(.suggested-action):not(.destructive-action) { + border-top-left-radius: 9999px; + border-bottom-left-radius: 9999px; +} + +headerbar .linked > button:last-child:not(.suggested-action):not(.destructive-action) { + border-top-right-radius: 9999px; + border-bottom-right-radius: 9999px; +} + +headerbar .linked > button:only-child:not(.suggested-action):not(.destructive-action) { + border-radius: 9999px; +} + +headerbar button:hover:not(.suggested-action):not(.destructive-action) { + background-color: rgba(239, 241, 245, 0.12); +} + +headerbar button:focus:not(.suggested-action):not(.destructive-action), headerbar button:hover:not(.suggested-action):not(.destructive-action), headerbar button:active:not(.suggested-action):not(.destructive-action) { + color: #eff1f5; + outline: none; +} + +headerbar button:disabled:not(.suggested-action):not(.destructive-action) { + color: rgba(239, 241, 245, 0.32); +} + +headerbar button:checked:not(.suggested-action):not(.destructive-action) { + background-color: #89b4fa; + color: rgba(30, 30, 46, 0.87); + outline: none; +} + +headerbar button:checked:hover:not(.suggested-action):not(.destructive-action) { + box-shadow: inset 0 0 0 1000px rgba(30, 30, 46, 0.04); + color: rgba(30, 30, 46, 0.87); +} + +headerbar button:checked:focus:not(.suggested-action):not(.destructive-action) { + color: rgba(30, 30, 46, 0.87); +} + +headerbar button:checked:disabled:not(.suggested-action):not(.destructive-action) { + background-color: rgba(230, 233, 239, 0.5); + color: rgba(30, 30, 46, 0.38); +} + +headerbar button:backdrop:not(.suggested-action):not(.destructive-action) { + color: rgba(239, 241, 245, 0.5); +} + +headerbar button:backdrop:focus:not(.suggested-action):not(.destructive-action), headerbar button:backdrop:hover:not(.suggested-action):not(.destructive-action), headerbar button:backdrop:active:not(.suggested-action):not(.destructive-action) { + color: rgba(239, 241, 245, 0.7); +} + +headerbar button:backdrop:disabled:not(.suggested-action):not(.destructive-action) { + color: rgba(239, 241, 245, 0.32); +} + +headerbar button:backdrop:checked:not(.suggested-action):not(.destructive-action) { + color: rgba(30, 30, 46, 0.6); +} + +headerbar button:backdrop:checked:disabled:not(.suggested-action):not(.destructive-action) { + color: rgba(30, 30, 46, 0.3); +} + +headerbar entry { + background-color: rgba(239, 241, 245, 0.04); + color: #eff1f5; + border-radius: 12px; +} + +headerbar entry:disabled { + background-color: rgba(239, 241, 245, 0.04); + color: rgba(239, 241, 245, 0.5); +} + +headerbar entry image { + color: rgba(239, 241, 245, 0.7); +} + +headerbar entry image:hover, headerbar entry image:active { + color: #eff1f5; +} + +headerbar entry image:disabled { + color: rgba(239, 241, 245, 0.5); +} + +headerbar { + transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1), color 75ms cubic-bezier(0, 0, 0.2, 1); + background-color: transparent; + color: #eff1f5; + min-height: 46px; + border: none; + box-shadow: none; + padding: 0; + margin: 0; +} + +headerbar:disabled { + color: rgba(239, 241, 245, 0.5); +} + +headerbar:backdrop { + background-color: transparent; + color: rgba(239, 241, 245, 0.7); +} + +headerbar:backdrop:disabled { + color: rgba(239, 241, 245, 0.32); +} + +headerbar.flat, headerbar.flat:backdrop { + background: none; + box-shadow: none; + transition: none; +} + +headerbar .title { + /* padding: 0 $space-size * 2; */ + padding: 0; + margin: 0 -20px; + font-weight: bold; +} + +headerbar .subtitle { + /* padding: 0 $space-size * 2; */ + padding: 0; + font-size: smaller; +} + +headerbar .subtitle, +headerbar .dim-label, +headerbar row.expander image.expander-row-arrow, +row.expander headerbar image.expander-row-arrow, +headerbar row label.subtitle, +row headerbar label.subtitle { + transition: color 75ms cubic-bezier(0, 0, 0.2, 1); + color: rgba(239, 241, 245, 0.7); +} + +headerbar .subtitle:backdrop, +headerbar .dim-label:backdrop, +headerbar row.expander image.expander-row-arrow:backdrop, +row.expander headerbar image.expander-row-arrow:backdrop, +headerbar row label.subtitle:backdrop, +row headerbar label.subtitle:backdrop { + color: rgba(239, 241, 245, 0.5); +} + +headerbar .titlebar { + background-color: transparent; + box-shadow: none; +} + +headerbar headerbar + separator { + background-color: rgba(239, 241, 245, 0.12); +} + +headerbar > windowhandle > box { + padding: 0 12px; +} + +headerbar > windowhandle > box, +headerbar > windowhandle > box > box.start, +headerbar > windowhandle > box > box.end { + border-spacing: 6px; +} + +headerbar entry, +headerbar spinbutton, +headerbar button, +headerbar menubutton, +headerbar stackswitcher, +headerbar separator:not(.sidebar) { + margin-top: 6px; + margin-bottom: 6px; +} + +headerbar menubutton > button, +headerbar spinbutton > button, +headerbar splitbutton > button, +headerbar splitbutton > menubutton, +headerbar .linked > menubutton, +headerbar entry > menubutton { + margin-top: 0; + margin-bottom: 0; +} + +headerbar button.suggested-action:disabled, +headerbar button.destructive-action:disabled { + background-color: rgba(239, 241, 245, 0.04); + color: rgba(239, 241, 245, 0.5); + opacity: 1; +} + +headerbar splitbutton { + /* background-color: if( */ + /* $variant == 'light', */ + /* rgba($base_alt, 0.5), */ + /* $titlebar-fill */ + /* ); */ + background-color: transparent; + border-radius: 12px; +} + +headerbar splitbutton button:not(.suggested-action):not(.destructive-action):not(:hover):not(:active):not(:checked) { + background-color: transparent; +} + +headerbar splitbutton > separator { + background-color: transparent; +} + +headerbar .linked:not(.vertical) > entry:not(:only-child) { + border-radius: 12px; +} + +headerbar .entry-tag { + margin-top: 5px; + margin-bottom: 5px; +} + +headerbar stackswitcher { + background-color: rgba(239, 241, 245, 0.04); +} + +headerbar stackswitcher:checked { + background-color: #e6e9ef; + color: rgba(30, 30, 46, 0.87); +} + +headerbar stackswitcher:checked:hover { + background-color: white; +} + +headerbar stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action) { + border-radius: 9999px; +} + +headerbar popover.background button.suggested-action:disabled, +headerbar popover.background button.destructive-action:disabled { + background-color: rgba(239, 241, 245, 0.04); + color: rgba(239, 241, 245, 0.5); +} + +headerbar popover.background entry, +headerbar popover.background spinbutton, +headerbar popover.background button, +headerbar popover.background menubutton, +headerbar popover.background stackswitcher { + margin-top: 0; + margin-bottom: 0; +} + +headerbar separator:not(.sidebar) { + background-color: rgba(239, 241, 245, 0.12); +} + +headerbar switch { + margin: 11px 6px; +} + +headerbar.selection-mode { + transition: background-color 0.1ms 225ms, color 75ms cubic-bezier(0, 0, 0.2, 1); + background-color: #89b4fa; + color: rgba(30, 30, 46, 0.87); +} + +headerbar.selection-mode:backdrop { + color: rgba(30, 30, 46, 0.6); +} + +headerbar.selection-mode .subtitle:link { + color: rgba(30, 30, 46, 0.87); +} + +headerbar.selection-mode .selection-menu { + padding-left: 16px; + padding-right: 16px; +} + +headerbar.selection-mode .selection-menu .arrow { + -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); +} + +headerbar.default-decoration { + min-height: 34px; + padding: 0; + margin: 0; + border-radius: 12px 12px 0 0; + box-shadow: inset 0 1px rgba(239, 241, 245, 0.1); + border: none; + outline: none; +} + +.solid-csd headerbar.default-decoration, .maximized headerbar.default-decoration { + border-radius: 0; + box-shadow: none; +} + +window > .titlebar:not(.flat) { + box-shadow: none; +} + +window > .titlebar headerbar:not(.flat) { + box-shadow: none; +} + +window.devel headerbar { + background: #1e1e2e cross-fade(10%-gtk-icontheme("system-run-symbolic"), image(transparent)) 90% 0/256px 256px no-repeat, linear-gradient(to right, transparent 65%, rgba(137, 180, 250, 0.1)), linear-gradient(to top, #242437 3px, #28283d); +} + +window.devel headerbar:backdrop { + background: #1e1e2e cross-fade(10%-gtk-icontheme("system-run-symbolic"), image(transparent)) 90% 0/256px 256px no-repeat, image(#1e1e2e); + /* background-color would flash */ +} + +/************ + * Pathbars * + ************/ + +pathbar > button { + padding-left: 5px; + padding-right: 5px; + border-radius: 12px; + background-color: alpha(currentColor, 0.08); + border: none; + box-shadow: none; +} + + +pathbar > button:disabled { + background-color: alpha(currentColor, 0.05); +} + + +pathbar > button:checked { + background-color: alpha(currentColor, 0.1); + color: #eff1f5; +} + + +pathbar > button:checked:hover { + background-color: alpha(currentColor, 0.16); + color: #eff1f5; +} + + +pathbar > button label, +pathbar > button image { + margin-left: 3px; + margin-right: 3px; +} + + +pathbar > button.slider-button { + padding-left: 4px; + padding-right: 4px; +} + +.pathbar { + background-color: rgba(239, 241, 245, 0.04); + color: rgba(239, 241, 245, 0.7); + border: none; + border-radius: 12px; + padding: 2px; +} + +headerbar .pathbar { + margin-top: 6px; + margin-bottom: 6px; + background-color: rgba(239, 241, 245, 0.04); + color: rgba(239, 241, 245, 0.7); +} + +.pathbar > button { + margin-top: 0; + margin-bottom: 0; + min-height: 20px; + border-radius: 10px; + border: none; + box-shadow: none; +} + +.pathbar > button:last-child { + background-color: alpha(currentColor, 0.1); + color: #eff1f5; +} + +/************** + * Tree Views * + **************/ +columnview.view, +treeview.view { + border-left-color: #4a4b5a; + border-top-color: #4a4b5a; +} + +columnview.view:hover, columnview.view:selected, +treeview.view:hover, +treeview.view:selected { + border-radius: 0; +} + +columnview.view:focus, +treeview.view:focus { + box-shadow: none; + outline: none; +} + +columnview.view.separator, +treeview.view.separator { + min-height: 5px; + color: rgba(239, 241, 245, 0.12); +} + +columnview.view:drop(active), +treeview.view:drop(active) { + box-shadow: none; +} + +columnview.view:drop(active).after, +treeview.view:drop(active).after { + border-top-style: none; +} + +columnview.view:drop(active).before, +treeview.view:drop(active).before { + border-bottom-style: none; +} + +columnview.view > dndtarget:drop(active), +treeview.view > dndtarget:drop(active) { + border-style: solid none; + border-width: 1px; + border-color: alpha(currentColor, 0.06); +} + +columnview.view > dndtarget:drop(active).after, +treeview.view > dndtarget:drop(active).after { + border-top-style: none; +} + +columnview.view > dndtarget:drop(active).before, +treeview.view > dndtarget:drop(active).before { + border-bottom-style: none; +} + +columnview.view.expander, +treeview.view.expander { + min-width: 16px; + min-height: 16px; + -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); + color: rgba(239, 241, 245, 0.7); +} + +columnview.view.expander:dir(rtl), +treeview.view.expander:dir(rtl) { + -gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl"); +} + +columnview.view.expander:hover, +treeview.view.expander:hover { + color: #eff1f5; +} + +columnview.view.expander:selected, +treeview.view.expander:selected { + color: #eff1f5; +} + +columnview.view.expander:selected:hover, +treeview.view.expander:selected:hover { + color: #eff1f5; +} + +columnview.view.expander:checked, +treeview.view.expander:checked { + -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); +} + +columnview.view.expander:disabled, +treeview.view.expander:disabled { + color: rgba(239, 241, 245, 0.32); +} + +columnview.view.progressbar, +treeview.view.progressbar { + border-bottom: 6px solid #89b4fa; + box-shadow: none; + background-color: transparent; + background-image: none; +} + +columnview.view.progressbar:selected:hover, +treeview.view.progressbar:selected:hover { + box-shadow: none; +} + +columnview.view.trough, +treeview.view.trough { + border-bottom: 6px solid rgba(239, 241, 245, 0.12); + box-shadow: none; + background-color: transparent; + background-image: none; +} + +columnview.view.trough:selected:hover, +treeview.view.trough:selected:hover { + box-shadow: none; +} + +columnview.view > header > button, +treeview.view > header > button { + padding: 2px 6px; + border-style: solid; + border-width: 0 1px 0 0; + border-color: transparent; + border-radius: 0; + background-clip: border-box; + border-image: linear-gradient(to bottom, transparent 20%, rgba(239, 241, 245, 0.12) 20%, rgba(239, 241, 245, 0.12) 80%, transparent 80%) 0 1 0 0/0 1px 0 0 stretch; +} + +columnview.view > header > button:not(:focus):not(:hover):not(:active), +treeview.view > header > button:not(:focus):not(:hover):not(:active) { + color: rgba(239, 241, 245, 0.7); +} + +columnview.view > header > button, columnview.view > header > button:disabled, +treeview.view > header > button, +treeview.view > header > button:disabled { + background-color: transparent; +} + +columnview.view > header > button:last-child, columnview.view > header > button:only-child, +treeview.view > header > button:last-child, +treeview.view > header > button:only-child { + border-right: none; + border-image: none; +} + +columnview.view button.dnd, +columnview.view header.button.dnd, +treeview.view button.dnd, +treeview.view header.button.dnd { + padding: 2px 6px; + border-style: none solid solid; + border-width: 1px; + border-color: rgba(239, 241, 245, 0.12); + border-radius: 0; + box-shadow: none; + background-color: #313244; + background-clip: border-box; + color: #89b4fa; +} + +columnview.view acceleditor > label, +treeview.view acceleditor > label { + background-color: #89b4fa; +} + +stack.view treeview.view { + min-height: 34px; +} + +/********* + * Menus * + *********/ +menubar { + padding: 0; + background-color: #1e1e2e; + color: #eff1f5; +} + +menubar:backdrop { + background-color: #1e1e2e; + color: rgba(239, 241, 245, 0.7); +} + +.csd menubar { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1); +} + +menubar > item { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1); + min-height: 20px; + padding: 4px 8px; + color: rgba(239, 241, 245, 0.7); +} + +menubar > item:selected { + transition: none; + background-color: alpha(currentColor, 0.1); + color: #eff1f5; +} + +menubar > item:disabled { + color: rgba(239, 241, 245, 0.32); +} + +menubar > item label:disabled { + color: inherit; +} + +menubar > item popover.menu popover.menu { + margin-left: 9px; +} + +menubar > item popover.menu.background popover.menu.background > contents { + margin: 0; + border-radius: 12px; +} + +/********************** + * Popover Base Menus * + **********************/ +popover.menu box.inline-buttons { + color: #eff1f5; + padding: 0 6px; +} + +popover.menu box.inline-buttons button.image-button.model { + min-height: 28px; + min-width: 28px; + padding: 0; + border: none; + outline: none; + transition: none; + border-radius: 12px; +} + +popover.menu box.inline-buttons button.image-button.model:selected { + background-image: image(alpha(currentColor, 0.06)); +} + +popover.menu box.circular-buttons { + padding: 6px; +} + +popover.menu box.circular-buttons button.circular.image-button.model { + padding: 6px; + border-radius: 12px; +} + +popover.menu box.circular-buttons button.circular.image-button.model:focus { + background-color: alpha(currentColor, 0.06); +} + +popover.menu arrow.left, +popover.menu radio.left, +popover.menu check.left { + margin-left: 0; + margin-right: 0; +} + +popover.menu arrow.right, +popover.menu radio.right, +popover.menu check.right { + margin-left: 0; + margin-right: 0; +} + +popover.menu label.title { + font-weight: bold; + padding: 4px 26px; +} + +/************ + * Popovers * + ************/ +popover.background { + font: initial; +} + +popover.background, popover.background:backdrop { + background-color: transparent; +} + +popover > arrow, +popover > contents { + transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); + padding: 6px; + background-color: #232634; + border-radius: 12px; + color: #eff1f5; + border: none; + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 15px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12), 0 0 0 2px #89b4fa, 0 0 36px transparent; +} + +popover > arrow { + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 15px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12), 0 0 0 2px #89b4fa, 0 0 36px transparent; +} + +popover > contents > list, +popover > contents > .view, +popover > contents > toolbar { + border-style: none; + box-shadow: none; + background-color: transparent; +} + +popover > contents separator { + background-color: rgba(239, 241, 245, 0.12); + margin: 15px 10px; +} + +popover > contents list separator { + margin: 0; +} + +popover > contents list > row { + border-radius: 12px; +} + +popover > contents stack > box { + padding: 0; +} + +popover > contents > box > button { + margin: 0; +} + +popover .view:not(:selected), +popover toolbar { + background-color: #232634; +} + +popover button, +popover entry, +popover combobox { + border-radius: 12px; +} + +popover .linked > button:not(.radio) { + border-radius: 0; +} + +popover .linked > button:not(.radio):first-child { + border-radius: 12px 0 0 12px; +} + +popover .linked > button:not(.radio):last-child { + border-radius: 0 12px 12px 0; +} + +popover .linked > button:not(.radio):only-child { + border-radius: 12px; +} + +popover.menu button, +popover button.model { + min-height: 32px; + padding: 0 8px; +} + +popover modelbutton { + transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1); + min-height: 22px; + min-width: 56px; + padding: 3px 9px; + color: #eff1f5; + font: initial; + border-radius: 12px; +} + +popover modelbutton:hover { + transition: none; + background-color: rgba(239, 241, 245, 0.04); + color: #89b4fa; +} + +popover modelbutton:hover accelerator { + color: #89b4fa; +} + +popover modelbutton:hover accelerator:disabled { + color: rgba(239, 241, 245, 0.5); +} + +popover modelbutton:focus:not(:hover) { + transition: none; + box-shadow: none; + outline: none; +} + +popover modelbutton:disabled { + color: rgba(239, 241, 245, 0.5); +} + +popover modelbutton accelerator { + color: rgba(239, 241, 245, 0.5); + margin-left: 30px; +} + +popover modelbutton accelerator:disabled { + color: rgba(239, 241, 245, 0.12); +} + +popover modelbutton arrow.left { + -gtk-icon-source: -gtk-icontheme("go-previous-symbolic"); +} + +popover modelbutton arrow.right { + -gtk-icon-source: -gtk-icontheme("go-next-symbolic"); +} + +.osd popover, popover.touch-selection, popover.magnifier { + background-color: transparent; +} + +magnifier { + background-color: #313244; +} + +/************* + * Notebooks * + *************/ +tabbar tab, tabbar tabbox > tabboxchild > tab, notebook > header > tabs > tab { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms; + min-height: 24px; + min-width: 24px; + padding: 3px 12px; + border: none; + outline: none; + background-clip: padding-box; + color: #eff1f5; + font-weight: 500; + border-radius: 9px; +} + +tabbar tab:hover:not(:checked):not(:selected), notebook > header > tabs > tab:hover:not(:checked):not(:selected) { + background-color: rgba(239, 241, 245, 0.04); + color: #89b4fa; + box-shadow: none; +} + +tabbar tab:disabled, notebook > header > tabs > tab:disabled { + color: rgba(30, 30, 46, 0.3); +} + +tabbar tab:active, notebook > header > tabs > tab:active { + background-color: #313244; + color: #eff1f5; + box-shadow: none; +} + +tabbar tab:checked:not(:active), notebook > header > tabs > tab:checked:not(:active), tabbar tab:selected:not(:active), notebook > header > tabs > tab:selected:not(:active) { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms, background-color 0ms; + background-color: rgba(239, 241, 245, 0.04); + color: #89b4fa; + box-shadow: none; +} + +tabbar tab:checked:not(:active):disabled, notebook > header > tabs > tab:checked:not(:active):disabled, tabbar tab:selected:not(:active):disabled, notebook > header > tabs > tab:selected:not(:active):disabled { + color: rgba(239, 241, 245, 0.5); +} + +notebook, notebook.frame { + background-color: rgba(239, 241, 245, 0.04); + border-radius: 9px; +} + +notebook.frame frame > border { + border: none; + border-radius: 9px; +} + +notebook.frame frame > list row.activatable { + border-radius: 12px; +} + +frame > paned > notebook > header, notebook.frame > header { + background-color: rgba(239, 241, 245, 0.04); +} + +notebook > header { + border: none; + background-color: rgba(239, 241, 245, 0.04); + margin: 3px; + border-radius: 12px; +} + +notebook > header.top > tabs > arrow { + border-top-style: none; +} + +notebook > header.bottom > tabs > arrow { + border-bottom-style: none; +} + +notebook > header.top > tabs > arrow, notebook > header.bottom > tabs > arrow { + padding-left: 4px; + padding-right: 4px; +} + +notebook > header.top > tabs > arrow.down, notebook > header.bottom > tabs > arrow.down { + margin-left: 0; + -gtk-icon-source: -gtk-icontheme("pan-start-symbolic"); +} + +notebook > header.top > tabs > arrow.up, notebook > header.bottom > tabs > arrow.up { + margin-right: 0; + -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); +} + +notebook > header.left > tabs > arrow { + border-left-style: none; +} + +notebook > header.right > tabs > arrow { + border-right-style: none; +} + +notebook > header.left > tabs > arrow, notebook > header.right > tabs > arrow { + padding-top: 4px; + padding-bottom: 4px; +} + +notebook > header.left > tabs > arrow.down, notebook > header.right > tabs > arrow.down { + margin-top: 0; + -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); +} + +notebook > header.left > tabs > arrow.up, notebook > header.right > tabs > arrow.up { + margin-bottom: 0; + -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); +} + +notebook > header > tabs > arrow { + min-height: 16px; + min-width: 16px; + border-radius: 12px; +} + +notebook > header > tabs > tab { + margin: 3px; +} + +notebook > header > tabs > tab > box { + transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1); + margin: -6px -12px; + padding: 6px 12px; +} + +notebook > header > tabs > tab > box:drop(active) { + background-color: rgba(239, 241, 245, 0.12); + color: #eff1f5; +} + +notebook > header > tabs > tab button.flat:last-child { + margin-left: 6px; + margin-right: -3px; +} + +notebook > header > tabs > tab button.flat:first-child { + margin-left: -3px; + margin-right: 6px; +} + +notebook > header > tabs > tab button.small-button { + min-width: 24px; + min-height: 24px; +} + +notebook > header.top > tabs, notebook > header.bottom > tabs { + padding-left: 0; + padding-right: 0; +} + +notebook > header.top > tabs:not(:only-child):first-child, notebook > header.bottom > tabs:not(:only-child):first-child { + margin-left: 0; +} + +notebook > header.top > tabs:not(:only-child):last-child, notebook > header.bottom > tabs:not(:only-child):last-child { + margin-right: 0; +} + +notebook > header.top > tabs > tab:not(:last-child), notebook > header.bottom > tabs > tab:not(:last-child) { + margin-right: 0; +} + +notebook > header.top > tabs tab.reorderable-page, notebook > header.bottom > tabs tab.reorderable-page { + border-style: solid; +} + +notebook > header.left > tabs, notebook > header.right > tabs { + padding-top: 0; + padding-bottom: 0; +} + +notebook > header.left > tabs:not(:only-child):first-child, notebook > header.right > tabs:not(:only-child):first-child { + margin-top: 0; +} + +notebook > header.left > tabs:not(:only-child):last-child, notebook > header.right > tabs:not(:only-child):last-child { + margin-bottom: 0; +} + +notebook > header.left > tabs > tab:not(:last-child), notebook > header.right > tabs > tab:not(:last-child) { + margin-bottom: 0; +} + +notebook > header.left > tabs tab.reorderable-page, notebook > header.right > tabs tab.reorderable-page { + border-style: solid; +} + +notebook > header > menubutton > button.image-button { + padding: 3px; + min-width: 24px; + min-height: 24px; + margin: 0 3px; +} + +notebook > stack:not(:only-child) { + background-color: transparent; + border-radius: 12px; +} + +tabbar > revealer > box { + box-shadow: none; +} + +tabbar .box { + min-height: 34px; + background-color: rgba(239, 241, 245, 0.04); + background-image: none; + padding: 0; + margin: 3px; + border-radius: 12px; + border: none; + box-shadow: none; +} + +tabbar scrolledwindow.pinned undershoot { + border: 0 solid rgba(239, 241, 245, 0.12); +} + +tabbar scrolledwindow.pinned:dir(rtl) undershoot.left { + border-left-width: 1px; +} + +tabbar scrolledwindow.pinned:dir(ltr) undershoot.right { + border-right-width: 1px; +} + +tabbar scrolledwindow.pinned tabbox { + padding: 3px 3px 3px 0; +} + +tabbar scrolledwindow.pinned tabbox > tabboxchild { + margin: 0; +} + +tabbar scrolledwindow.pinned tabbox > background:dir(ltr) { + box-shadow: inset -1px 0 rgba(239, 241, 245, 0.12); +} + +tabbar scrolledwindow.pinned tabbox > background:dir(rtl) { + box-shadow: inset 1px 0 rgba(239, 241, 245, 0.12); +} + +tabbar scrolledwindow:not(.pinned) tabbox { + padding: 3px 0; +} + +tabbar scrolledwindow:not(.pinned) tabbox > tabboxchild { + margin: 0 -2px; +} + +tabbar scrolledwindow:not(.pinned) tabbox > tabboxchild + separator + tabboxchild { + margin-left: 0; +} + +tabbar undershoot { + transition: background 150ms ease-in-out; +} + +tabbar undershoot.left { + background: linear-gradient(to right, #313244, rgba(0, 0, 0, 0) 20px); +} + +tabbar undershoot.right { + background: linear-gradient(to left, #313244, rgba(0, 0, 0, 0) 20px); +} + +tabbar .needs-attention-left undershoot.left { + background: linear-gradient(to right, alpha(#89b4fa, 0.5), alpha(#89b4fa, 0.3) 1px, alpha(#89b4fa, 0) 20px); +} + +tabbar .needs-attention-right undershoot.right { + background: linear-gradient(to left, alpha(#89b4fa, 0.5), alpha(#89b4fa, 0.3) 1px, alpha(#89b4fa, 0) 20px); +} + +tabbar tabbox { + background-color: transparent; + background-image: none; + padding: 0; + margin: 0; + border: none; + box-shadow: none; +} + +tabbar tabbox > background { + background: none; +} + +tabbar tabbox > separator { + margin: 9px 0; + min-width: 1px; + background-color: rgba(30, 30, 46, 0.12); + transition: opacity 150ms ease-in-out; +} + +tabbar tabbox > separator.hidden { + opacity: 0; +} + +tabbar tabbox > tabboxchild { + padding: 0; +} + +tabbar tabbox > tabboxchild > tab { + margin: 0; +} + +tabbar tab.needs-attention { + background-image: radial-gradient(ellipse at bottom, rgba(239, 241, 245, 0.8), alpha(#89b4fa, 0.4) 10%, alpha(#89b4fa, 0) 30%); +} + +tabbar tab.needs-attention:hover { + background-image: image(alpha(currentColor, 0.03)), radial-gradient(ellipse at bottom, rgba(239, 241, 245, 0.8), alpha(#89b4fa, 0.4) 10%, alpha(#89b4fa, 0) 30%); +} + +tabbar .start-action, +tabbar .end-action { + background-color: rgba(239, 241, 245, 0.04); + background-clip: padding-box; + border-color: rgba(239, 241, 245, 0.12); + border-style: solid; + transition: background 150ms ease-in-out; +} + +tabbar .start-action button, +tabbar .end-action button { + border: none; + border-radius: 0; +} + +tabbar .start-action:dir(ltr), +tabbar .end-action:dir(rtl) { + border-right-width: 1px; +} + +tabbar .start-action:dir(rtl), +tabbar .end-action:dir(ltr) { + border-left-width: 1px; +} + +tabbar:not(.inline) scrolledwindow.pinned undershoot { + border-color: rgba(239, 241, 245, 0.12); +} + +tabbar:not(.inline) undershoot.left { + background: linear-gradient(to right, #1e1e2e, rgba(0, 0, 0, 0) 20px); +} + +tabbar:not(.inline) undershoot.right { + background: linear-gradient(to left, #1e1e2e, rgba(0, 0, 0, 0) 20px); +} + +tabbar:not(.inline) .needs-attention-left undershoot.left { + background: linear-gradient(to right, alpha(#89b4fa, 0.5), alpha(#89b4fa, 0.3) 1px, alpha(#89b4fa, 0) 20px); +} + +tabbar:not(.inline) .needs-attention-right undershoot.right { + background: linear-gradient(to left, alpha(#89b4fa, 0.5), alpha(#89b4fa, 0.3) 1px, alpha(#89b4fa, 0) 20px); +} + +tabbar:not(.inline) tabbox > background { + background-color: #1e1e2e; +} + +tabbar:not(.inline) .start-action, +tabbar:not(.inline) .end-action { + background-color: alpha(#1e1e2e, 0.6); + border-color: rgba(239, 241, 245, 0.12); +} + +dnd tab { + min-height: 24px; + background-color: #1e1e2e; + color: #eff1f5; + box-shadow: 0 1px 5px 1px rgba(0, 0, 0, 0.09), 0 2px 14px 3px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(0, 0, 0, 0.05); + outline: 1px solid rgba(30, 30, 46, 0.75); + outline-offset: -1px; + margin: 24px; +} + +dnd tab.needs-attention { + background-image: radial-gradient(ellipse at bottom, rgba(239, 241, 245, 0.8), alpha(#89b4fa, 0.4) 10%, alpha(#89b4fa, 0) 30%); +} + +tabbar tab, +dnd tab { + padding: 6px; +} + +tabbar tab button.image-button, +dnd tab button.image-button { + padding: 0; + margin: 0; + min-width: 24px; + min-height: 24px; + border-radius: 9999px; +} + +tabbar tab button.image-button.tab-close-button, +dnd tab button.image-button.tab-close-button { + margin-right: -3px; +} + +tabview:drop(active), +tabbox:drop(active) { + box-shadow: none; +} + +/************** + * Scrollbars * + **************/ +scrollbar { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1); + background-color: #313244; + box-shadow: none; + outline: none; +} + +scrollbar.top { + border-bottom: 1px solid transparent; +} + +scrollbar.bottom { + border-top: 1px solid transparent; +} + +scrollbar.left { + border-right: 1px solid transparent; +} + +scrollbar.right { + border-left: 1px solid transparent; +} + +scrollbar > range > trough { + outline: none; + background: none; +} + +scrollbar > range > trough > slider { + transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1); + min-width: 8px; + min-height: 8px; + border: 4px solid transparent; + border-radius: 9999px; + background-clip: padding-box; + box-shadow: none; + outline: none; + background-color: #232634; +} + +scrollbar > range > trough > slider:hover { + background-color: #292c3c; +} + +scrollbar > range > trough > slider:active { + background-color: #292c3c; +} + +scrollbar > range > trough > slider:disabled { + background-color: #1e1e2e; +} + +scrollbar > range.fine-tune > trough > slider { + min-width: 4px; + min-height: 4px; +} + +scrollbar > range.fine-tune.horizontal > trough > slider { + margin: 2px 0; +} + +scrollbar > range.fine-tune.vertical > trough > slider { + margin: 0 2px; +} + +scrollbar.overlay-indicator:not(.fine-tune) > range > trough > slider { + transition-property: background-color, min-height, min-width; +} + +scrollbar.overlay-indicator:not(.dragging):not(.hovering) { + border-color: transparent; + background-color: transparent; +} + +scrollbar.overlay-indicator:not(.dragging):not(.hovering) > range > trough > slider { + min-width: 4px; + min-height: 4px; + margin: 2px; + border: none; +} + +scrollbar.overlay-indicator:not(.dragging):not(.hovering) button { + min-width: 4px; + min-height: 4px; + margin: 2px; + border: 1px solid rgba(49, 50, 68, 0.3); + border-radius: 9999px; + background-color: rgba(239, 241, 245, 0.5); + background-clip: padding-box; + -gtk-icon-source: none; +} + +scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled { + background-color: rgba(239, 241, 245, 0.32); +} + +scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal > range > trough > slider { + min-width: 24px; +} + +scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal button { + min-width: 8px; +} + +scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical > range > trough > slider { + min-height: 24px; +} + +scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical button { + min-height: 8px; +} + +scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering { + background-color: #1e1e2e; +} + +scrollbar.horizontal > range > trough > slider { + min-width: 24px; +} + +scrollbar.vertical > range > trough > slider { + min-height: 24px; +} + +scrollbar button { + min-width: 16px; + min-height: 16px; + padding: 0; + border-radius: 0; +} + +scrollbar.vertical button.down { + -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); +} + +scrollbar.vertical button.up { + -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); +} + +scrollbar.horizontal button.down { + -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); +} + +scrollbar.horizontal button.up { + -gtk-icon-source: -gtk-icontheme("pan-start-symbolic"); +} + +/********** + * Switch * + **********/ +switch { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1); + padding: 3px; + border: none; + border-radius: 12px; + background-color: rgba(239, 241, 245, 0.5); +} + +switch:checked { + background-color: #89b4fa; +} + +switch:disabled { + opacity: 0.5; +} + +switch > slider { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1); + min-width: 18px; + min-height: 18px; + border-radius: 9999px; + outline: none; + box-shadow: 0 0 0 0 transparent, 0 3px 2px -2px rgba(0, 0, 0, 0.05), 0 2px 3px -1px rgba(0, 0, 0, 0.06), 0 1px 4px 0 rgba(0, 0, 0, 0.05); + background-color: #1e1e2e; + border: none; +} + +switch:focus slider, switch:hover slider, switch:focus:hover slider { + box-shadow: 0 0 0 6px rgba(239, 241, 245, 0.6), 0 3px 3px -2px transparent, 0 2px 3px -1px transparent, 0 1px 4px 0 transparent; +} + +/************************* + * Check and Radio items * + *************************/ +checkbutton, +radiobutton { + outline: none; + border-spacing: 3px; +} + +check, +radio { + min-height: 20px; + min-width: 20px; + margin: 3px; + padding: 0; + border-radius: 9999px; + border: none; + color: transparent; + background-color: rgba(239, 241, 245, 0.12); + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), box-shadow 150ms cubic-bezier(0, 0, 0.2, 1); +} + +check:hover, +radio:hover { + box-shadow: 0 0 0 6px rgba(239, 241, 245, 0.04); + background-color: rgba(239, 241, 245, 0.15); +} + +check:active, +radio:active { + box-shadow: 0 0 0 6px rgba(239, 241, 245, 0.12); + background-color: rgba(239, 241, 245, 0.2); +} + +check:disabled, +radio:disabled { + background-color: rgba(239, 241, 245, 0.04); +} + +check:checked, check:indeterminate, +radio:checked, +radio:indeterminate { + color: rgba(30, 30, 46, 0.6); + background-color: #89b4fa; +} + +check:checked:hover, check:indeterminate:hover, +radio:checked:hover, +radio:indeterminate:hover { + box-shadow: 0 0 0 6px rgba(137, 180, 250, 0.15); + background-color: #bad3fc; +} + +check:checked:active, check:indeterminate:active, +radio:checked:active, +radio:indeterminate:active { + box-shadow: 0 0 0 6px rgba(137, 180, 250, 0.2); + background-color: #89b4fa; +} + +check:checked:disabled, check:indeterminate:disabled, +radio:checked:disabled, +radio:indeterminate:disabled { + color: rgba(30, 30, 46, 0.6); + background-color: rgba(137, 180, 250, 0.35); +} + +popover modelbutton.flat check, popover modelbutton.flat check:focus, popover modelbutton.flat check:hover, popover modelbutton.flat check:focus:hover, popover modelbutton.flat check:active, popover modelbutton.flat check:disabled, popover modelbutton.flat radio, popover modelbutton.flat radio:focus, popover modelbutton.flat radio:hover, popover modelbutton.flat radio:focus:hover, popover modelbutton.flat radio:active, popover modelbutton.flat radio:disabled { + transition: none; + box-shadow: none; + background-image: none; +} + +popover modelbutton.flat check.left:dir(rtl), popover modelbutton.flat radio.left:dir(rtl) { + margin-left: -3px; + margin-right: 6px; +} + +popover modelbutton.flat check.right:dir(ltr), popover modelbutton.flat radio.right:dir(ltr) { + margin-left: 6px; + margin-right: -3px; +} + +popover.menu check, popover.menu radio { + transition: none; + margin: 0; + padding: 0; +} + +popover.menu check:dir(ltr), popover.menu radio:dir(ltr) { + margin-right: 6px; + margin-left: -3px; +} + +popover.menu check:dir(rtl), popover.menu radio:dir(rtl) { + margin-left: 6px; + margin-right: -3px; +} + +popover.menu check, popover.menu check:hover, popover.menu check:disabled, popover.menu check:checked:hover, popover.menu check:indeterminate:hover, popover.menu radio, popover.menu radio:hover, popover.menu radio:disabled, popover.menu radio:checked:hover, popover.menu radio:indeterminate:hover { + box-shadow: none; +} + + +check { + -gtk-icon-size: 20px; +} + + +check:checked { + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/checkbox-checked-symbolic.svg")), -gtk-recolor(url("assets/checkbox-checked-symbolic@2.svg"))); +} + + +check:indeterminate { + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/checkbox-mixed-symbolic.svg")), -gtk-recolor(url("assets/checkbox-mixed-symbolic@2.svg"))); +} + + +radio { + -gtk-icon-size: 20px; +} + + +radio:checked { + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/radio-checked-symbolic.svg")), -gtk-recolor(url("assets/radio-checked-symbolic@2.svg"))); +} + + +radio:indeterminate { + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/radio-mixed-symbolic.svg")), -gtk-recolor(url("assets/radio-mixed-symbolic@2.svg"))); +} + + +popover.menu check { + min-height: 16px; + min-width: 16px; + -gtk-icon-size: 16px; +} + + +popover.menu check:checked { + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/small-checkbox-checked-symbolic.svg")), -gtk-recolor(url("assets/small-checkbox-checked-symbolic@2.svg"))); +} + + +popover.menu check:indeterminate { + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/small-checkbox-mixed-symbolic.svg")), -gtk-recolor(url("assets/small-checkbox-mixed-symbolic@2.svg"))); +} + + +popover.menu radio { + min-height: 16px; + min-width: 16px; + -gtk-icon-size: 16px; +} + + +popover.menu radio:checked { + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/small-radio-checked-symbolic.svg")), -gtk-recolor(url("assets/small-radio-checked-symbolic@2.svg"))); +} + + +popover.menu radio:indeterminate { + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/small-radio-mixed-symbolic.svg")), -gtk-recolor(url("assets/small-radio-mixed-symbolic@2.svg"))); +} + +check:not(:checked):active { + -gtk-icon-transform: rotate(90deg); +} + +treeview.view radio, +treeview.view check, +columnview.view radio, +columnview.view check { + padding: 0; + margin: 0; + transition: none; +} + +treeview.view radio, treeview.view radio:hover, treeview.view radio:disabled, treeview.view radio:checked:hover, treeview.view radio:indeterminate:hover, +treeview.view check, +treeview.view check:hover, +treeview.view check:disabled, +treeview.view check:checked:hover, +treeview.view check:indeterminate:hover, +columnview.view radio, +columnview.view radio:hover, +columnview.view radio:disabled, +columnview.view radio:checked:hover, +columnview.view radio:indeterminate:hover, +columnview.view check, +columnview.view check:hover, +columnview.view check:disabled, +columnview.view check:checked:hover, +columnview.view check:indeterminate:hover { + box-shadow: none; +} + +treeview.view:hover check, +treeview.view:hover radio, treeview.view:selected check, +treeview.view:selected radio, treeview.view:focus check, +treeview.view:focus radio, +columnview.view:hover check, +columnview.view:hover radio, +columnview.view:selected check, +columnview.view:selected radio, +columnview.view:focus check, +columnview.view:focus radio { + box-shadow: none; +} + +treeview.view:hover check:checked, +treeview.view:hover radio:checked, treeview.view:selected check:checked, +treeview.view:selected radio:checked, treeview.view:focus check:checked, +treeview.view:focus radio:checked, +columnview.view:hover check:checked, +columnview.view:hover radio:checked, +columnview.view:selected check:checked, +columnview.view:selected radio:checked, +columnview.view:focus check:checked, +columnview.view:focus radio:checked { + color: rgba(30, 30, 46, 0.87); + background-color: #89b4fa; +} + +checkbutton.selection-mode { + border-radius: 9999px; +} + +checkbutton.selection-mode check, +checkbutton.selection-mode radio { + padding: 6px; + border-radius: 9999px; +} + +checkbutton.selection-mode check:checked, checkbutton.selection-mode check:indeterminate, +checkbutton.selection-mode radio:checked, +checkbutton.selection-mode radio:indeterminate { + color: rgba(30, 30, 46, 0.87); + background-color: #89b4fa; +} + +checkbutton.selection-mode label:dir(ltr) { + margin-right: 6px; +} + +checkbutton.selection-mode label:dir(rtl) { + margin-left: 6px; +} + +/************ + * GtkScale * + ************/ +scale { + min-height: 2px; + min-width: 2px; +} + +scale.horizontal { + padding: 16px 12px; +} + +scale.vertical { + padding: 12px 16px; +} + +scale > trough { + transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1); + outline: none; + background-color: rgba(239, 241, 245, 0.3); +} + +scale > trough:disabled { + background-color: rgba(239, 241, 245, 0.12); +} + +scale > trough > highlight { + transition: background-image 75ms cubic-bezier(0, 0, 0.2, 1); + background-image: image(#89b4fa); +} + +scale > trough > highlight:disabled { + background-color: #1e1e2e; + background-image: image(rgba(239, 241, 245, 0.32)); +} + +scale > trough > fill { + transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1); + background-color: rgba(239, 241, 245, 0.3); +} + +scale > trough > fill:disabled { + background-color: transparent; +} + +scale > trough > slider { + min-height: 18px; + min-width: 18px; + margin: -8px; + transition: all 75ms cubic-bezier(0, 0, 0.2, 1); + border-radius: 9999px; + color: #89b4fa; + background-color: #313244; + box-shadow: inset 0 0 0 2px #89b4fa; +} + +scale > trough > slider:hover { + box-shadow: inset 0 0 0 2px #89b4fa, 0 0 0 8px rgba(239, 241, 245, 0.12); +} + +scale > trough > slider:active { + box-shadow: inset 0 0 0 4px #89b4fa, 0 0 0 8px rgba(239, 241, 245, 0.12); +} + +scale > trough > slider:disabled { + box-shadow: inset 0 0 0 2px rgba(239, 241, 245, 0.32); +} + +scale.fine-tune.horizontal { + min-height: 4px; + padding-top: 15px; + padding-bottom: 15px; +} + +scale.fine-tune.vertical { + min-width: 4px; + padding-left: 15px; + padding-right: 15px; +} + +scale.fine-tune > trough > slider { + margin: -7px; +} + +scale > marks, +scale > value { + color: rgba(239, 241, 245, 0.7); +} + +scale indicator { + background-color: rgba(239, 241, 245, 0.3); + color: transparent; +} + +scale.marks-before:not(.marks-after) > trough > slider, scale.marks-after:not(.marks-before) > trough > slider { + transform: rotate(45deg); + border-bottom-right-radius: 0; +} + +scale.horizontal indicator { + min-height: 8px; + min-width: 1px; +} + +scale.vertical indicator { + min-height: 1px; + min-width: 8px; +} + +scale.color { + min-height: 0; + min-width: 0; +} + +scale.color.horizontal { + padding: 0 0 12px 0; +} + +scale.color.horizontal > trough > slider:dir(ltr), scale.color.horizontal > trough > slider:dir(rtl) { + margin-bottom: -13.5px; + margin-top: 11.5px; +} + +scale.color.vertical:dir(ltr) { + padding: 0 0 0 12px; +} + +scale.color.vertical:dir(ltr) slider { + margin-left: -13.5px; + margin-right: 11.5px; +} + +scale.color.vertical:dir(rtl) { + padding: 0 12px 0 0; +} + +scale.color.vertical:dir(rtl) > trough > slider { + margin-right: -13.5px; + margin-left: 11.5px; +} + +/***************** + * Progress bars * + *****************/ +progressbar { + color: rgba(239, 241, 245, 0.7); + font-size: smaller; +} + +progressbar.horizontal trough, +progressbar.horizontal progress { + min-height: 6px; +} + +progressbar.vertical trough, +progressbar.vertical progress { + min-width: 6px; +} + +progressbar trough { + border-radius: 12px; + background-color: rgba(239, 241, 245, 0.12); +} + +progressbar progress { + border-radius: 12px; + background-color: #89b4fa; +} + +progressbar.osd { + min-width: 6px; + min-height: 6px; + background-color: transparent; + box-shadow: none; + margin: 0; + padding: 0; +} + +progressbar.osd trough { + background-color: transparent; +} + +progressbar.osd progress { + background-color: #89b4fa; +} + +progressbar trough.empty progress { + all: unset; +} + +/************* + * Level Bar * + *************/ +levelbar.horizontal block { + min-height: 6px; +} + +levelbar.horizontal.discrete block { + min-width: 34px; +} + +levelbar.horizontal.discrete block:not(:last-child) { + margin-right: 2px; +} + +levelbar.vertical block { + min-width: 6px; +} + +levelbar.vertical.discrete block { + min-height: 34px; +} + +levelbar.vertical.discrete block:not(:last-child) { + margin-bottom: 2px; +} + +levelbar trough { + border-radius: 12px; +} + +levelbar block.low { + background-color: #df8e1d; +} + +levelbar block.high, levelbar block:not(.empty) { + background-color: #89b4fa; +} + +levelbar block.full { + background-color: #40a02b; +} + +levelbar block.empty { + background-color: rgba(239, 241, 245, 0.12); +} + +/**************** + * Print dialog * +*****************/ +window.dialog.print drawing { + color: #eff1f5; + background: none; + border: none; + padding: 0; +} + +window.dialog.print drawing paper { + padding: 0; + border: 1px solid rgba(239, 241, 245, 0.12); + background-color: #313244; + color: #eff1f5; +} + +window.dialog.print .dialog-action-box { + margin: 12px; +} + +/********** + * Frames * + **********/ +frame, +.frame { + border: 1px solid rgba(239, 241, 245, 0.12); +} + +frame > list, +.frame > list { + border: none; +} + +frame.view, +.frame.view { + border-radius: 12px; +} + +frame.flat, +.frame.flat { + border-style: none; +} + +frame { + border-radius: 12px; +} + +frame > label { + margin: 4px; +} + +frame.flat > border, statusbar frame > border { + border: none; +} + +actionbar { + box-shadow: none; +} + +actionbar > revealer > box { + padding: 6px; + border-spacing: 6px; + box-shadow: none; + background-color: #313244; + background-clip: border-box; + border: none; + color: #eff1f5; +} + +actionbar > revealer > box button, +actionbar > revealer > box entry, +actionbar > revealer > box menubutton, +actionbar > revealer > box menubutton > button, +actionbar > revealer > box splitbutton, +actionbar > revealer > box splitbutton > button, +actionbar > revealer > box spinbutton { + margin: 0; +} + +statusbar { + padding: 6px 18px; +} + +scrolledwindow viewport.frame { + border: none; +} + +stack scrolledwindow.frame viewport.frame list { + border: none; +} + +scrolledwindow > overshoot.top { + background-image: radial-gradient(farthest-side at top, alpha(currentColor, 0.12) 85%, alpha(currentColor, 0)), radial-gradient(farthest-side at top, alpha(currentColor, 0.05), alpha(currentColor, 0)); + background-size: 100% 3%, 100% 50%; + background-repeat: no-repeat; + background-position: top; + background-color: transparent; + border: none; + box-shadow: none; +} + +scrolledwindow > overshoot.bottom { + background-image: radial-gradient(farthest-side at bottom, alpha(currentColor, 0.12) 85%, alpha(currentColor, 0)), radial-gradient(farthest-side at bottom, alpha(currentColor, 0.05), alpha(currentColor, 0)); + background-size: 100% 3%, 100% 50%; + background-repeat: no-repeat; + background-position: bottom; + background-color: transparent; + border: none; + box-shadow: none; +} + +scrolledwindow > overshoot.left { + background-image: radial-gradient(farthest-side at left, alpha(currentColor, 0.12) 85%, alpha(currentColor, 0)), radial-gradient(farthest-side at left, alpha(currentColor, 0.05), alpha(currentColor, 0)); + background-size: 3% 100%, 50% 100%; + background-repeat: no-repeat; + background-position: left; + background-color: transparent; + border: none; + box-shadow: none; +} + +scrolledwindow > overshoot.right { + background-image: radial-gradient(farthest-side at right, alpha(currentColor, 0.12) 85%, alpha(currentColor, 0)), radial-gradient(farthest-side at right, alpha(currentColor, 0.05), alpha(currentColor, 0)); + background-size: 3% 100%, 50% 100%; + background-repeat: no-repeat; + background-position: right; + background-color: transparent; + border: none; + box-shadow: none; +} + +scrolledwindow.undershoot-top > undershoot.top { + border-radius: 0px 0px 0 0; + box-shadow: none; + background: linear-gradient(to bottom, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +scrolledwindow.undershoot-bottom > undershoot.bottom { + border-radius: 0 0 0px 0px; + box-shadow: none; + background: linear-gradient(to top, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +scrolledwindow.undershoot-start:dir(ltr) > undershoot.left { + border-radius: 0px 0 0 0px; + box-shadow: none; + background: linear-gradient(to right, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +scrolledwindow.undershoot-start:dir(rtl) > undershoot.right { + border-radius: 0 0px 0px 0; + box-shadow: none; + background: linear-gradient(to left, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +scrolledwindow.undershoot-end:dir(ltr) > undershoot.right { + border-radius: 0 0px 0px 0; + box-shadow: none; + background: linear-gradient(to left, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +scrolledwindow.undershoot-end:dir(rtl) > undershoot.left { + border-radius: 0px 0 0 0px; + box-shadow: none; + background: linear-gradient(to right, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +scrolledwindow > undershoot { + background-image: none; + box-shadow: none; + border: none; +} + +separator { + min-width: 1px; + min-height: 1px; + background-color: transparent; +} + +stacksidebar + separator.vertical, +stacksidebar separator.horizontal, button.font separator, button.file separator, separator.spacer, separator.sidebar { + min-width: 0; + min-height: 0; + background-color: transparent; + background-image: none; +} + +/********* + * Lists * + *********/ +list.content, +list.boxed-list { + border-radius: 12px; + box-shadow: none; + border: none; + background-color: transparent; +} + +list.content > row, +list.boxed-list > row { + border: none; + border-radius: 3px; + background-color: rgba(239, 241, 245, 0.04); +} + +list.content > row:hover, +list.boxed-list > row:hover, list.content > row.has-open-popup, +list.boxed-list > row.has-open-popup, list.content > row:focus, +list.boxed-list > row:focus { + background-color: rgba(239, 241, 245, 0.04); +} + +list.content > row:active, +list.boxed-list > row:active { + background-color: alpha(currentColor, 0.12); +} + +list.content > row:not(:first-child), +list.boxed-list > row:not(:first-child) { + margin-top: 3px; +} + +list.content > row:first-child, +list.boxed-list > row:first-child { + border-radius: 12px 12px 3px 3px; +} + +list.content > row:last-child, +list.boxed-list > row:last-child { + border-radius: 3px 3px 12px 12px; +} + +list.content > row:only-child, +list.boxed-list > row:only-child { + border-radius: 12px; +} + +listview, +list { + border-color: rgba(239, 241, 245, 0.12); + background-color: rgba(239, 241, 245, 0.04); + background-clip: padding-box; +} + +listview > row, +list > row { + padding: 6px; + background-clip: padding-box; +} + +listview > row.expander, +list > row.expander { + padding: 0px; +} + +listview > row.expander .row-header, +list > row.expander .row-header { + padding: 2px; +} + +listview.horizontal row.separator:not(:last-child), listview.separators.horizontal > row:not(.separator):not(:last-child), +list.horizontal row.separator:not(:last-child), +list.separators.horizontal > row:not(.separator):not(:last-child) { + border-left: 1px solid rgba(239, 241, 245, 0.12); +} + +listview:not(.horizontal) row.separator:not(:last-child), listview.separators:not(.horizontal) > row:not(.separator):not(:last-child), +list:not(.horizontal) row.separator:not(:last-child), +list.separators:not(.horizontal) > row:not(.separator):not(:last-child) { + border-bottom: 1px solid rgba(239, 241, 245, 0.12); +} + +leaflet scrolledwindow listview, leaflet scrolledwindow list { + background-color: transparent; +} + +list.frame { + border-radius: 12px; +} + +listview.view { + color: #eff1f5; + background-color: transparent; +} + +popover.menu listview.view { + padding: 0; +} + +popover.menu listview.view > row { + margin-left: 0; + margin-right: 0; + border-radius: 12px; +} + +row { + color: rgba(239, 241, 245, 0.7); + background-clip: padding-box; +} + +row label.subtitle { + font-size: smaller; +} + +row > box.header { + margin-left: 12px; + margin-right: 12px; + min-height: 46px; +} + +row > box.header > .icon:disabled { + filter: opacity(0.35); +} + +row > box.header > box.title { + margin-top: 6px; + margin-bottom: 6px; + border-spacing: 3px; +} + +.nautilus-window .nautilus-grid-view child.activatable, columnview.view > header > button, +treeview.view > header > button, row.activatable { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1), font-weight 0; + outline: none; + box-shadow: none; + background-color: transparent; + background-image: radial-gradient(circle, transparent 10%, transparent 0%); + background-repeat: no-repeat; + background-position: center; + background-size: 1000% 1000%; + outline: none; +} + +.nautilus-window .nautilus-grid-view child.activatable:focus, columnview.view > header > button:focus, +treeview.view > header > button:focus, row.activatable:focus { + color: #eff1f5; + background-color: transparent; + box-shadow: none; + outline: none; +} + +.nautilus-window .nautilus-grid-view child.activatable:hover, columnview.view > header > button:hover, +treeview.view > header > button:hover, .nautilus-window .nautilus-grid-view child.has-open-popup.activatable, columnview.view > header > button.has-open-popup, +treeview.view > header > button.has-open-popup, row.activatable:hover, row.activatable.has-open-popup { + color: #eff1f5; + background-color: alpha(currentColor, 0.05); + box-shadow: none; +} + +.nautilus-window .nautilus-grid-view child.activatable:active, columnview.view > header > button:active, +treeview.view > header > button:active, row.activatable:active { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms, font-weight 0ms; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + background-image: radial-gradient(circle, alpha(currentColor, 0.05) 10%, transparent 0%); + background-size: 0% 0%; + background-color: alpha(currentColor, 0.05); + color: #eff1f5; + box-shadow: none; +} + +.nautilus-window .nautilus-grid-view child.activatable:selected, columnview.view > header > button:selected, +treeview.view > header > button:selected, row.activatable:selected { + background-color: alpha(currentColor, 0.06); +} + +.nautilus-window .nautilus-grid-view child.activatable:selected:hover, columnview.view > header > button:selected:hover, +treeview.view > header > button:selected:hover, row.activatable:selected:hover { + background-color: alpha(currentColor, 0.08); +} + +button row.activatable:focus, button row.activatable:hover, button row.activatable:active { + box-shadow: none; + background: none; +} + +button:checked row.activatable { + color: rgba(30, 30, 46, 0.87); +} + +row:selected { + background-color: alpha(currentColor, 0.06); + color: inherit; + box-shadow: none; +} + +row:selected:hover { + background-color: alpha(currentColor, 0.08); +} + +row:selected:focus, row:selected:focus-visible:focus-within { + outline: none; + background-color: alpha(currentColor, 0.08); +} + +row:selected:focus:hover, row:selected:focus-visible:focus-within:hover { + background-color: alpha(currentColor, 0.16); +} + +row:selected image, +row:selected label { + color: #eff1f5; +} + +row:selected button image, +row:selected button label { + color: inherit; +} + +row:selected:disabled image, +row:selected:disabled label { + color: rgba(239, 241, 245, 0.5); +} + +.rich-list { + /* rich lists usually containing other widgets than just labels/text */ +} + +.rich-list > row { + padding: 9px 12px; + min-height: 32px; + /* should be tall even when only containing a label */ +} + +.rich-list > row:last-child { + border-bottom: none; +} + +.rich-list > row > box { + border-spacing: 12px; +} + +row label.subtitle { + font-size: smaller; +} + +row > box.header { + margin-left: 12px; + margin-right: 12px; + border-spacing: 6px; + min-height: 50px; +} + +row > box.header > .icon:disabled { + filter: opacity(0.45); +} + +row > box.header > box.title { + margin-top: 6px; + margin-bottom: 6px; + border-spacing: 3px; + padding: 0; +} + +row > box.header > box.title, +row > box.header > box.title > .title { + padding: 0; + font-weight: bold; + color: #eff1f5; +} + +row > box.header > box.title > .subtitle { + padding: 2px 0; + font-weight: normal; + color: rgba(239, 241, 245, 0.7); +} + +row > box.header > .prefixes, +row > box.header > .suffixes { + border-spacing: 6px; +} + +row > box.header > .icon:dir(ltr), +row > box.header > .prefixes:dir(ltr) { + margin-right: 6px; +} + +row > box.header > .icon:dir(rtl), +row > box.header > .prefixes:dir(rtl) { + margin-left: 6px; +} + +row.entry .edit-icon, +row.entry .indicator { + min-width: 24px; + min-height: 24px; + padding: 5px; +} + +row.entry .edit-icon:disabled { + opacity: 0.5; +} + +row.entry .indicator { + opacity: 0.65; +} + +row.entry.monospace { + font-family: inherit; +} + +row.entry.monospace text { + font-family: monospace; +} + +row.entry.error text > selection:focus-within { + background-color: alpha(#d20f39, 0.2); +} + +row.entry.error text > cursor-handle > contents { + background-color: currentColor; +} + +row.entry.warning text > selection:focus-within { + background-color: alpha(#df8e1d, 0.2); +} + +row.entry.warning text > cursor-handle > contents { + background-color: currentColor; +} + +row.entry.success text > selection:focus-within { + background-color: alpha(#40a02b, 0.2); +} + +row.entry.success text > cursor-handle > contents { + background-color: currentColor; +} + +row.combo image.dropdown-arrow:disabled { + filter: opacity(0.45); +} + +row.combo listview.inline { + background: none; + border: none; + box-shadow: none; + color: inherit; +} + +row.combo listview.inline, row.combo listview.inline:disabled { + background: none; + color: inherit; +} + +row.combo popover > contents { + min-width: 120px; +} + +row.expander { + background: none; + padding: 0px; +} + +row.expander > box > list { + background: none; + color: inherit; +} + +row.expander list.nested { + color: inherit; + background-color: transparent; +} + +row.expander list.nested > row { + background-color: transparent; + border: none; + background-image: none; + transition: none; + animation: none; +} + +row.expander image.expander-row-arrow { + transition: -gtk-icon-transform 200ms cubic-bezier(0, 0, 0.2, 1); +} + +row.expander image.expander-row-arrow:dir(ltr) { + margin-left: 6px; +} + +row.expander image.expander-row-arrow:dir(rtl) { + margin-right: 6px; +} + +row.expander image.expander-row-arrow:dir(ltr) { + -gtk-icon-transform: rotate(0.5turn); +} + +row.expander image.expander-row-arrow:dir(rtl) { + -gtk-icon-transform: rotate(-0.5turn); +} + +row.expander image.expander-row-arrow:disabled { + filter: opacity(0.45); +} + +row.expander:checked image.expander-row-arrow { + -gtk-icon-transform: rotate(0turn); + opacity: 1; +} + +row.expander:checked image.expander-row-arrow:not(:disabled) { + color: #89b4fa; +} + +.osd row.expander:checked image.expander-row-arrow:not(:disabled) { + color: inherit; +} + +list.content > row.expander row.header, +list.boxed-list > row.expander row.header { + background-color: transparent; + border: none; + box-shadow: none; +} + +list.content > row.expander, +list.boxed-list > row.expander { + border: none; +} + +columnview > listview > row { + padding: 0; +} + +columnview > listview > row > cell { + padding: 8px 6px; +} + +columnview > listview > row > cell:not(:first-child) { + border-left: 1px solid transparent; +} + +columnview.column-separators > listview > row > cell { + border-left-color: rgba(239, 241, 245, 0.12); +} + +columnview.data-table > listview > row > cell { + padding-top: 2px; + padding-bottom: 2px; +} + +treeexpander { + border-spacing: 6px; +} + +columnview row:not(:selected) cell editablelabel:not(.editing):focus-within { + outline: 2px solid alpha(currentColor, 0.06); +} + +columnview row:not(:selected) cell editablelabel.editing:focus-within { + outline: 2px solid #89b4fa; +} + +columnview row:not(:selected) cell editablelabel.editing text selection { + color: rgba(30, 30, 46, 0.87); + background-color: #89b4fa; +} + +/********************* + * App Notifications * + *********************/ +.app-notification { + margin: 6px; + border-spacing: 0; + padding: 0; + border: none; + background-image: none; +} + +.app-notification button.text-button:not(:disabled) { + color: #89b4fa; +} + +.app-notification > box > label { + margin-left: 9px; +} + +.app-notification.frame, +.app-notification border { + border: none; +} + +/************* + * Expanders * + *************/ +expander { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1); + min-width: 16px; + min-height: 16px; + color: rgba(239, 241, 245, 0.7); + -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); +} + +expander:dir(rtl) { + -gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl"); +} + +expander:hover, expander:active { + color: #eff1f5; +} + +expander:checked { + -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); +} + +expander:disabled { + color: rgba(239, 241, 245, 0.32); +} + +expander-widget > box > title { + border-radius: 12px; +} + +expander-widget > box > title:hover > expander { + color: rgba(239, 241, 245, 0.7); +} + +.navigation-sidebar:not(decoration):not(window):drop(active):focus, .navigation-sidebar:not(decoration):not(window):drop(active), +placessidebar:not(decoration):not(window):drop(active):focus, +placessidebar:not(decoration):not(window):drop(active), +stackswitcher:not(decoration):not(window):drop(active):focus, +stackswitcher:not(decoration):not(window):drop(active), +expander-widget:not(decoration):not(window):drop(active):focus, +expander-widget:not(decoration):not(window):drop(active) { + box-shadow: none; +} + +/************ + * Calendar * + ************/ +calendar { + padding: 0; + border: 1px solid rgba(239, 241, 245, 0.12); + border-radius: 12px; + color: #eff1f5; +} + +calendar:disabled { + color: rgba(239, 241, 245, 0.5); +} + +calendar:selected { + border-radius: 12px; +} + +calendar > header { + padding: 3px; + border-bottom: 1px solid rgba(239, 241, 245, 0.12); +} + +calendar > header > button { + min-height: 24px; +} + +calendar > grid { + margin: 3px; +} + +calendar > grid > label { + border-radius: 12px; + margin: 0; +} + +calendar > grid > label.today:selected { + box-shadow: none; +} + +calendar > grid > label:focus { + outline-style: none; +} + +calendar > grid > label.day-number { + padding: 6px; +} + +calendar > grid > label.day-number.other-month { + color: alpha(currentColor, 0.3); +} + +/*********** + * Dialogs * + ***********/ +window.messagedialog .response-area button, window.dialog.message .dialog-action-area > button { + border-radius: 9px; + min-height: 28px; + padding: 6px 12px; + margin: 0; + border: none; +} + +window.dialog.message.background { + background-color: #292c3c; +} + +window.dialog.message box.dialog-vbox.vertical { + margin-top: 6px; + border-spacing: 24px; +} + +window.dialog.message box.dialog-vbox.vertical > box.vertical { + margin-bottom: 6px; +} + +window.dialog.message box.dialog-vbox.vertical > box > box > box > label.title { + font-weight: 800; + font-size: 15pt; +} + +window.dialog.message .titlebar { + min-height: 24px; + border-style: none; + box-shadow: inset 0 1px rgba(239, 241, 245, 0.1); + background-color: #292c3c; + color: #eff1f5; +} + +window.dialog.message .titlebar:backdrop { + background-color: #292c3c; + color: rgba(239, 241, 245, 0.7); +} + +window.dialog.message .dialog-action-area { + border: none; + margin: 0; + padding: 6px; + border-spacing: 6px; +} + +window.dialog.message .dialog-action-area > button { + border: none; +} + +window.dialog.message .dialog-action-area > button.suggested-action:not(:disabled) { + color: #1e66f5; +} + +window.dialog.message .dialog-action-area > button.destructive-action:not(:disabled) { + color: #d20f39; +} + +window.aboutdialog.background.csd scrolledwindow.frame, +window.aboutdialog.background.csd scrolledwindow.frame > viewport.view, +window.aboutdialog.background.csd scrolledwindow.frame > textview.view, +window.aboutdialog.background.csd scrolledwindow.frame > textview.view > text { + border-radius: 12px; +} + +/******************** + * AdwMessageDialog * + ********************/ +window.messagedialog { + background-color: #292c3c; + color: #eff1f5; + padding: 6px; +} + +window.messagedialog .message-area { + padding: 24px 30px; + border-spacing: 10px; +} + +window.messagedialog .response-area { + border-spacing: 6px; +} + +window.messagedialog .response-area button.suggested { + color: #89b4fa; +} + +window.messagedialog .response-area button.destructive { + color: #d20f39; +} + +window.messagedialog .response-area separator { + background: none; + margin: 3px; +} + +/*********** + * Sidebar * + ***********/ +.sidebar { + border: none; +} + +.sidebar listview.view, +.sidebar list { + background-color: transparent; + color: inherit; +} + +leaflet.unfolded > box > stacksidebar.sidebar { + border: none; +} + +stacksidebar list { + padding: 6px; + background-color: transparent; +} + +stacksidebar row { + min-height: 24px; + padding: 6px; + border-radius: 6px; +} + +stacksidebar row:selected { + font-weight: 500; + background-color: rgba(239, 241, 245, 0.04); +} + +stacksidebar row + row { + margin-top: 3px; +} + +stacksidebar row > label { + padding-left: 6px; + padding-right: 6px; + color: inherit; +} + +separator.sidebar { + background-color: rgba(239, 241, 245, 0.12); + border-right: none; +} + +separator.sidebar.selection-mode, .selection-mode separator.sidebar { + background-color: rgba(239, 241, 245, 0.12); +} + +/********************** + * Navigation Sidebar * + **********************/ +.navigation-sidebar { + /* padding: $space-size - 4 $space-size - 2; //only vertical padding. horizontal row size would clip */ + padding: 0 6px; + border-right: none; +} + +.navigation-sidebar, .navigation-sidebar.view, .navigation-sidebar.background { + background-color: transparent; + color: inherit; +} + +.navigation-sidebar > separator { + background-color: rgba(239, 241, 245, 0.12); + margin: 10px 15px; +} + +.navigation-sidebar row.activatable label.dim-label { + color: rgba(239, 241, 245, 0.32); +} + +.navigation-sidebar > row { + min-height: 24px; + /* padding: 0 $space-size 0 $space-size; */ + padding: 0 6px; + margin: 0; + border-radius: 9px; +} + +.navigation-sidebar > row:hover, .navigation-sidebar > row:focus-visible:focus-within { + background-color: alpha(currentColor, 0.08); +} + +.navigation-sidebar > row:active { + background-color: alpha(currentColor, 0.12); +} + +.navigation-sidebar > row:selected { + background-color: alpha(currentColor, 0.08); + box-shadow: none; +} + +.navigation-sidebar > row:selected label, +.navigation-sidebar > row:selected image { + color: #89b4fa; + font-weight: 700; +} + +.navigation-sidebar > row:selected:hover { + background-color: alpha(currentColor, 0.08); +} + +.navigation-sidebar > row:selected:focus-visible:focus-within { + outline: none; + background-color: alpha(currentColor, 0.08); +} + +.navigation-sidebar > row:selected:focus-visible:focus-within:hover { + background-color: alpha(currentColor, 0.16); +} + +.navigation-sidebar > row:disabled { + color: rgba(239, 241, 245, 0.5); +} + +.navigation-sidebar > row:not(:first-child) { + margin-top: 3px; +} + +/**************** + * File chooser * + ****************/ +filechooser paned > separator { + background: rgba(239, 241, 245, 0.12); +} + +filechooser paned > box #pathbarbox.view, +filechooser paned > box stack.view, +filechooser paned > box columnview.view, +filechooser paned > box gridview.view { + background-color: transparent; +} + +filechooser .dialog-action-box { + border: none; +} + +filechooser #pathbarbox { + border: none; + background-color: transparent; +} + +filechooser stack.view frame > border { + border: none; +} + +filechooserbutton > button > box { + border-spacing: 6px; +} + +filechooserbutton:drop(active) { + box-shadow: none; + border-color: transparent; +} + +filechooser child.activatable filelistcell.dim-label { + color: rgba(239, 241, 245, 0.7); +} + +placessidebar { + background-color: transparent; +} + +placessidebar > viewport.frame { + border-style: none; +} + +placessidebar list.navigation-sidebar > row image.sidebar-icon { + color: inherit; +} + +placessidebar list.navigation-sidebar > row image.sidebar-icon:dir(ltr) { + padding-right: 8px; +} + +placessidebar list.navigation-sidebar > row image.sidebar-icon:dir(rtl) { + padding-left: 8px; +} + +placessidebar list.navigation-sidebar > row label.sidebar-label { + color: inherit; +} + +placessidebar list.navigation-sidebar > row label.sidebar-label:dir(ltr) { + padding-right: 2px; +} + +placessidebar list.navigation-sidebar > row label.sidebar-label:dir(rtl) { + padding-left: 2px; +} + +placessidebar list.navigation-sidebar > row.sidebar-placeholder-row { + background-color: alpha(currentColor, 0.08); +} + +placessidebar list.navigation-sidebar > row.sidebar-new-bookmark-row { + color: #89b4fa; +} + +placessidebar list.navigation-sidebar > row.sidebar-new-bookmark-row image.sidebar-icon { + color: #89b4fa; +} + +placessidebar list.navigation-sidebar > row:drop(active) { + background-color: alpha(currentColor, 0.08); +} + +placesview .server-list-button > image { + transition: 200ms cubic-bezier(0, 0, 0.2, 1); + -gtk-icon-transform: rotate(0turn); +} + +placesview .server-list-button:checked > image { + transition: 200ms cubic-bezier(0, 0, 0.2, 1); + -gtk-icon-transform: rotate(-0.5turn); +} + +placesview > actionbar > revealer > box > label { + border-spacing: 6px; +} + +/********* + * Paned * + *********/ +paned > separator { + min-width: 1px; + min-height: 1px; + -gtk-icon-source: none; + border-style: none; + background-color: transparent; + background-image: image(#4a4b5a); + background-size: 1px 1px; + background-clip: content-box; + box-shadow: none; +} + +paned > separator.wide { + min-width: 6px; + min-height: 6px; + background-color: #1e1e2e; + background-image: image(#4a4b5a), image(#4a4b5a); + background-size: 1px 1px, 1px 1px; +} + +paned.horizontal > separator { + background-repeat: repeat-y; +} + +paned.horizontal > separator:dir(ltr) { + margin: 0 -8px 0 0; + padding: 0 8px 0 0; + background-position: left; +} + +paned.horizontal > separator:dir(rtl) { + margin: 0 0 0 -8px; + padding: 0 0 0 8px; + background-position: right; +} + +paned.horizontal > separator.wide { + margin: 0; + padding: 0; + background-repeat: repeat-y, repeat-y; + background-position: left, right; +} + +paned.vertical > separator { + margin: 0 0 -8px 0; + padding: 0 0 8px 0; + background-repeat: repeat-x; + background-position: top; +} + +paned.vertical > separator.wide { + margin: 0; + padding: 0; + background-repeat: repeat-x, repeat-x; + background-position: bottom, top; +} + +/************ + * GtkVideo * + ************/ +video { + background: black; + border-radius: 12px; +} + +video image.osd { + min-width: 64px; + min-height: 64px; + border-radius: 9999px; + border: none; +} + +/************** + * GtkInfoBar * + **************/ +infobar > revealer > box { + padding: 6px; + border-spacing: 12px; + border-bottom: 1px solid rgba(239, 241, 245, 0.12); + box-shadow: none; +} + +infobar.info > revealer > box, infobar.info:hover > revealer > box, infobar.info:backdrop > revealer > box { + background-color: #313244; + color: #eff1f5; +} + +infobar.info > revealer > box button.text-button:not(:disabled):not(.suggested-action):not( +.destructive-action +), infobar.info:hover > revealer > box button.text-button:not(:disabled):not(.suggested-action):not( +.destructive-action +), infobar.info:backdrop > revealer > box button.text-button:not(:disabled):not(.suggested-action):not( +.destructive-action +) { + color: #89b4fa; +} + +infobar.action > revealer > box, infobar.action:backdrop > revealer > box, infobar.question > revealer > box, infobar.question:backdrop > revealer > box { + background-color: transparent; + color: #eff1f5; + border-radius: 9px; + border: none; +} + +infobar.action > revealer > box button, infobar.action > revealer > box button:hover, infobar.action > revealer > box button:focus, infobar.action > revealer > box button:active, infobar.action > revealer > box button:checked, infobar.action > revealer > box button.text-button:not(:disabled), infobar.action:backdrop > revealer > box button, infobar.action:backdrop > revealer > box button:hover, infobar.action:backdrop > revealer > box button:focus, infobar.action:backdrop > revealer > box button:active, infobar.action:backdrop > revealer > box button:checked, infobar.action:backdrop > revealer > box button.text-button:not(:disabled), infobar.question > revealer > box button, infobar.question > revealer > box button:hover, infobar.question > revealer > box button:focus, infobar.question > revealer > box button:active, infobar.question > revealer > box button:checked, infobar.question > revealer > box button.text-button:not(:disabled), infobar.question:backdrop > revealer > box button, infobar.question:backdrop > revealer > box button:hover, infobar.question:backdrop > revealer > box button:focus, infobar.question:backdrop > revealer > box button:active, infobar.question:backdrop > revealer > box button:checked, infobar.question:backdrop > revealer > box button.text-button:not(:disabled) { + color: #eff1f5; +} + +infobar.action > revealer > box *:link, infobar.action:backdrop > revealer > box *:link, infobar.question > revealer > box *:link, infobar.question:backdrop > revealer > box *:link { + color: #eff1f5; +} + +infobar.action:hover > revealer > box, infobar.question:hover > revealer > box { + background-color: rgba(239, 241, 245, 0.04); +} + +infobar.warning > revealer > box, infobar.warning:backdrop > revealer > box { + background-color: #df8e1d; + color: #eff1f5; +} + +infobar.warning > revealer > box button, infobar.warning > revealer > box button:hover, infobar.warning > revealer > box button:focus, infobar.warning > revealer > box button:active, infobar.warning > revealer > box button:checked, infobar.warning > revealer > box button.text-button:not(:disabled), infobar.warning:backdrop > revealer > box button, infobar.warning:backdrop > revealer > box button:hover, infobar.warning:backdrop > revealer > box button:focus, infobar.warning:backdrop > revealer > box button:active, infobar.warning:backdrop > revealer > box button:checked, infobar.warning:backdrop > revealer > box button.text-button:not(:disabled) { + color: #eff1f5; +} + +infobar.warning > revealer > box *:link, infobar.warning:backdrop > revealer > box *:link { + color: #eff1f5; +} + +infobar.warning:hover > revealer > box { + background-color: #c8801a; +} + +infobar.error > revealer > box, infobar.error:backdrop > revealer > box { + background-color: #d20f39; + color: #eff1f5; +} + +infobar.error > revealer > box button, infobar.error > revealer > box button:hover, infobar.error > revealer > box button:focus, infobar.error > revealer > box button:active, infobar.error > revealer > box button:checked, infobar.error > revealer > box button.text-button:not(:disabled), infobar.error:backdrop > revealer > box button, infobar.error:backdrop > revealer > box button:hover, infobar.error:backdrop > revealer > box button:focus, infobar.error:backdrop > revealer > box button:active, infobar.error:backdrop > revealer > box button:checked, infobar.error:backdrop > revealer > box button.text-button:not(:disabled) { + color: #eff1f5; +} + +infobar.error > revealer > box *:link, infobar.error:backdrop > revealer > box *:link { + color: #eff1f5; +} + +infobar.error:hover > revealer > box { + background-color: #ba0d33; +} + +/************ + * Tooltips * + ************/ +tooltip { + padding: 6px 12px; + box-shadow: none; + border: none; +} + +tooltip.background { + background-color: rgba(24, 24, 37, 0.9); + color: #eff1f5; + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.05), 0 2px 3px -1px rgba(0, 0, 0, 0.06), 0 1px 4px 0 rgba(0, 0, 0, 0.05); + border-radius: 12px; + margin: 2px 6px 8px 6px; +} + +tooltip > box { + border-spacing: 6px; +} + +/***************** + * Color Chooser * + *****************/ +colorswatch.top { + border-top-left-radius: 12px; + border-top-right-radius: 12px; +} + +colorswatch.top overlay { + border-top-left-radius: 12px; + border-top-right-radius: 12px; +} + +colorswatch.bottom { + border-bottom-left-radius: 12px; + border-bottom-right-radius: 12px; +} + +colorswatch.bottom overlay { + border-bottom-left-radius: 12px; + border-bottom-right-radius: 12px; +} + +colorswatch.left, colorswatch:first-child:not(.top) { + border-top-left-radius: 12px; + border-bottom-left-radius: 12px; +} + +colorswatch.left overlay, colorswatch:first-child:not(.top) overlay { + border-top-left-radius: 12px; + border-bottom-left-radius: 12px; +} + +colorswatch.right, colorswatch:last-child:not(.bottom) { + border-top-right-radius: 12px; + border-bottom-right-radius: 12px; +} + +colorswatch.right overlay, colorswatch:last-child:not(.bottom) overlay { + border-top-right-radius: 12px; + border-bottom-right-radius: 12px; +} + +colorswatch.dark { + color: #eff1f5; +} + +colorswatch.light { + color: rgba(30, 30, 46, 0.87); +} + +colorchooser colorswatch:hover { + transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); + box-shadow: 0 0 0 2px #89b4fa; +} + +colorswatch#add-color-button { + border-radius: 12px 0 0 12px; + color: #eff1f5; +} + +colorswatch#add-color-button:only-child { + border-radius: 12px; +} + +colorswatch#add-color-button overlay { + background-color: rgba(239, 241, 245, 0.04); +} + +colorswatch#add-color-button overlay:hover { + background-color: rgba(239, 241, 245, 0.12); + box-shadow: none; +} + +colorswatch#add-color-button overlay:active { + background-color: rgba(239, 241, 245, 0.3); +} + +colorswatch:disabled { + opacity: 0.5; +} + +colorswatch:disabled overlay { + box-shadow: none; +} + +colorswatch#editor-color-sample { + border-radius: 12px; +} + +colorswatch#editor-color-sample overlay { + border-radius: 12px; +} + +colorswatch#editor-color-sample overlay:hover { + box-shadow: 0 2px 3px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -1px rgba(0, 0, 0, 0.17); +} + +colorchooser .popover.osd { + transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); + border-radius: 12px; + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.15), 0 4px 3px 0 rgba(0, 0, 0, 0.18), 0 1px 6px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(239, 241, 245, 0.1); + background-color: #292c3c; +} + +colorchooser .popover.osd:backdrop { + box-shadow: 0 3px 2px -3px rgba(0, 0, 0, 0.2), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(239, 241, 245, 0.1); +} + +/******** + * Misc * + ********/ +.content-view { + background-color: #1e1e2e; +} + +/********************** + * Window Decorations * + **********************/ +window { + border: none; +} + +window.csd { + border-radius: 12px; + outline: none; + margin: 0; + transition: none; + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 15px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12), 0 0 0 2px #89b4fa, 0 0 36px transparent; +} + +window.csd:backdrop { + transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.15), 0 4px 3px 0 rgba(0, 0, 0, 0.18), 0 1px 6px 0 rgba(0, 0, 0, 0.12), 0 0 0 2px #292c3c, 0 0 36px transparent; +} + +window.csd.maximized, window.csd.fullscreen, window.csd.tiled, window.csd.tiled-top, window.csd.tiled-right, window.csd.tiled-bottom, window.csd.tiled-left { + border-radius: 0; + transition: none; +} + +window.csd.maximized, window.csd.fullscreen { + box-shadow: none; + outline: none; +} + +window.solid-csd { + margin: 0; + padding: 2px; + border-radius: 0; + background-color: #1e1e2e; + border: 1px solid #4a4b5a; +} + +window.solid-csd:backdrop { + background-color: #1e1e2e; +} + +window.ssd { + box-shadow: inset 0 1px rgba(239, 241, 245, 0.1); +} + +windowcontrols > button:not(.suggested-action):not(.destructive-action) { + min-height: 22px; + min-width: 22px; + padding: 6px 0; + margin-left: 0px; + margin-right: 0px; +} + +windowcontrols > button.minimize:not(.suggested-action):not(.destructive-action), windowcontrols > button.maximize:not(.suggested-action):not(.destructive-action), windowcontrols > button.close:not(.suggested-action):not(.destructive-action) { + color: rgba(239, 241, 245, 0.7); +} + +windowcontrols > button.minimize:not(.suggested-action):not(.destructive-action), windowcontrols > button.maximize:not(.suggested-action):not(.destructive-action), windowcontrols > button.close:not(.suggested-action):not(.destructive-action) { + background: none; + box-shadow: none; +} + +windowcontrols > button.minimize:not(.suggested-action):not(.destructive-action) > image, windowcontrols > button.maximize:not(.suggested-action):not(.destructive-action) > image, windowcontrols > button.close:not(.suggested-action):not(.destructive-action) > image { + background-color: alpha(currentColor, 0.1); +} + +windowcontrols > button.minimize:hover:not(.suggested-action):not(.destructive-action), windowcontrols > button.maximize:hover:not(.suggested-action):not(.destructive-action), windowcontrols > button.close:hover:not(.suggested-action):not(.destructive-action) { + color: #eff1f5; +} + +windowcontrols > button.minimize:hover:not(.suggested-action):not(.destructive-action) > image, windowcontrols > button.maximize:hover:not(.suggested-action):not(.destructive-action) > image, windowcontrols > button.close:hover:not(.suggested-action):not(.destructive-action) > image { + background-color: alpha(currentColor, 0.15); +} + +windowcontrols > button.minimize:active:not(.suggested-action):not(.destructive-action), windowcontrols > button.maximize:active:not(.suggested-action):not(.destructive-action), windowcontrols > button.close:active:not(.suggested-action):not(.destructive-action) { + color: #eff1f5; +} + +windowcontrols > button.minimize:active:not(.suggested-action):not(.destructive-action) > image, windowcontrols > button.maximize:active:not(.suggested-action):not(.destructive-action) > image, windowcontrols > button.close:active:not(.suggested-action):not(.destructive-action) > image { + background-color: alpha(currentColor, 0.2); +} + +windowcontrols > button.minimize:backdrop:not(.suggested-action):not(.destructive-action), windowcontrols > button.maximize:backdrop:not(.suggested-action):not(.destructive-action), windowcontrols > button.close:backdrop:not(.suggested-action):not(.destructive-action) { + opacity: 0.65; +} + +windowcontrols { + border-spacing: 6px; +} + +windowcontrols:not(.empty).start:dir(ltr), windowcontrols:not(.empty).end:dir(rtl) { + margin-right: 6px; + margin-left: 6px; +} + +windowcontrols:not(.empty).start:dir(rtl), windowcontrols:not(.empty).end:dir(ltr) { + margin-left: 6px; + margin-right: 6px; +} + +windowcontrols > button:not(.suggested-action):not(.destructive-action) > image { + border-radius: 100%; + padding: 0; +} + + +.view:selected, iconview:selected, gridview > child:selected, columnview.view:selected, +treeview.view:selected, calendar:selected, calendar > grid > label.day-number:selected { + background-color: alpha(currentColor, 0.06); +} + +flowbox > flowboxchild:selected, .link selection, calendar > grid > label.today { + color: #89b4fa; + background-color: rgba(137, 180, 250, 0.2); +} + +textview text selection:focus, textview text selection, label > selection, +entry > text > selection, spinbutton > text > selection, +entry headerbar popover.background entry > text > selection, +headerbar popover.background entry entry > text > selection, calendar > grid > label.today:selected { + color: rgba(30, 30, 46, 0.87); + background-color: #89b4fa; +} + +.monospace { + font-family: monospace; +} + +/********************** + * Touch Copy & Paste * + **********************/ +cursor-handle { + color: #89b4fa; + -gtk-icon-source: -gtk-recolor(url("assets/cursor-handle-symbolic.svg")); +} + +cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) { + padding-top: 6px; +} + +shortcuts-section { + margin: 20px; +} + +.shortcuts-search-results { + margin: 20px; + border-spacing: 24px; +} + +shortcut { + border-spacing: 6px; +} + +shortcut > .keycap { + min-width: 12px; + min-height: 26px; + margin-top: 2px; + padding-bottom: 2px; + padding-left: 8px; + padding-right: 8px; + border: solid 1px rgba(239, 241, 245, 0.12); + border-radius: 13px; + box-shadow: inset 0 -2px rgba(239, 241, 245, 0.12); + background-color: #292c3c; + color: #eff1f5; + font-size: smaller; +} + +:not(decoration):not(window):drop(active) { + caret-color: #89b4fa; +} + +stackswitcher { + min-height: 0; + padding: 0; + border-radius: 15px; + background-color: rgba(239, 241, 245, 0.04); + border: none; +} + +stackswitcher.linked > button:not(.suggested-action):not(.destructive-action) { + margin: 0; + border-radius: 9999px; +} + +stackswitcher.linked > button:not(.suggested-action):not(.destructive-action).text-button { + min-width: 100px; +} + +stackswitcher.linked > button:not(.suggested-action):not(.destructive-action):not(:hover):not(:active):not(:checked) { + background-color: transparent; +} + +stackswitcher.linked > button:not(.suggested-action):not(.destructive-action):focus:not(:hover):not(:checked) { + box-shadow: none; +} + +stackswitcher.linked > button:not(.suggested-action):not(.destructive-action):checked { + background-color: #e6e9ef; + color: rgba(30, 30, 46, 0.87); +} + +stackswitcher.linked > button:not(.suggested-action):not(.destructive-action):checked:hover { + box-shadow: none; + background-color: white; +} + +stackswitcher button.text-button { + min-width: 100px; +} + +stackswitcher button.circular, +stackswitcher button.text-button.circular { + min-width: 34px; + min-height: 34px; + padding: 0; +} + +/************* + * App Icons * + *************/ +.lowres-icon { + -gtk-icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); +} + +.icon-dropshadow { + -gtk-icon-shadow: 0 1px 12px rgba(0, 0, 0, 0.05), 0 1px 6px rgba(0, 0, 0, 0.1); +} + +/********* + * Emoji * + *********/ +popover.emoji-picker { + padding: 0; +} + +popover.emoji-picker > contents { + padding: 0; +} + +.emoji-searchbar { + padding: 6px; + border-spacing: 6px; + background: none; +} + +.emoji-searchbar entry text { + background: none; + box-shadow: none; +} + +.emoji-toolbar { + padding: 3px; + border-spacing: 0; + background: none; +} + +.emoji-toolbar > flowboxchild { + padding: 3px; +} + +.emoji-toolbar > flowboxchild > button { + padding: 6px; +} + +button.emoji-section { + margin: 0; + padding: 6px; + border-radius: 12px; +} + +button.emoji-section:checked { + color: #89b4fa; +} + +popover.emoji-picker emoji { + font-size: x-large; + padding: 6px; + transition: all 75ms cubic-bezier(0, 0, 0.2, 1); + border-radius: 9px; +} + +popover.emoji-picker emoji:focus, popover.emoji-picker emoji:hover { + background: alpha(currentColor, 0.08); +} + +emoji-completion-row { + min-height: 28px; + padding: 0 12px; +} + +emoji-completion-row > box { + border-spacing: 6px; + padding: 2px 6px; +} + +emoji-completion-row:focus, emoji-completion-row:hover, +emoji-completion-row emoji:hover, +emoji-completion-row emoji:focus { + background-color: alpha(currentColor, 0.08); + color: #eff1f5; +} + +popover.entry-completion > contents { + padding: 0; +} + +.nautilus-window.view { + background-color: #1e1e2e; +} + +.nautilus-window .sidebar-pane { + background-color: #1e1e2e; + color: #eff1f5; +} + +.nautilus-window .sidebar-pane:backdrop { + background-color: #1e1e2e; + transition: none; +} + +.nautilus-window placesview label { + color: rgba(239, 241, 245, 0.7); +} + +.nautilus-window flap > separator { + background-color: transparent; +} + +.nautilus-window .nautilus-grid-view, +.nautilus-window .nautilus-list-view { + /* @extend %content_style; */ +} + +.nautilus-window .nautilus-grid-view .view, +.nautilus-window .nautilus-list-view .view { + background-color: transparent; +} + +.nautilus-window .nautilus-grid-view row.activatable > cell, +.nautilus-window .nautilus-list-view row.activatable > cell { + padding: 0px; + margin: 0px; +} + +.nautilus-window .nautilus-grid-view gridview.view { + margin: 10px 5px; + padding: 10px 5px; +} + +.nautilus-window tabbar .box { + background-color: transparent; + box-shadow: none; + padding: 0; +} + +.nautilus-window tabbar .box:backdrop { + background-color: transparent; + box-shadow: none; +} + +.nautilus-window tabbox, .nautilus-window tabbox:backdrop { + transition: none; + background-color: transparent; +} + +.nautilus-window tabbox > tabboxchild > tab { + color: rgba(239, 241, 245, 0.7); +} + +.nautilus-window tabbox > tabboxchild > tab:hover { + background-color: rgba(239, 241, 245, 0.04); + color: #eff1f5; +} + +.nautilus-window tabbox > tabboxchild > tab:disabled { + color: rgba(239, 241, 245, 0.32); +} + +.nautilus-window tabbox > tabboxchild > tab:checked, .nautilus-window tabbox > tabboxchild > tab:selected { + background-color: rgba(239, 241, 245, 0.04); + color: #89b4fa; + box-shadow: none; +} + +.nautilus-window tabbox > tabboxchild > tab:checked:disabled, .nautilus-window tabbox > tabboxchild > tab:selected:disabled { + color: rgba(239, 241, 245, 0.5); +} + +.nautilus-window tabbox > tabboxchild > tab button.tab-close-button { + color: #eff1f5; +} + +.nautilus-window tabbox > tabboxchild > tab button.tab-close-button:hover, .nautilus-window tabbox > tabboxchild > tab button.tab-close-button:active { + color: #eff1f5; +} + +.nautilus-window tabbox > tabboxchild > tab button.tab-close-button:disabled { + color: #eff1f5; +} + +.nautilus-window .floating-bar { + min-height: 32px; + padding: 0; + margin: 6px; + border-style: none; + border-radius: 9px; + background-color: rgba(49, 50, 68, 0.95); + color: #89b4fa; + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.05), 0 2px 3px -1px rgba(0, 0, 0, 0.06), 0 1px 4px 0 rgba(0, 0, 0, 0.05); +} + +.nautilus-window .floating-bar button { + margin: 4px; + color: rgba(30, 30, 46, 0.87); +} + +.nautilus-window banner > revealer > widget { + color: #eff1f5; + background-color: rgba(49, 50, 68, 0.5); + border-radius: 9px; + margin: 9px; +} + +.nautilus-window banner > revealer > widget:hover { + background-color: #313244; + border-radius: 9px; + margin: 9px; +} + +.nautilus-window banner > revealer > widget button { + color: #eff1f5; + background-color: rgba(137, 180, 250, 0.3); +} + +.nautilus-window banner > revealer > widget button:hover { + background-color: rgba(137, 180, 250, 0.6); +} + +#NautilusQueryEditor > menubutton > button.image-button { + min-width: 24px; + min-height: 24px; + padding: 3px; + margin-right: -5px; +} + +#NautilusQueryEditor > menubutton > button.image-button:checked image { + color: rgba(30, 30, 46, 0.87); +} + +#NautilusQueryEditor > text, +#NautilusQueryEditor > box, +#NautilusQueryEditor > menubutton { + margin: 3px 0; +} + +#NautilusQueryEditorTag { + background-color: rgba(239, 241, 245, 0.12); +} + +#NautilusQueryEditorTag > button.image-button { + margin: 0; + padding: 0; +} + +#NautilusPathBar { + background-color: rgba(239, 241, 245, 0.04); + border-radius: 12px; + margin: 6px 0; +} + +#NautilusPathButton { + margin: 0 3px; + border-radius: 12px; +} + +#NautilusPathButton.current-dir { + color: #89b4fa; +} + +#NautilusPathButton.current-dir:hover, #NautilusPathButton.current-dir:active { + background: none; + box-shadow: none; +} + +#NautilusPathButton:first-child { + margin-left: 0; +} + +#NautilusViewCell clamp box { + margin: 0; + border-spacing: 0; +} + +#NautilusFileChooser gridview.view { + background-color: transparent; + margin: 10px 5px; + padding: 10px 5px; +} + +#NautilusFileChooser columnview.view, +row.activatable > cell { + background-color: transparent; + padding: 1px 10px; +} + +#NautilusProgressIndicator popover label { + color: rgba(239, 241, 245, 0.7); +} + +#NautilusProgressIndicator popover image { + color: rgba(239, 241, 245, 0.7); +} + +/* Nautilus Progress Indicator */ +windowhandle box.vertical box.toolbar { + background-color: #1e1e2e; + border: none; + outline: none; +} + +windowhandle box.toolbar menubutton button.toggle { + background-color: #1e1e2e; + border: none; + outline: none; +} + +window.dialog > box > stack > box > box > notebook.frame { + border-width: 0 0 0 1px; + border-radius: 0; +} + +.display-container.card { + background-color: #313244; +} + +.small .display-container.card { + border-radius: 0; + box-shadow: none; + border-width: 0 0 1px 0; +} + +.display-container .history-view { + background-color: transparent; +} + +.display-container #displayitem { + padding: 0 12px 8px 0; + font-size: 1.4em; + border-top: 1px solid rgba(239, 241, 245, 0.12); +} + +.math-buttons button { + font-size: 1.1em; + padding: 2px 6px; +} + +.math-buttons button.text-button { + padding-left: 16px; + padding-right: 16px; +} + +leaflet button.number-button { + background-color: rgba(239, 241, 245, 0.1); +} + +leaflet button.number-button:hover { + background-color: rgba(239, 241, 245, 0.2); +} + +leaflet button.number-button:active { + background-color: rgba(239, 241, 245, 0.3); +} + +label.primary-label, label.month-name, label.secondary-label { + font-size: 16pt; + font-weight: bold; + padding: 12px; +} + +label.primary-label, label.month-name { + color: #89b4fa; +} + +label.secondary-label { + color: rgba(239, 241, 245, 0.5); +} + +toastoverlay datechooser.view, +toastoverlay agenda-view.view, +toastoverlay agenda-view.view list, +toastoverlay stack.view { + background-color: transparent; +} + +calendar-view { + font-size: 10pt; +} + +calendar-view:selected { + color: #89b4fa; + font-weight: bold; +} + +calendar-view.header, +label.header { + font-size: 10pt; + font-weight: bold; + color: rgba(239, 241, 245, 0.5); +} + +calendar-view.current, +weekgrid.current { + background-color: alpha(#89b4fa, 0.3); +} + +popover.events { + background-color: #292c3c; + padding: 0; +} + +popover.events box { + border-top-left-radius: 12px; + border-top-right-radius: 12px; +} + +popover.events list { + background-color: #313244; + border-radius: 12px; +} + +popover.events scrolledwindow { + border-width: 0; +} + +popover.events button { + border-radius: 12px; + border-top-left-radius: 0; + border-top-right-radius: 0; + border-style: solid none none; + box-shadow: none; +} + +event { + margin: 1px; + font-size: 0.9rem; +} + +event widget.content { + margin: 4px; +} + +event.timed, event:not(.slanted):not(.slanted-start):not(.slanted-end) { + border-radius: 12px; +} + +event.timed widget.edge { + border-radius: 6px; + min-width: 5px; +} + +event.slanted-start, event.slanted-end:dir(rtl) { + padding-left: 16px; + border-radius: 0 6px 6px 0; +} + +event.slanted-end, event.slanted-start:dir(rtl) { + padding-right: 16px; + border-radius: 6px 0 0 6px; +} + +event:not(.timed).color-dark { + color: white; + outline-color: rgba(0, 0, 0, 0.3); +} + +event.timed, event:not(.timed).color-light { + color: alpha(black, 0.75); + outline-color: rgba(255, 255, 255, 0.5); +} + +popover.event-popover, +popover.event-popover > contents { + padding: 0; +} + +.search-viewport { + background-color: #313244; +} + +.calendar-list { + background-color: transparent; +} + +.calendar-list > list { + border-radius: 4px; +} + +menubutton.flat.sources-button { + margin-top: 0; + margin-bottom: 0; + border-radius: 0; + border-top-style: none; + border-bottom-style: none; +} + +menubutton.flat.sources-button:hover:not(:backdrop) { + background-image: none; + text-shadow: none; +} + +menubutton.flat.sources-button > button { + border-radius: 0 0 12px 12px; +} + +.calendar-color-image { + -gtk-icon-filter: none; +} + +image.calendar-color-image, +button:active:not(:backdrop) .calendar-color-image, +button:checked:not(:backdrop) .calendar-color-image, +.calendars-list .calendar-color-image:not(:backdrop):not(:disabled), +.calendar-list .calendar-color-image:not(:backdrop):not(:disabled), +.sources-button:not(:backdrop):not(:disabled) .calendar-color-image { + -gtk-icon-shadow: 0 1px alpha(black, 0.1); +} + +datechooser { + padding: 6px; +} + +datechooser .current-week { + background-color: rgba(239, 241, 245, 0.04); + color: #eff1f5; + border-radius: 12px; +} + +datechooser navigator { + margin-right: 6px; + margin-left: 6px; + margin-bottom: 6px; +} + +datechooser navigator label { + font-weight: bold; +} + +datechooser navigator button.flat, +datechooser navigator button.image-button { + min-height: 34px; + min-width: 34px; + padding: 0; +} + +datechooser .weeknum, +datechooser .weekday { + color: rgba(239, 241, 245, 0.5); + font-size: smaller; +} + +datechooser button.day { + font-size: 10pt; + font-weight: normal; + margin: 3px; + padding: 0; + min-height: 34px; + min-width: 34px; + transition: none; +} + +datechooser button.day dot { + background-color: #eff1f5; + border-radius: 50%; + min-height: 3px; + min-width: 3px; +} + +datechooser button.day:selected, datechooser button.day.today:selected { + background-color: #89b4fa; + color: rgba(30, 30, 46, 0.87); + font-weight: bold; +} + +datechooser button.day:selected dot, datechooser button.day.today:selected dot { + background-color: rgba(30, 30, 46, 0.87); +} + +datechooser button.day.today { + color: #89b4fa; +} + +datechooser button.day.today dot { + background-color: #89b4fa; +} + +datechooser button.day.other-month:not(:hover), datechooser button.day.other-month:backdrop { + color: rgba(239, 241, 245, 0.32); +} + +datechooser button.day.other-month:not(:hover) dot, datechooser button.day.other-month:backdrop dot { + background-color: rgba(239, 241, 245, 0.32); +} + +datechooser button.day.other-month:hover:not(:backdrop) { + color: rgba(239, 241, 245, 0.5); +} + +datechooser button.day.other-month:hover:not(:backdrop) dot { + background-color: rgba(239, 241, 245, 0.5); +} + +.week-header { + padding: 0; +} + +.week-header > box:first-child { + border-bottom: 1px solid rgba(239, 241, 245, 0.12); +} + +.week-header .week-number { + font-size: 16pt; + font-weight: bold; + padding: 12px 12px 18px 12px; + color: rgba(239, 241, 245, 0.3); +} + +.week-header.week-temperature { + font-size: 10pt; + font-weight: bold; + color: rgba(239, 241, 245, 0.5); +} + +.week-header.lines { + color: rgba(239, 241, 245, 0.12); +} + +weekhourbar > label { + font-size: 10pt; + padding: 4px 6px; +} + +.week-view .lines { + color: rgba(239, 241, 245, 0.12); +} + +weekgrid > widget.now-strip { + background-color: alpha(#89b4fa, 0.8); + margin: 0 0 0 1px; + min-height: 3px; +} + +weekgrid:selected, weekgrid.dnd, +.week-header:selected, +.week-header.dnd { + background-color: alpha(#89b4fa, 0.25); +} + +monthcell { + border: solid 1px rgba(239, 241, 245, 0.12); + border-width: 1px 0 0 1px; + background-color: transparent; + transition: background-color 200ms; +} + +monthcell:hover:not(.out-of-month):not(.today) { + background-color: #313244; + transition: background-color 200ms; + color: #eff1f5; +} + +monthcell:selected { + background-color: alpha(#89b4fa, 0.1); +} + +monthcell:selected:hover { + background-color: alpha(#89b4fa, 0.2); +} + +monthcell:selected label.day-label { + font-weight: bold; +} + +monthcell:nth-child(7n + 1) { + border-left-width: 0; +} + +monthcell.today { + background-color: alpha(#89b4fa, 0.2); +} + +monthcell.today:hover { + background-color: alpha(#89b4fa, 0.3); + color: #89b4fa; +} + +monthcell.today:selected { + background-color: alpha(#89b4fa, 0.25); +} + +monthcell.today:selected:hover { + background-color: alpha(#89b4fa, 0.35); +} + +monthcell label { + color: #eff1f5; + font-size: 0.9rem; +} + +monthcell label.day-label { + font-size: 1rem; +} + +monthcell.out-of-month { + background-color: rgba(239, 241, 245, 0.04); +} + +monthcell.out-of-month label { + color: rgba(239, 241, 245, 0.7); +} + +monthcell button { + padding: 0 6px; + border-radius: 0; + border-bottom: none; + border-right: none; +} + +monthpopover > box { + margin: 0; + padding: 0; + background-color: transparent; +} + +.notes-section box > textview { + border-radius: 12px; + padding: 6px; +} + +.notes-section box > textview > text { + background: none; +} + +agenda-view list.background > row { + padding: 2px 12px; +} + +agenda-view list.background > label { + padding: 6px 12px; +} + +label.no-events { + font-style: italic; +} + +searchbutton > popover > arrow { + background: none; + border: none; +} + +menubutton stack > box { + border-spacing: 6px; +} + +#TweakPreferencesPage.tweak-group label.subtitle { + color: rgba(239, 241, 245, 0.32); +} + +#TweakPreferencesPage label.dim-label { + color: rgba(239, 241, 245, 0.32); +} + +.tweak-titlebar-left { + box-shadow: inset 0 1px rgba(239, 241, 245, 0.1); + border-top-left-radius: 12px; +} + +.tweak-titlebar-left > windowhandle > box { + padding: 0px; + margin: 0 5px 0 15px; +} + +.tweak-titlebar-left > windowhandle widget > box.start { + padding: 0px; + margin: 0 2px 0 0; +} + +.tweak-titlebar-left > windowhandle widget > box, +.tweak-titlebar-left windowtitle { + padding: 0px; + margin: 0 -3px 0 10px; +} + +.tweak-titlebar-left:backdrop { + box-shadow: inset 0 1px rgba(239, 241, 245, 0.1); + border-top-left-radius: 12px; +} + +.sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow .dim-label, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow row label.subtitle, row .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow label.subtitle, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow row.expander image.expander-row-arrow, row.expander .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow image.expander-row-arrow { + color: rgba(30, 30, 46, 0.38); +} + +.details-page { + margin: 24px 0px; +} + +.installed-overlay-box { + font-size: smaller; + background-color: #89b4fa; + border-radius: 0; + color: rgba(30, 30, 46, 0.87); + text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2); +} + +screenshot-carousel box.frame { + border-width: 1px 0; + border-radius: 0; +} + +screenshot-carousel button, +.featured-carousel button { + margin: 12px; +} + +carousel.card { + border: none; + background-color: rgba(239, 241, 245, 0.04); +} + +.smaller { + font-size: smaller; +} + +.screenshot-image-main .image1, +.screenshot-image-main .image2 { + margin-top: 6px; + margin-bottom: 12px; + margin-left: 6px; + margin-right: 6px; +} + +.app-tile-label { + font-size: 105%; +} + +gs-summary-tile image.loading-icon { + background-color: rgba(239, 241, 245, 0.12); + border-radius: 12px; +} + +.review-row > box { + margin: 12px; + border-spacing: 3px; +} + +.review-row textview { + background: none; +} + +.review-row .edit-icon { + min-width: 24px; + min-height: 24px; + padding: 6px; +} + +.review-textbox { + padding: 6px; +} + +.origin-rounded-box { + background-color: rgba(239, 241, 245, 0.12); + border-radius: 9999px; + padding: 4px; +} + +.origin-beta { + color: #df8e1d; +} + +.origin-button > button { + padding: 3px 9px; +} + +clamp.medium .category-tile:not(.category-tile-iconless) { + font-size: large; +} + +clamp.large .category-tile:not(.category-tile-iconless) { + font-size: larger; +} + +flowboxchild.card:not(.category-tile) { + padding: 0; + box-shadow: none; + border: none; + background-color: transparent; + background-image: none; +} + +.category-tile.card { + padding: 21px; + border: none; + border-radius: 12px; + min-width: 140px; + font-weight: 900; + font-size: larger; +} + +.category-tile.card:not(.category-tile-iconless), .category-tile.card:not(.category-tile-iconless):active { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1); + animation: none; +} + +.category-tile.card.category-tile-iconless { + padding: 9px 15px; + min-width: 130px; + font-size: 105%; + font-weight: normal; +} + +.category-tile.card.category-create { + background: linear-gradient(180deg, #ce8cd7 0%, #2861c6 100%); + color: white; +} + +.category-tile.card.category-create:hover { + background: linear-gradient(180deg, shade(#ce8cd7, 1.07) 0%, shade(#2861c6, 1.1) 100%); + color: white; +} + +.category-tile.card.category-create:active { + background: linear-gradient(180deg, shade(#ce8cd7, 0.95) 0%, shade(#2861c6, 0.95) 100%); + color: white; +} + +.category-tile.card.category-develop { + background-color: #5e5c64; + color: white; +} + +.category-tile.card.category-develop:hover { + background-color: shade(#5e5c64, 1.2); + color: white; +} + +.category-tile.card.category-develop:active { + background-color: shade(#5e5c64, 0.95); + color: white; +} + +.category-tile.card.category-learn { + background: linear-gradient(180deg, #2ec27e 30%, #27a66c 100%); + color: white; +} + +.category-tile.card.category-learn:hover { + background: linear-gradient(180deg, shade(#2ec27e, 1.06) 30%, shade(#27a66c, 1.06) 100%); + color: white; +} + +.category-tile.card.category-learn:active { + background: linear-gradient(180deg, shade(#2ec27e, 0.95) 30%, shade(#27a66c, 0.95) 100%); + color: white; +} + +.category-tile.card.category-play { + background: linear-gradient(75deg, #f9e2a7 0%, #eb5ec3 50%, #6d53e0 100%); + color: #393484; +} + +.category-tile.card.category-play:hover { + background: linear-gradient(75deg, shade(#f9e2a7, 1.07) 0%, shade(#eb5ec3, 1.07) 50%, shade(#6d53e0, 1.07) 100%); + color: #393484; +} + +.category-tile.card.category-play:active { + background: linear-gradient(75deg, shade(#f9e2a7, 0.97) 0%, shade(#eb5ec3, 0.95) 50%, shade(#6d53e0, 1.07) 100%); + color: #393484; +} + +.category-tile.card.category-socialize { + background: linear-gradient(90deg, #ef4e9b 0%, #f77466 100%); + color: rgba(239, 241, 245, 0.7); +} + +.category-tile.card.category-socialize:hover { + background: linear-gradient(90deg, shade(#ef4e9b, 1.08) 0%, shade(#f77466, 1.08) 100%); +} + +.category-tile.card.category-socialize:active { + background: linear-gradient(90deg, shade(#ef4e9b, 0.95) 0%, shade(#f77466, 0.95) 100%); +} + +.category-tile.card.category-work { + padding: 1px; + /* FIXME: work around https://gitlab.gnome.org/GNOME/gtk/-/issues/4324 */ + color: #1c71d8; + background-color: #fdf8d7; + background-image: linear-gradient(rgba(239, 241, 245, 0.12) 1px, transparent 1px), linear-gradient(90deg, rgba(239, 241, 245, 0.12) 1px, transparent 1px); + background-size: 10px 10px, 10px 10px; + background-position: -1px -4px, center -1px; + background-repeat: repeat; +} + +.category-tile.card.category-work:hover { + color: #1c71d8; + background-color: #fefcef; + background-image: linear-gradient(rgba(239, 241, 245, 0.12) 1px, transparent 1px), linear-gradient(90deg, rgba(239, 241, 245, 0.12) 1px, transparent 1px); +} + +.category-tile.card.category-work:active { + color: #1c71d8; + background-color: #fcf4bf; + background-image: linear-gradient(rgba(239, 241, 245, 0.12) 1px, transparent 1px), linear-gradient(90deg, rgba(239, 241, 245, 0.12) 1px, transparent 1px); + background-size: 10px 10px, 10px 10px; + background-position: -1px -4px, center -1px; + background-repeat: repeat; +} + +.featured-tile { + padding: 0; + box-shadow: none; + color: #eff1f5; +} + +.featured-tile label.title-1 { + margin-top: 6px; + margin-bottom: 6px; +} + +.featured-tile.narrow label.title-1 { + font-size: 16pt; +} + +.application-details-infobar, .application-details-infobar.info { + background-color: rgba(239, 241, 245, 0.04); + color: #eff1f5; + border: 1px solid rgba(239, 241, 245, 0.12); +} + +.application-details-infobar.warning { + background-color: #df8e1d; + color: #eff1f5; + border: 1px solid rgba(239, 241, 245, 0.12); +} + +.card.info { + background-color: #1f1f2f; + color: #eff1f5; +} + +.card.warning { + background-color: #1f1f2e; + color: #eff1f5; +} + +.infobox { + border-spacing: 6px; + padding: 12px; +} + +@keyframes install-progress-unknown-move { + 0% { + background-position: 0%; + } + 50% { + background-position: 100%; + } + 100% { + background-position: 0%; + } +} + +.application-details-description .button { + padding-left: 24px; + padding-right: 24px; +} + +.install-progress { + background-image: linear-gradient(to top, #89b4fa 2px, alpha(#89b4fa, 0) 2px); + background-repeat: no-repeat; + background-position: 0 bottom; + background-size: 0; + transition: none; +} + +.install-progress:dir(rtl) { + background-position: 100% bottom; +} + +.review-row > * { + margin: 12px; +} + +.review-row button { + font-size: smaller; +} + +.review-row .vote-buttons button { + margin-right: -1px; +} + +.review-row .vote-buttons button:not(:first-child) { + border-image: linear-gradient(to top, rgba(239, 241, 245, 0.12), rgba(239, 241, 245, 0.12)) 0 0 0 1/5px 0 5px 1px; +} + +.review-row .vote-buttons button:hover, +.review-row .vote-buttons button:active, +.review-row .vote-buttons button:hover + button, +.review-row .vote-buttons button:active + button { + border-image: none; +} + +review-bar { + color: rgba(239, 241, 245, 0.5); + background-image: none; + background-color: rgba(239, 241, 245, 0.3); +} + +.review-histogram star-image { + color: rgba(239, 241, 245, 0.5); +} + +.version-arrow-label { + font-size: x-small; +} + +.overview-more-button { + font-size: smaller; + padding: 0 16px; +} + +.app-row-origin-text { + font-size: smaller; +} + +.app-listbox-header { + padding: 6px; + border-bottom: 1px solid rgba(239, 241, 245, 0.12); +} + +.image-list { + background-color: transparent; +} + +box.star { + background-color: transparent; + background-image: none; +} + +button.star { + outline-offset: 0; + background-color: transparent; + background-image: none; + border-image: none; + border-radius: 0; + border-width: 0; + padding: 0; + box-shadow: none; + outline-offset: -1px; +} + +flowboxchild { + padding: 0px; +} + +star-image > image.starred { + color: #f9e2af; + transition-duration: 200ms; +} + +star-image > image.starred:hover { + color: #df8e1d; +} + +star-image > image.non-starred { + opacity: 0.2; + transition-duration: 200ms; +} + +star-image > image.non-starred:hover { + color: #f9e2af; + opacity: 0.7; +} + +.dimmer-label { + opacity: 0.25; +} + +.update-failed-details { + font-family: Monospace; + font-size: smaller; + padding: 16px; +} + +.upgrade-banner { + padding: 0px; + border-radius: 12px; + border: none; +} + +.upgrade-banner-background { + background: linear-gradient(to bottom, #40a02b, #1e66f5); + color: white; +} + +.upgrade-buttons #button_upgrades_install, +.upgrade-buttons #button_upgrades_install_cancel { + padding-left: 16px; + padding-right: 16px; +} + +scrolledwindow.list-page > viewport > clamp > box { + margin: 24px 12px; + border-spacing: 24px; +} + +.update-preferences preferencesgroup > box > box { + margin-top: 18px; +} + +.section > label:not(:first-child) { + margin-top: 6px; +} + +.section > box:not(:first-child) { + margin-top: 12px; +} + +clamp.status-page { + margin: 36px 12px; +} + +clamp.status-page .iconbox { + min-height: 128px; + min-width: 128px; +} + +clamp.status-page .icon { + color: rgba(239, 241, 245, 0.5); + min-height: 32px; + min-width: 32px; +} + +clamp.status-page .icon:not(:last-child) { + margin-bottom: 36px; +} + +clamp.status-page .title:not(:last-child) { + margin-bottom: 12px; +} + +app-context-bar .context-tile { + border: 1px solid rgba(239, 241, 245, 0.12); + background-color: transparent; + border-radius: 0; + padding: 24px 12px 21px 12px; + outline-offset: 5px; + transition-property: outline, outline-offset, background-image; + border-bottom: none; + border-right: none; +} + +app-context-bar .context-tile:hover { + background-image: none; + background-color: alpha(currentColor, 0.08); +} + +app-context-bar .context-tile.keyboard-activating, app-context-bar .context-tile:active { + background-color: alpha(currentColor, 0.12); +} + +app-context-bar .context-tile:focus:focus-visible { + outline-offset: -1px; +} + +app-context-bar.horizontal box:first-child .context-tile:first-child, app-context-bar.vertical .context-tile:first-child { + border-left: none; +} + +app-context-bar.horizontal .context-tile, app-context-bar.vertical box:first-child .context-tile { + border-top: none; +} + +app-context-bar > box:not(:first-child) > button.flat { + border-radius: 0; +} + +app-context-bar > box:not(:first-child) > button.flat:last-child { + border-radius: 0 12px 12px 0; +} + +app-context-bar > box:first-child > button.flat { + border-radius: 0; +} + +app-context-bar > box:first-child > button.flat:first-child { + border-radius: 12px 0 0 12px; +} + +app-context-bar > box > button.flat { + border-left-color: rgba(239, 241, 245, 0.12); +} + +.context-tile-lozenge { + min-height: 28px; + min-width: 28px; + padding: 6px; + font-size: 18px; + font-weight: bold; + border-radius: 9999px; +} + +.context-tile-lozenge.large { + font-size: 24px; + padding: 16px; + min-width: 24px; + /* 60px minus the left and right padding */ + min-height: 24px; + /* 60px minus the top and bottom padding */ +} + +.context-tile-lozenge.wide-image image { + margin-top: -28px; + margin-bottom: -28px; +} + +.context-tile-lozenge image { + -gtk-icon-style: symbolic; +} + +.context-tile-lozenge.grey { + color: #eff1f5; + background-color: rgba(239, 241, 245, 0.12); +} + +.context-tile-lozenge.green, .context-tile-lozenge.details-rating-0 { + color: #28641b; + background-color: rgba(64, 160, 43, 0.15); +} + +.context-tile-lozenge.blue, .context-tile-lozenge.details-rating-5 { + color: #1e66f5; + background-color: rgba(30, 102, 245, 0.15); +} + +.context-tile-lozenge.yellow, .context-tile-lozenge.details-rating-12 { + color: #9b6314; + background-color: rgba(223, 142, 29, 0.15); +} + +.context-tile-lozenge.details-rating-15 { + color: #fe640b; + background-color: rgba(254, 100, 11, 0.15); +} + +.context-tile-lozenge.red, .context-tile-lozenge.details-rating-18 { + color: #8b0a26; + background-color: rgba(210, 15, 57, 0.15); +} + +.eol-red { + font-weight: bold; + color: #d20f39; +} + +window.narrow .app-title { + font-size: 16pt; +} + +window.narrow .app-developer { + font-size: small; +} + +.install-progress-label { + font-size: smaller; + font-feature-settings: 'tnum'; +} + +scrolledwindow.fake-adw-status-page > viewport > box { + margin: 36px 12px; +} + +scrolledwindow.fake-adw-status-page +> viewport +> box +> clamp:not(:last-child) +> box { + margin-bottom: 36px; +} + +scrolledwindow.fake-adw-status-page +> viewport +> box +> clamp +> box +> .icon:not(:last-child) { + margin-bottom: 36px; +} + +scrolledwindow.fake-adw-status-page +> viewport +> box +> clamp +> box +> .title:not(:last-child) { + margin-bottom: 12px; +} + +statuspage.icon-dropshadow image.icon { + -gtk-icon-shadow: 0 1px 12px rgba(0, 0, 0, 0.05), 0 -1px rgba(0, 0, 0, 0.05), 1px 0 rgba(0, 0, 0, 0.1), 0 1px rgba(0, 0, 0, 0.3), -1px 0 rgba(0, 0, 0, 0.1); +} + +window.info scrollbar.vertical { + margin-top: 48px; + background: none; + box-shadow: none; +} + +window.info scrollbar.vertical trough { + margin-top: 0; +} + +row.app > box.header { + margin-left: 12px; + margin-right: 12px; +} + +row.app > box.header { + border-spacing: 12px; +} + +row.app > box.header > image { + margin-top: 12px; + margin-bottom: 12px; +} + +row.app label.warning { + color: #d20f39; +} + +@keyframes pre-delay { + from { + opacity: 0; + } + to { + opacity: 0; + } +} + +@keyframes fade-in { + from { + filter: opacity(0%); + } +} + +/* Give a fade-in animation to spinners. */ +spinner.fade-in:checked { + animation: pre-delay 0.5s linear 1, fade-in 1s linear 1, spin 1s linear infinite; + animation-delay: 0s, 0.5s, 0.5s; +} + +window > contents > leaflet > box > stack.background { + background-color: transparent; + background-image: linear-gradient(to bottom, transparent, transparent 46px, #1e1e2e 46px, #1e1e2e); +} + +@define-color weather_temp_chart_fill_color rgba(223, 142, 29, 0.5); +@define-color weather_temp_chart_stroke_color #b27117; +@define-color weather_thermometer_warm_color #df8e1d; +@define-color weather_thermometer_cold_color #1e66f5; +#places-label { + font-weight: bold; +} + +#temperature-label { + font-size: 32pt; + font-weight: 900; + margin-left: 9px; +} + +#conditions-grid *:backdrop { + color: rgba(239, 241, 245, 0.7); +} + +.content-view.cell { + font-weight: bold; +} + +#locationEntry { + margin: 6px; +} + +.weather-popover { + margin-top: 6px; +} + +.forecast-card { + transition: border-radius 100ms ease-out; + border-radius: 12px; +} + +.forecast-card separator { + background-color: #1e1e2e; +} + +#daily-forecast-box > separator:last-child { + background-color: transparent; + min-width: 0; +} + +#conditions-grid, +#attributionGrid { + margin-left: 18px; + margin-right: 18px; +} + +#weather-page .small .forecast-card { + margin-left: 0; + margin-right: 0; + border-radius: 0; + border-width: 1px 0; +} + +.forecast-temperature-label { + font-weight: bold; + color: #ae7b03; +} + +WeatherThermometer { + margin-bottom: 12px; +} + +WeatherThermometer > label.high { + font-weight: bold; + color: #df8e1d; +} + +WeatherThermometer > label.low { + font-weight: bold; + color: #1e66f5; +} + +.forecast-button { + margin: 0 12px; +} + +.forecast-graphic { + margin: 18px; +} + +button.osd.circular { + border-radius: 9999px; + min-width: 24px; + min-height: 24px; +} + +button.osd.circular > image { + padding: 0; +} + +scrolledwindow.inline list, +scrolledwindow.inline listview { + background: none; + color: inherit; +} + +scrolledwindow.inline undershoot.top { + box-shadow: inset 0 1px rgba(239, 241, 245, 0.12); +} + +.search-view { + background-color: #89b4fa; + color: rgba(30, 30, 46, 0.87); +} + +.search-view menubutton button:focus:focus-visible { + outline-color: rgba(255, 255, 255, 0.3); +} + +image.circular { + min-width: 34px; + min-height: 34px; + padding: 0; + border-radius: 9999px; +} + +#gnome-system-monitor.background.csd { + background-color: #1e1e2e; +} + +.large-button { + padding: 6px; +} + +.alarm-time { + font-size: 2.5em; + font-weight: 300; +} + +.clocks-ampm-toggle-button, +.clocks-secondary-standalone-label { + font-size: 18pt; +} + +.clocks-standalone-label, +.clocks-ringing-label { + font-size: 6em; + font-weight: 300; +} + +.clocks-ringing-title { + font-size: 1.5em; + font-weight: bold; +} + +.clocks-alarm-setup-time { + font-size: 32pt; +} + +.clocks-timer-label, +.clocks-spinbutton { + font-size: 48pt; +} + +.timer-panel .timer-header { + font-size: 20pt; + font-weight: 300; +} + +.timer-countdown { + font-size: 40pt; + font-weight: 300; +} + +/* Stopwatch Panel */ +.lap-time { + font-weight: bold; +} + +.stopped-stopwatch label, +.running-stopwatch label, +.paused-stopwatch label { + font-size: 70px; + font-weight: lighter; +} + +.stopped-stopwatch .seconds-label { + font-weight: 300; +} + +.running-stopwatch .seconds-label, +.running-stopwatch .miliseconds-label { + color: #89b4fa; +} + +.stopped-stopwatch .miliseconds-label, +.running-stopwatch .miliseconds-label, +.paused-stopwatch .miliseconds-label { + font-size: 50px; +} + +.running-stopwatch .seconds-label, +.paused-stopwatch .seconds-label { + font-weight: 300; +} + +.clock-location { + font-weight: bolder; +} + +.hidden { + opacity: 0; +} + +.clock-time { + font-size: 2em; + padding: 0.2em 0.5em; + border-radius: 1em; +} + +.none .clock-time { + background: alpha(currentColor, 0.2); +} + +.night .clock-time { + color: #89b4fa; + background-color: alpha(#1e66f5, 0.25); +} + +.naut .clock-time, +.astro .clock-time { + color: #fab387; + background-color: alpha(#fe640b, 0.25); +} + +.civil .clock-time, +.day .clock-time { + color: #f9e2af; + background: alpha(#df8e1d, 0.25); +} + +headerbar splitbutton notification button { + margin: 0; + min-height: 24px; + min-width: 24px; + padding: 0; +} + +popover.background.global-search > arrow, +popover.background.global-search > contents { + padding: 0; +} + +panelframeswitcher { + padding: 3px; +} + +.frameheader.header { + min-height: 24px; + background-color: #313244; +} + +.frameheader.header > button { + border: none; + margin: 0; + padding: 3px; +} + +.frameheader.header tabbar.inline > revealer > box { + min-height: 24px; +} + +.frameheader.header tabbar.inline > revealer > box .start-action { + padding: 0; + border: none; +} + +.frameheader.header tabbar.inline > revealer > box .end-action { + padding: 0; + border-left: 1px solid rgba(239, 241, 245, 0.12); +} + +.frameheader.header tabbar.inline > revealer > box tabbox { + border: none; + background: none; +} + +panelstatusbar > menubutton > button, +panelstatusbar > paneltogglebutton button { + border-radius: 0; +} + +.style-variant { + padding: 0 12px; +} + +.style-variant button.toggle { + padding: 0; +} + +.style-variant button.toggle, .style-variant button.toggle:hover, .style-variant button.toggle:focus, .style-variant button.toggle:active, .style-variant button.toggle:checked { + background: none; + outline: none; + border: none; + box-shadow: none; +} + +.style-variant button.toggle > stylevariantpreview > .wallpaper { + border-radius: 12px; + outline-color: transparent; + outline-width: 3px; + outline-offset: 3px; + outline-style: solid; + box-shadow: none; +} + +.style-variant button.toggle:hover > stylevariantpreview > .wallpaper { + outline-color: rgba(239, 241, 245, 0.04); +} + +.style-variant button.toggle:active > stylevariantpreview > .wallpaper { + outline-color: rgba(239, 241, 245, 0.3); +} + +.style-variant button.toggle:checked > stylevariantpreview > .wallpaper { + outline-color: #89b4fa; +} + +playlistview scrollbar.overlay-indicator.dragging, playlistview scrollbar.overlay-indicator.hovering { + background-color: transparent; +} + +playlistview queuerow picture.cover, +playlistview queuerow image.card { + border: none; +} + +window.dialog > .dialog-vbox > box > scrolledwindow > viewport > widget > list.boxed-list { + border: none; + border-radius: 0; +} + +window.dialog > .dialog-vbox > box > scrolledwindow > viewport > widget > list.boxed-list > row:first-child, window.dialog > .dialog-vbox > box > scrolledwindow > viewport > widget > list.boxed-list > row:last-child { + border-radius: 0; +} + +/* Tagger */ +list.music-list { + margin: -40px 0; + background-color: transparent; +} + +/* Nicotine+ */ +notebook scrolledwindow treeview.treeview-spacing { + background-color: #1e1e2e; +} + +.account-switcher-row label { + color: #eff1f5; +} + +.account-switcher-row label.dim-label { + color: rgba(239, 241, 245, 0.7); +} + +avatar { + border-radius: 9999px; + font-weight: bold; +} + +avatar.color1 { + background-image: linear-gradient(#83b6ec, #337fdc); + color: #cfe1f5; +} + +avatar.color2 { + background-image: linear-gradient(#7ad9f1, #0f9ac8); + color: #caeaf2; +} + +avatar.color3 { + background-image: linear-gradient(#8de6b1, #29ae74); + color: #cef8d8; +} + +avatar.color4 { + background-image: linear-gradient(#b5e98a, #6ab85b); + color: #e6f9d7; +} + +avatar.color5 { + background-image: linear-gradient(#f8e359, #d29d09); + color: #f9f4e1; +} + +avatar.color6 { + background-image: linear-gradient(#ffcb62, #d68400); + color: #ffead1; +} + +avatar.color7 { + background-image: linear-gradient(#ffa95a, #ed5b00); + color: #ffe5c5; +} + +avatar.color8 { + background-image: linear-gradient(#f78773, #e62d42); + color: #f8d2ce; +} + +avatar.color9 { + background-image: linear-gradient(#e973ab, #e33b6a); + color: #fac7de; +} + +avatar.color10 { + background-image: linear-gradient(#cb78d4, #9945b5); + color: #e7c2e8; +} + +avatar.color11 { + background-image: linear-gradient(#9e91e8, #7a59ca); + color: #d5d2f5; +} + +avatar.color12 { + background-image: linear-gradient(#e3cf9c, #b08952); + color: #f2eade; +} + +avatar.color13 { + background-image: linear-gradient(#be916d, #785336); + color: #e5d6ca; +} + +avatar.color14 { + background-image: linear-gradient(#c0bfbc, #6e6d71); + color: #d8d7d3; +} + +avatar.contrasted { + color: #eff1f5; +} + +avatar.image { + background: none; +} + +.card { + border-radius: 12px; + border: none; + background-clip: border-box; + color: rgba(239, 241, 245, 0.7); + box-shadow: none; + outline: none; + background-color: rgba(239, 241, 245, 0.04); + color: #eff1f5; +} + +.card.activatable { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1), outline 300ms cubic-bezier(0, 0, 0.2, 1); + background-color: rgba(239, 241, 245, 0.08); + background-image: radial-gradient(circle, transparent 10%, transparent 0%); + background-repeat: no-repeat; + background-position: center; + background-size: 1000% 1000%; + outline: 0 solid transparent; + outline-offset: 2px; + color: #eff1f5; + background-color: rgba(239, 241, 245, 0.04); +} + +.card.activatable:hover { + background-color: alpha(currentColor, 0.08); + color: #eff1f5; + outline: 0 solid transparent; +} + +.card.activatable:active { + transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms, border 0ms; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + background-image: radial-gradient(circle, alpha(currentColor, 0.08) 10%, transparent 0%); + background-size: 0% 0%; + background-color: alpha(currentColor, 0.08); + color: #eff1f5; + outline: 0 solid transparent; +} + +toast { + margin: 12px; + margin-bottom: 24px; + border-radius: 9999px; + border-spacing: 6px; + padding: 6px; + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.1), 0 4px 6px 0 rgba(0, 0, 0, 0.12), 0 1px 10px 0 rgba(0, 0, 0, 0.1), inset 0 1px rgba(239, 241, 245, 0.1); + background-color: #292c3c; + color: #eff1f5; + border: none; +} + +toast:dir(ltr) { + padding-left: 12px; +} + +toast:dir(rtl) { + padding-right: 12px; +} + +toast > label { + margin: 0 6px; +} + +viewswitcher { + margin: 2px; + border-spacing: 3px; +} + +viewswitcher.wide button.toggle { + border-radius: 3px; +} + +viewswitcher.wide button.toggle:first-child { + border-top-left-radius: 17px; + border-bottom-left-radius: 17px; +} + +viewswitcher.wide button.toggle:last-child { + border-top-right-radius: 17px; + border-bottom-right-radius: 17px; +} + +viewswitcher.narrow button.toggle { + border-radius: 0 0 3px 3px; + margin: 0; +} + +viewswitcher.narrow button.toggle:first-child { + border-bottom-left-radius: 12px; +} + +viewswitcher.narrow button.toggle:last-child { + border-bottom-right-radius: 12px; +} + +viewswitcher button.toggle { + font-weight: bold; + padding: 0; +} + +viewswitcher button.toggle:focus:not(:hover):not(:active) { + box-shadow: none; + outline: none; +} + +viewswitcher button.toggle > stack > box.narrow { + font-size: 0.75rem; + padding-top: 8px; + padding-bottom: 4px; + border-spacing: 3px; +} + +viewswitcher button.toggle > stack > box.narrow > stack > label { + padding-left: 6px; + padding-right: 6px; +} + +viewswitcher button.toggle > stack > box.wide { + padding: 2px 12px; + border-spacing: 6px; +} + +viewswitcherbar actionbar > revealer > box { + padding: 0; +} + +viewswitcherbar actionbar > revealer > box viewswitcher.narrow button.toggle { + border-radius: 12px; + margin: 3px 0; +} + +viewswitcherbar actionbar > revealer > box viewswitcher.narrow button.toggle > stack > box.narrow { + padding-top: 5px; + padding-bottom: 1px; + border-spacing: 0; +} + +viewswitchertitle { + margin-top: 0; + margin-bottom: 0; +} + +viewswitchertitle viewswitcher { + margin-left: 12px; + margin-right: 12px; +} + +viewswitchertitle viewswitcher.narrow { + margin-top: 0; + margin-bottom: 0; +} + +viewswitchertitle viewswitcher.narrow button.toggle > stack > box.narrow { + padding-top: 0; + padding-bottom: 0; + border-spacing: 0; +} + +viewswitchertitle viewswitcher.wide { + margin-top: 0; + margin-bottom: 0; +} + +viewswitchertitle windowtitle { + margin-top: 0; + margin-bottom: 0; +} + +indicatorbin > indicator, +indicatorbin > mask { + min-width: 6px; + min-height: 6px; + border-radius: 9999px; +} + +indicatorbin > indicator { + margin: 1px; + background-color: alpha(currentColor, 0.4); +} + +indicatorbin > indicator > label { + font-size: 0.6rem; + font-weight: bold; + padding: 1px 4px; + color: #eff1f5; +} + +indicatorbin > mask { + padding: 1px; + background: black; +} + +indicatorbin.needs-attention > indicator { + background-color: #89b4fa; +} + +indicatorbin.needs-attention > indicator > label { + color: rgba(30, 30, 46, 0.87); +} + +preferencespage > scrolledwindow > viewport > clamp > box { + margin: 24px 12px; + border-spacing: 24px; +} + +preferencesgroup > box background-preview widget.sidebar, +preferencesgroup > box widget.header-bar:not(.editable-area) { + background-color: #11111b; +} + +preferencesgroup > box, +preferencesgroup > box .labels { + border-spacing: 6px; +} + +preferencesgroup > box > box.header:not(.single-line) { + margin-bottom: 6px; +} + +preferencesgroup > box > box.single-line { + min-height: 34px; +} + +preferencesgroup > box button.background-preview-button.toggle { + padding: 0; + background: none; + box-shadow: none; + outline-color: transparent; + outline-width: 3px; + outline-offset: 3px; + outline-style: solid; +} + +preferencesgroup > box button.background-preview-button.toggle, +preferencesgroup > box button.background-preview-button.toggle > background-preview { + border-radius: 12px; +} + +preferencesgroup > box button.background-preview-button.toggle:hover { + outline-color: rgba(239, 241, 245, 0.04); +} + +preferencesgroup > box button.background-preview-button.toggle:active { + outline-color: rgba(239, 241, 245, 0.3); +} + +preferencesgroup > box button.background-preview-button.toggle:checked { + outline-color: #89b4fa; +} + +preferencesgroup > box .cutout-button { + background-color: #313244; +} + +preferencesgroup > box button.accent-button { + min-height: 24px; + min-width: 24px; + padding: 3px; + border-radius: 9px; + background: var(--accent-bg-color); + outline: none; + background-clip: content-box; + box-shadow: none; +} + +preferencesgroup > box button.accent-button:hover { + box-shadow: 0 0 0 3px alpha(currentColor, 0.08); +} + +preferencesgroup > box button.accent-button:checked { + box-shadow: 0 0 0 3px #89b4fa; +} + +preferencesgroup > box button.accent-button.blue, preferencesgroup > box button.accent-button.teal, preferencesgroup > box button.accent-button.green, preferencesgroup > box button.accent-button.yellow, preferencesgroup > box button.accent-button.orange, preferencesgroup > box button.accent-button.red, preferencesgroup > box button.accent-button.pink, preferencesgroup > box button.accent-button.purple, preferencesgroup > box button.accent-button.slate { + --accent-color: oklab( + from var(--accent-bg-color) var(--standalone-color-oklab) + ); +} + +preferencesgroup > box button.accent-button.blue { + --accent-bg-color: var(--accent-blue); +} + +preferencesgroup > box button.accent-button.teal { + --accent-bg-color: var(--accent-teal); +} + +preferencesgroup > box button.accent-button.green { + --accent-bg-color: var(--accent-green); +} + +preferencesgroup > box button.accent-button.yellow { + --accent-bg-color: var(--accent-yellow); +} + +preferencesgroup > box button.accent-button.orange { + --accent-bg-color: var(--accent-orange); +} + +preferencesgroup > box button.accent-button.red { + --accent-bg-color: var(--accent-red); +} + +preferencesgroup > box button.accent-button.pink { + --accent-bg-color: var(--accent-pink); +} + +preferencesgroup > box button.accent-button.purple { + --accent-bg-color: var(--accent-purple); +} + +preferencesgroup > box button.accent-button.slate { + --accent-bg-color: var(--accent-slate); +} + +preferencesgroup > box box > list.boxed-list-separate { + background-color: transparent; + border-radius: 12px; +} + +preferencesgroup > box box > list.boxed-list-separate row { + color: #eff1f5; + background-color: rgba(239, 241, 245, 0.04); + border-radius: 12px 12px 0 0; + margin-top: 0px; + margin-bottom: 2px; +} + +preferencesgroup > box box > list.boxed-list-separate row:first-child { + border-radius: 12px 12px 0 0; +} + +preferencesgroup > box box > list.boxed-list-separate row:last-child { + border-radius: 0 0 12px 12px; + margin-bottom: 0; +} + +preferencesgroup > box box > list.boxed-list-separate row + row { + margin-top: 2px; +} + +preferencesgroup > box box > list.boxed-list-separate row:hover, preferencesgroup > box box > list.boxed-list-separate row:focus { + color: rgba(239, 241, 245, 0.7); + background-color: rgba(239, 241, 245, 0.04); +} + +window.about .main-page > viewport > clamp > box { + margin: 12px; + border-spacing: 6px; +} + +window.about .main-page > viewport > clamp > box > box { + margin-top: 18px; + border-spacing: 18px; + margin-bottom: 6px; +} + +window.about .main-page .app-version { + padding: 3px 18px; + color: #89b4fa; + border-radius: 12px; + margin-top: 3px; +} + +window.about .subpage > viewport > clamp > box { + margin: 18px 12px; + border-spacing: 18px; +} + +window.about .subpage > clamp > textview { + background: none; + color: inherit; +} + +statuspage > scrolledwindow > viewport > box { + margin: 36px 12px; + border-spacing: 36px; +} + +statuspage > scrolledwindow > viewport > box > clamp > box { + border-spacing: 12px; +} + +statuspage > scrolledwindow > viewport > box > clamp > box > .icon { + -gtk-icon-size: 128px; + color: alpha(currentColor, 0.55); +} + +statuspage > scrolledwindow > viewport > box > clamp > box > .icon:disabled { + opacity: 0.35; +} + +statuspage > scrolledwindow > viewport > box > clamp > box > .icon:not(:last-child) { + margin-bottom: 24px; +} + +statuspage.compact > scrolledwindow > viewport > box { + margin: 24px 12px; + border-spacing: 24px; +} + +statuspage.compact > scrolledwindow > viewport > box > clamp > box > .icon { + -gtk-icon-size: 96px; +} + +statuspage.compact > scrolledwindow > viewport > box > clamp > box > .icon:not(:last-child) { + margin-bottom: 12px; +} + +statuspage.compact > scrolledwindow > viewport > box > clamp > box > .title { + font-size: 18pt; +} + +flap > dimming, +leaflet > dimming, +navigation-view > dimming, +overlay-split-view > dimming { + background-color: rgba(30, 30, 46, 0.2); + background-image: none; +} + +flap > border, +leaflet > border, +navigation-view > border, +overlay-split-view > border { + background-color: transparent; + background-image: none; +} + +flap > shadow, +leaflet > shadow, +navigation-view > shadow, +overlay-split-view > shadow { + min-width: 56px; + min-height: 56px; +} + +flap > shadow.left, +leaflet > shadow.left, +navigation-view > shadow.left, +overlay-split-view > shadow.left { + background-image: linear-gradient(to right, alpha(rgba(30, 30, 46, 0.2), 0.7), alpha(rgba(30, 30, 46, 0.2), 0.14) 40px, alpha(rgba(30, 30, 46, 0.2), 0) 56px), linear-gradient(to right, alpha(rgba(30, 30, 46, 0.2), 0.4), alpha(rgba(30, 30, 46, 0.2), 0.14) 7px, alpha(rgba(30, 30, 46, 0.2), 0) 24px); +} + +flap > shadow.right, +leaflet > shadow.right, +navigation-view > shadow.right, +overlay-split-view > shadow.right { + background-image: linear-gradient(to left, alpha(rgba(30, 30, 46, 0.2), 0.7), alpha(rgba(30, 30, 46, 0.2), 0.14) 40px, alpha(rgba(30, 30, 46, 0.2), 0) 56px), linear-gradient(to left, alpha(rgba(30, 30, 46, 0.2), 0.4), alpha(rgba(30, 30, 46, 0.2), 0.14) 7px, alpha(rgba(30, 30, 46, 0.2), 0) 24px); +} + +flap > shadow.up, +leaflet > shadow.up, +navigation-view > shadow.up, +overlay-split-view > shadow.up { + background-image: linear-gradient(to bottom, alpha(rgba(30, 30, 46, 0.2), 0.7), alpha(rgba(30, 30, 46, 0.2), 0.14) 40px, alpha(rgba(30, 30, 46, 0.2), 0) 56px), linear-gradient(to bottom, alpha(rgba(30, 30, 46, 0.2), 0.4), alpha(rgba(30, 30, 46, 0.2), 0.14) 7px, alpha(rgba(30, 30, 46, 0.2), 0) 24px); +} + +flap > shadow.down, +leaflet > shadow.down, +navigation-view > shadow.down, +overlay-split-view > shadow.down { + background-image: linear-gradient(to top, alpha(rgba(30, 30, 46, 0.2), 0.7), alpha(rgba(30, 30, 46, 0.2), 0.14) 40px, alpha(rgba(30, 30, 46, 0.2), 0) 56px), linear-gradient(to top, alpha(rgba(30, 30, 46, 0.2), 0.4), alpha(rgba(30, 30, 46, 0.2), 0.14) 7px, alpha(rgba(30, 30, 46, 0.2), 0) 24px); +} + +.sidebar-pane .sidebar > scrolledwindow, +.sidebar-pane toolbarview > scrolledwindow, +.sidebar-pane navigation-view-page stack > scrolledwindow, .sidebar-pane, .toolbar, filechooser paned > box, placessidebar > scrolledwindow, agenda-view list.background, .tweak-titlebar-left, .tweak-titlebar-left:backdrop, leaflet.unfolded > box > scrolledwindow, leaflet.unfolded .contacts-contact-list > scrolledwindow, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow { + background-color: #181825; + color: #eff1f5; + border-radius: 0; + margin: 0; +} + +.sidebar-pane .sidebar > scrolledwindow .dim-label, +.sidebar-pane toolbarview > scrolledwindow .dim-label, +.sidebar-pane navigation-view-page stack > scrolledwindow .dim-label, .sidebar-pane .dim-label, .toolbar .dim-label, filechooser paned > box .dim-label, placessidebar > scrolledwindow .dim-label, agenda-view list.background .dim-label, .tweak-titlebar-left .dim-label, leaflet.unfolded > box > scrolledwindow .dim-label, leaflet.unfolded .contacts-contact-list > scrolledwindow .dim-label, .sidebar-pane row label.subtitle, row .sidebar-pane label.subtitle, .toolbar row label.subtitle, row .toolbar label.subtitle, filechooser paned > box row label.subtitle, row filechooser paned > box label.subtitle, placessidebar > scrolledwindow row label.subtitle, row placessidebar > scrolledwindow label.subtitle, agenda-view list.background row label.subtitle, row agenda-view list.background label.subtitle, .tweak-titlebar-left row label.subtitle, row .tweak-titlebar-left label.subtitle, leaflet.unfolded > box > scrolledwindow row label.subtitle, row leaflet.unfolded > box > scrolledwindow label.subtitle, leaflet.unfolded .contacts-contact-list > scrolledwindow row label.subtitle, row leaflet.unfolded .contacts-contact-list > scrolledwindow label.subtitle, .sidebar-pane row.expander image.expander-row-arrow, row.expander .sidebar-pane image.expander-row-arrow, .toolbar row.expander image.expander-row-arrow, row.expander .toolbar image.expander-row-arrow, filechooser paned > box row.expander image.expander-row-arrow, row.expander filechooser paned > box image.expander-row-arrow, placessidebar > scrolledwindow row.expander image.expander-row-arrow, row.expander placessidebar > scrolledwindow image.expander-row-arrow, agenda-view list.background row.expander image.expander-row-arrow, row.expander agenda-view list.background image.expander-row-arrow, .tweak-titlebar-left row.expander image.expander-row-arrow, row.expander .tweak-titlebar-left image.expander-row-arrow, leaflet.unfolded > box > scrolledwindow row.expander image.expander-row-arrow, row.expander leaflet.unfolded > box > scrolledwindow image.expander-row-arrow, leaflet.unfolded .contacts-contact-list > scrolledwindow row.expander image.expander-row-arrow, row.expander leaflet.unfolded .contacts-contact-list > scrolledwindow image.expander-row-arrow { + color: rgba(30, 30, 46, 0.38); +} + +.nautilus-window placessidebar > scrolledwindow { + background-color: #1e1e2e; + color: #eff1f5; + border-radius: 0; + margin: 0 6px 0 0; +} + +.nautilus-window placessidebar > scrolledwindow .dim-label, .nautilus-window placessidebar > scrolledwindow row label.subtitle, row .nautilus-window placessidebar > scrolledwindow label.subtitle, .nautilus-window placessidebar > scrolledwindow row.expander image.expander-row-arrow, row.expander .nautilus-window placessidebar > scrolledwindow image.expander-row-arrow { + color: rgba(30, 30, 46, 0.38); +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar > range > trough, +.sidebar-pane toolbarview > scrolledwindow > scrollbar > range > trough, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar > range > trough, placessidebar > scrolledwindow > scrollbar > range > trough, .nautilus-window placessidebar scrollbar > range > trough, leaflet.unfolded > box > scrolledwindow > scrollbar > range > trough, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar > range > trough, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > scrollbar > range > trough { + margin: 0 -8px 0 0; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar > range > trough > slider, +.sidebar-pane toolbarview > scrolledwindow > scrollbar > range > trough > slider, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar > range > trough > slider, placessidebar > scrolledwindow > scrollbar > range > trough > slider, .nautilus-window placessidebar scrollbar > range > trough > slider, leaflet.unfolded > box > scrolledwindow > scrollbar > range > trough > slider, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar > range > trough > slider, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > scrollbar > range > trough > slider { + background-color: #232634; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar > range > trough > slider:hover, +.sidebar-pane toolbarview > scrolledwindow > scrollbar > range > trough > slider:hover, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar > range > trough > slider:hover, placessidebar > scrolledwindow > scrollbar > range > trough > slider:hover, .nautilus-window placessidebar scrollbar > range > trough > slider:hover, leaflet.unfolded > box > scrolledwindow > scrollbar > range > trough > slider:hover, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar > range > trough > slider:hover { + background-color: #292c3c; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar > range > trough > slider:active, +.sidebar-pane toolbarview > scrolledwindow > scrollbar > range > trough > slider:active, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar > range > trough > slider:active, placessidebar > scrolledwindow > scrollbar > range > trough > slider:active, .nautilus-window placessidebar scrollbar > range > trough > slider:active, leaflet.unfolded > box > scrolledwindow > scrollbar > range > trough > slider:active, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar > range > trough > slider:active { + background-color: #292c3c; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar > range > trough > slider:disabled, +.sidebar-pane toolbarview > scrolledwindow > scrollbar > range > trough > slider:disabled, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar > range > trough > slider:disabled, placessidebar > scrolledwindow > scrollbar > range > trough > slider:disabled, .nautilus-window placessidebar scrollbar > range > trough > slider:disabled, leaflet.unfolded > box > scrolledwindow > scrollbar > range > trough > slider:disabled, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar > range > trough > slider:disabled { + background-color: #1e1e2e; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, +.sidebar-pane toolbarview > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, placessidebar > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, .nautilus-window placessidebar scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, leaflet.unfolded > box > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button { + background-color: rgba(30, 30, 46, 0.38); +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled, +.sidebar-pane toolbarview > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled, placessidebar > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled, .nautilus-window placessidebar scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled, leaflet.unfolded > box > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled { + background-color: rgba(30, 30, 46, 0.3); +} + +calendar-view { + margin: 6px; +} + +.nautilus-window .nautilus-grid-view, +.nautilus-window .nautilus-list-view { + background-color: rgba(239, 241, 245, 0.04); + border-radius: 12px; + margin: 0 6px 6px 6px; +} + +placessidebar list.navigation-sidebar, .nautilus-window placessidebar > scrolledwindow > viewport > .navigation-sidebar, leaflet.unfolded .contacts-contact-list > scrolledwindow > viewport > .navigation-sidebar, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > .navigation-sidebar { + padding: 6px 0 6px 6px; + background: none; + color: rgba(239, 241, 245, 0.7); +} + +placessidebar list.navigation-sidebar > separator, .nautilus-window placessidebar > scrolledwindow > viewport > .navigation-sidebar > separator, leaflet.unfolded .contacts-contact-list > scrolledwindow > viewport > .navigation-sidebar > separator, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > .navigation-sidebar > separator { + background-color: rgba(239, 241, 245, 0.12); + margin: 10px 15px; +} + +placessidebar list.navigation-sidebar > row, .nautilus-window placessidebar > scrolledwindow > viewport > .navigation-sidebar > row, leaflet.unfolded .contacts-contact-list > scrolledwindow > viewport > .navigation-sidebar > row, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > .navigation-sidebar > row { + color: rgba(30, 30, 46, 0.6); + border-radius: 9px; + color: #eff1f5; + padding: 6px 0; +} + +placessidebar list.navigation-sidebar > row:hover, .nautilus-window placessidebar > scrolledwindow > viewport > .navigation-sidebar > row:hover, leaflet.unfolded .contacts-contact-list > scrolledwindow > viewport > .navigation-sidebar > row:hover, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > .navigation-sidebar > row:hover, placessidebar list.navigation-sidebar > row:active, .nautilus-window placessidebar > scrolledwindow > viewport > .navigation-sidebar > row:active, leaflet.unfolded .contacts-contact-list > scrolledwindow > viewport > .navigation-sidebar > row:active, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > .navigation-sidebar > row:active, placessidebar list.navigation-sidebar > row:focus, .nautilus-window placessidebar > scrolledwindow > viewport > .navigation-sidebar > row:focus, leaflet.unfolded .contacts-contact-list > scrolledwindow > viewport > .navigation-sidebar > row:focus, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > .navigation-sidebar > row:focus { + color: #eff1f5; +} + +placessidebar list.navigation-sidebar > row:selected, .nautilus-window placessidebar > scrolledwindow > viewport > .navigation-sidebar > row:selected, leaflet.unfolded .contacts-contact-list > scrolledwindow > viewport > .navigation-sidebar > row:selected, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > .navigation-sidebar > row:selected { + /* background-color: if($variant == 'light', rgba($base, 0.4), $fill); */ + background-color: alpha(currentColor, 0.08); + color: #89b4fa; + font-weight: 500; + /* border-left: 3px solid $primary; */ +} + +placessidebar list.navigation-sidebar > row:selected:hover, .nautilus-window placessidebar > scrolledwindow > viewport > .navigation-sidebar > row:selected:hover, leaflet.unfolded .contacts-contact-list > scrolledwindow > viewport > .navigation-sidebar > row:selected:hover, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > .navigation-sidebar > row:selected:hover, placessidebar list.navigation-sidebar > row:selected:focus, .nautilus-window placessidebar > scrolledwindow > viewport > .navigation-sidebar > row:selected:focus, leaflet.unfolded .contacts-contact-list > scrolledwindow > viewport > .navigation-sidebar > row:selected:focus, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > .navigation-sidebar > row:selected:focus { + /* background-color: rgba($base, 0.9); */ + background-color: alpha(currentColor, 0.08); + color: #eff1f5; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar.top, +.sidebar-pane toolbarview > scrolledwindow > scrollbar.top, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar.top, filechooser paned > box scrolledwindow scrollbar.top, placessidebar > scrolledwindow > scrollbar.top, .nautilus-window placessidebar scrollbar.top, .nautilus-window .nautilus-grid-view scrolledwindow scrollbar.top, +.nautilus-window .nautilus-list-view scrolledwindow scrollbar.top, leaflet.unfolded > box > scrolledwindow > scrollbar.top, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar.top, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > scrollbar.top { + border-bottom: none; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar.bottom, +.sidebar-pane toolbarview > scrolledwindow > scrollbar.bottom, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar.bottom, filechooser paned > box scrolledwindow scrollbar.bottom, placessidebar > scrolledwindow > scrollbar.bottom, .nautilus-window placessidebar scrollbar.bottom, .nautilus-window .nautilus-grid-view scrolledwindow scrollbar.bottom, +.nautilus-window .nautilus-list-view scrolledwindow scrollbar.bottom, leaflet.unfolded > box > scrolledwindow > scrollbar.bottom, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar.bottom, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > scrollbar.bottom { + border-top: none; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar.left, +.sidebar-pane toolbarview > scrolledwindow > scrollbar.left, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar.left, filechooser paned > box scrolledwindow scrollbar.left, placessidebar > scrolledwindow > scrollbar.left, .nautilus-window placessidebar scrollbar.left, .nautilus-window .nautilus-grid-view scrolledwindow scrollbar.left, +.nautilus-window .nautilus-list-view scrolledwindow scrollbar.left, leaflet.unfolded > box > scrolledwindow > scrollbar.left, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar.left, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > scrollbar.left { + border-right: none; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar.right, +.sidebar-pane toolbarview > scrolledwindow > scrollbar.right, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar.right, filechooser paned > box scrolledwindow scrollbar.right, placessidebar > scrolledwindow > scrollbar.right, .nautilus-window placessidebar scrollbar.right, .nautilus-window .nautilus-grid-view scrolledwindow scrollbar.right, +.nautilus-window .nautilus-list-view scrolledwindow scrollbar.right, leaflet.unfolded > box > scrolledwindow > scrollbar.right, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar.right, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > scrollbar.right { + border-left: none; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar > range > trough > slider, +.sidebar-pane toolbarview > scrolledwindow > scrollbar > range > trough > slider, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar > range > trough > slider, filechooser paned > box scrolledwindow scrollbar > range > trough > slider, placessidebar > scrolledwindow > scrollbar > range > trough > slider, .nautilus-window placessidebar scrollbar > range > trough > slider, .nautilus-window .nautilus-grid-view scrolledwindow scrollbar > range > trough > slider, +.nautilus-window .nautilus-list-view scrolledwindow scrollbar > range > trough > slider, leaflet.unfolded > box > scrolledwindow > scrollbar > range > trough > slider, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar > range > trough > slider, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > scrollbar > range > trough > slider { + border: 4px solid transparent; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering), +.sidebar-pane toolbarview > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering), +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering), filechooser paned > box scrolledwindow scrollbar.overlay-indicator:not(.dragging):not(.hovering), placessidebar > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering), .nautilus-window placessidebar scrollbar.overlay-indicator:not(.dragging):not(.hovering), .nautilus-window .nautilus-grid-view scrolledwindow scrollbar.overlay-indicator:not(.dragging):not(.hovering), +.nautilus-window .nautilus-list-view scrolledwindow scrollbar.overlay-indicator:not(.dragging):not(.hovering), leaflet.unfolded > box > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering), leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering), .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) { + border-color: transparent; + background-color: transparent; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) > range > trough > slider, +.sidebar-pane toolbarview > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) > range > trough > slider, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) > range > trough > slider, filechooser paned > box scrolledwindow scrollbar.overlay-indicator:not(.dragging):not(.hovering) > range > trough > slider, placessidebar > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) > range > trough > slider, .nautilus-window placessidebar scrollbar.overlay-indicator:not(.dragging):not(.hovering) > range > trough > slider, .nautilus-window .nautilus-grid-view scrolledwindow scrollbar.overlay-indicator:not(.dragging):not(.hovering) > range > trough > slider, +.nautilus-window .nautilus-list-view scrolledwindow scrollbar.overlay-indicator:not(.dragging):not(.hovering) > range > trough > slider, leaflet.unfolded > box > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) > range > trough > slider, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) > range > trough > slider { + border: none; + margin: 1px; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, +.sidebar-pane toolbarview > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, filechooser paned > box scrolledwindow scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, placessidebar > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, .nautilus-window placessidebar scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, .nautilus-window .nautilus-grid-view scrolledwindow scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, +.nautilus-window .nautilus-list-view scrolledwindow scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, leaflet.unfolded > box > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar.overlay-indicator:not(.dragging):not(.hovering) button { + border: none; +} + +.sidebar-pane .sidebar > scrolledwindow > scrollbar.overlay-indicator.dragging, +.sidebar-pane toolbarview > scrolledwindow > scrollbar.overlay-indicator.dragging, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar.overlay-indicator.dragging, filechooser paned > box scrolledwindow scrollbar.overlay-indicator.dragging, placessidebar > scrolledwindow > scrollbar.overlay-indicator.dragging, .nautilus-window placessidebar scrollbar.overlay-indicator.dragging, .nautilus-window .nautilus-grid-view scrolledwindow scrollbar.overlay-indicator.dragging, +.nautilus-window .nautilus-list-view scrolledwindow scrollbar.overlay-indicator.dragging, leaflet.unfolded > box > scrolledwindow > scrollbar.overlay-indicator.dragging, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar.overlay-indicator.dragging, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > scrollbar.overlay-indicator.dragging, .sidebar-pane .sidebar > scrolledwindow > scrollbar.overlay-indicator.hovering, +.sidebar-pane toolbarview > scrolledwindow > scrollbar.overlay-indicator.hovering, +.sidebar-pane navigation-view-page stack > scrolledwindow > scrollbar.overlay-indicator.hovering, filechooser paned > box scrolledwindow scrollbar.overlay-indicator.hovering, placessidebar > scrolledwindow > scrollbar.overlay-indicator.hovering, .nautilus-window placessidebar scrollbar.overlay-indicator.hovering, .nautilus-window .nautilus-grid-view scrolledwindow scrollbar.overlay-indicator.hovering, +.nautilus-window .nautilus-list-view scrolledwindow scrollbar.overlay-indicator.hovering, leaflet.unfolded > box > scrolledwindow > scrollbar.overlay-indicator.hovering, leaflet.unfolded .contacts-contact-list > scrolledwindow > scrollbar.overlay-indicator.hovering, .sidebar-pane toolbarview > stack > box > widget > widget > scrolledwindow > scrollbar.overlay-indicator.hovering { + background-color: transparent; +} + +.nautilus-window .nautilus-grid-view scrolledwindow.undershoot-top > undershoot.top, +.nautilus-window .nautilus-list-view scrolledwindow.undershoot-top > undershoot.top { + border-radius: 12px 12px 0 0; + box-shadow: none; + background: linear-gradient(to bottom, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +.nautilus-window .nautilus-grid-view scrolledwindow.undershoot-bottom > undershoot.bottom, +.nautilus-window .nautilus-list-view scrolledwindow.undershoot-bottom > undershoot.bottom { + border-radius: 0 0 12px 12px; + box-shadow: none; + background: linear-gradient(to top, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +.nautilus-window .nautilus-grid-view scrolledwindow.undershoot-start:dir(ltr) > undershoot.left, +.nautilus-window .nautilus-list-view scrolledwindow.undershoot-start:dir(ltr) > undershoot.left { + border-radius: 12px 0 0 12px; + box-shadow: none; + background: linear-gradient(to right, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +.nautilus-window .nautilus-grid-view scrolledwindow.undershoot-start:dir(rtl) > undershoot.right, +.nautilus-window .nautilus-list-view scrolledwindow.undershoot-start:dir(rtl) > undershoot.right { + border-radius: 0 12px 12px 0; + box-shadow: none; + background: linear-gradient(to left, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +.nautilus-window .nautilus-grid-view scrolledwindow.undershoot-end:dir(ltr) > undershoot.right, +.nautilus-window .nautilus-list-view scrolledwindow.undershoot-end:dir(ltr) > undershoot.right { + border-radius: 0 12px 12px 0; + box-shadow: none; + background: linear-gradient(to left, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +.nautilus-window .nautilus-grid-view scrolledwindow.undershoot-end:dir(rtl) > undershoot.left, +.nautilus-window .nautilus-list-view scrolledwindow.undershoot-end:dir(rtl) > undershoot.left { + border-radius: 12px 0 0 12px; + box-shadow: none; + background: linear-gradient(to right, alpha(rgba(30, 30, 46, 0.2), 0.75), transparent 4px); +} + +.sidebar-pane { + color: #eff1f5; + border-top-left-radius: 12px; +} + +.sidebar-pane .sidebar-pane { + background-color: transparent; + color: inherit; +} + +.sidebar-pane headerbar, +.sidebar-pane .navigation-sidebar, +.sidebar-pane searchbar > revealer > box { + background-color: transparent; + box-shadow: none; + border: none; +} + +.sidebar-pane .navigation-sidebar { + padding: 2px 4px; + background: none; + color: rgba(239, 241, 245, 0.7); +} + +.sidebar-pane:dir(ltr), +.sidebar-pane:dir(ltr) banner > revealer > widget, .sidebar-pane.end:dir(rtl), +.sidebar-pane.end:dir(rtl) banner > revealer > widget { + box-shadow: inset 0 1px rgba(239, 241, 245, 0.1); + border-right: none; +} + +/* Middle pane in three-pane setups */ +.content-pane .sidebar-pane, +.sidebar-pane .content-pane { + background-color: transparent; + color: #eff1f5; +} + +.content-pane .sidebar-pane:backdrop, +.sidebar-pane .content-pane:backdrop { + background-color: transparent; + transition: none; +} + +.content-pane { + background-color: #1e1e2e; + color: #eff1f5; + border-top-right-radius: 12px; + box-shadow: inset 0 1px rgba(239, 241, 245, 0.1); +} + +.content-pane headerbar, .content-pane headerbar:backdrop { + background-color: transparent; + box-shadow: none; + border: none; +} + +.maximized .content-pane, .fullscreen .content-pane, .tiled .content-pane, .tiled-top .content-pane, .tiled-right .content-pane, .tiled-bottom .content-pane, .tiled-left .content-pane { + border-radius: 0; + box-shadow: inset 0 1px rgba(239, 241, 245, 0.1); +} + +.top-bar { + box-shadow: none; + background: none; + border: none; +} + +.top-bar headerbar, .top-bar headerbar:backdrop { + background-color: transparent; + box-shadow: none; +} + +.top-bar .collapse-spacing { + padding: 0; +} + +themeselector, +panelthemeselector { + margin: 9px; +} + +themeselector checkbutton, +panelthemeselector checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(239, 241, 245, 0.12); +} + +themeselector checkbutton.follow:checked, themeselector checkbutton.light:checked, themeselector checkbutton.dark:checked, +panelthemeselector checkbutton.follow:checked, +panelthemeselector checkbutton.light:checked, +panelthemeselector checkbutton.dark:checked { + box-shadow: inset 0 0 0 2px #89b4fa; +} + +themeselector checkbutton.follow, +panelthemeselector checkbutton.follow { + background-image: linear-gradient(to bottom right, #eff1f5 50%, #232634 50%); +} + +themeselector checkbutton.light, +panelthemeselector checkbutton.light { + background-color: #eff1f5; +} + +themeselector checkbutton.dark, +panelthemeselector checkbutton.dark { + background-color: #232634; +} + +themeselector checkbutton.theme-selector radio, +panelthemeselector checkbutton.theme-selector radio { + -gtk-icon-source: none; + border: none; + background: none; + box-shadow: none; + min-height: 20px; + min-width: 20px; + padding: 0; +} + +themeselector checkbutton.theme-selector radio:hover, themeselector checkbutton.theme-selector radio:active, themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:hover, +panelthemeselector checkbutton.theme-selector radio:active, +panelthemeselector checkbutton.theme-selector radio:checked { + background-color: transparent; +} + +themeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked { + -gtk-icon-size: 20px; + -gtk-icon-source: -gtk-scaled(-gtk-recolor(url("assets/checkbox-checked-symbolic.svg")), -gtk-recolor(url("assets/checkbox-checked-symbolic@2.svg"))); + color: rgba(30, 30, 46, 0.87); + background-color: #89b4fa; +} + +themeselector checkbutton.theme-selector radio:checked, themeselector checkbutton.theme-selector radio:checked:hover, themeselector checkbutton.theme-selector radio:checked:active, +panelthemeselector checkbutton.theme-selector radio:checked, +panelthemeselector checkbutton.theme-selector radio:checked:hover, +panelthemeselector checkbutton.theme-selector radio:checked:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher { + padding: 6px; +} + +themeswitcher .check { + min-height: 20px; + min-width: 20px; + background: none; + padding: 0; + margin: 0; + border-radius: 9999px; + color: rgba(30, 30, 46, 0.87); + background-color: #89b4fa; +} + +themeswitcher .check, themeswitcher .check:hover, themeswitcher .check:active { + box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.08), 0 1px 2px 0 rgba(0, 0, 0, 0.1); +} + +themeswitcher checkbutton { + padding: 0; + min-height: 44px; + min-width: 44px; + padding: 1px; + background-clip: content-box; + border-radius: 9999px; + box-shadow: inset 0 0 0 1px rgba(239, 241, 245, 0.12); +} + +themeswitcher checkbutton:checked { + box-shadow: inset 0 0 0 2px #89b4fa; +} + +themeswitcher checkbutton radio, themeswitcher checkbutton radio:hover, themeswitcher checkbutton radio:active, themeswitcher checkbutton radio:checked, themeswitcher checkbutton radio:checked:hover, themeswitcher checkbutton radio:checked:active { + background-color: transparent; + border: none; + background: none; + box-shadow: none; + color: transparent; + -gtk-icon-source: none; + -gtk-icon-size: 0; +} + +themeswitcher checkbutton.system { + background: linear-gradient(-45deg, #1e1e2e 50%, #eff1f5 50%); +} + +themeswitcher checkbutton.light { + color: alpha(black, 0.8); + background-color: #eff1f5; +} + +themeswitcher checkbutton.dark { + color: #eff1f5; + background-color: #1e1e2e; +} + +/* GTK NAMED COLORS + ---------------- + use responsibly! */ +/* widget text/foreground color */ +@define-color theme_fg_color #eff1f5; +/* text color for entries, views and content in general */ +@define-color theme_text_color #eff1f5; +/* widget base background color */ +@define-color theme_bg_color #1e1e2e; +/* text widgets and the like base background color */ +@define-color theme_base_color #313244; +/* base background color of selections */ +@define-color theme_selected_bg_color #89b4fa; +/* text/foreground color of selections */ +@define-color theme_selected_fg_color rgba(30, 30, 46, 0.87); +/* base background color of insensitive widgets */ +@define-color insensitive_bg_color #1e1e2e; +/* text foreground color of insensitive widgets */ +@define-color insensitive_fg_color rgba(239, 241, 245, 0.5); +/* insensitive text widgets and the like base background color */ +@define-color insensitive_base_color #313244; +/* widget text/foreground color on backdrop windows */ +@define-color theme_unfocused_fg_color #eff1f5; +/* text color for entries, views and content in general on backdrop windows */ +@define-color theme_unfocused_text_color #eff1f5; +/* widget base background color on backdrop windows */ +@define-color theme_unfocused_bg_color #1e1e2e; +/* text widgets and the like base background color on backdrop windows */ +@define-color theme_unfocused_base_color #313244; +/* base background color of selections on backdrop windows */ +@define-color theme_unfocused_selected_bg_color #89b4fa; +/* text/foreground color of selections on backdrop windows */ +@define-color theme_unfocused_selected_fg_color rgba(30, 30, 46, 0.87); +/* insensitive color on backdrop windows */ +@define-color unfocused_insensitive_color rgba(239, 241, 245, 0.5); +/* widgets main borders color */ +@define-color borders rgba(239, 241, 245, 0.12); +/* widgets main borders color on backdrop windows */ +@define-color unfocused_borders rgba(239, 241, 245, 0.12); +/* these are pretty self explicative */ +@define-color warning_color #df8e1d; +@define-color error_color #d20f39; +@define-color success_color #40a02b; +/* these colors are exported for the window manager and shouldn't be used in applications, +read if you used those and something break with a version upgrade you're on your own... */ +@define-color wm_focused_title #eff1f5; +@define-color wm_unfocused_title rgba(239, 241, 245, 0.7); +@define-color wm_highlight rgba(239, 241, 245, 0.1); +@define-color wm_border #0a0a0e; +@define-color wm_focused_bg #1e1e2e; +@define-color wm_unfocused_bg #1e1e2e; +@define-color wm_button_icon #eff1f5; +@define-color wm_button_focused_bg #2b2b3a; +@define-color wm_button_unfocused_bg #2b2b3a; +@define-color wm_button_hover_fg rgba(30, 30, 46, 0.87); +@define-color wm_button_active_fg rgba(30, 30, 46, 0.87); +@define-color wm_button_hover_bg #e6e9ef; +@define-color wm_button_active_bg #e7eaf0; +/* FIXME this is really an API */ +@define-color content_view_bg #313244; +@define-color placeholder_text_color #b6b8c0; +/* Very contrasty background for text views (@theme_text_color foreground) */ +@define-color text_view_bg #313244; +@define-color budgie_tasklist_indicator_color rgba(121, 122, 133, 0.7); +@define-color budgie_tasklist_indicator_color_active #89b4fa; +@define-color budgie_tasklist_indicator_color_active_window rgba(108, 140, 195, 0.816); +@define-color budgie_tasklist_indicator_color_attention #df8e1d; +@define-color STRAWBERRY_100 #FF9262; +@define-color STRAWBERRY_300 #FF793E; +@define-color STRAWBERRY_500 #F15D22; +@define-color STRAWBERRY_700 #CF3B00; +@define-color STRAWBERRY_900 #AC1800; +@define-color ORANGE_100 #FFDB91; +@define-color ORANGE_300 #FFCA40; +@define-color ORANGE_500 #FAA41A; +@define-color ORANGE_700 #DE8800; +@define-color ORANGE_900 #C26C00; +@define-color BANANA_100 #FFFFA8; +@define-color BANANA_300 #FFFA7D; +@define-color BANANA_500 #FFCE51; +@define-color BANANA_700 #D1A023; +@define-color BANANA_900 #A27100; +@define-color LIME_100 #A2F3BE; +@define-color LIME_300 #8ADBA6; +@define-color LIME_500 #73C48F; +@define-color LIME_700 #479863; +@define-color LIME_900 #1C6D38; +@define-color BLUEBERRY_100 #94A6FF; +@define-color BLUEBERRY_300 #6A7CE0; +@define-color BLUEBERRY_500 #3F51B5; +@define-color BLUEBERRY_700 #213397; +@define-color BLUEBERRY_900 #031579; +@define-color GRAPE_100 #D25DE6; +@define-color GRAPE_300 #B84ACB; +@define-color GRAPE_500 #9C27B0; +@define-color GRAPE_700 #830E97; +@define-color GRAPE_900 #6A007E; +@define-color COCOA_100 #9F9792; +@define-color COCOA_300 #7B736E; +@define-color COCOA_500 #574F4A; +@define-color COCOA_700 #463E39; +@define-color COCOA_900 #342C27; +@define-color SILVER_100 #EEE; +@define-color SILVER_300 #CCC; +@define-color SILVER_500 #AAA; +@define-color SILVER_700 #888; +@define-color SILVER_900 #666; +@define-color SLATE_100 #888; +@define-color SLATE_300 #666; +@define-color SLATE_500 #444; +@define-color SLATE_700 #222; +@define-color SLATE_900 #111; +@define-color BLACK_100 #474341; +@define-color BLACK_300 #403C3A; +@define-color BLACK_500 #393634; +@define-color BLACK_700 #33302F; +@define-color BLACK_900 #2B2928; +@define-color blue_1 #99c1f1; +@define-color blue_2 #62a0ea; +@define-color blue_3 #3584e4; +@define-color blue_4 #1c71d8; +@define-color blue_5 #1a5fb4; +@define-color green_1 #8ff0a4; +@define-color green_2 #57e389; +@define-color green_3 #33d17a; +@define-color green_4 #2ec27e; +@define-color green_5 #26a269; +@define-color yellow_1 #f9f06b; +@define-color yellow_2 #f8e45c; +@define-color yellow_3 #f6d32d; +@define-color yellow_4 #f5c211; +@define-color yellow_5 #e5a50a; +@define-color orange_1 #ffbe6f; +@define-color orange_2 #ffa348; +@define-color orange_3 #ff7800; +@define-color orange_4 #e66100; +@define-color orange_5 #c64600; +@define-color red_1 #f66151; +@define-color red_2 #ed333b; +@define-color red_3 #e01b24; +@define-color red_4 #c01c28; +@define-color red_5 #a51d2d; +@define-color purple_1 #dc8add; +@define-color purple_2 #c061cb; +@define-color purple_3 #9141ac; +@define-color purple_4 #813d9c; +@define-color purple_5 #613583; +@define-color brown_1 #cdab8f; +@define-color brown_2 #b5835a; +@define-color brown_3 #986a44; +@define-color brown_4 #865e3c; +@define-color brown_5 #63452c; +@define-color light_1 #ffffff; +@define-color light_2 #f6f5f4; +@define-color light_3 #deddda; +@define-color light_4 #c0bfbc; +@define-color light_5 #9a9996; +@define-color dark_1 #77767b; +@define-color dark_2 #5e5c64; +@define-color dark_3 #3d3846; +@define-color dark_4 #241f31; +@define-color dark_5 #000000; +/* GTK NAMED COLORS + ---------------- + use responsibly! */ +@define-color accent_bg_color #89b4fa; +@define-color accent_fg_color rgba(30, 30, 46, 0.87); +@define-color accent_color #89b4fa; +@define-color destructive_bg_color #d20f39; +@define-color destructive_fg_color #eff1f5; +@define-color destructive_color #d20f39; +@define-color success_bg_color #40a02b; +@define-color success_fg_color #eff1f5; +@define-color success_color #40a02b; +@define-color warning_bg_color #df8e1d; +@define-color warning_fg_color #eff1f5; +@define-color warning_color #df8e1d; +@define-color error_bg_color #d20f39; +@define-color error_fg_color #eff1f5; +@define-color error_color #d20f39; +@define-color window_bg_color #1e1e2e; +@define-color window_fg_color #eff1f5; +@define-color view_bg_color #313244; +@define-color view_fg_color #eff1f5; +@define-color headerbar_bg_color #1e1e2e; +@define-color headerbar_fg_color #eff1f5; +@define-color headerbar_border_color rgba(239, 241, 245, 0.12); +@define-color headerbar_backdrop_color #1e1e2e; +@define-color headerbar_shade_color rgba(239, 241, 245, 0.12); +@define-color card_bg_color #313244; +@define-color card_fg_color #eff1f5; +@define-color card_shade_color rgba(239, 241, 245, 0.12); +@define-color dialog_bg_color #313244; +@define-color dialog_fg_color #eff1f5; +@define-color popover_bg_color #292c3c; +@define-color popover_fg_color #eff1f5; +@define-color shade_color rgba(239, 241, 245, 0.12); +@define-color scrollbar_outline_color rgba(239, 241, 245, 0.12); diff --git a/i3/config b/i3/config new file mode 100644 index 0000000..1d9d505 --- /dev/null +++ b/i3/config @@ -0,0 +1,615 @@ +# This file is a modified version based on default i3-config-wizard config +# source is available here: +# https://raw.githubusercontent.com/endeavouros-team/endeavouros-i3wm-setup/master/.config/i3/config +# Maintainer: joekamprad [joekamprad //a_t// endeavouros.com] +# https://endeavouros.com +# +# iconic font icon search: https://fontawesome.com/v4.7/cheatsheet/ +# +# --> to update this run the following command (will backup existing setup file) +# wget --backups=1 https://raw.githubusercontent.com/endeavouros-team/endeavouros-i3wm-setup/main/.config/i3/config -P ~/.config/i3/ +# +# Endeavouros-i3 config file +# Source for complete framework of our i3 config and theming here: https://github.com/endeavouros-team/endeavouros-i3wm-setup +# EndeavourOS wiki holds some Information also: https://discovery.endeavouros.com/window-tiling-managers/i3-wm/ +# Please see http://i3wm.org/docs/userguide.html for the official i3 reference! + +####################### +# config starts here: # +####################### + +# Font for window titles. Will also be used by the bar unless a different font +# is used in the bar {} block below. +# This font is widely installed, provides lots of unicode glyphs, right-to-left +# text rendering and scalability on retina/hidpi displays (thanks to pango). +font pango: Segoe UI Regular 11 + +# set the mod key to the winkey: +set $mod Mod4 + +##################### +# workspace layout: # +##################### + +# default i3 tiling mode: +workspace_layout default + +# i3 stacking layout: +# Each window will be fullscreen and tabbed top to bottom. +#workspace_layout stacking + +# i3 tabbed layout: +# Each new window will open fullscreen as a tab (left to right) +#workspace_layout tabbed + +############################## +# extra options for windows: # +############################## + +#border indicator on windows: +new_window pixel 1 + +# thin borders +# hide_edge_borders both + +# Set inner/outer gaps +gaps inner 2 +gaps outer 1 + +# show window title bars (not officially supported with i3gaps) + +# window title alignment +#title_align center + +# Use Mouse+$mod to drag floating windows to their wanted position +floating_modifier $mod + +# switch/iterate between workspaces +#bindsym $mod+Tab workspace next +#bindsym $mod+Shift+Tab workspace prev +bindsym Control+MOD1+Prior workspace next +bindsym Control+MOD1+Next workspace prev +# switch to workspace +bindsym $mod+1 workspace $ws1 +bindsym $mod+2 workspace $ws2 +bindsym $mod+3 workspace $ws3 +bindsym $mod+4 workspace $ws4 +bindsym $mod+5 workspace $ws5 +bindsym $mod+6 workspace $ws6 +bindsym $mod+7 workspace $ws7 +bindsym $mod+8 workspace $ws8 +bindsym $mod+9 workspace $ws9 +bindsym $mod+0 workspace $ws10 + +# switch to workspace with numpad keys +bindcode $mod+87 workspace 1 +bindcode $mod+88 workspace 2 +bindcode $mod+89 workspace 3 +bindcode $mod+83 workspace 4 +bindcode $mod+84 workspace 5 +bindcode $mod+85 workspace 6 +bindcode $mod+79 workspace 7 +bindcode $mod+80 workspace 8 +bindcode $mod+81 workspace 9 +bindcode $mod+90 workspace 10 + +# switch to workspace with numlock numpad keys +bindcode $mod+Mod2+87 workspace $ws1 +bindcode $mod+Mod2+88 workspace $ws2 +bindcode $mod+Mod2+89 workspace $ws3 +bindcode $mod+Mod2+83 workspace $ws4 +bindcode $mod+Mod2+84 workspace $ws5 +bindcode $mod+Mod2+85 workspace $ws6 +bindcode $mod+Mod2+79 workspace $ws7 +bindcode $mod+Mod2+80 workspace $ws8 +bindcode $mod+Mod2+81 workspace $ws9 +bindcode $mod+Mod2+90 workspace $ws10 + +# move focused container to workspace +bindsym $mod+Shift+1 move container to workspace $ws1 +bindsym $mod+Shift+2 move container to workspace $ws2 +bindsym $mod+Shift+3 move container to workspace $ws3 +bindsym $mod+Shift+4 move container to workspace $ws4 +bindsym $mod+Shift+5 move container to workspace $ws5 +bindsym $mod+Shift+6 move container to workspace $ws6 +bindsym $mod+Shift+7 move container to workspace $ws7 +bindsym $mod+Shift+8 move container to workspace $ws8 +bindsym $mod+Shift+9 move container to workspace $ws9 +bindsym $mod+Shift+0 move container to workspace $ws10 + +# move focused container to workspace with numpad keys +bindcode $mod+Shift+Mod2+87 move container to workspace $ws1 +bindcode $mod+Shift+Mod2+88 move container to workspace $ws2 +bindcode $mod+Shift+Mod2+89 move container to workspace $ws3 +bindcode $mod+Shift+Mod2+83 move container to workspace $ws4 +bindcode $mod+Shift+Mod2+84 move container to workspace $ws5 +bindcode $mod+Shift+Mod2+85 move container to workspace $ws6 +bindcode $mod+Shift+Mod2+79 move container to workspace $ws7 +bindcode $mod+Shift+Mod2+80 move container to workspace $ws8 +bindcode $mod+Shift+Mod2+81 move container to workspace $ws9 +bindcode $mod+Shift+Mod2+90 move container to workspace $ws10 + +# move focused container to workspace with numpad keys +bindcode $mod+Shift+87 move container to workspace $ws1 +bindcode $mod+Shift+88 move container to workspace $ws2 +bindcode $mod+Shift+89 move container to workspace $ws3 +bindcode $mod+Shift+83 move container to workspace $ws4 +bindcode $mod+Shift+84 move container to workspace $ws5 +bindcode $mod+Shift+85 move container to workspace $ws6 +bindcode $mod+Shift+79 move container to workspace $ws7 +bindcode $mod+Shift+80 move container to workspace $ws8 +bindcode $mod+Shift+81 move container to workspace $ws9 +bindcode $mod+Shift+90 move container to workspace $ws10 + +# resize window (you can also use the mouse for that): +#mode "resize" { +# These bindings trigger as soon as you enter the resize mode +# Pressing left will shrink the window's width. +# Pressing right will grow the window's width. +# Pressing up will shrink the window's height. +# Pressing down will grow the window's height. +# bindsym j resize shrink width 10 px or 10 ppt +# bindsym k resize grow height 10 px or 10 ppt +# bindsym l resize shrink height 10 px or 10 ppt +# bindsym ntilde resize grow width 10 px or 10 ppt + +# same bindings, but for the arrow keys +# bindsym Left resize shrink width 10 px or 10 ppt +# bindsym Down resize grow height 10 px or 10 ppt +# bindsym Up resize shrink height 10 px or 10 ppt +# bindsym Right resize grow width 10 px or 10 ppt + +# back to normal: Enter or Escape +# bindsym Return mode "default" +# bindsym Escape mode "default" +#} + +#bindsym $mod+r mode "resize" + +###################################### +# keybindings for different actions: # +###################################### + +# start a terminal +bindsym $mod+Return exec kitty + +# kill focused window +bindsym $mod+q kill + +# exit-menu +bindsym $mod+Shift+e exec ~/.config/i3/scripts/powermenu + +# Lock the system +# lock with a picture: +#bindsym $mod+l exec i3lock -i ~/.config/i3/i3-lock-screen.png -p default|win -t +# lock by blurring the screen: +bindsym $mod+l exec ~/.config/i3/scripts/blur-lock + +# reload the configuration file +bindsym $mod+Shift+c reload + +# restart i3 inplace (preserves your layout/session, can be used to update i3) +bindsym $mod+Shift+r restart + +# keybinding in fancy rofi (automated): +bindsym F1 exec ~/.config/i3/scripts/keyhint-2 +# alternative +# keybinding list in editor: +# bindsym $mod+F1 exec xed ~/.config/i3/keybindings + +# Backlight control +#bindsym XF86MonBrightnessUp exec xbacklight +10 && notify-send "Brightness - $(xbacklight -get | cut -d '.' -f 1)%" +#bindsym XF86MonBrightnessDown exec xbacklight -10 && notify-send "Brightness - $(xbacklight -get | cut -d '.' -f 1)%" +# Backlight setting using dunst osc +bindsym XF86MonBrightnessUp exec --no-startup-id brightnessctl set +5% +bindsym XF86MonBrightnessDown exec --no-startup-id brightnessctl set 5%- +# change focus +bindsym $mod+j focus left +bindsym $mod+k focus down +bindsym $mod+b focus up +bindsym $mod+o focus right + +# alternatively, you can use the cursor keys: +bindsym $mod+Left focus left +bindsym $mod+Down focus down +bindsym $mod+Up focus up +bindsym $mod+Right focus right + +# move focused window +bindsym $mod+Shift+j move left +bindsym $mod+Shift+k move down +bindsym $mod+Shift+b move up +bindsym $mod+Shift+o move right + +# alternatively, you can use the cursor keys: +bindsym $mod+Shift+Left move left +bindsym $mod+Shift+Down move down +bindsym $mod+Shift+Up move up +bindsym $mod+Shift+Right move right + +# split in horizontal orientation +bindsym $mod+h split h + +# split in vertical orientation +bindsym $mod+v split v + +# enter fullscreen mode for the focused container +bindsym $mod+f fullscreen toggle + +# change container layout (stacked, tabbed, toggle split) +bindsym $mod+s layout stacked +bindsym $mod+g layout tabbed +bindsym $mod+e layout toggle split + +# toggle tiling / floating +bindsym $mod+Shift+space floating toggle + +# change focus between tiling / floating windows +#bindsym $mod+space focus mode_toggle + +# focus the parent container +bindsym $mod+a focus parent + +# open new empty workspace +bindsym $mod+Shift+n exec ~/.config/i3/scripts/empty_workspace + +# Multimedia Keys + +# volume +# use meta keys without showing osc +#bindsym XF86AudioRaiseVolume exec amixer -D pulse sset Master 5%+ && pkill -RTMIN+1 i3blocks +#bindsym XF86AudioLowerVolume exec amixer -D pulse sset Master 5%- && pkill -RTMIN+1 i3blocks +# use meta keys showing osc using dunst +bindsym XF86AudioRaiseVolume exec --no-startup-id ~/.config/i3/scripts/volume_brightness.sh volume_up +bindsym XF86AudioLowerVolume exec --no-startup-id ~/.config/i3/scripts/volume_brightness.sh volume_down +bindsym Scroll_Lock exec --no-startup-id ~/.config/i3/scripts/volume_brightness.sh volume_down +bindsym Pause exec --no-startup-id ~/.config/i3/scripts/volume_brightness.sh volume_up +# gradular volume control +bindsym $mod+XF86AudioRaiseVolume exec amixer -D pulse sset Master 1%+ && pkill -RTMIN+1 i3blocks +bindsym $mod+XF86AudioLowerVolume exec amixer -D pulse sset Master 1%- && pkill -RTMIN+1 i3blocks + +# mute +#bindsym XF86AudioMute exec amixer sset Master toggle && killall -USR1 i3blocks +# use meta keys showing osc using dunst +bindsym XF86AudioMute exec --no-startup-id ~/.config/i3/scripts/volume_brightness.sh volume_mute + +# mic mute toggle +bindsym XF86AudioMicMute exec amixer sset Capture toggle + +# audio control +bindsym XF86AudioPlay exec playerctl play +bindsym XF86AudioPause exec playerctl pause +bindsym XF86AudioNext exec playerctl next +bindsym XF86AudioPrev exec playerctl previous + +# Redirect sound to headphones +bindsym $mod+p exec /usr/local/bin/switch-audio-port + +## App shortcuts +bindsym $mod+w exec /usr/bin/firefox +bindsym $mod+n exec /usr/bin/thunar +bindsym Print exec scrot ~/%Y-%m-%d-%T-screenshot.png && notify-send "Screenshot saved to ~/$(date +"%Y-%m-%d-%T")-screenshot.png" + +# Power Profiles menu switcher (rofi) +bindsym $mod+Shift+p exec ~/.config/i3/scripts/power-profiles + +########################################## +# configuration for workspace behaviour: # +########################################## + +# Define names for default workspaces for which we configure key bindings later on. +# We use variables to avoid repeating the names in multiple places. +set $ws1 "1" +set $ws2 "2" +set $ws3 "3" +set $ws4 "4" +set $ws5 "5" +set $ws6 "6" +set $ws7 "7" +set $ws8 "8" +set $ws9 "9" +set $ws10 "10" + +# use workspaces on different displays: +# where you have to replace VGA-0/HDMI-0 with the names for your displays +# you can get from xrandr command +#workspace $ws1 output VGA-0 +#workspace $ws2 output VGA-0 +#workspace $ws3 output HDMI-0 +#workspace $ws4 output HDMI-0 +#workspace $ws5 output HDMI-0 + +# bind program to workspace and focus to them on startup: +#assign [class="Xfce4-terminal"] $ws1 +#assign [class="(?i)firefox"] $ws2 +#assign [class="Thunar"] $ws3 +#assign [class="thunderbird"] $ws4 +#assign [class="TelegramDesktop"] $ws5 + +# automatic set focus new window if it opens on another workspace than the current: +for_window [class=Xfce4-terminal] focus +for_window [class=(?i)firefox] focus +for_window [class=Thunar] focus +for_window [class=Thunderbird] focus +for_window [class=TelegramDesktop] focus + +############## +# compositor # +############## + +# transparency +# uncomment one of them to be used +# options could need changes, related to used GPU and drivers. +# to find the right setting consult the archwiki or ask at the forum. +# +# xcompmgr: https://wiki.archlinux.org/title/Xcompmgr +# manpage: https://man.archlinux.org/man/xcompmgr.1.en +# install xcompmgr package to use it (yay -S xcompmgr) +#exec --no-startup-id xcompmgr -C -n & +# or an more specialized config like this: +#exec --no-startup-id xcompmgr -c -C -t-5 -l-5 -r4.2 -o.55 & +# +# or: +# +# picom: https://wiki.archlinux.org/title/Picom +# manpage: https://man.archlinux.org/man/picom.1.en +# The default configuration is available in /etc/xdg/picom.conf +# For modifications, it can be copied to ~/.config/picom/picom.conf or ~/.config/picom.conf +# install picom package (yay -S picom) +# start using default config +exec_always --no-startup-id picom -b +# +# for custom config: +#exec_always --no-startup-id picom --config ~/.config/picom.conf + +############################################# +# autostart applications/services on login: # +############################################# + +#get auth work with polkit-gnome +exec --no-startup-id /usr/lib/polkit-gnome/polkit-gnome-authentication-agent-1 + +# dex execute .desktop files + apps using /etc/xdg/autostart. +# when second to i3 a DE is installed or mixed usage of i3 + xfce4 or GNOME +# in this cases better disable dex and use manual starting apps using xdg/autostart +# if enabled you should comment welcome app. +# https://github.com/jceb/dex +#exec --no-startup-id dex -a -s /etc/xdg/autostart/:~/.config/autostart/ +exec --no-startup-id dex --autostart --environment i3 + +# start welcome app +#exec --no-startup-id sh /usr/share/endeavouros/scripts/welcome --startdelay=3 + +# num lock activated +exec --no-startup-id numlockx off + +# configure multiple keyboard layouts and hotkey to switch (Alt+CAPSLOCK in this example) +#exec --no-startup-id setxkbmap -layout 'us,sk' -variant altgr-intl,qwerty -option 'grp:alt_caps_toggle' + +# start conky: +#exec_always --no-startup-id conky + +# start a script to setup displays +# uncomment the next line, use arandr to setup displays and save the file as monitor: +exec --no-startup-id ~/.screenlayout/monitor.sh + +# set wallpaper +# exec --no-startup-id sleep 2 && nitrogen --restore +exec --no-startup-id sleep 1 && feh --bg-fill ~/wallpaper.png + +# set powersavings for display: +exec --no-startup-id xset s 480 dpms 600 600 600 + +# disable power saving (for example if using xscreensaver) +#exec --no-startup-id xset -dpms + +# use xautolock to use autosuspend rules for mobile devices +# https://wiki.archlinux.org/title/Session_lock#xautolock +#exec --no-startup-id xautolock -time 60 -locker "systemctl suspend" + + +# xscreensaver +# https://www.jwz.org/xscreensaver +#exec --no-startup-id xscreensaver --no-splash + +# Desktop notifications +# dunst config used ~/.config/dunst/dunstrc +# set alternative config if needed: + exec --no-startup-id /usr/bin/dunst --config ~/.config/dunst/dunstrc +# may yneed to run dbus-launch explicitly: +#exec --no-startup-id dbus-launch /usr/bin/dunst +# exec --no-startup-id /usr/bin/dunst +# alternative if you installed aside with XFCE4: +# exec --no-startup-id /usr/lib/xfce4/notifyd/xfce4-notifyd & + +# autotiling script +# https://github.com/nwg-piotr/autotiling +# `yay -S autotiling ;) (it is in AUR) +exec_always --no-startup-id autotiling + +# Autostart apps as you like +#exec --no-startup-id sleep 2 && xfce4-terminal +#exec --no-startup-id sleep 7 && firefox https://github.com/endeavouros-team/endeavouros-i3wm-setup/blob/main/force-knowledge.md +#exec --no-startup-id sleep 3 && thunar +#exec --no-startup-id sleep 3 && librewolf + +############### +# system tray # +############### +# if you do not use dex: exec --no-startup-id dex --autostart --environment i3 +# you need to have tray apps started manually one by one: + +# start blueberry app for managing bluetooth devices from tray: +exec --no-startup-id blueberry-tray + +# networkmanager-applet +exec --no-startup-id nm-applet + +# clipman-applet +exec --no-startup-id xfce4-clipman + +################## +# floating rules # +################## + +# set floating (nontiling) for apps needing it +for_window [class="Yad" instance="yad"] floating enable +for_window [class="Galculator" instance="galculator"] floating enable +for_window [class="Blueberry.py" instance="blueberry.py"] floating enable + +# set floating (nontiling) for special apps +for_window [class="Xsane" instance="xsane"] floating enable +for_window [class="Pavucontrol" instance="pavucontrol"] floating enable +for_window [class="qt5ct" instance="qt5ct"] floating enable +for_window [class="Blueberry.py" instance="blueberry.py"] floating enable +for_window [class="Bluetooth-sendto" instance="bluetooth-sendto"] floating enable +for_window [class="Pamac-manager"] floating enable +for_window [window_role="About"] floating enable + +# set border of floating window +for_window [class="urxvt"] border pixel 1 + +# set size of floating window +#for_window [window_role="(?i)GtkFileChooserDialog"] resize set 640 480 #to set size of file choose dialog +#for_window [class=".*"] resize set 640 480 #to change size of all floating windows + +# set position of floating window +#for_window [class=".*"] move position center + +###################################### +# color settings for bar and windows # +###################################### + +# Define colors variables: +set $rosewater #f5e0dc +set $flamingo #f2cdcd +set $pink #f5c2e7 +set $mauve #cba6f7 +set $red #f38ba8 +set $maroon #eba0ac +set $peach #fab387 +set $yellow #f9e2af +set $green #a6e3a1 +set $teal #94e2d5 +set $sky #89dceb +set $sapphire #74c7ec +set $blue #89b4fa +set $lavender #b4befe +set $text #cdd6f4 +set $subtext1 #bac2de +set $subtext0 #a6adc8 +set $overlay2 #9399b2 +set $overlay1 #7f849c +set $overlay0 #6c7086 +set $surface2 #585b70 +set $surface1 #45475a +set $surface0 #313244 +set $base #1e1e2e +set $mantle #181825 +set $crust #11111b + +# define colors for windows: +client.focused $lavender $base $text $rosewater $lavender +client.focused_inactive $overlay0 $base $text $rosewater $overlay0 +client.unfocused $overlay0 $base $text $rosewater $overlay0 +client.urgent $peach $base $peach $overlay0 $peach +client.placeholder $overlay0 $base $text $overlay0 $overlay0 +client.background $base + +############################################ +# bar settings (input comes from i3blocks) # +############################################ + +# Start i3bar to display a workspace bar +# (plus the system information i3status finds out, if available) +#bar { +# font pango: Noto Sans Regular 10 +# status_command i3blocks -c ~/.config/i3/i3blocks.conf +# position bottom +# i3bar_command i3bar --transparency +# it could be that you have no primary display set: set one (xrandr --output --primary) +# reference: https://i3wm.org/docs/userguide.html#_tray_output + #tray_output primary +# tray_padding 0 + +# When strip_workspace_numbers is set to yes, +# any workspace that has a name of the form +# “[n][:][NAME]” will display only the name. +# strip_workspace_numbers yes +##strip_workspace_name no +# +# colors { +# separator $purple +# background $darkgrey +# statusline $white +# border bg txt indicator +# focused_workspace $mediumgrey $grey $darkgrey $purple +# active_workspace $lightblue $mediumgrey $darkgrey $purple +# inactive_workspace $darkgrey $darkgrey $grey $purple +# urgent_workspace $urgentred $urgentred $white $purple +# } + +# } + +# you can add different bars for multidisplay setups on each display: +# set output HDMI-0 to the display you want the bar, --transparency can be set. +# Transparency needs rgba color codes to be used where the last two letters are the transparency factor see here: +# https://gist.github.com/lopspower/03fb1cc0ac9f32ef38f4 +# #08052be6 --> e6=90% + +# bar { +# font pango: Noto Sans Regular 10 +# status_command i3blocks -c ~/.config/i3/i3blocks-2.conf +# i3bar_command i3bar --transparency +# output HDMI-0 +# position bottom +# +# When strip_workspace_numbers is set to yes, +# any workspace that has a name of the form +# “[n][:][NAME]” will display only the name. +#strip_workspace_numbers yes +##strip_workspace_name no +# +# colors { +# separator $purple +# background $darkbluetrans +# statusline $white +# border bg txt indicator +# focused_workspace $lighterblue $lighterblue $darkblue $purple +# active_workspace $lightdblue $lightdblue $darkblue $purple +# inactive_workspace $darkblue $darkblue $lightdblue $purple +# urgent_workspace $urgentred $urgentred $white $purple +# } +#} + +##################################### +# Application menu handled by rofi: # +##################################### + +## rofi bindings fancy application menu ($mod+d /F9 optional disabled) + +bindsym $mod+space exec rofi -modi drun -show drun -show-icons \ + -config ~/.config/rofi/default.rasinc + +#bindsym F9 exec rofi -modi drun -show drun \ +# -config ~/.config/rofi/rofidmenu.rasi + +## rofi bindings for window menu ($mod+t /F10 optional disabled) +bindsym MOD1+Tab workspace next +bindsym MOD1+Shift+Tab workspace prev + +bindsym $mod+t exec rofi -show window \ + -config ~/.config/rofi/rofidmenu.rasi + +#bindsym F10 exec rofi -show window \ +# -config ~/.config/rofi/rofidmenu.rasi + +## rofi bindings to manage clipboard (install rofi-greenclip from the AUR) + +exec --no-startup-id greenclip daemon>/dev/null +bindsym $mod+c exec --no-startup-id rofi -modi "clipboard:greenclip print" -show clipboard -config ~/.config/rofi/rofidmenu.ra + +exec --no-startup-id picom -b +exec_always feh --bg-fill /home/red/wallpaper.png +#exec_always --no-startup-id polybar +exec --no-startup-id pgrep -x polybar || polybar diff --git a/i3/mocha b/i3/mocha new file mode 100644 index 0000000..77749f6 --- /dev/null +++ b/i3/mocha @@ -0,0 +1,26 @@ +set $rosewater #f5e0dc +set $flamingo #f2cdcd +set $pink #f5c2e7 +set $mauve #cba6f7 +set $red #f38ba8 +set $maroon #eba0ac +set $peach #fab387 +set $yellow #f9e2af +set $green #a6e3a1 +set $teal #94e2d5 +set $sky #89dceb +set $sapphire #74c7ec +set $blue #89b4fa +set $lavender #b4befe +set $text #cdd6f4 +set $subtext1 #bac2de +set $subtext0 #a6adc8 +set $overlay2 #9399b2 +set $overlay1 #7f849c +set $overlay0 #6c7086 +set $surface2 #585b70 +set $surface1 #45475a +set $surface0 #313244 +set $base #1e1e2e +set $mantle #181825 +set $crust #11111b diff --git a/kitty/current-theme.conf b/kitty/current-theme.conf new file mode 100644 index 0000000..2533db7 --- /dev/null +++ b/kitty/current-theme.conf @@ -0,0 +1,80 @@ +# vim:ft=kitty + +## name: Catppuccin-Mocha +## author: Pocco81 (https://github.com/Pocco81) +## license: MIT +## upstream: https://github.com/catppuccin/kitty/blob/main/mocha.conf +## blurb: Soothing pastel theme for the high-spirited! + + + +# The basic colors +foreground #CDD6F4 +background #1E1E2E +selection_foreground #1E1E2E +selection_background #F5E0DC + +# Cursor colors +cursor #F5E0DC +cursor_text_color #1E1E2E + +# URL underline color when hovering with mouse +url_color #F5E0DC + +# Kitty window border colors +active_border_color #B4BEFE +inactive_border_color #6C7086 +bell_border_color #F9E2AF + +# OS Window titlebar colors +wayland_titlebar_color system +macos_titlebar_color system + +# Tab bar colors +active_tab_foreground #11111B +active_tab_background #CBA6F7 +inactive_tab_foreground #CDD6F4 +inactive_tab_background #181825 +tab_bar_background #11111B + +# Colors for marks (marked text in the terminal) +mark1_foreground #1E1E2E +mark1_background #B4BEFE +mark2_foreground #1E1E2E +mark2_background #CBA6F7 +mark3_foreground #1E1E2E +mark3_background #74C7EC + +# The 16 terminal colors + +# black +color0 #45475A +color8 #585B70 + +# red +color1 #F38BA8 +color9 #F38BA8 + +# green +color2 #A6E3A1 +color10 #A6E3A1 + +# yellow +color3 #F9E2AF +color11 #F9E2AF + +# blue +color4 #89B4FA +color12 #89B4FA + +# magenta +color5 #F5C2E7 +color13 #F5C2E7 + +# cyan +color6 #94E2D5 +color14 #94E2D5 + +# white +color7 #BAC2DE +color15 #A6ADC8 diff --git a/kitty/kitty.conf b/kitty/kitty.conf new file mode 100644 index 0000000..733b40e --- /dev/null +++ b/kitty/kitty.conf @@ -0,0 +1,2646 @@ +# vim:fileencoding=utf-8:foldmethod=marker + +# BEGIN_KITTY_THEME +# Catppuccin-Mocha +include current-theme.conf +# END_KITTY_THEME + +#: Fonts {{{ + +#: kitty has very powerful font management. You can configure +#: individual font faces and even specify special fonts for particular +#: characters. + +# font_family monospace +# bold_font auto +# italic_font auto +# bold_italic_font auto + +#: You can specify different fonts for the bold/italic/bold-italic +#: variants. The easiest way to select fonts is to run the `kitten +#: choose-fonts` command which will present a nice UI for you to +#: select the fonts you want with previews and support for selecting +#: variable fonts and font features. If you want to learn to select +#: fonts manually, read the font specification syntax +#: . + +# font_size 11.0 + +#: Font size (in pts). + +# force_ltr no + +#: kitty does not support BIDI (bidirectional text), however, for RTL +#: scripts, words are automatically displayed in RTL. That is to say, +#: in an RTL script, the words "HELLO WORLD" display in kitty as +#: "WORLD HELLO", and if you try to select a substring of an RTL- +#: shaped string, you will get the character that would be there had +#: the string been LTR. For example, assuming the Hebrew word ירושלים, +#: selecting the character that on the screen appears to be ם actually +#: writes into the selection buffer the character י. kitty's default +#: behavior is useful in conjunction with a filter to reverse the word +#: order, however, if you wish to manipulate RTL glyphs, it can be +#: very challenging to work with, so this option is provided to turn +#: it off. Furthermore, this option can be used with the command line +#: program GNU FriBidi +#: to get BIDI support, because it will force kitty to always treat +#: the text as LTR, which FriBidi expects for terminals. + +# symbol_map + +#: E.g. symbol_map U+E0A0-U+E0A3,U+E0C0-U+E0C7 PowerlineSymbols + +#: Map the specified Unicode codepoints to a particular font. Useful +#: if you need special rendering for some symbols, such as for +#: Powerline. Avoids the need for patched fonts. Each Unicode code +#: point is specified in the form `U+`. You +#: can specify multiple code points, separated by commas and ranges +#: separated by hyphens. This option can be specified multiple times. +#: The syntax is:: + +#: symbol_map codepoints Font Family Name + +# narrow_symbols + +#: E.g. narrow_symbols U+E0A0-U+E0A3,U+E0C0-U+E0C7 1 + +#: Usually, for Private Use Unicode characters and some symbol/dingbat +#: characters, if the character is followed by one or more spaces, +#: kitty will use those extra cells to render the character larger, if +#: the character in the font has a wide aspect ratio. Using this +#: option you can force kitty to restrict the specified code points to +#: render in the specified number of cells (defaulting to one cell). +#: This option can be specified multiple times. The syntax is:: + +#: narrow_symbols codepoints [optionally the number of cells] + +# disable_ligatures never + +#: Choose how you want to handle multi-character ligatures. The +#: default is to always render them. You can tell kitty to not render +#: them when the cursor is over them by using cursor to make editing +#: easier, or have kitty never render them at all by using always, if +#: you don't like them. The ligature strategy can be set per-window +#: either using the kitty remote control facility or by defining +#: shortcuts for it in kitty.conf, for example:: + +#: map alt+1 disable_ligatures_in active always +#: map alt+2 disable_ligatures_in all never +#: map alt+3 disable_ligatures_in tab cursor + +#: Note that this refers to programming ligatures, typically +#: implemented using the calt OpenType feature. For disabling general +#: ligatures, use the font_features option. + +# font_features + +#: E.g. font_features none + +#: Choose exactly which OpenType features to enable or disable. Note +#: that for the main fonts, features can be specified when selecting +#: the font using the choose-fonts kitten. This setting is useful for +#: fallback fonts. + +#: Some fonts might have features worthwhile in a terminal. For +#: example, Fira Code includes a discretionary feature, zero, which in +#: that font changes the appearance of the zero (0), to make it more +#: easily distinguishable from Ø. Fira Code also includes other +#: discretionary features known as Stylistic Sets which have the tags +#: ss01 through ss20. + +#: For the exact syntax to use for individual features, see the +#: HarfBuzz documentation . + +#: Note that this code is indexed by PostScript name, and not the font +#: family. This allows you to define very precise feature settings; +#: e.g. you can disable a feature in the italic font but not in the +#: regular font. + +#: On Linux, font features are first read from the FontConfig database +#: and then this option is applied, so they can be configured in a +#: single, central place. + +#: To get the PostScript name for a font, use the `fc-scan file.ttf` +#: command on Linux or the `Font Book tool on macOS +#: `__. + +#: Enable alternate zero and oldstyle numerals:: + +#: font_features FiraCode-Retina +zero +onum + +#: Enable only alternate zero in the bold font:: + +#: font_features FiraCode-Bold +zero + +#: Disable the normal ligatures, but keep the calt feature which (in +#: this font) breaks up monotony:: + +#: font_features TT2020StyleB-Regular -liga +calt + +#: In conjunction with force_ltr, you may want to disable Arabic +#: shaping entirely, and only look at their isolated forms if they +#: show up in a document. You can do this with e.g.:: + +#: font_features UnifontMedium +isol -medi -fina -init + +# modify_font + +#: Modify font characteristics such as the position or thickness of +#: the underline and strikethrough. The modifications can have the +#: suffix px for pixels or % for percentage of original value. No +#: suffix means use pts. For example:: + +#: modify_font underline_position -2 +#: modify_font underline_thickness 150% +#: modify_font strikethrough_position 2px + +#: Additionally, you can modify the size of the cell in which each +#: font glyph is rendered and the baseline at which the glyph is +#: placed in the cell. For example:: + +#: modify_font cell_width 80% +#: modify_font cell_height -2px +#: modify_font baseline 3 + +#: Note that modifying the baseline will automatically adjust the +#: underline and strikethrough positions by the same amount. +#: Increasing the baseline raises glyphs inside the cell and +#: decreasing it lowers them. Decreasing the cell size might cause +#: rendering artifacts, so use with care. + +# box_drawing_scale 0.001, 1, 1.5, 2 + +#: The sizes of the lines used for the box drawing Unicode characters. +#: These values are in pts. They will be scaled by the monitor DPI to +#: arrive at a pixel value. There must be four values corresponding to +#: thin, normal, thick, and very thick lines. + +# undercurl_style thin-sparse + +#: The style with which undercurls are rendered. This option takes the +#: form (thin|thick)-(sparse|dense). Thin and thick control the +#: thickness of the undercurl. Sparse and dense control how often the +#: curl oscillates. With sparse the curl will peak once per character, +#: with dense twice. + +# text_composition_strategy platform + +#: Control how kitty composites text glyphs onto the background color. +#: The default value of platform tries for text rendering as close to +#: "native" for the platform kitty is running on as possible. + +#: A value of legacy uses the old (pre kitty 0.28) strategy for how +#: glyphs are composited. This will make dark text on light +#: backgrounds look thicker and light text on dark backgrounds +#: thinner. It might also make some text appear like the strokes are +#: uneven. + +#: You can fine tune the actual contrast curve used for glyph +#: composition by specifying up to two space-separated numbers for +#: this setting. + +#: The first number is the gamma adjustment, which controls the +#: thickness of dark text on light backgrounds. Increasing the value +#: will make text appear thicker. The default value for this is 1.0 on +#: Linux and 1.7 on macOS. Valid values are 0.01 and above. The result +#: is scaled based on the luminance difference between the background +#: and the foreground. Dark text on light backgrounds receives the +#: full impact of the curve while light text on dark backgrounds is +#: affected very little. + +#: The second number is an additional multiplicative contrast. It is +#: percentage ranging from 0 to 100. The default value is 0 on Linux +#: and 30 on macOS. + +#: If you wish to achieve similar looking thickness in light and dark +#: themes, a good way to experiment is start by setting the value to +#: 1.0 0 and use a dark theme. Then adjust the second parameter until +#: it looks good. Then switch to a light theme and adjust the first +#: parameter until the perceived thickness matches the dark theme. + +# text_fg_override_threshold 0 + +#: The minimum accepted difference in luminance between the foreground +#: and background color, below which kitty will override the +#: foreground color. It is percentage ranging from 0 to 100. If the +#: difference in luminance of the foreground and background is below +#: this threshold, the foreground color will be set to white if the +#: background is dark or black if the background is light. The default +#: value is 0, which means no overriding is performed. Useful when +#: working with applications that use colors that do not contrast well +#: with your preferred color scheme. + +#: WARNING: Some programs use characters (such as block characters) +#: for graphics display and may expect to be able to set the +#: foreground and background to the same color (or similar colors). +#: If you see unexpected stripes, dots, lines, incorrect color, no +#: color where you expect color, or any kind of graphic display +#: problem try setting text_fg_override_threshold to 0 to see if this +#: is the cause of the problem. + +#: }}} + +#: Text cursor customization {{{ + +# cursor #cccccc + +#: Default text cursor color. If set to the special value none the +#: cursor will be rendered with a "reverse video" effect. Its color +#: will be the color of the text in the cell it is over and the text +#: will be rendered with the background color of the cell. Note that +#: if the program running in the terminal sets a cursor color, this +#: takes precedence. Also, the cursor colors are modified if the cell +#: background and foreground colors have very low contrast. Note that +#: some themes set this value, so if you want to override it, place +#: your value after the lines where the theme file is included. + +# cursor_text_color #111111 + +#: The color of text under the cursor. If you want it rendered with +#: the background color of the cell underneath instead, use the +#: special keyword: `background`. Note that if cursor is set to none +#: then this option is ignored. Note that some themes set this value, +#: so if you want to override it, place your value after the lines +#: where the theme file is included. + +# cursor_shape block + +#: The cursor shape can be one of block, beam, underline. Note that +#: when reloading the config this will be changed only if the cursor +#: shape has not been set by the program running in the terminal. This +#: sets the default cursor shape, applications running in the terminal +#: can override it. In particular, shell integration +#: in kitty sets +#: the cursor shape to beam at shell prompts. You can avoid this by +#: setting shell_integration to no-cursor. + +# cursor_shape_unfocused hollow + +#: Defines the text cursor shape when the OS window is not focused. +#: The unfocused cursor shape can be one of block, beam, underline, +#: hollow and unchanged (leave the cursor shape as it is). + +# cursor_beam_thickness 1.5 + +#: The thickness of the beam cursor (in pts). + +# cursor_underline_thickness 2.0 + +#: The thickness of the underline cursor (in pts). + +# cursor_blink_interval -1 + +#: The interval to blink the cursor (in seconds). Set to zero to +#: disable blinking. Negative values mean use system default. Note +#: that the minimum interval will be limited to repaint_delay. You can +#: also animate the cursor blink by specifying an easing function. For +#: example, setting this to option to 0.5 ease-in-out will cause the +#: cursor blink to be animated over a second, in the first half of the +#: second it will go from opaque to transparent and then back again +#: over the next half. You can specify different easing functions for +#: the two halves, for example: -1 linear ease-out. kitty supports all +#: the CSS easing functions . Note that turning on animations +#: uses extra power as it means the screen is redrawn multiple times +#: per blink interval. See also, cursor_stop_blinking_after. + +# cursor_stop_blinking_after 15.0 + +#: Stop blinking cursor after the specified number of seconds of +#: keyboard inactivity. Set to zero to never stop blinking. + +# cursor_trail 0 + +#: Set this to a value larger than zero to enable a "cursor trail" +#: animation. This is an animation that shows a "trail" following the +#: movement of the text cursor. It makes it easy to follow large +#: cursor jumps and makes for a cool visual effect of the cursor +#: zooming around the screen. The actual value of this option controls +#: when the animation is trigerred. It is a number of milliseconds. +#: The trail animation only follows cursors that have stayed in their +#: position for longer than the specified number of milliseconds. This +#: prevents trails from appearing for cursors that rapidly change +#: their positions during UI updates in complex applications. See +#: cursor_trail_decay to control the animation speed and +#: cursor_trail_start_threshold to control when a cursor trail is +#: started. + +# cursor_trail_decay 0.1 0.4 + +#: Controls the decay times for the cursor trail effect when the +#: cursor_trail is enabled. This option accepts two positive float +#: values specifying the fastest and slowest decay times in seconds. +#: The first value corresponds to the fastest decay time (minimum), +#: and the second value corresponds to the slowest decay time +#: (maximum). The second value must be equal to or greater than the +#: first value. Smaller values result in a faster decay of the cursor +#: trail. Adjust these values to control how quickly the cursor trail +#: fades away. + +# cursor_trail_start_threshold 2 + +#: Set the distance threshold for starting the cursor trail. This +#: option accepts a positive integer value that represents the minimum +#: number of cells the cursor must move before the trail is started. +#: When the cursor moves less than this threshold, the trail is +#: skipped, reducing unnecessary cursor trail animation. + +#: }}} + +#: Scrollback {{{ + +# scrollback_lines 2000 + +#: Number of lines of history to keep in memory for scrolling back. +#: Memory is allocated on demand. Negative numbers are (effectively) +#: infinite scrollback. Note that using very large scrollback is not +#: recommended as it can slow down performance of the terminal and +#: also use large amounts of RAM. Instead, consider using +#: scrollback_pager_history_size. Note that on config reload if this +#: is changed it will only affect newly created windows, not existing +#: ones. + +# scrollback_indicator_opacity 1.0 + +#: The opacity of the scrollback indicator which is a small colored +#: rectangle that moves along the right hand side of the window as you +#: scroll, indicating what fraction you have scrolled. The default is +#: one which means fully opaque, aka visible. Set to a value between +#: zero and one to make the indicator less visible. + +# scrollback_pager less --chop-long-lines --RAW-CONTROL-CHARS +INPUT_LINE_NUMBER + +#: Program with which to view scrollback in a new window. The +#: scrollback buffer is passed as STDIN to this program. If you change +#: it, make sure the program you use can handle ANSI escape sequences +#: for colors and text formatting. INPUT_LINE_NUMBER in the command +#: line above will be replaced by an integer representing which line +#: should be at the top of the screen. Similarly CURSOR_LINE and +#: CURSOR_COLUMN will be replaced by the current cursor position or +#: set to 0 if there is no cursor, for example, when showing the last +#: command output. + +# scrollback_pager_history_size 0 + +#: Separate scrollback history size (in MB), used only for browsing +#: the scrollback buffer with pager. This separate buffer is not +#: available for interactive scrolling but will be piped to the pager +#: program when viewing scrollback buffer in a separate window. The +#: current implementation stores the data in UTF-8, so approximately +#: 10000 lines per megabyte at 100 chars per line, for pure ASCII, +#: unformatted text. A value of zero or less disables this feature. +#: The maximum allowed size is 4GB. Note that on config reload if this +#: is changed it will only affect newly created windows, not existing +#: ones. + +# scrollback_fill_enlarged_window no + +#: Fill new space with lines from the scrollback buffer after +#: enlarging a window. + +# wheel_scroll_multiplier 5.0 + +#: Multiplier for the number of lines scrolled by the mouse wheel. +#: Note that this is only used for low precision scrolling devices, +#: not for high precision scrolling devices on platforms such as macOS +#: and Wayland. Use negative numbers to change scroll direction. See +#: also wheel_scroll_min_lines. + +# wheel_scroll_min_lines 1 + +#: The minimum number of lines scrolled by the mouse wheel. The scroll +#: multiplier wheel_scroll_multiplier only takes effect after it +#: reaches this number. Note that this is only used for low precision +#: scrolling devices like wheel mice that scroll by very small amounts +#: when using the wheel. With a negative number, the minimum number of +#: lines will always be added. + +# touch_scroll_multiplier 1.0 + +#: Multiplier for the number of lines scrolled by a touchpad. Note +#: that this is only used for high precision scrolling devices on +#: platforms such as macOS and Wayland. Use negative numbers to change +#: scroll direction. + +#: }}} + +#: Mouse {{{ + +# mouse_hide_wait 3.0 + +#: Hide mouse cursor after the specified number of seconds of the +#: mouse not being used. Set to zero to disable mouse cursor hiding. +#: Set to a negative value to hide the mouse cursor immediately when +#: typing text. Disabled by default on macOS as getting it to work +#: robustly with the ever-changing sea of bugs that is Cocoa is too +#: much effort. + +# url_color #0087bd +# url_style curly + +#: The color and style for highlighting URLs on mouse-over. url_style +#: can be one of: none, straight, double, curly, dotted, dashed. + +# open_url_with default + +#: The program to open clicked URLs. The special value default will +#: first look for any URL handlers defined via the open_actions +#: facility and if non +#: are found, it will use the Operating System's default URL handler +#: (open on macOS and xdg-open on Linux). + +# url_prefixes file ftp ftps gemini git gopher http https irc ircs kitty mailto news sftp ssh + +#: The set of URL prefixes to look for when detecting a URL under the +#: mouse cursor. + +# detect_urls yes + +#: Detect URLs under the mouse. Detected URLs are highlighted with an +#: underline and the mouse cursor becomes a hand over them. Even if +#: this option is disabled, URLs are still clickable. See also the +#: underline_hyperlinks option to control how hyperlinks (as opposed +#: to plain text URLs) are displayed. + +# url_excluded_characters + +#: Additional characters to be disallowed from URLs, when detecting +#: URLs under the mouse cursor. By default, all characters that are +#: legal in URLs are allowed. Additionally, newlines are allowed (but +#: stripped). This is to accommodate programs such as mutt that add +#: hard line breaks even for continued lines. \n can be added to this +#: option to disable this behavior. Special characters can be +#: specified using backslash escapes, to specify a backslash use a +#: double backslash. + +# show_hyperlink_targets no + +#: When the mouse hovers over a terminal hyperlink, show the actual +#: URL that will be activated when the hyperlink is clicked. + +# underline_hyperlinks hover + +#: Control how hyperlinks are underlined. They can either be +#: underlined on mouse hover, always (i.e. permanently underlined) or +#: never which means that kitty will not apply any underline styling +#: to hyperlinks. Note that the value of always only applies to real +#: (OSC 8) hyperlinks not text that is detected to be a URL on mouse +#: hover. Uses the url_style and url_color settings for the underline +#: style. Note that reloading the config and changing this value +#: to/from always will only affect text subsequently received by +#: kitty. + +# copy_on_select no + +#: Copy to clipboard or a private buffer on select. With this set to +#: clipboard, selecting text with the mouse will cause the text to be +#: copied to clipboard. Useful on platforms such as macOS that do not +#: have the concept of primary selection. You can instead specify a +#: name such as a1 to copy to a private kitty buffer. Map a shortcut +#: with the paste_from_buffer action to paste from this private +#: buffer. For example:: + +#: copy_on_select a1 +#: map shift+cmd+v paste_from_buffer a1 + +#: Note that copying to the clipboard is a security risk, as all +#: programs, including websites open in your browser can read the +#: contents of the system clipboard. + +# paste_actions quote-urls-at-prompt,confirm + +#: A comma separated list of actions to take when pasting text into +#: the terminal. The supported paste actions are: + +#: quote-urls-at-prompt: +#: If the text being pasted is a URL and the cursor is at a shell prompt, +#: automatically quote the URL (needs shell_integration). +#: replace-dangerous-control-codes +#: Replace dangerous control codes from pasted text, without confirmation. +#: replace-newline +#: Replace the newline character from pasted text, without confirmation. +#: confirm: +#: Confirm the paste if the text to be pasted contains any terminal control codes +#: as this can be dangerous, leading to code execution if the shell/program running +#: in the terminal does not properly handle these. +#: confirm-if-large +#: Confirm the paste if it is very large (larger than 16KB) as pasting +#: large amounts of text into shells can be very slow. +#: filter: +#: Run the filter_paste() function from the file paste-actions.py in +#: the kitty config directory on the pasted text. The text returned by the +#: function will be actually pasted. +#: no-op: +#: Has no effect. + +# strip_trailing_spaces never + +#: Remove spaces at the end of lines when copying to clipboard. A +#: value of smart will do it when using normal selections, but not +#: rectangle selections. A value of always will always do it. + +# select_by_word_characters @-./_~?&=%+# + +#: Characters considered part of a word when double clicking. In +#: addition to these characters any character that is marked as an +#: alphanumeric character in the Unicode database will be matched. + +# select_by_word_characters_forward + +#: Characters considered part of a word when extending the selection +#: forward on double clicking. In addition to these characters any +#: character that is marked as an alphanumeric character in the +#: Unicode database will be matched. + +#: If empty (default) select_by_word_characters will be used for both +#: directions. + +# click_interval -1.0 + +#: The interval between successive clicks to detect double/triple +#: clicks (in seconds). Negative numbers will use the system default +#: instead, if available, or fallback to 0.5. + +# focus_follows_mouse no + +#: Set the active window to the window under the mouse when moving the +#: mouse around. On macOS, this will also cause the OS Window under +#: the mouse to be focused automatically when the mouse enters it. + +# pointer_shape_when_grabbed arrow + +#: The shape of the mouse pointer when the program running in the +#: terminal grabs the mouse. + +# default_pointer_shape beam + +#: The default shape of the mouse pointer. + +# pointer_shape_when_dragging beam + +#: The default shape of the mouse pointer when dragging across text. + +#: Mouse actions {{{ + +#: Mouse buttons can be mapped to perform arbitrary actions. The +#: syntax is: + +#: .. code-block:: none + +#: mouse_map button-name event-type modes action + +#: Where button-name is one of left, middle, right, b1 ... b8 with +#: added keyboard modifiers. For example: ctrl+shift+left refers to +#: holding the Ctrl+Shift keys while clicking with the left mouse +#: button. The value b1 ... b8 can be used to refer to up to eight +#: buttons on a mouse. + +#: event-type is one of press, release, doublepress, triplepress, +#: click, doubleclick. modes indicates whether the action is performed +#: when the mouse is grabbed by the program running in the terminal, +#: or not. The values are grabbed or ungrabbed or a comma separated +#: combination of them. grabbed refers to when the program running in +#: the terminal has requested mouse events. Note that the click and +#: double click events have a delay of click_interval to disambiguate +#: from double and triple presses. + +#: You can run kitty with the kitty --debug-input command line option +#: to see mouse events. See the builtin actions below to get a sense +#: of what is possible. + +#: If you want to unmap a button, map it to nothing. For example, to +#: disable opening of URLs with a plain click:: + +#: mouse_map left click ungrabbed + +#: See all the mappable actions including mouse actions here +#: . + +#: .. note:: +#: Once a selection is started, releasing the button that started it will +#: automatically end it and no release event will be dispatched. + +# clear_all_mouse_actions no + +#: Remove all mouse action definitions up to this point. Useful, for +#: instance, to remove the default mouse actions. + +#: Click the link under the mouse or move the cursor + +# mouse_map left click ungrabbed mouse_handle_click selection link prompt + +#:: First check for a selection and if one exists do nothing. Then +#:: check for a link under the mouse cursor and if one exists, click +#:: it. Finally check if the click happened at the current shell +#:: prompt and if so, move the cursor to the click location. Note +#:: that this requires shell integration +#:: to work. + +#: Click the link under the mouse or move the cursor even when grabbed + +# mouse_map shift+left click grabbed,ungrabbed mouse_handle_click selection link prompt + +#:: Same as above, except that the action is performed even when the +#:: mouse is grabbed by the program running in the terminal. + +#: Click the link under the mouse cursor + +# mouse_map ctrl+shift+left release grabbed,ungrabbed mouse_handle_click link + +#:: Variant with Ctrl+Shift is present because the simple click based +#:: version has an unavoidable delay of click_interval, to +#:: disambiguate clicks from double clicks. + +#: Discard press event for link click + +# mouse_map ctrl+shift+left press grabbed discard_event + +#:: Prevent this press event from being sent to the program that has +#:: grabbed the mouse, as the corresponding release event is used to +#:: open a URL. + +#: Paste from the primary selection + +# mouse_map middle release ungrabbed paste_from_selection + +#: Start selecting text + +# mouse_map left press ungrabbed mouse_selection normal + +#: Start selecting text in a rectangle + +# mouse_map ctrl+alt+left press ungrabbed mouse_selection rectangle + +#: Select a word + +# mouse_map left doublepress ungrabbed mouse_selection word + +#: Select a line + +# mouse_map left triplepress ungrabbed mouse_selection line + +#: Select line from point + +# mouse_map ctrl+alt+left triplepress ungrabbed mouse_selection line_from_point + +#:: Select from the clicked point to the end of the line. If you +#:: would like to select the word at the point and then extend to the +#:: rest of the line, change `line_from_point` to +#:: `word_and_line_from_point`. + +#: Extend the current selection + +# mouse_map right press ungrabbed mouse_selection extend + +#:: If you want only the end of the selection to be moved instead of +#:: the nearest boundary, use move-end instead of extend. + +#: Paste from the primary selection even when grabbed + +# mouse_map shift+middle release ungrabbed,grabbed paste_selection +# mouse_map shift+middle press grabbed discard_event + +#: Start selecting text even when grabbed + +# mouse_map shift+left press ungrabbed,grabbed mouse_selection normal + +#: Start selecting text in a rectangle even when grabbed + +# mouse_map ctrl+shift+alt+left press ungrabbed,grabbed mouse_selection rectangle + +#: Select a word even when grabbed + +# mouse_map shift+left doublepress ungrabbed,grabbed mouse_selection word + +#: Select a line even when grabbed + +# mouse_map shift+left triplepress ungrabbed,grabbed mouse_selection line + +#: Select line from point even when grabbed + +# mouse_map ctrl+shift+alt+left triplepress ungrabbed,grabbed mouse_selection line_from_point + +#:: Select from the clicked point to the end of the line even when +#:: grabbed. If you would like to select the word at the point and +#:: then extend to the rest of the line, change `line_from_point` to +#:: `word_and_line_from_point`. + +#: Extend the current selection even when grabbed + +# mouse_map shift+right press ungrabbed,grabbed mouse_selection extend + +#: Show clicked command output in pager + +# mouse_map ctrl+shift+right press ungrabbed mouse_show_command_output + +#:: Requires shell integration +#:: to work. + +#: }}} + +#: }}} + +#: Performance tuning {{{ + +# repaint_delay 10 + +#: Delay between screen updates (in milliseconds). Decreasing it, +#: increases frames-per-second (FPS) at the cost of more CPU usage. +#: The default value yields ~100 FPS which is more than sufficient for +#: most uses. Note that to actually achieve 100 FPS, you have to +#: either set sync_to_monitor to no or use a monitor with a high +#: refresh rate. Also, to minimize latency when there is pending input +#: to be processed, this option is ignored. + +# input_delay 3 + +#: Delay before input from the program running in the terminal is +#: processed (in milliseconds). Note that decreasing it will increase +#: responsiveness, but also increase CPU usage and might cause flicker +#: in full screen programs that redraw the entire screen on each loop, +#: because kitty is so fast that partial screen updates will be drawn. +#: This setting is ignored when the input buffer is almost full. + +# sync_to_monitor yes + +#: Sync screen updates to the refresh rate of the monitor. This +#: prevents screen tearing +#: when scrolling. +#: However, it limits the rendering speed to the refresh rate of your +#: monitor. With a very high speed mouse/high keyboard repeat rate, +#: you may notice some slight input latency. If so, set this to no. + +#: }}} + +#: Terminal bell {{{ + +# enable_audio_bell yes + +#: The audio bell. Useful to disable it in environments that require +#: silence. + +# visual_bell_duration 0.0 + +#: The visual bell duration (in seconds). Flash the screen when a bell +#: occurs for the specified number of seconds. Set to zero to disable. +#: The flash is animated, fading in and out over the specified +#: duration. The easing function used for the fading can be +#: controlled. For example, 2.0 linear will casuse the flash to fade +#: in and out linearly. The default if unspecified is to use ease-in- +#: out which fades slowly at the start, middle and end. You can +#: specify different easing functions for the fade-in and fade-out +#: parts, like this: 2.0 ease-in linear. kitty supports all the CSS +#: easing functions . + +# visual_bell_color none + +#: The color used by visual bell. Set to none will fall back to +#: selection background color. If you feel that the visual bell is too +#: bright, you can set it to a darker color. + +# window_alert_on_bell yes + +#: Request window attention on bell. Makes the dock icon bounce on +#: macOS or the taskbar flash on Linux. + +# bell_on_tab "🔔 " + +#: Some text or a Unicode symbol to show on the tab if a window in the +#: tab that does not have focus has a bell. If you want to use leading +#: or trailing spaces, surround the text with quotes. See +#: tab_title_template for how this is rendered. + +#: For backwards compatibility, values of yes, y and true are +#: converted to the default bell symbol and no, n, false and none are +#: converted to the empty string. + +# command_on_bell none + +#: Program to run when a bell occurs. The environment variable +#: KITTY_CHILD_CMDLINE can be used to get the program running in the +#: window in which the bell occurred. + +# bell_path none + +#: Path to a sound file to play as the bell sound. If set to none, the +#: system default bell sound is used. Must be in a format supported by +#: the operating systems sound API, such as WAV or OGA on Linux +#: (libcanberra) or AIFF, MP3 or WAV on macOS (NSSound). + +# linux_bell_theme __custom + +#: The XDG Sound Theme kitty will use to play the bell sound. Defaults +#: to the custom theme name specified in the XDG Sound theme +#: specification , falling back to the default +#: freedesktop theme if it does not exist. To change your sound theme +#: desktop wide, create +#: :file:~/.local/share/sounds/__custom/index.theme` with the +#: contents: + +#: [Sound Theme] + +#: Inherits=name-of-the-sound-theme-you-want-to-use + +#: Replace name-of-the-sound-theme-you-want-to-use with the actual +#: theme name. Now all compliant applications should use sounds from +#: this theme. + +#: }}} + +#: Window layout {{{ + +# remember_window_size yes +# initial_window_width 640 +# initial_window_height 400 + +#: If enabled, the OS Window size will be remembered so that new +#: instances of kitty will have the same size as the previous +#: instance. If disabled, the OS Window will initially have size +#: configured by initial_window_width/height, in pixels. You can use a +#: suffix of "c" on the width/height values to have them interpreted +#: as number of cells instead of pixels. + +# enabled_layouts * + +#: The enabled window layouts. A comma separated list of layout names. +#: The special value all means all layouts. The first listed layout +#: will be used as the startup layout. Default configuration is all +#: layouts in alphabetical order. For a list of available layouts, see +#: the layouts . + +# window_resize_step_cells 2 +# window_resize_step_lines 2 + +#: The step size (in units of cell width/cell height) to use when +#: resizing kitty windows in a layout with the shortcut +#: start_resizing_window. The cells value is used for horizontal +#: resizing, and the lines value is used for vertical resizing. + +# window_border_width 0.5pt + +#: The width of window borders. Can be either in pixels (px) or pts +#: (pt). Values in pts will be rounded to the nearest number of pixels +#: based on screen resolution. If not specified, the unit is assumed +#: to be pts. Note that borders are displayed only when more than one +#: window is visible. They are meant to separate multiple windows. + +# draw_minimal_borders yes + +#: Draw only the minimum borders needed. This means that only the +#: borders that separate the window from a neighbor are drawn. Note +#: that setting a non-zero window_margin_width overrides this and +#: causes all borders to be drawn. + +# window_margin_width 0 + +#: The window margin (in pts) (blank area outside the border). A +#: single value sets all four sides. Two values set the vertical and +#: horizontal sides. Three values set top, horizontal and bottom. Four +#: values set top, right, bottom and left. + +# single_window_margin_width -1 + +#: The window margin to use when only a single window is visible (in +#: pts). Negative values will cause the value of window_margin_width +#: to be used instead. A single value sets all four sides. Two values +#: set the vertical and horizontal sides. Three values set top, +#: horizontal and bottom. Four values set top, right, bottom and left. + +# window_padding_width 0 + +#: The window padding (in pts) (blank area between the text and the +#: window border). A single value sets all four sides. Two values set +#: the vertical and horizontal sides. Three values set top, horizontal +#: and bottom. Four values set top, right, bottom and left. + +# single_window_padding_width -1 + +#: The window padding to use when only a single window is visible (in +#: pts). Negative values will cause the value of window_padding_width +#: to be used instead. A single value sets all four sides. Two values +#: set the vertical and horizontal sides. Three values set top, +#: horizontal and bottom. Four values set top, right, bottom and left. + +# placement_strategy center + +#: When the window size is not an exact multiple of the cell size, the +#: cell area of the terminal window will have some extra padding on +#: the sides. You can control how that padding is distributed with +#: this option. Using a value of center means the cell area will be +#: placed centrally. A value of top-left means the padding will be +#: only at the bottom and right edges. The value can be one of: top- +#: left, top, top-right, left, center, right, bottom-left, bottom, +#: bottom-right. + +# active_border_color #00ff00 + +#: The color for the border of the active window. Set this to none to +#: not draw borders around the active window. + +# inactive_border_color #cccccc + +#: The color for the border of inactive windows. + +# bell_border_color #ff5a00 + +#: The color for the border of inactive windows in which a bell has +#: occurred. + +# inactive_text_alpha 1.0 + +#: Fade the text in inactive windows by the specified amount (a number +#: between zero and one, with zero being fully faded). + +# hide_window_decorations no + +#: Hide the window decorations (title-bar and window borders) with +#: yes. On macOS, titlebar-only and titlebar-and-corners can be used +#: to only hide the titlebar and the rounded corners. Whether this +#: works and exactly what effect it has depends on the window +#: manager/operating system. Note that the effects of changing this +#: option when reloading config are undefined. When using titlebar- +#: only, it is useful to also set window_margin_width and +#: placement_strategy to prevent the rounded corners from clipping +#: text. Or use titlebar-and-corners. + +# window_logo_path none + +#: Path to a logo image. Must be in PNG/JPEG/WEBP/GIF/TIFF/BMP format. +#: Relative paths are interpreted relative to the kitty config +#: directory. The logo is displayed in a corner of every kitty window. +#: The position is controlled by window_logo_position. Individual +#: windows can be configured to have different logos either using the +#: launch action or the remote control +#: facility. + +# window_logo_position bottom-right + +#: Where to position the window logo in the window. The value can be +#: one of: top-left, top, top-right, left, center, right, bottom-left, +#: bottom, bottom-right. + +# window_logo_alpha 0.5 + +#: The amount the logo should be faded into the background. With zero +#: being fully faded and one being fully opaque. + +# window_logo_scale 0 + +#: The percentage (0-100] of the window size to which the logo should +#: scale. Using a single number means the logo is scaled to that +#: percentage of the shortest window dimension, while preseving aspect +#: ratio of the logo image. + +#: Using two numbers means the width and height of the logo are scaled +#: to the respective percentage of the window's width and height. + +#: Using zero as the percentage disables scaling in that dimension. A +#: single zero (the default) disables all scaling of the window logo. + +# resize_debounce_time 0.1 0.5 + +#: The time to wait (in seconds) before asking the program running in +#: kitty to resize and redraw the screen during a live resize of the +#: OS window, when no new resize events have been received, i.e. when +#: resizing is either paused or finished. On platforms such as macOS, +#: where the operating system sends events corresponding to the start +#: and end of a live resize, the second number is used for redraw- +#: after-pause since kitty can distinguish between a pause and end of +#: resizing. On such systems the first number is ignored and redraw is +#: immediate after end of resize. On other systems only the first +#: number is used so that kitty is "ready" quickly after the end of +#: resizing, while not also continuously redrawing, to save energy. + +# resize_in_steps no + +#: Resize the OS window in steps as large as the cells, instead of +#: with the usual pixel accuracy. Combined with initial_window_width +#: and initial_window_height in number of cells, this option can be +#: used to keep the margins as small as possible when resizing the OS +#: window. Note that this does not currently work on Wayland. + +# visual_window_select_characters 1234567890ABCDEFGHIJKLMNOPQRSTUVWXYZ + +#: The list of characters for visual window selection. For example, +#: for selecting a window to focus on with focus_visible_window. The +#: value should be a series of unique numbers or alphabets, case +#: insensitive, from the set 0-9A-Z\-=[];',./\\`. Specify your +#: preference as a string of characters. + +# confirm_os_window_close -1 + +#: Ask for confirmation when closing an OS window or a tab with at +#: least this number of kitty windows in it by window manager (e.g. +#: clicking the window close button or pressing the operating system +#: shortcut to close windows) or by the close_tab action. A value of +#: zero disables confirmation. This confirmation also applies to +#: requests to quit the entire application (all OS windows, via the +#: quit action). Negative values are converted to positive ones, +#: however, with shell_integration enabled, using negative values +#: means windows sitting at a shell prompt are not counted, only +#: windows where some command is currently running. Note that if you +#: want confirmation when closing individual windows, you can map the +#: close_window_with_confirmation action. + +#: }}} + +#: Tab bar {{{ + +# tab_bar_edge bottom + +#: The edge to show the tab bar on, top or bottom. + +# tab_bar_margin_width 0.0 + +#: The margin to the left and right of the tab bar (in pts). + +# tab_bar_margin_height 0.0 0.0 + +#: The margin above and below the tab bar (in pts). The first number +#: is the margin between the edge of the OS Window and the tab bar. +#: The second number is the margin between the tab bar and the +#: contents of the current tab. + +# tab_bar_style fade + +#: The tab bar style, can be one of: + +#: fade +#: Each tab's edges fade into the background color. (See also tab_fade) +#: slant +#: Tabs look like the tabs in a physical file. +#: separator +#: Tabs are separated by a configurable separator. (See also +#: tab_separator) +#: powerline +#: Tabs are shown as a continuous line with "fancy" separators. +#: (See also tab_powerline_style) +#: custom +#: A user-supplied Python function called draw_tab is loaded from the file +#: tab_bar.py in the kitty config directory. For examples of how to +#: write such a function, see the functions named draw_tab_with_* in +#: kitty's source code: kitty/tab_bar.py. See also +#: this discussion +#: for examples from kitty users. +#: hidden +#: The tab bar is hidden. If you use this, you might want to create +#: a mapping for the select_tab action which presents you with a list of +#: tabs and allows for easy switching to a tab. + +# tab_bar_align left + +#: The horizontal alignment of the tab bar, can be one of: left, +#: center, right. + +# tab_bar_min_tabs 2 + +#: The minimum number of tabs that must exist before the tab bar is +#: shown. + +# tab_switch_strategy previous + +#: The algorithm to use when switching to a tab when the current tab +#: is closed. The default of previous will switch to the last used +#: tab. A value of left will switch to the tab to the left of the +#: closed tab. A value of right will switch to the tab to the right of +#: the closed tab. A value of last will switch to the right-most tab. + +# tab_fade 0.25 0.5 0.75 1 + +#: Control how each tab fades into the background when using fade for +#: the tab_bar_style. Each number is an alpha (between zero and one) +#: that controls how much the corresponding cell fades into the +#: background, with zero being no fade and one being full fade. You +#: can change the number of cells used by adding/removing entries to +#: this list. + +# tab_separator " ┇" + +#: The separator between tabs in the tab bar when using separator as +#: the tab_bar_style. + +# tab_powerline_style angled + +#: The powerline separator style between tabs in the tab bar when +#: using powerline as the tab_bar_style, can be one of: angled, +#: slanted, round. + +# tab_activity_symbol none + +#: Some text or a Unicode symbol to show on the tab if a window in the +#: tab that does not have focus has some activity. If you want to use +#: leading or trailing spaces, surround the text with quotes. See +#: tab_title_template for how this is rendered. + +# tab_title_max_length 0 + +#: The maximum number of cells that can be used to render the text in +#: a tab. A value of zero means that no limit is applied. + +# tab_title_template "{fmt.fg.red}{bell_symbol}{activity_symbol}{fmt.fg.tab}{title}" + +#: A template to render the tab title. The default just renders the +#: title with optional symbols for bell and activity. If you wish to +#: include the tab-index as well, use something like: {index}:{title}. +#: Useful if you have shortcuts mapped for goto_tab N. If you prefer +#: to see the index as a superscript, use {sup.index}. All data +#: available is: + +#: title +#: The current tab title. +#: index +#: The tab index usable with goto_tab N goto_tab shortcuts. +#: layout_name +#: The current layout name. +#: num_windows +#: The number of windows in the tab. +#: num_window_groups +#: The number of window groups (a window group is a window and all of its overlay windows) in the tab. +#: tab.active_wd +#: The working directory of the currently active window in the tab +#: (expensive, requires syscall). Use active_oldest_wd to get +#: the directory of the oldest foreground process rather than the newest. +#: tab.active_exe +#: The name of the executable running in the foreground of the currently +#: active window in the tab (expensive, requires syscall). Use +#: active_oldest_exe for the oldest foreground process. +#: max_title_length +#: The maximum title length available. +#: keyboard_mode +#: The name of the current keyboard mode or the empty string if no keyboard mode is active. + +#: Note that formatting is done by Python's string formatting +#: machinery, so you can use, for instance, {layout_name[:2].upper()} +#: to show only the first two letters of the layout name, upper-cased. +#: If you want to style the text, you can use styling directives, for +#: example: +#: `{fmt.fg.red}red{fmt.fg.tab}normal{fmt.bg._00FF00}greenbg{fmt.bg.tab}`. +#: Similarly, for bold and italic: +#: `{fmt.bold}bold{fmt.nobold}normal{fmt.italic}italic{fmt.noitalic}`. +#: The 256 eight terminal colors can be used as `fmt.fg.color0` +#: through `fmt.fg.color255`. Note that for backward compatibility, if +#: {bell_symbol} or {activity_symbol} are not present in the template, +#: they are prepended to it. + +# active_tab_title_template none + +#: Template to use for active tabs. If not specified falls back to +#: tab_title_template. + +# active_tab_foreground #000 +# active_tab_background #eee +# active_tab_font_style bold-italic +# inactive_tab_foreground #444 +# inactive_tab_background #999 +# inactive_tab_font_style normal + +#: Tab bar colors and styles. + +# tab_bar_background none + +#: Background color for the tab bar. Defaults to using the terminal +#: background color. + +# tab_bar_margin_color none + +#: Color for the tab bar margin area. Defaults to using the terminal +#: background color for margins above and below the tab bar. For side +#: margins the default color is chosen to match the background color +#: of the neighboring tab. + +#: }}} + +#: Color scheme {{{ + +# foreground #dddddd +# background #000000 + +#: The foreground and background colors. + +# background_opacity 1.0 + +#: The opacity of the background. A number between zero and one, where +#: one is opaque and zero is fully transparent. This will only work if +#: supported by the OS (for instance, when using a compositor under +#: X11). Note that it only sets the background color's opacity in +#: cells that have the same background color as the default terminal +#: background, so that things like the status bar in vim, powerline +#: prompts, etc. still look good. But it means that if you use a color +#: theme with a background color in your editor, it will not be +#: rendered as transparent. Instead you should change the default +#: background color in your kitty config and not use a background +#: color in the editor color scheme. Or use the escape codes to set +#: the terminals default colors in a shell script to launch your +#: editor. See also transparent_background_colors. Be aware that using +#: a value less than 1.0 is a (possibly significant) performance hit. +#: When using a low value for this setting, it is desirable that you +#: set the background color to a color the matches the general color +#: of the desktop background, for best text rendering. If you want to +#: dynamically change transparency of windows, set +#: dynamic_background_opacity to yes (this is off by default as it has +#: a performance cost). Changing this option when reloading the config +#: will only work if dynamic_background_opacity was enabled in the +#: original config. + +# background_blur 0 + +#: Set to a positive value to enable background blur (blurring of the +#: visuals behind a transparent window) on platforms that support it. +#: Only takes effect when background_opacity is less than one. On +#: macOS, this will also control the blur radius (amount of blurring). +#: Setting it to too high a value will cause severe performance issues +#: and/or rendering artifacts. Usually, values up to 64 work well. +#: Note that this might cause performance issues, depending on how the +#: platform implements it, so use with care. Currently supported on +#: macOS and KDE. + +# background_image none + +#: Path to a background image. Must be in PNG/JPEG/WEBP/TIFF/GIF/BMP +#: format. + +# background_image_layout tiled + +#: Whether to tile, scale or clamp the background image. The value can +#: be one of tiled, mirror-tiled, scaled, clamped, centered or +#: cscaled. The scaled and cscaled values scale the image to the +#: window size, with cscaled preserving the image aspect ratio. + +# background_image_linear no + +#: When background image is scaled, whether linear interpolation +#: should be used. + +# transparent_background_colors + +#: A space separated list of upto 7 colors, with opacity. When the +#: background color of a cell matches one of these colors, it is +#: rendered semi-transparent using the specified opacity. + +#: Useful in more complex UIs like editors where you could want more +#: than a single background color to be rendered as transparent, for +#: instance, for a cursor highlight line background or a highlighted +#: block. Terminal applications can set this color using The kitty +#: color control escape code. + +#: The syntax for specifiying colors is: color@opacity, where the +#: @opacity part is optional. When unspecified, the value of +#: background_opacity is used. For example:: + +#: transparent_background_colors red@0.5 #00ff00@0.3 + + dynamic_background_opacity yes + background_opacity 0.9 + +#: Allow changing of the background_opacity dynamically, using either +#: keyboard shortcuts (increase_background_opacity and +#: decrease_background_opacity) or the remote control facility. +#: Changing this option by reloading the config is not supported. + +# background_tint 0.0 + +#: How much to tint the background image by the background color. This +#: option makes it easier to read the text. Tinting is done using the +#: current background color for each window. This option applies only +#: if background_opacity is set and transparent windows are supported +#: or background_image is set. + +# background_tint_gaps 1.0 + +#: How much to tint the background image at the window gaps by the +#: background color, after applying background_tint. Since this is +#: multiplicative with background_tint, it can be used to lighten the +#: tint over the window gaps for a *separated* look. + +# dim_opacity 0.4 + +#: How much to dim text that has the DIM/FAINT attribute set. One +#: means no dimming and zero means fully dimmed (i.e. invisible). + +# selection_foreground #000000 +# selection_background #fffacd + +#: The foreground and background colors for text selected with the +#: mouse. Setting both of these to none will cause a "reverse video" +#: effect for selections, where the selection will be the cell text +#: color and the text will become the cell background color. Setting +#: only selection_foreground to none will cause the foreground color +#: to be used unchanged. Note that these colors can be overridden by +#: the program running in the terminal. + +#: The color table {{{ + +#: The 256 terminal colors. There are 8 basic colors, each color has a +#: dull and bright version, for the first 16 colors. You can set the +#: remaining 240 colors as color16 to color255. + +# color0 #000000 +# color8 #767676 + +#: black + +# color1 #cc0403 +# color9 #f2201f + +#: red + +# color2 #19cb00 +# color10 #23fd00 + +#: green + +# color3 #cecb00 +# color11 #fffd00 + +#: yellow + +# color4 #0d73cc +# color12 #1a8fff + +#: blue + +# color5 #cb1ed1 +# color13 #fd28ff + +#: magenta + +# color6 #0dcdcd +# color14 #14ffff + +#: cyan + +# color7 #dddddd +# color15 #ffffff + +#: white + +# mark1_foreground black + +#: Color for marks of type 1 + +# mark1_background #98d3cb + +#: Color for marks of type 1 (light steel blue) + +# mark2_foreground black + +#: Color for marks of type 2 + +# mark2_background #f2dcd3 + +#: Color for marks of type 1 (beige) + +# mark3_foreground black + +#: Color for marks of type 3 + +# mark3_background #f274bc + +#: Color for marks of type 3 (violet) + +#: }}} + +#: }}} + +#: Advanced {{{ + +shell fish + +#: The shell program to execute. The default value of . means to use +#: the value of of the SHELL environment variable or if unset, +#: whatever shell is set as the default shell for the current user. +#: Note that on macOS if you change this, you might need to add +#: --login and --interactive to ensure that the shell starts in +#: interactive mode and reads its startup rc files. Environment +#: variables are expanded in this setting. + +editor micro + +#: The terminal based text editor (such as vim or nano) to use when +#: editing the kitty config file or similar tasks. + +#: The default value of . means to use the environment variables +#: VISUAL and EDITOR in that order. If these variables aren't set, +#: kitty will run your shell ($SHELL -l -i -c env) to see if your +#: shell startup rc files set VISUAL or EDITOR. If that doesn't work, +#: kitty will cycle through various known editors (vim, emacs, etc.) +#: and take the first one that exists on your system. + +# close_on_child_death no + +#: Close the window when the child process (usually the shell) exits. +#: With the default value no, the terminal will remain open when the +#: child exits as long as there are still other processes outputting +#: to the terminal (for example disowned or backgrounded processes). +#: When enabled with yes, the window will close as soon as the child +#: process exits. Note that setting it to yes means that any +#: background processes still using the terminal can fail silently +#: because their stdout/stderr/stdin no longer work. + +# remote_control_password + +#: Allow other programs to control kitty using passwords. This option +#: can be specified multiple times to add multiple passwords. If no +#: passwords are present kitty will ask the user for permission if a +#: program tries to use remote control with a password. A password can +#: also *optionally* be associated with a set of allowed remote +#: control actions. For example:: + +#: remote_control_password "my passphrase" get-colors set-colors focus-window focus-tab + +#: Only the specified actions will be allowed when using this +#: password. Glob patterns can be used too, for example:: + +#: remote_control_password "my passphrase" set-tab-* resize-* + +#: To get a list of available actions, run:: + +#: kitten @ --help + +#: A set of actions to be allowed when no password is sent can be +#: specified by using an empty password. For example:: + +#: remote_control_password "" *-colors + +#: Finally, the path to a python module can be specified that provides +#: a function is_cmd_allowed that is used to check every remote +#: control command. For example:: + +#: remote_control_password "my passphrase" my_rc_command_checker.py + +#: Relative paths are resolved from the kitty configuration directory. +#: See rc_custom_auth for details. + +# allow_remote_control no + +#: Allow other programs to control kitty. If you turn this on, other +#: programs can control all aspects of kitty, including sending text +#: to kitty windows, opening new windows, closing windows, reading the +#: content of windows, etc. Note that this even works over SSH +#: connections. The default setting of no prevents any form of remote +#: control. The meaning of the various values are: + +#: password +#: Remote control requests received over both the TTY device and the socket +#: are confirmed based on passwords, see remote_control_password. + +#: socket-only +#: Remote control requests received over a socket are accepted +#: unconditionally. Requests received over the TTY are denied. +#: See listen_on. + +#: socket +#: Remote control requests received over a socket are accepted +#: unconditionally. Requests received over the TTY are confirmed based on +#: password. + +#: no +#: Remote control is completely disabled. + +#: yes +#: Remote control requests are always accepted. + +# listen_on none + +#: Listen to the specified socket for remote control connections. Note +#: that this will apply to all kitty instances. It can be overridden +#: by the kitty --listen-on command line option. For UNIX sockets, +#: such as unix:${TEMP}/mykitty or unix:@mykitty (on Linux). +#: Environment variables are expanded and relative paths are resolved +#: with respect to the temporary directory. If {kitty_pid} is present, +#: then it is replaced by the PID of the kitty process, otherwise the +#: PID of the kitty process is appended to the value, with a hyphen. +#: For TCP sockets such as tcp:localhost:0 a random port is always +#: used even if a non-zero port number is specified. See the help for +#: kitty --listen-on for more details. Note that this will be ignored +#: unless allow_remote_control is set to either: yes, socket or +#: socket-only. Changing this option by reloading the config is not +#: supported. + +# env + +#: Specify the environment variables to be set in all child processes. +#: Using the name with an equal sign (e.g. env VAR=) will set it to +#: the empty string. Specifying only the name (e.g. env VAR) will +#: remove the variable from the child process' environment. Note that +#: environment variables are expanded recursively, for example:: + +#: env VAR1=a +#: env VAR2=${HOME}/${VAR1}/b + +#: The value of VAR2 will be /a/b. + +# filter_notification + +#: Specify rules to filter out notifications sent by applications +#: running in kitty. Can be specified multiple times to create +#: multiple filter rules. A rule specification is of the form +#: field:regexp. A filter rule can match on any of the fields: title, +#: body, app, type. The special value of all filters out all +#: notifications. Rules can be combined using Boolean operators. Some +#: examples:: + +#: filter_notification title:hello or body:"abc.*def" +#: # filter out notification from vim except for ones about updates, (?i) +#: # makes matching case insesitive. +#: filter_notification app:"[ng]?vim" and not body:"(?i)update" +#: # filter out all notifications +#: filter_notification all + +#: The field app is the name of the application sending the +#: notification and type is the type of the notification. Not all +#: applications will send these fields, so you can also match on the +#: title and body of the notification text. More sophisticated +#: programmatic filtering and custom actions on notifications can be +#: done by creating a notifications.py file in the kitty config +#: directory (~/.config/kitty). An annotated sample is available +#: . + +# watcher + +#: Path to python file which will be loaded for watchers +#: . Can be +#: specified more than once to load multiple watchers. The watchers +#: will be added to every kitty window. Relative paths are resolved +#: relative to the kitty config directory. Note that reloading the +#: config will only affect windows created after the reload. + +# exe_search_path + +#: Control where kitty finds the programs to run. The default search +#: order is: First search the system wide PATH, then ~/.local/bin and +#: ~/bin. If still not found, the PATH defined in the login shell +#: after sourcing all its startup files is tried. Finally, if present, +#: the PATH specified by the env option is tried. + +#: This option allows you to prepend, append, or remove paths from +#: this search order. It can be specified multiple times for multiple +#: paths. A simple path will be prepended to the search order. A path +#: that starts with the + sign will be append to the search order, +#: after ~/bin above. A path that starts with the - sign will be +#: removed from the entire search order. For example:: + +#: exe_search_path /some/prepended/path +#: exe_search_path +/some/appended/path +#: exe_search_path -/some/excluded/path + +# update_check_interval 24 + +#: The interval to periodically check if an update to kitty is +#: available (in hours). If an update is found, a system notification +#: is displayed informing you of the available update. The default is +#: to check every 24 hours, set to zero to disable. Update checking is +#: only done by the official binary builds. Distro packages or source +#: builds do not do update checking. Changing this option by reloading +#: the config is not supported. + +# startup_session none + +#: Path to a session file to use for all kitty instances. Can be +#: overridden by using the kitty --session =none command line option +#: for individual instances. See sessions +#: in the kitty +#: documentation for details. Note that relative paths are interpreted +#: with respect to the kitty config directory. Environment variables +#: in the path are expanded. Changing this option by reloading the +#: config is not supported. Note that if kitty is invoked with command +#: line arguments specifying a command to run, this option is ignored. + +# clipboard_control write-clipboard write-primary read-clipboard-ask read-primary-ask + +#: Allow programs running in kitty to read and write from the +#: clipboard. You can control exactly which actions are allowed. The +#: possible actions are: write-clipboard, read-clipboard, write- +#: primary, read-primary, read-clipboard-ask, read-primary-ask. The +#: default is to allow writing to the clipboard and primary selection +#: and to ask for permission when a program tries to read from the +#: clipboard. Note that disabling the read confirmation is a security +#: risk as it means that any program, even the ones running on a +#: remote server via SSH can read your clipboard. See also +#: clipboard_max_size. + +# clipboard_max_size 512 + +#: The maximum size (in MB) of data from programs running in kitty +#: that will be stored for writing to the system clipboard. A value of +#: zero means no size limit is applied. See also clipboard_control. + +# file_transfer_confirmation_bypass + +#: The password that can be supplied to the file transfer kitten +#: to skip the +#: transfer confirmation prompt. This should only be used when +#: initiating transfers from trusted computers, over trusted networks +#: or encrypted transports, as it allows any programs running on the +#: remote machine to read/write to the local filesystem, without +#: permission. + +# allow_hyperlinks yes + +#: Process hyperlink escape sequences (OSC 8). If disabled OSC 8 +#: escape sequences are ignored. Otherwise they become clickable +#: links, that you can click with the mouse or by using the hints +#: kitten . The +#: special value of ask means that kitty will ask before opening the +#: link when clicked. + +# shell_integration enabled + +#: Enable shell integration on supported shells. This enables features +#: such as jumping to previous prompts, browsing the output of the +#: previous command in a pager, etc. on supported shells. Set to +#: disabled to turn off shell integration, completely. It is also +#: possible to disable individual features, set to a space separated +#: list of these values: no-rc, no-cursor, no-title, no-cwd, no- +#: prompt-mark, no-complete, no-sudo. See Shell integration +#: for details. + +# allow_cloning ask + +#: Control whether programs running in the terminal can request new +#: windows to be created. The canonical example is clone-in-kitty +#: . +#: By default, kitty will ask for permission for each clone request. +#: Allowing cloning unconditionally gives programs running in the +#: terminal (including over SSH) permission to execute arbitrary code, +#: as the user who is running the terminal, on the computer that the +#: terminal is running on. + +# clone_source_strategies venv,conda,env_var,path + +#: Control what shell code is sourced when running clone-in-kitty in +#: the newly cloned window. The supported strategies are: + +#: venv +#: Source the file $VIRTUAL_ENV/bin/activate. This is used by the +#: Python stdlib venv module and allows cloning venvs automatically. +#: conda +#: Run conda activate $CONDA_DEFAULT_ENV. This supports the virtual +#: environments created by conda. +#: env_var +#: Execute the contents of the environment variable +#: KITTY_CLONE_SOURCE_CODE with eval. +#: path +#: Source the file pointed to by the environment variable +#: KITTY_CLONE_SOURCE_PATH. + +#: This option must be a comma separated list of the above values. +#: Only the first valid match, in the order specified, is sourced. + +# notify_on_cmd_finish never + +#: Show a desktop notification when a long-running command finishes +#: (needs shell_integration). The possible values are: + +#: never +#: Never send a notification. + +#: unfocused +#: Only send a notification when the window does not have keyboard focus. + +#: invisible +#: Only send a notification when the window both is unfocused and not visible +#: to the user, for example, because it is in an inactive tab or its OS window +#: is not currently active. + +#: always +#: Always send a notification, regardless of window state. + +#: There are two optional arguments: + +#: First, the minimum duration for what is considered a long running +#: command. The default is 5 seconds. Specify a second argument to set +#: the duration. For example: invisible 15. Do not set the value too +#: small, otherwise a command that launches a new OS Window and exits +#: will spam a notification. + +#: Second, the action to perform. The default is notify. The possible +#: values are: + +#: notify +#: Send a desktop notification. + +#: bell +#: Ring the terminal bell. + +#: command +#: Run a custom command. All subsequent arguments are the cmdline to run. + +#: Some more examples:: + +#: # Send a notification when a command takes more than 5 seconds in an unfocused window +#: notify_on_cmd_finish unfocused +#: # Send a notification when a command takes more than 10 seconds in a invisible window +#: notify_on_cmd_finish invisible 10.0 +#: # Ring a bell when a command takes more than 10 seconds in a invisible window +#: notify_on_cmd_finish invisible 10.0 bell +#: # Run 'notify-send' when a command takes more than 10 seconds in a invisible window +#: # Here %c is replaced by the current command line and %s by the job exit code +#: notify_on_cmd_finish invisible 10.0 command notify-send "job finished with status: %s" %c + +# term xterm-kitty + +#: The value of the TERM environment variable to set. Changing this +#: can break many terminal programs, only change it if you know what +#: you are doing, not because you read some advice on "Stack Overflow" +#: to change it. The TERM variable is used by various programs to get +#: information about the capabilities and behavior of the terminal. If +#: you change it, depending on what programs you run, and how +#: different the terminal you are changing it to is, various things +#: from key-presses, to colors, to various advanced features may not +#: work. Changing this option by reloading the config will only affect +#: newly created windows. + +# terminfo_type path + +#: The value of the TERMINFO environment variable to set. This +#: variable is used by programs running in the terminal to search for +#: terminfo databases. The default value of path causes kitty to set +#: it to a filesystem location containing the kitty terminfo database. +#: A value of direct means put the entire database into the env var +#: directly. This can be useful when connecting to containers, for +#: example. But, note that not all software supports this. A value of +#: none means do not touch the variable. + +# forward_stdio no + +#: Forward STDOUT and STDERR of the kitty process to child processes. +#: This is useful for debugging as it allows child processes to print +#: to kitty's STDOUT directly. For example, echo hello world +#: >&$KITTY_STDIO_FORWARDED in a shell will print to the parent +#: kitty's STDOUT. Sets the KITTY_STDIO_FORWARDED=fdnum environment +#: variable so child processes know about the forwarding. Note that on +#: macOS this prevents the shell from being run via the login utility +#: so getlogin() will not work in programs run in this session. + +# menu_map + +#: Specify entries for various menus in kitty. Currently only the +#: global menubar on macOS is supported. For example:: + +#: menu_map global "Actions::Launch something special" launch --hold --type=os-window sh -c "echo hello world" + +#: This will create a menu entry named "Launch something special" in +#: an "Actions" menu in the macOS global menubar. Sub-menus can be +#: created by adding more levels separated by the :: characters. + +#: }}} + +#: OS specific tweaks {{{ + +# wayland_titlebar_color system + +#: The color of the kitty window's titlebar on Wayland systems with +#: client side window decorations such as GNOME. A value of system +#: means to use the default system colors, a value of background means +#: to use the background color of the currently active kitty window +#: and finally you can use an arbitrary color, such as #12af59 or red. + +# macos_titlebar_color system + +#: The color of the kitty window's titlebar on macOS. A value of +#: system means to use the default system color, light or dark can +#: also be used to set it explicitly. A value of background means to +#: use the background color of the currently active window and finally +#: you can use an arbitrary color, such as #12af59 or red. WARNING: +#: This option works by using a hack when arbitrary color (or +#: background) is configured, as there is no proper Cocoa API for it. +#: It sets the background color of the entire window and makes the +#: titlebar transparent. As such it is incompatible with +#: background_opacity. If you want to use both, you are probably +#: better off just hiding the titlebar with hide_window_decorations. + +# macos_option_as_alt no + +#: Use the Option key as an Alt key on macOS. With this set to no, +#: kitty will use the macOS native Option+Key to enter Unicode +#: character behavior. This will break any Alt+Key keyboard shortcuts +#: in your terminal programs, but you can use the macOS Unicode input +#: technique. You can use the values: left, right or both to use only +#: the left, right or both Option keys as Alt, instead. Note that +#: kitty itself always treats Option the same as Alt. This means you +#: cannot use this option to configure different kitty shortcuts for +#: Option+Key vs. Alt+Key. Also, any kitty shortcuts using +#: Option/Alt+Key will take priority, so that any such key presses +#: will not be passed to terminal programs running inside kitty. +#: Changing this option by reloading the config is not supported. + +# macos_hide_from_tasks no + +#: Hide the kitty window from running tasks on macOS (⌘+Tab and the +#: Dock). Changing this option by reloading the config is not +#: supported. + +# macos_quit_when_last_window_closed no + +#: Have kitty quit when all the top-level windows are closed on macOS. +#: By default, kitty will stay running, even with no open windows, as +#: is the expected behavior on macOS. + +# macos_window_resizable yes + +#: Disable this if you want kitty top-level OS windows to not be +#: resizable on macOS. + +# macos_thicken_font 0 + +#: Draw an extra border around the font with the given width, to +#: increase legibility at small font sizes on macOS. For example, a +#: value of 0.75 will result in rendering that looks similar to sub- +#: pixel antialiasing at common font sizes. Note that in modern kitty, +#: this option is obsolete (although still supported). Consider using +#: text_composition_strategy instead. + +# macos_traditional_fullscreen no + +#: Use the macOS traditional full-screen transition, that is faster, +#: but less pretty. + +# macos_show_window_title_in all + +#: Control where the window title is displayed on macOS. A value of +#: window will show the title of the currently active window at the +#: top of the macOS window. A value of menubar will show the title of +#: the currently active window in the macOS global menu bar, making +#: use of otherwise wasted space. A value of all will show the title +#: in both places, and none hides the title. See +#: macos_menubar_title_max_length for how to control the length of the +#: title in the menu bar. + +# macos_menubar_title_max_length 0 + +#: The maximum number of characters from the window title to show in +#: the macOS global menu bar. Values less than one means that there is +#: no maximum limit. + +# macos_custom_beam_cursor no + +#: Use a custom mouse cursor for macOS that is easier to see on both +#: light and dark backgrounds. Nowadays, the default macOS cursor +#: already comes with a white border. WARNING: this might make your +#: mouse cursor invisible on dual GPU machines. Changing this option +#: by reloading the config is not supported. + +# macos_colorspace srgb + +#: The colorspace in which to interpret terminal colors. The default +#: of srgb will cause colors to match those seen in web browsers. The +#: value of default will use whatever the native colorspace of the +#: display is. The value of displayp3 will use Apple's special +#: snowflake display P3 color space, which will result in over +#: saturated (brighter) colors with some color shift. Reloading +#: configuration will change this value only for newly created OS +#: windows. + +# linux_display_server auto + +#: Choose between Wayland and X11 backends. By default, an appropriate +#: backend based on the system state is chosen automatically. Set it +#: to x11 or wayland to force the choice. Changing this option by +#: reloading the config is not supported. + +# wayland_enable_ime yes + +#: Enable Input Method Extension on Wayland. This is typically used +#: for inputting text in East Asian languages. However, its +#: implementation in Wayland is often buggy and introduces latency +#: into the input loop, so disable this if you know you dont need it. +#: Changing this option by reloading the config is not supported, it +#: will not have any effect. + +#: }}} + +#: Keyboard shortcuts {{{ + +#: Keys are identified simply by their lowercase Unicode characters. +#: For example: a for the A key, [ for the left square bracket key, +#: etc. For functional keys, such as Enter or Escape, the names are +#: present at Functional key definitions +#: . +#: For modifier keys, the names are ctrl (control, ⌃), shift (⇧), alt +#: (opt, option, ⌥), super (cmd, command, ⌘). + +#: Simple shortcut mapping is done with the map directive. For full +#: details on advanced mapping including modal and per application +#: maps, see mapping . Some +#: quick examples to illustrate common tasks:: + +#: # unmap a keyboard shortcut, passing it to the program running in kitty +#: map kitty_mod+space +#: # completely ignore a keyboard event +#: map ctrl+alt+f1 discard_event +#: # combine multiple actions +#: map kitty_mod+e combine : new_window : next_layout +#: # multi-key shortcuts +#: map ctrl+x>ctrl+y>z action + +#: The full list of actions that can be mapped to key presses is +#: available here . + +# kitty_mod ctrl+shift + +#: Special modifier key alias for default shortcuts. You can change +#: the value of this option to alter all default shortcuts that use +#: kitty_mod. + +# clear_all_shortcuts no + +#: Remove all shortcut definitions up to this point. Useful, for +#: instance, to remove the default shortcuts. + +# action_alias + +#: E.g. action_alias launch_tab launch --type=tab --cwd=current + +#: Define action aliases to avoid repeating the same options in +#: multiple mappings. Aliases can be defined for any action and will +#: be expanded recursively. For example, the above alias allows you to +#: create mappings to launch a new tab in the current working +#: directory without duplication:: + +#: map f1 launch_tab vim +#: map f2 launch_tab emacs + +#: Similarly, to alias kitten invocation:: + +#: action_alias hints kitten hints --hints-offset=0 + +# kitten_alias + +#: E.g. kitten_alias hints hints --hints-offset=0 + +#: Like action_alias above, but specifically for kittens. Generally, +#: prefer to use action_alias. This option is a legacy version, +#: present for backwards compatibility. It causes all invocations of +#: the aliased kitten to be substituted. So the example above will +#: cause all invocations of the hints kitten to have the --hints- +#: offset=0 option applied. + +#: Clipboard {{{ + +#: Copy to clipboard + +# map kitty_mod+c copy_to_clipboard +# map cmd+c copy_to_clipboard + +#:: There is also a copy_or_interrupt action that can be optionally +#:: mapped to Ctrl+C. It will copy only if there is a selection and +#:: send an interrupt otherwise. Similarly, +#:: copy_and_clear_or_interrupt will copy and clear the selection or +#:: send an interrupt if there is no selection. + +#: Paste from clipboard + +# map kitty_mod+v paste_from_clipboard +# map cmd+v paste_from_clipboard + +#: Paste from selection + +# map kitty_mod+s paste_from_selection +# map shift+insert paste_from_selection + +#: Pass selection to program + +# map kitty_mod+o pass_selection_to_program + +#:: You can also pass the contents of the current selection to any +#:: program with pass_selection_to_program. By default, the system's +#:: open program is used, but you can specify your own, the selection +#:: will be passed as a command line argument to the program. For +#:: example:: + +#:: map kitty_mod+o pass_selection_to_program firefox + +#:: You can pass the current selection to a terminal program running +#:: in a new kitty window, by using the @selection placeholder:: + +#:: map kitty_mod+y new_window less @selection + +#: }}} + +#: Scrolling {{{ + +#: Scroll line up + +# map kitty_mod+up scroll_line_up +# map kitty_mod+k scroll_line_up +# map opt+cmd+page_up scroll_line_up +# map cmd+up scroll_line_up + +#: Scroll line down + +# map kitty_mod+down scroll_line_down +# map kitty_mod+j scroll_line_down +# map opt+cmd+page_down scroll_line_down +# map cmd+down scroll_line_down + +#: Scroll page up + +# map kitty_mod+page_up scroll_page_up +# map cmd+page_up scroll_page_up + +#: Scroll page down + +# map kitty_mod+page_down scroll_page_down +# map cmd+page_down scroll_page_down + +#: Scroll to top + +# map kitty_mod+home scroll_home +# map cmd+home scroll_home + +#: Scroll to bottom + +# map kitty_mod+end scroll_end +# map cmd+end scroll_end + +#: Scroll to previous shell prompt + +# map kitty_mod+z scroll_to_prompt -1 + +#:: Use a parameter of 0 for scroll_to_prompt to scroll to the last +#:: jumped to or the last clicked position. Requires shell +#:: integration +#:: to work. + +#: Scroll to next shell prompt + +# map kitty_mod+x scroll_to_prompt 1 + +#: Browse scrollback buffer in pager + +# map kitty_mod+h show_scrollback + +#:: You can pipe the contents of the current screen and history +#:: buffer as STDIN to an arbitrary program using launch --stdin- +#:: source. For example, the following opens the scrollback buffer in +#:: less in an overlay window:: + +#:: map f1 launch --stdin-source=@screen_scrollback --stdin-add-formatting --type=overlay less +G -R + +#:: For more details on piping screen and buffer contents to external +#:: programs, see launch . + +#: Browse output of the last shell command in pager + +# map kitty_mod+g show_last_command_output + +#:: You can also define additional shortcuts to get the command +#:: output. For example, to get the first command output on screen:: + +#:: map f1 show_first_command_output_on_screen + +#:: To get the command output that was last accessed by a keyboard +#:: action or mouse action:: + +#:: map f1 show_last_visited_command_output + +#:: You can pipe the output of the last command run in the shell +#:: using the launch action. For example, the following opens the +#:: output in less in an overlay window:: + +#:: map f1 launch --stdin-source=@last_cmd_output --stdin-add-formatting --type=overlay less +G -R + +#:: To get the output of the first command on the screen, use +#:: @first_cmd_output_on_screen. To get the output of the last jumped +#:: to command, use @last_visited_cmd_output. + +#:: Requires shell integration +#:: to work. + +#: }}} + +#: Window management {{{ + +#: New window + +# map kitty_mod+enter new_window +# map cmd+enter new_window + +#:: You can open a new kitty window running an arbitrary program, for +#:: example:: + +#:: map kitty_mod+y launch mutt + +#:: You can open a new window with the current working directory set +#:: to the working directory of the current window using:: + +#:: map ctrl+alt+enter launch --cwd=current + +#:: You can open a new window that is allowed to control kitty via +#:: the kitty remote control facility with launch --allow-remote- +#:: control. Any programs running in that window will be allowed to +#:: control kitty. For example:: + +#:: map ctrl+enter launch --allow-remote-control some_program + +#:: You can open a new window next to the currently active window or +#:: as the first window, with:: + +#:: map ctrl+n launch --location=neighbor +#:: map ctrl+f launch --location=first + +#:: For more details, see launch +#:: . + +#: New OS window + +# map kitty_mod+n new_os_window +# map cmd+n new_os_window + +#:: Works like new_window above, except that it opens a top-level OS +#:: window. In particular you can use new_os_window_with_cwd to open +#:: a window with the current working directory. + +#: Close window + +# map kitty_mod+w close_window +# map shift+cmd+d close_window + +#: Next window + +# map kitty_mod+] next_window + +#: Previous window + +# map kitty_mod+[ previous_window + +#: Move window forward + +# map kitty_mod+f move_window_forward + +#: Move window backward + +# map kitty_mod+b move_window_backward + +#: Move window to top + +# map kitty_mod+` move_window_to_top + +#: Start resizing window + +# map kitty_mod+r start_resizing_window +# map cmd+r start_resizing_window + +#: First window + +# map kitty_mod+1 first_window +# map cmd+1 first_window + +#: Second window + +# map kitty_mod+2 second_window +# map cmd+2 second_window + +#: Third window + +# map kitty_mod+3 third_window +# map cmd+3 third_window + +#: Fourth window + +# map kitty_mod+4 fourth_window +# map cmd+4 fourth_window + +#: Fifth window + +# map kitty_mod+5 fifth_window +# map cmd+5 fifth_window + +#: Sixth window + +# map kitty_mod+6 sixth_window +# map cmd+6 sixth_window + +#: Seventh window + +# map kitty_mod+7 seventh_window +# map cmd+7 seventh_window + +#: Eighth window + +# map kitty_mod+8 eighth_window +# map cmd+8 eighth_window + +#: Ninth window + +# map kitty_mod+9 ninth_window +# map cmd+9 ninth_window + +#: Tenth window + +# map kitty_mod+0 tenth_window + +#: Visually select and focus window + +# map kitty_mod+f7 focus_visible_window + +#:: Display overlay numbers and alphabets on the window, and switch +#:: the focus to the window when you press the key. When there are +#:: only two windows, the focus will be switched directly without +#:: displaying the overlay. You can change the overlay characters and +#:: their order with option visual_window_select_characters. + +#: Visually swap window with another + +# map kitty_mod+f8 swap_with_window + +#:: Works like focus_visible_window above, but swaps the window. + +#: }}} + +#: Tab management {{{ + +#: Next tab + +# map kitty_mod+right next_tab +# map shift+cmd+] next_tab +# map ctrl+tab next_tab + +#: Previous tab + +# map kitty_mod+left previous_tab +# map shift+cmd+[ previous_tab +# map ctrl+shift+tab previous_tab + +#: New tab + +# map kitty_mod+t new_tab +# map cmd+t new_tab + +#: Close tab + +# map kitty_mod+q close_tab +# map cmd+w close_tab + +#: Close OS window + +# map shift+cmd+w close_os_window + +#: Move tab forward + +# map kitty_mod+. move_tab_forward + +#: Move tab backward + +# map kitty_mod+, move_tab_backward + +#: Set tab title + +# map kitty_mod+alt+t set_tab_title +# map shift+cmd+i set_tab_title + + +#: You can also create shortcuts to go to specific tabs, with 1 being +#: the first tab, 2 the second tab and -1 being the previously active +#: tab, -2 being the tab active before the previously active tab and +#: so on. Any number larger than the number of tabs goes to the last +#: tab and any number less than the number of previously used tabs in +#: the history goes to the oldest previously used tab in the history:: + +#: map ctrl+alt+1 goto_tab 1 +#: map ctrl+alt+2 goto_tab 2 + +#: Just as with new_window above, you can also pass the name of +#: arbitrary commands to run when using new_tab and new_tab_with_cwd. +#: Finally, if you want the new tab to open next to the current tab +#: rather than at the end of the tabs list, use:: + +#: map ctrl+t new_tab !neighbor [optional cmd to run] +#: }}} + +#: Layout management {{{ + +#: Next layout + +# map kitty_mod+l next_layout + + +#: You can also create shortcuts to switch to specific layouts:: + +#: map ctrl+alt+t goto_layout tall +#: map ctrl+alt+s goto_layout stack + +#: Similarly, to switch back to the previous layout:: + +#: map ctrl+alt+p last_used_layout + +#: There is also a toggle_layout action that switches to the named +#: layout or back to the previous layout if in the named layout. +#: Useful to temporarily "zoom" the active window by switching to the +#: stack layout:: + +#: map ctrl+alt+z toggle_layout stack +#: }}} + +#: Font sizes {{{ + +#: You can change the font size for all top-level kitty OS windows at +#: a time or only the current one. + +#: Increase font size + +# map kitty_mod+equal change_font_size all +2.0 +# map kitty_mod+plus change_font_size all +2.0 +# map kitty_mod+kp_add change_font_size all +2.0 +# map cmd+plus change_font_size all +2.0 +# map cmd+equal change_font_size all +2.0 +# map shift+cmd+equal change_font_size all +2.0 + +#: Decrease font size + +# map kitty_mod+minus change_font_size all -2.0 +# map kitty_mod+kp_subtract change_font_size all -2.0 +# map cmd+minus change_font_size all -2.0 +# map shift+cmd+minus change_font_size all -2.0 + +#: Reset font size + +# map kitty_mod+backspace change_font_size all 0 +# map cmd+0 change_font_size all 0 + + +#: To setup shortcuts for specific font sizes:: + +#: map kitty_mod+f6 change_font_size all 10.0 + +#: To setup shortcuts to change only the current OS window's font +#: size:: + +#: map kitty_mod+f6 change_font_size current 10.0 +#: }}} + +#: Select and act on visible text {{{ + +#: Use the hints kitten to select text and either pass it to an +#: external program or insert it into the terminal or copy it to the +#: clipboard. + +#: Open URL + +# map kitty_mod+e open_url_with_hints + +#:: Open a currently visible URL using the keyboard. The program used +#:: to open the URL is specified in open_url_with. + +#: Insert selected path + +# map kitty_mod+p>f kitten hints --type path --program - + +#:: Select a path/filename and insert it into the terminal. Useful, +#:: for instance to run git commands on a filename output from a +#:: previous git command. + +#: Open selected path + +# map kitty_mod+p>shift+f kitten hints --type path + +#:: Select a path/filename and open it with the default open program. + +#: Insert selected line + +# map kitty_mod+p>l kitten hints --type line --program - + +#:: Select a line of text and insert it into the terminal. Useful for +#:: the output of things like: `ls -1`. + +#: Insert selected word + +# map kitty_mod+p>w kitten hints --type word --program - + +#:: Select words and insert into terminal. + +#: Insert selected hash + +# map kitty_mod+p>h kitten hints --type hash --program - + +#:: Select something that looks like a hash and insert it into the +#:: terminal. Useful with git, which uses SHA1 hashes to identify +#:: commits. + +#: Open the selected file at the selected line + +# map kitty_mod+p>n kitten hints --type linenum + +#:: Select something that looks like filename:linenum and open it in +#:: your default editor at the specified line number. + +#: Open the selected hyperlink + +# map kitty_mod+p>y kitten hints --type hyperlink + +#:: Select a hyperlink (i.e. a URL that has been marked as such by +#:: the terminal program, for example, by `ls --hyperlink=auto`). + + +#: The hints kitten has many more modes of operation that you can map +#: to different shortcuts. For a full description see hints kitten +#: . +#: }}} + +#: Miscellaneous {{{ + +#: Show documentation + +# map kitty_mod+f1 show_kitty_doc overview + +#: Toggle fullscreen + +# map kitty_mod+f11 toggle_fullscreen +# map ctrl+cmd+f toggle_fullscreen + +#: Toggle maximized + +# map kitty_mod+f10 toggle_maximized + +#: Toggle macOS secure keyboard entry + +# map opt+cmd+s toggle_macos_secure_keyboard_entry + +#: Unicode input + +# map kitty_mod+u kitten unicode_input +# map ctrl+cmd+space kitten unicode_input + +#: Edit config file + +# map kitty_mod+f2 edit_config_file +# map cmd+, edit_config_file + +#: Open the kitty command shell + +# map kitty_mod+escape kitty_shell window + +#:: Open the kitty shell in a new window / tab / overlay / os_window +#:: to control kitty using commands. + +#: Increase background opacity + +# map kitty_mod+a>m set_background_opacity +0.1 + +#: Decrease background opacity + +# map kitty_mod+a>l set_background_opacity -0.1 + +#: Make background fully opaque + +# map kitty_mod+a>1 set_background_opacity 1 + +#: Reset background opacity + +# map kitty_mod+a>d set_background_opacity default + +#: Reset the terminal + +# map kitty_mod+delete clear_terminal reset active +# map opt+cmd+r clear_terminal reset active + +#:: You can create shortcuts to clear/reset the terminal. For +#:: example:: + +#:: # Reset the terminal +#:: map f1 clear_terminal reset active +#:: # Clear the terminal screen by erasing all contents +#:: map f1 clear_terminal clear active +#:: # Clear the terminal scrollback by erasing it +#:: map f1 clear_terminal scrollback active +#:: # Scroll the contents of the screen into the scrollback +#:: map f1 clear_terminal scroll active +#:: # Clear everything on screen up to the line with the cursor or the start of the current prompt (needs shell integration) +#:: map f1 clear_terminal to_cursor active +#:: # Same as above except cleared lines are moved into scrollback +#:: map f1 clear_terminal to_cursor_scroll active + +#:: If you want to operate on all kitty windows instead of just the +#:: current one, use all instead of active. + +#:: Some useful functions that can be defined in the shell rc files +#:: to perform various kinds of clearing of the current window: + +#:: .. code-block:: sh + +#:: clear-only-screen() { +#:: printf "\e[H\e[2J" +#:: } + +#:: clear-screen-and-scrollback() { +#:: printf "\e[H\e[3J" +#:: } + +#:: clear-screen-saving-contents-in-scrollback() { +#:: printf "\e[H\e[22J" +#:: } + +#:: For instance, using these escape codes, it is possible to remap +#:: Ctrl+L to both scroll the current screen contents into the +#:: scrollback buffer and clear the screen, instead of just clearing +#:: the screen. For ZSH, in ~/.zshrc, add: + +#:: .. code-block:: zsh + +#:: ctrl_l() { +#:: builtin print -rn -- $'\r\e[0J\e[H\e[22J' >"$TTY" +#:: builtin zle .reset-prompt +#:: builtin zle -R +#:: } +#:: zle -N ctrl_l +#:: bindkey '^l' ctrl_l + +#:: Alternatively, you can just add map ctrl+l clear_terminal +#:: to_cursor_scroll active to kitty.conf which works with no changes +#:: to the shell rc files, but only clears up to the prompt, it does +#:: not clear anytext at the prompt itself. + +#: Clear up to cursor line + +# map cmd+k clear_terminal to_cursor active + +#: Reload kitty.conf + +# map kitty_mod+f5 load_config_file +# map ctrl+cmd+, load_config_file + +#:: Reload kitty.conf, applying any changes since the last time it +#:: was loaded. Note that a handful of options cannot be dynamically +#:: changed and require a full restart of kitty. Particularly, when +#:: changing shortcuts for actions located on the macOS global menu +#:: bar, a full restart is needed. You can also map a keybinding to +#:: load a different config file, for example:: + +#:: map f5 load_config /path/to/alternative/kitty.conf + +#:: Note that all options from the original kitty.conf are discarded, +#:: in other words the new configuration *replace* the old ones. + +#: Debug kitty configuration + +# map kitty_mod+f6 debug_config +# map opt+cmd+, debug_config + +#:: Show details about exactly what configuration kitty is running +#:: with and its host environment. Useful for debugging issues. + +#: Send arbitrary text on key presses + +#:: E.g. map ctrl+shift+alt+h send_text all Hello World + +#:: You can tell kitty to send arbitrary (UTF-8) encoded text to the +#:: client program when pressing specified shortcut keys. For +#:: example:: + +#:: map ctrl+alt+a send_text all Special text + +#:: This will send "Special text" when you press the Ctrl+Alt+A key +#:: combination. The text to be sent decodes ANSI C escapes +#:: so you can use escapes like \e to send control +#:: codes or \u21fb to send Unicode characters (or you can just input +#:: the Unicode characters directly as UTF-8 text). You can use +#:: `kitten show-key` to get the key escape codes you want to +#:: emulate. + +#:: The first argument to send_text is the keyboard modes in which to +#:: activate the shortcut. The possible values are normal, +#:: application, kitty or a comma separated combination of them. The +#:: modes normal and application refer to the DECCKM cursor key mode +#:: for terminals, and kitty refers to the kitty extended keyboard +#:: protocol. The special value all means all of them. + +#:: Some more examples:: + +#:: # Output a word and move the cursor to the start of the line (like typing and pressing Home) +#:: map ctrl+alt+a send_text normal Word\e[H +#:: map ctrl+alt+a send_text application Word\eOH +#:: # Run a command at a shell prompt (like typing the command and pressing Enter) +#:: map ctrl+alt+a send_text normal,application some command with arguments\r + +#: Open kitty Website + +# map shift+cmd+/ open_url https://sw.kovidgoyal.net/kitty/ + +#: Hide macOS kitty application + +# map cmd+h hide_macos_app + +#: Hide macOS other applications + +# map opt+cmd+h hide_macos_other_apps + +#: Minimize macOS window + +# map cmd+m minimize_macos_window + +#: Quit kitty + +# map cmd+q quit + +#: }}} + +#: }}} diff --git a/kritadisplayrc b/kritadisplayrc new file mode 100644 index 0000000..5a78640 --- /dev/null +++ b/kritadisplayrc @@ -0,0 +1,6 @@ +[General] +EnableHiDPI=true +LogUsage=true +OpenGLRenderer=auto +canvasState=OPENGL_SUCCESS +rootSurfaceFormat=bt709-g22 diff --git a/kritarc b/kritarc new file mode 100644 index 0000000..0654801 --- /dev/null +++ b/kritarc @@ -0,0 +1,739 @@ +AlsoSaveAsKra=false +AntialiasSelectionOutline=false +ArtColorSel.ColorSpace=0 +ArtColorSel.InversedSaturation=false +ArtColorSel.Light=1 +ArtColorSel.LightPieces=11 +ArtColorSel.NumRings=7 +ArtColorSel.RingPieces=12 +ArtColorSel.SelColorH=0 +ArtColorSel.SelColorS=0 +ArtColorSel.SelColorX=1 +ArtColorSel.defaultHueSteps=12 +ArtColorSel.defaultSaturationSteps=7 +ArtColorSel.defaultValueScaleSteps=11 +ArtColorSel.enforceGamutMask=false +ArtColorSel.lumaB=0.0722 +ArtColorSel.lumaG=0.7152 +ArtColorSel.lumaGamma=2.2 +ArtColorSel.lumaR=0.2126 +ArtColorSel.showBgColor=true +ArtColorSel.showValueScale=false +AutoSaveInterval=420 +BackgroundColorForNewImage=48,48,48 +BackgroundOpacityForNewImage=255 +BackgroundStyleForNewImage=0 +CanvasOnlyActive=false +CanvasSize/ConstrainProportions=false +CanvasSize/KeepAspectRatio=false +ColorManagement/UseSystemMonitorProfile=false +ConvertToImageColorSpaceOnImport=false +CreateBackupFile=true +ExportConfiguration-image/jpeg=\n\n true\n false\n \n false\n false\n true\n false\n 80\n true\n 0\n false\n false\n 0\n \n\n \n\n]]>\n false\n\n +ExportConfiguration-image/png=\n\n true\n 9\n false\n true\n false\n false\n false\n false\n false\n false\n \n\n \n\n]]>\n\n +FilterSelector/LastUsedFilter=hsvadjustment +GamutMasks.viewMode=0 +KineticScrollingEnabled=true +KineticScrollingGesture=2 +KineticScrollingHideScrollbar=false +KineticScrollingSensitivity=75 +KisDlgPreferences/CurrentPage=tablet +Krita/Ocio/DisplayDevice=sRGB +Krita/Ocio/DisplayLook=None +Krita/Ocio/DisplayView=Raw +Krita/Ocio/InputColorSpace=raw +Krita/Ocio/OcioColorManagementMode=0 +Krita/Ocio/OcioConfigPath= +Krita/Ocio/OcioLockColorVisualRepresentation=false +Krita/Ocio/OcioLutPath= +Krita/Ocio/UseOcio=false +LastBackGroundColor=\n\n \n\n +LastEraser_0=a) Eraser Circle +LastForeGroundColor=\n\n \n\n +LastPreset=b) Basic-3 Flow +LastPreset_-1=b) Basic-3 Flow +LineSmoothingDelayDistance=50 +LineSmoothingDistance=50 +LineSmoothingFinishStabilizedCurve=true +LineSmoothingScalableDistance=true +LineSmoothingSmoothPressure=false +LineSmoothingStabilizeSensors=true +LineSmoothingTailAggressiveness=0.15 +LineSmoothingType=1 +LineSmoothingUseDelayDistance=true +NumberOfLayersForNewImage=2 +OpenGLFilterMode=3 +PinnedFonts=Noto Sans +ResourceDirectory=/home/red/.local/share/krita +ShowEraserOutlineWhilePainting=true +ShowOutlineWhilePainting=true +ShowRootLayer=false +SpecificColorSelector/HsxMode=0 +SpecificColorSelector/UseHsx=false +SpecificColorSelector/UsePercentage=false +ToolOptionsInDocker=true +TrimFramesImport=false +TrimKra=false +UseZip64=false +activateTransformToolAfterPaste=false +adaptivePlaybackRange=true +allowLCMSOptimization=true +amdDisableVectorWorkaround=false +animationCacheFrameSizeLimit=2500 +animationCacheRegionOfInterestMargin=0.25 +antialiascurves=true +assistantsDrawMode=0 +autoPinLayers=true +autosavefileshidden=true +backupfilelocation=0 +backupfilesuffix=~ +baseLength=60 +brushHudSettings=\n\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n\n +calculateAnimationCacheInBackground=true +canvasBorderColor=128,128,128 +canvasState=OPENGL_SUCCESS +canvasizedlg_heightunit=px +canvasizedlg_widthunit=px +canvasizedlg_xoffsetunit=px +canvasizedlg_yoffsetunit=px +checkerscolor=220,220,220 +checkerscolor2=255,255,255 +checksize=32 +colorDepthDef=U8 +colorModelDef=RGBA +colorProfileDef=sRGB-elle-V2-srgbtrc.icc +colorsettings/forcepalettecolors=false +compressLayersInKra=false +cumulativeUndoExcludeFromMerge=10 +cumulativeUndoMaxGroupDuration=5000 +cumulativeUndoMaxGroupSeparation=1000 +cumulativeUndoMergeTimeout=5000 +currentInputProfile=Krita Default +cursorMaincColor=128,255,128 +custom_font_size=-1 +custom_system_font= +defaultPalette=Default +defaultProofingAdaptationState=1 +defaultProofingBlackpointCompensation=true +defaultProofingGamutwarning=0,255,0 +defaultProofingProfileDepth=U8 +defaultProofingProfileIntent=3 +defaultProofingProfileModel=CMYKA +defaultProofingProfileName=Chemical proof +disableTouchOnCanvas=false +enableBrushSpeedLogging=false +enableOpenGLFramerateLogging=false +enablePerfLog=false +enableProgressReporting=true +eraserCursorMaincColor=128,255,128 +eraserCursorStyle=9 +eraserOutlineStyle=2 +filterdialog/geometry=\x01\xd9\xd0\xcb\x00\x03\x00\x00\x00\x00\x04\xdc\x00\x00\x02\xc5\x00\x00\x07\x0c\x00\x00\x04\xd8\x00\x00\x04\xde\x00\x00\x02\xdf\x00\x00\x07\n\x00\x00\x04\xd6\x00\x00\x00\x00\x00\x00\x00\x00\rp\x00\x00\x04\xde\x00\x00\x02\xdf\x00\x00\x07\n\x00\x00\x04\xd6 +filterdialog/rememberlastpreset=false +forceAlwaysFullSizedEraserOutline=false +forceAlwaysFullSizedOutline=false +forcedDpiForQtFontBugWorkaround=-1 +fpsLimit=100 +frameRenderingClones=16 +frameRenderingTimeout=30000 +fullscreenMode=false +globalSnapBoundingBox=false +globalSnapExtension=false +globalSnapImageBounds=true +globalSnapImageCenter=true +globalSnapIntersection=false +globalSnapNode=false +globalSnapOrthogonal=false +globalSnapToPixel=false +gridmaincolor=99,99,99 +gridmainstyle=0 +gridsubdivisioncolor=150,150,150 +gridsubdivisionstyle=1 +guidesColor=99,99,99 +guidesLineStyle=0 +hideDockersFullScreen=true +hideMenuFullScreen=true +hidePopups=false +hideScrollbars=false +hideScrollbarsFullScreen=true +hideStatusbarFullScreen=true +hideTitleBarFullscreen=true +hideToolbarFullscreen=true +imageHeightDef=3000 +imageResolutionDef=300 +imageWidthDef=3500 +imagesizedlg_imsizeunit=% +imagesizedlg_printSizeSeparatly=false +imagesizedlg_ratioLock=true +imagesizedlg_resunit=Pixels/Inch +imagesizedlg_sizeunit=in +internal_selector_active_color_set=Concept-cookie +internal_selector_active_color_set_md5=3abb5864db316fea8610808b4b638920 +levelOfDetailEnabled=false +logviewer_enabled=false +maxAllowedSpeedValue=30 +maxSwapSize=4096 +maximumBrushSize=1000 +mdiBackgroundColorXML=\n\n \n\n +mdiBackgroundImage= +mdi_rubberband=1 +mdi_viewmode=1 +memoryHardLimitPercent=50 +memoryPoolLimitPercent=0 +memorySoftLimitPercent=2 +monitorProfile=sRGB-elle-V2-srgbtrc.icc +monitorProfile/OverrideX11=false +monitorProfileHP Inc._OMEN 34c-_CNC4301LDG-=sRGB-elle-V2-srgbtrc.icc +moveToolChangedValueX=1972 +moveToolChangedValueY=1422 +moveToolUnit=0 +newCursorStyle=0 +newOutlineStyle=2 +numFavoritePresets=10 +numberOfOnionSkins=10 +numberofbackupfiles=1 +oninSkinTintColorForward=0,255,0 +onionSkinOpacity_-1=173 +onionSkinOpacity_-10=22 +onionSkinOpacity_-2=163 +onionSkinOpacity_-3=147 +onionSkinOpacity_-4=130 +onionSkinOpacity_-5=107 +onionSkinOpacity_-6=86 +onionSkinOpacity_-7=66 +onionSkinOpacity_-8=48 +onionSkinOpacity_-9=35 +onionSkinOpacity_0=178 +onionSkinOpacity_1=173 +onionSkinOpacity_10=22 +onionSkinOpacity_2=163 +onionSkinOpacity_3=147 +onionSkinOpacity_4=130 +onionSkinOpacity_5=107 +onionSkinOpacity_6=86 +onionSkinOpacity_7=66 +onionSkinOpacity_8=48 +onionSkinOpacity_9=35 +onionSkinState_-1=true +onionSkinState_-10=false +onionSkinState_-2=true +onionSkinState_-3=false +onionSkinState_-4=false +onionSkinState_-5=false +onionSkinState_-6=false +onionSkinState_-7=false +onionSkinState_-8=false +onionSkinState_-9=false +onionSkinState_0=true +onionSkinState_1=true +onionSkinState_10=false +onionSkinState_2=true +onionSkinState_3=false +onionSkinState_4=false +onionSkinState_5=false +onionSkinState_6=false +onionSkinState_7=false +onionSkinState_8=false +onionSkinState_9=false +onionSkinTintColorBackward=255,0,0 +onionSkinTintFactor=191 +pasteBehaviour=0 +pasteFormat=0 +pixelGridColor=255,255,255 +pixelGridDrawingThreshold=24 +popuppalette/selectorSize=140 +popuppalette/showColorHistory=true +popuppalette/showRotationTrack=true +popuppalette/size=385 +popuppalette/useDynamicSlotCount=true +popuppalette/usevisualcolorselector=false +presethistory=b) Basic-2 Opacity,a) Eraser Small,a) Eraser Circle,Odd,b) Basic-3 Flow,b) Basic-1,b) Airbrush Soft,k) Blender Smear,a) Eraser Soft,b) Basic-5 Size Opacity +renameMergedLayers=true +renamePastedLayers=true +renderIntent=0 +saveSessionOnQuit=false +scratchpadVisible=false +scrollingcheckers=false +selectionOutlineOpacity=1 +selectionOverlayMaskColor=255,0,0,128 +separateEraserCursor=false +sessionOnStartup=0 +showAdditionalOnionSkinsSettings=true +showBrushHud=false +showDockers=true +showFilterGallery=false +showOnCanvasMessages=true +showPaletteBottomBar=true +showSingleChannelAsColor=false +speedValueSmoothing=3 +swaplocation=/tmp +switchSelectionCtrlAlt=false +tabletPressureCurve=0,0.317269;1,1; +toolbarslider_1=opacity +toolbarslider_2=size +toolbarslider_3=flow +toolbarslider_4=flow +undoStackLimit=200 +useAnimationCacheFrameSizeLimit=true +useAnimationCacheRegionOfInterest=true +useBlackPointCompensation=true +useCreamyAlphaDarken=true +useCumulativeUndoRedo=false +useDefaultColorSpace=false +useOnDiskAnimationCacheSwapping=true +useOpenGLTextureBuffer=true +useRightMiddleTabletButtonWorkaround=false +useSubtractiveBlendingForCmykColorSpaces=true +useTimestampsForBrushSpeed=false +use_custom_system_font=false +zoomMarginSize=0 +zoomSteps=2 + +[File Dialogs] +Choose the resource library to import=/home/red/Downloads +DontUseNativeFileDialog=true +OpenDocument=/run/media/veracrypt1/sdb/sdb/Art/2025 06 +SaveAs=/run/media/veracrypt1/sdb/sdb/Art/2025 08 +krita_resources=/home/red/sh/UltimateMyPaintBundles_Fizzyflower/Classic_MyPaint/paintoppresets + +[GradientChooser] +global/itemSize=medium +global/itemSizeCustom=32 +global/viewMode=icon + +[KisAssistantTool] +AssistantType=perspective + +[KisResourceItemChooser_paintoppresets] +splitterState_1row=\x00\x00\x00\xff\x00\x00\x00\x01\x00\x00\x00\x02\xff\xff\xff\xff\xff\xff\xff\xff\x01\xff\xff\xff\xff\x01\x00\x00\x00\x01\x00 +splitterState_2row=\x00\x00\x00\xff\x00\x00\x00\x01\x00\x00\x00\x03\x00\x00\x01\x1a\x00\x00\x00/\xff\xff\xff\xff\x01\xff\xff\xff\xff\x01\x00\x00\x00\x01\x00 + +[KisShortcutsDialog Settings] +Dialog Size=600,480 + +[KisToolCrop] +allowGrow=true +decoration=1 +growCenter=false + +[KisToolPath] +outlineType=1 +patternTransformScale=100 + +[KisToolPolyline] +outlineType=1 +patternTransformScale=100 + +[KisToolSelectContiguous] +growSelection=0 +threshold=1 + +[KisToolSelectElliptical] +roundCornersX=0 +roundCornersY=0 + +[KisToolSelectRectangular] +roundCornersX=0 +roundCornersY=0 + +[KisToolSelectSimilar] +antiAliasSelection=false +threshold=11 + +[KisToolTransform] +filterId=NearestNeighbor +forceLodMode=true +useOverlayPreviewStyle=false + +[KritaFill/KisToolFill] +thresholdAmount=1 + +[KritaFill/KisToolGradient] +repeat=0 +reverse=true +shape=2 + +[KritaShape/KisToolEllipse] +outlineType=1 +patternTransformScale=100 +roundCornersX=0 +roundCornersY=0 + +[KritaTransform/KisToolMove] +forceLodMode=false + +[MainWindow] +3440x1440 screen: Height=1406 +3440x1440 screen: Width=1716 +3440x1440 screen: Window-Maximized=true +DP-2 Height 3440x1440 DP-2=1403 +DP-2 Width 3440x1440 DP-2=1142 +DP-2 Window-Maximized 3440x1440 DP-2=true +State=AAAA/wAAAAD9AAAABAAAAAAAAACjAAAFG/wCAAAABPsAAAAOAFQAbwBvAGwAQgBvAHgBAAAAPQAAAe0AAAAzAP////sAAAAqAHEAdQBpAGMAawBfAHMAZQB0AHQAaQBuAGcAcwBfAGQAbwBjAGsAZQByAQAAAjAAAAMoAAAAhAD////7AAAAJABGAGwAbwB3AFMAaABhAHAAZQBCAG8AeABEAG8AYwBrAGUAcgAAAANqAAAAxwAAAAAAAAAA+wAAACgARgBsAG8AdwBTAHQAZQBuAGMAaQBsAEIAbwB4AEQAbwBjAGsAZQByAAAAA30AAADHAAAAAAAAAAAAAAABAAABDQAABRv8AgAAAEX7AAAAGgBLAGkAcwBCAGkAcgBkAGUAeQBlAEIAbwB4AAAAAAD/////AAAAAAAAAAD7AAAAIABLAGkAcwBQAGEAbABlAHQAdABlAEQAbwBjAGsAZQByAAAAAAD/////AAAAAAAAAAD7AAAAGgBLAG8AQwBvAGwAbwByAEQAbwBjAGsAZQByAAAAAAD/////AAAAAAAAAAD7AAAAMABLAGkAcwBUAHIAaQBhAG4AZwBsAGUAQwBvAGwAbwByAFMAZQBsAGUAYwB0AG8AcgAAAAAA/////wAAAAAAAAAA+wAAACIAUwBoAGEAZABvAHcAIABQAHIAbwBwAGUAcgB0AGkAZQBzAAAAAAD/////AAAAAAAAAAD7AAAAIABTAGgAYQBwAGUAIABQAHIAbwBwAGUAcgB0AGkAZQBzAAAAAAD/////AAAAAAAAAAD7AAAAGgBTAGgAYQBwAGUAUwBlAGwAZQBjAHQAbwByAAAAAEgAAABEAAAAAAAAAAD7AAAAJABTAGkAbQBwAGwAZQAgAFQAZQB4AHQAIABFAGQAaQB0AG8AcgAAAAAA/////wAAAAAAAAAA/AAAAD0AAAE3AAAAjQEAAB36AAAAAAEAAAAH+wAAAB4AQwBvAGwAbwByAFMAZQBsAGUAYwB0AG8AcgBOAGcBAAAAAP////8AAABGAP////sAAAAgAHMAaABhAHIAZQBkAHQAbwBvAGwAZABvAGMAawBlAHIBAAAAAP////8AAABNAP////sAAAAcAE8AdgBlAHIAdgBpAGUAdwBEAG8AYwBrAGUAcgAAAAAA/////wAAAEYA////+wAAACoAUwBwAGUAYwBpAGYAaQBjAEMAbwBsAG8AcgBTAGUAbABlAGMAdABvAHIAAAAAAP////8AAABwAP////sAAAAWAEMAbwBsAG8AcgBTAGwAaQBkAGUAcgAAAAAA/////wAAAAAAAAAA+wAAABYASQBtAGEAZwBlAEQAbwBjAGsAZQByAAAAAAD/////AAAAAAAAAAD7AAAAKgBTAGgAYQBwAGUAQwBvAGwAbABlAGMAdABpAG8AbgBEAG8AYwBrAGUAcgAAAAZIAAABKAAAAAAAAAAA+wAAABoAUABhAGwAZQB0AHQAZQBEAG8AYwBrAGUAcgEAAAF6AAABGgAAAGoA////+wAAAEYASwByAGkAdABhAFMAaABhAHAAZQAvAEsAaQBzAFQAbwBvAGwARAB5AG4AYQBvAHAAdABpAG8AbgAgAHcAaQBkAGcAZQB0AQAAAFIAAAASAAAAAAAAAAD7AAAALABLAHIAaQB0AGEAUwBoAGEAcABlAC8ASwBpAHMAVABvAG8AbABMAGkAbgBlAQAAADwAAABpAAAAAAAAAAD7AAAAMgBLAHIAaQB0AGEAUwBoAGEAcABlAC8ASwBpAHMAVABvAG8AbABFAGwAbABpAHAAcwBlAQAAAJEAAAASAAAAAAAAAAD7AAAAHABLAGkAcwBUAG8AbwBsAFAAbwBsAHkAZwBvAG4BAAAApgAAABIAAAAAAAAAAPsAAAAeAEsAaQBzAFQAbwBvAGwAUABvAGwAeQBsAGkAbgBlAQAAALsAAAASAAAAAAAAAAD7AAAAFgBLAGkAcwBUAG8AbwBsAFMAdABhAHIBAAAA0AAAABMAAAAAAAAAAPsAAAAqAFMAbgBhAHAARwB1AGkAZABlAEMAbwBuAGYAaQBnAFcAaQBkAGcAZQB0AAAAAO8AAABxAAAAAAAAAAD7AAAAMgBLAGkAcwBUAG8AbwBsAEMAcgBvAHAAIABvAHAAdABpAG8AbgAgAHcAaQBkAGcAZQB0AQAAAPsAAAASAAAAAAAAAAD7AAAAUABLAHIAaQB0AGEAVAByAGEAbgBzAGYAbwByAG0ALwBLAGkAcwBUAG8AbwBsAE0AbwB2AGUAIABPAHAAdABpAG8AbgAgAFcAaQBkAGcAZQB0AQAAARAAAAASAAAAAAAAAAD7AAAAPABLAGkAcwBUAG8AbwBsAFQAcgBhAG4AcwBmAG8AcgBtACAAbwBwAHQAaQBvAG4AIAB3AGkAZABnAGUAdAEAAAA8AAAALwAAAAAAAAAA+wAAAE4ASwByAGkAdABhAFMAaABhAHAAZQAvAEsAaQBzAFQAbwBvAGwATQBlAGEAcwB1AHIAZQAgAG8AcAB0AGkAbwBuACAAdwBpAGQAZwBlAHQBAAAAPAAAAEIAAAAAAAAAAPsAAABcAEsAcgBpAHQAYQBTAGUAbABlAGMAdABlAGQALwBLAGkAcwBUAG8AbwBsAEMAbwBsAG8AcgBQAGkAYwBrAGUAcgAgAG8AcAB0AGkAbwBuACAAdwBpAGQAZwBlAHQBAAAAPAAAAP8AAAAAAAAAAPsAAABGAEsAaQBzAFIAdQBsAGUAcgBBAHMAcwBpAHMAdABhAG4AdABUAG8AbwBsACAATwBwAHQAaQBvAG4AIABXAGkAZABnAGUAdAEAAAA8AAAAEgAAAAAAAAAA+wAAAEgASwBpAHMAVABvAG8AbABQAGUAcgBzAHAAZQBjAHQAaQB2AGUARwByAGkAZAAgAE8AcAB0AGkAbwBuACAAVwBpAGQAZwBlAHQBAAABowAAABIAAAAAAAAAAPsAAAAyAEsAaQBzAFQAbwBvAGwARwByAGkAZAAgAE8AcAB0AGkAbwBuACAAVwBpAGQAZwBlAHQBAAABuAAAABMAAAAAAAAAAPsAAABMAEsAaQBzAFQAbwBvAGwAUwBlAGwAZQBjAHQAUgBlAGMAdABhAG4AZwB1AGwAYQByACAAbwBwAHQAaQBvAG4AIAB3AGkAZABnAGUAdAEAAAHOAAAAEgAAAAAAAAAA+wAAAEoASwBpAHMAVABvAG8AbABTAGUAbABlAGMAdABFAGwAbABpAHAAdABpAGMAYQBsACAAbwBwAHQAaQBvAG4AIAB3AGkAZABnAGUAdAEAAAHjAAAAEgAAAAAAAAAA+wAAAEgASwBpAHMAVABvAG8AbABTAGUAbABlAGMAdABQAG8AbAB5AGcAbwBuAGEAbAAgAG8AcAB0AGkAbwBuACAAdwBpAGQAZwBlAHQBAAAB+AAAABIAAAAAAAAAAPsAAABEAEsAaQBzAFQAbwBvAGwAUwBlAGwAZQBjAHQATwB1AHQAbABpAG4AZQAgAG8AcAB0AGkAbwBuACAAdwBpAGQAZwBlAHQBAAACDQAAABIAAAAAAAAAAPsAAABKAEsAaQBzAFQAbwBvAGwAUwBlAGwAZQBjAHQAQwBvAG4AdABpAGcAdQBvAHUAcwAgAG8AcAB0AGkAbwBuACAAdwBpAGQAZwBlAHQBAAACIgAAABIAAAAAAAAAAPsAAABEAEsAaQBzAFQAbwBvAGwAUwBlAGwAZQBjAHQAUwBpAG0AaQBsAGEAcgAgAG8AcAB0AGkAbwBuACAAdwBpAGQAZwBlAHQBAAACNwAAABIAAAAAAAAAAPwAAAG2AAAAWgAAAAAA////+gAAAAABAAAAAvsAAAAuAEsAbwBTAGgAYQBwAGUAQwBvAGwAbABlAGMAdABpAG8AbgBEAG8AYwBrAGUAcgEAAAAA/////wAAAAAAAAAA+wAAACQAUwBtAGEAbABsAEMAbwBsAG8AcgBTAGUAbABlAGMAdABvAHIAAAADbgAAAQQAAABGAP////wAAAKaAAABqQAAAMEA////+gAAAAABAAAAA/sAAAAWAEsAaQBzAEwAYQB5AGUAcgBCAG8AeAEAAAAA/////wAAAQIA////+wAAABoAQwBoAGEAbgBuAGUAbABEAG8AYwBrAGUAcgAAAAAA/////wAAAE8A////+wAAAC4ASwBpAHMAUABhAGkAbgB0AGUAcgBsAHkATQBpAHgAZQByAEQAbwBjAGsAZQByAAAAAAD/////AAAAAAAAAAD8AAAESQAAAQ8AAAA0AP////oAAAAAAQAAAAL7AAAAGABQAHIAZQBzAGUAdABEAG8AYwBrAGUAcgEAAAAA/////wAAAGYA////+wAAABoAUAByAGUAcwBlAHQASABpAHMAdABvAHIAeQAAAAj6AAABBgAAAE8A////+wAAAEgASwByAGkAdABhAFMAaABhAHAAZQAvAEsAaQBzAFQAbwBvAGwAQgByAHUAcwBoAG8AcAB0AGkAbwBuACAAdwBpAGQAZwBlAHQBAAAD3AAAAGgAAAAAAAAAAPsAAAAiAFMAdAByAG8AawBlACAAUAByAG8AcABlAHIAdABpAGUAcwAAAAAA/////wAAAAAAAAAA+wAAABYAUwB0AHkAbABlAEQAbwBjAGsAZQByAAAAAAD/////AAAAAAAAAAD7AAAAIABLAGkAcwBIAGkAcwB0AG8AZwByAGEAbQBEAG8AYwBrAAAAAAD/////AAAAAAAAAAD7AAAAEgBTAGMAcgBpAHAAdABpAG4AZwAAAAAA/////wAAAAAAAAAA+wAAADAARABlAGYAYQB1AGwAdABUAG8AbwBsAEEAcgByAGEAbgBnAGUAVwBpAGQAZwBlAHQAAAACvAAAAFIAAAAAAAAAAPsAAAAiAEQAZQBmAGEAdQBsAHQAVABvAG8AbABXAGkAZABnAGUAdAAAAAMRAAAAWwAAAAAAAAAA+wAAACQASwBpAHMASABpAHMAdABvAGcAcgBhAG0ARABvAGMAawBlAHIAAAACQgAAAHsAAAAAAAAAAPsAAAAYAEQAaQBnAGkAdABhAGwATQBpAHgAZQByAAAAAAD/////AAAAtgD////7AAAADgBIAGkAcwB0AG8AcgB5AAAAA5AAAAC0AAAAYAD////7AAAATgBLAHIAaQB0AGEARgBpAGwAbAAvAEsAaQBzAFQAbwBvAGwARwByAGEAZABpAGUAbgB0ACAAbwBwAHQAaQBvAG4AIAB3AGkAZABnAGUAdAAAAAQoAAAAHAAAAAAAAAAA+wAAAEYASwByAGkAdABhAEYAaQBsAGwALwBLAGkAcwBUAG8AbwBsAEYAaQBsAGwAIABvAHAAdABpAG8AbgAgAHcAaQBkAGcAZQB0AAAAA1AAAAAcAAAAAAAAAAD7AAAANgBLAHIAaQB0AGEAUwBoAGEAcABlAC8ASwBpAHMAVABvAG8AbABSAGUAYwB0AGEAbgBnAGwAZQAAAAMFAAAAZwAAAAAAAAAA+wAAACIAQwBvAG0AcABvAHMAaQB0AGkAbwBuAEQAbwBjAGsAZQByAAAAAAD/////AAAAfQD////7AAAAKgBBAHIAdABpAHMAdABpAGMAQwBvAGwAbwByAFMAZQBsAGUAYwB0AG8AcgAAAAAA/////wAAAHUA////+wAAABoAUABhAHQAdABlAHIAbgBEAG8AYwBrAGUAcgAAAALZAAABSQAAAR4ACAAQ+wAAABoAVABhAHMAawBzAGUAdABEAG8AYwBrAGUAcgAAAAAA/////wAAAIEA////+wAAACgAUwBuAGEAcABHAHUAaQBkAGUAIABQAHIAbwBwAGUAcgB0AGkAZQBzAAAAAAD/////AAAAAAAAAAD7AAAAOABUAGUAeAB0AEQAbwBjAHUAbQBlAG4AdABJAG4AcwBwAGUAYwB0AGkAbwBuAEQAbwBjAGsAZQByAgAABJoAAAIVAAABKgAAAK77AAAAEgBMAHUAdABEAG8AYwBrAGUAcgAAAAAA/////wAAAW0A////+wAAABQARwByAGkAZABEAG8AYwBrAGUAcgAAAAAA/////wAAASsA////+wAAAB4ASABpAHMAdABvAGcAcgBhAG0ARABvAGMAawBlAHIAAAAAAP////8AAABFAP////sAAAAqAEEAbgBpAG0AYQB0AGkAbwBuAEMAdQByAHYAZQBzAEQAbwBjAGsAZQByAAAAAAD/////AAAAcQD////7AAAAMgBTAHYAZwBTAHkAbQBiAG8AbABDAG8AbABsAGUAYwB0AGkAbwBuAEQAbwBjAGsAZQByAAAAAAD/////AAAAgQD////7AAAAFgBUAG8AdQBjAGgARABvAGMAawBlAHIAAAACTAAAATEAAAATAP////sAAAAaAEEAcgByAGEAbgBnAGUARABvAGMAawBlAHIAAAAAAP////8AAAA4AP////sAAAA6AGMAbwBtAGkAYwBzAF8AcAByAG8AagBlAGMAdABfAG0AYQBuAGEAZwBlAHIAXwBkAG8AYwBrAGUAcgAAAAAA/////wAAALkA////+wAAABYAUABhAGcAZQByAEQAbwBjAGsAZQByAAAAAAD/////AAAAAAAAAAD7AAAAJgBsAGEAcwB0AGQAbwBjAHUAbQBlAG4AdABzAGQAbwBjAGsAZQByAAAAAAD/////AAAAgQD////7AAAAEgBHAGEAbQB1AHQATQBhAHMAawAAAAAA/////wAAALYA////+wAAABAAUwBuAGEAcABzAGgAbwB0AAAAAt8AAACkAAAAgQD////7AAAAEgBMAG8AZwBEAG8AYwBrAGUAcgAAAAAA/////wAAAIMA////+wAAACAAUwB0AG8AcgB5AGIAbwBhAHIAZABEAG8AYwBrAGUAcgAAAAAA/////wAAAKMA////+wAAABwAUgBlAGMAbwByAGQAZQByAEQAbwBjAGsAZQByAAAAAAD/////AAAAYAD////7AAAALABXAGkAZABlAEcAYQBtAHUAdABDAG8AbABvAHIAUwBlAGwAZQBjAHQAbwByAAAAAAD/////AAAArwD///8AAAACAAAKAAAAALz8AQAAAAH7AAAAGgBUAG8AbwBsAEIAYQByAEQAbwBjAGsAZQByAAAAAAD/////AAAAAAAAAAAAAAADAAAGsgAAAOD8AQAAAAT7AAAAHABGAGwAaQBwAGIAbwBvAGsARABvAGMAawBlAHIAAAAAAP////8AAAAAAAAAAPsAAAAeAEEAbgBpAG0AYQB0AGkAbwBuAEQAbwBjAGsAZQByAAAAAAD/////AAAAAAAAAAD7AAAAIABPAG4AaQBvAG4AUwBrAGkAbgBzAEQAbwBjAGsAZQByAAAAAAD/////AAABogD////7AAAAHABUAGkAbQBlAGwAaQBuAGUARABvAGMAawBlAHIAAAAAAAAABrIAAANzAP///wAABPYAAAUbAAAABAAAAAQAAAAIAAAACPwAAAABAAAAAgAAAAMAAAAWAG0AYQBpAG4AVABvAG8AbABCAGEAcgEAAAAA/////wAAAAAAAAAAAAAAHgBCAHIAdQBzAGgAZQBzAEEAbgBkAFMAdAB1AGYAZgEAAABm/////wAAAAAAAAAAAAAAFgBlAGQAaQB0AFQAbwBvAGwAQgBhAHIAAAAAAP////8AAAAAAAAAAA== +ToolBarsMovable=Disabled +ko_geometry=AdnQywADAAAAAAa5AAAAIAAADWwAAAWcAAAABAAAACEAAA1rAAAFmwAAAAACAAAADXAAAAa6AAAAIQAADWsAAAWb + +[MainWindow][DockWidget AnimationCurvesDocker] +DockArea=2 +Locked=false +height=480 +width=640 +xPosition=0 +yPosition=0 + +[MainWindow][DockWidget ArrangeDocker] +DockArea=2 +Locked=false +height=264 +width=222 +xPosition=0 +yPosition=0 + +[MainWindow][DockWidget ArtisticColorSelector] +DockArea=2 +Locked=false +height=284 +width=334 +xPosition=0 +yPosition=0 + +[MainWindow][DockWidget ChannelDocker] +DockArea=2 +Locked=false +height=30 +width=100 +xPosition=0 +yPosition=0 + +[MainWindow][DockWidget ColorSelectorNg] +DockArea=2 +Locked=false +height=264 +width=269 +xPosition=0 +yPosition=17 + +[MainWindow][DockWidget CompositionDocker] +DockArea=2 +Locked=false +height=300 +width=400 +xPosition=0 +yPosition=0 + +[MainWindow][DockWidget DigitalMixer] +DockArea=2 +Locked=false +height=30 +width=100 +xPosition=0 +yPosition=0 + +[MainWindow][DockWidget GamutMask] +DockArea=2 +Locked=false +height=322 +width=363 +xPosition=0 +yPosition=0 + +[MainWindow][DockWidget GridDocker] +DockArea=2 +Locked=false +height=527 +width=258 +xPosition=0 +yPosition=0 + +[MainWindow][DockWidget HistogramDocker] +DockArea=2 +Locked=false +height=463 +width=640 +xPosition=0 +yPosition=17 + +[MainWindow][DockWidget History] +DockArea=2 +Locked=false +height=463 +width=640 +xPosition=0 +yPosition=17 + +[MainWindow][DockWidget KisLayerBox] +DockArea=2 +Locked=false +height=408 +width=269 +xPosition=0 +yPosition=17 + +[MainWindow][DockWidget LogDocker] +DockArea=2 +Locked=false +height=260 +width=400 +xPosition=0 +yPosition=0 + +[MainWindow][DockWidget LutDocker] +DockArea=2 +Locked=false +height=328 +width=357 +xPosition=0 +yPosition=0 + +[MainWindow][DockWidget OnionSkinsDocker] +DockArea=8 +Locked=false +height=282 +width=336 +xPosition=0 +yPosition=0 + +[MainWindow][DockWidget OverviewDocker] +DockArea=2 +Locked=false +height=109 +width=100 +xPosition=0 +yPosition=0 + +[MainWindow][DockWidget PaletteDocker] +DockArea=2 +Locked=false +height=265 +width=269 +xPosition=0 +yPosition=17 + +[MainWindow][DockWidget PatternDocker] +DockArea=2 +Locked=false +height=269 +width=155 +xPosition=0 +yPosition=0 + +[MainWindow][DockWidget PresetDocker] +DockArea=2 +Locked=true +height=254 +width=269 +xPosition=0 +yPosition=17 + +[MainWindow][DockWidget PresetHistory] +DockArea=2 +Locked=false +height=30 +width=100 +xPosition=0 +yPosition=0 + +[MainWindow][DockWidget RecorderDocker] +DockArea=2 +Locked=false +height=369 +width=277 +xPosition=0 +yPosition=0 + +[MainWindow][DockWidget SmallColorSelector] +DockArea=2 +Locked=false +height=463 +width=640 +xPosition=0 +yPosition=17 + +[MainWindow][DockWidget Snapshot] +DockArea=2 +Locked=false +height=30 +width=100 +xPosition=0 +yPosition=0 + +[MainWindow][DockWidget SpecificColorSelector] +DockArea=2 +Locked=false +height=207 +width=268 +xPosition=0 +yPosition=0 + +[MainWindow][DockWidget StoryboardDocker] +DockArea=2 +Locked=false +height=561 +width=604 +xPosition=0 +yPosition=0 + +[MainWindow][DockWidget SvgSymbolCollectionDocker] +DockArea=2 +Locked=false +height=463 +width=640 +xPosition=0 +yPosition=17 + +[MainWindow][DockWidget TasksetDocker] +DockArea=2 +Locked=false +height=300 +width=400 +xPosition=0 +yPosition=0 + +[MainWindow][DockWidget TimelineDocker] +DockArea=8 +Locked=false +height=50 +width=100 +xPosition=0 +yPosition=0 + +[MainWindow][DockWidget ToolBox] +DockArea=1 +Locked=false +height=474 +width=163 +xPosition=0 +yPosition=19 + +[MainWindow][DockWidget TouchDocker] +DockArea=2 +Locked=false +height=341 +width=116 +xPosition=0 +yPosition=0 + +[MainWindow][DockWidget WideGamutColorSelector] +DockArea=2 +Locked=false +height=480 +width=640 +xPosition=0 +yPosition=0 + +[MainWindow][DockWidget comics_project_manager_docker] +DockArea=2 +Locked=false +height=463 +width=640 +xPosition=0 +yPosition=17 + +[MainWindow][DockWidget lastdocumentsdocker] +DockArea=2 +Locked=false +height=463 +width=640 +xPosition=0 +yPosition=17 + +[MainWindow][DockWidget quick_settings_docker] +DockArea=1 +Locked=false +height=791 +width=163 +xPosition=0 +yPosition=17 + +[MainWindow][DockWidget sharedtooldocker] +DockArea=2 +Locked=false +height=463 +width=640 +xPosition=0 +yPosition=17 + +[OverviewDocker] +pinControls=true + +[RecentFiles] +File1[$e]=/run/media/veracrypt1/sdb/sdb/Art/2025 06/19 room.kra +File2[$e]=/run/media/veracrypt1/sdb/sdb/Art/2025 06/19 huh.kra +Name1=19 room.kra +Name2=19 huh.kra +maxRecentFileItems=100 + +[SelectedTags] +brushes=All +gamutmasks=All +gradients=All +paintoppresets=★ My Favorites +palettes=All +patterns=All +tasksets=All +windowlayouts=All +workspaces=All + +[SvgSymbolCollection] +currentCollection=0 + +[SvgTextTool] +Geometry=AdnQywADAAAAAAI+AAAA8AAACzUAAATLAAACQAAAAQoAAAszAAAEyQAAAAAAAAAADXAAAAJAAAABCgAACzMAAATJ +windowState=AAAA/wAAAAD9AAAAAAAACPQAAAMvAAAABAAAAAQAAAAIAAAACPwAAAADAAAAAgAAAAEAAAAWAG0AYQBpAG4AVABvAG8AbABCAGEAcgEAAAAA/////wAAAAAAAAAAAAAAAgAAAAEAAAAYAGYAbwBuAHQAUwBlAHQAdABpAG4AZwBzAQAAAAD/////AAAAAAAAAAAAAAACAAAAAQAAABQAZgBvAHIAbQBhAHQAdABpAG4AZwEAAAAA/////wAAAAAAAAAA + +[TemplateChooserDialog] +LastReturnType=Custom Document + +[advancedColorSelector] +customSelectorBackgroundColor=160,160,164 +gamma=2.2 +lumaG=0.7152 +lumaR=0.2126 +minimalShadeSelectorLineConfig=0|0.2|0|0|0|0|0;1|0|1|1|0|0|0;2|0|-1|1|0|0|0 +showColorSelector=true +useCustomColorForBackground=false + +[autocontrast_filter_bookmarks] +Last Used=\n\n + +[blur_filter_bookmarks] +Last Used=\n\n 42\n 42\n true\n 0\n 0\n 0\n\n + +[colorbalance_filter_bookmarks] +Last Used=\n\n 0\n 0\n 0\n 0\n 0\n 0\n true\n 0\n 0\n 0\n\n + +[crashprevention] +CreatingCanvas=false + +[filterdialog] +forceLodMode=true +showPreview=true + +[hsvadjustment_filter_bookmarks] +Last Used=\n\n false\n false\n 0\n 0\n 1\n -100\n\n + +[invert_filter_bookmarks] +Last Used=\n\n + +[krita] +ColorSpaceExtensionsPlugins=\\0 +ColorSpaceExtensionsPluginsDisabled= +ColorSpacePlugins=\\0 +ColorSpacePluginsDisabled= +DockerPlugins=,,,,,,,,,,,,,,,,,,,,,,,,,,, +DockerPluginsDisabled= +FlakePlugins=\\0 +FlakePluginsDisabled= +ShapePlugins=\\0 +ShapePluginsDisabled= +ToolPlugins=,,,,,,,,,,,,, +ToolPluginsDisabled= + +[theme] +Theme=Catppuccin Mocha Red + +[tool_color_sampler] +ColorSamplerDefaultActivation=\n\n false\n 100\n false\n 1\n true\n true\n true\n\n + +[unsharp_filter_bookmarks] +Last Used=\n\n 99.99\n 29.65\n true\n 0\n\n diff --git a/micro/bindings.json b/micro/bindings.json new file mode 100644 index 0000000..83659cb --- /dev/null +++ b/micro/bindings.json @@ -0,0 +1,4 @@ +{ + "Alt-/": "lua:comment.comment", + "CtrlUnderscore": "lua:comment.comment" +} diff --git a/micro/colorschemes/mocha.micro b/micro/colorschemes/mocha.micro new file mode 100644 index 0000000..74d8601 --- /dev/null +++ b/micro/colorschemes/mocha.micro @@ -0,0 +1,42 @@ +color-link default "#cdd6f4,#1e1e2e00" +color-link comment "#9399b2" + +color-link identifier "#89b4fa" +color-link identifier.class "#89b4fa" +color-link identifier.var "#89b4fa" + +color-link constant "#fab387" +color-link constant.number "#fab387" +color-link constant.string "#a6e3a1" + +color-link symbol "#f5c2e7" +color-link symbol.brackets "#f2cdcd" +color-link symbol.tag "#89b4fa" + +color-link type "#89b4fa" +color-link type.keyword "#f9e2af" + +color-link special "#f5c2e7" +color-link statement "#cba6f7" +color-link preproc "#f5c2e7" + +color-link underlined "#89dceb" +color-link error "bold #f38ba8" +color-link todo "bold #f9e2af" + +color-link diff-added "#a6e3a1" +color-link diff-modified "#f9e2af" +color-link diff-deleted "#f38ba8" + +color-link gutter-error "#f38ba8" +color-link gutter-warning "#f9e2af" + +color-link statusline "#cdd6f4,#181825" +color-link tabbar "#cdd6f4,#181825" +color-link indent-char "#45475a" +color-link line-number "#45475a" +color-link current-line-number "#b4befe" + +color-link cursor-line "#313244,#cdd6f4" +color-link color-column "#313244" +color-link type.extended "default" diff --git a/micro/settings.json b/micro/settings.json new file mode 100644 index 0000000..f6f5c3d --- /dev/null +++ b/micro/settings.json @@ -0,0 +1,3 @@ +{ + "colorscheme": "mocha" +} diff --git a/picom/picom.conf b/picom/picom.conf new file mode 100644 index 0000000..5103e90 --- /dev/null +++ b/picom/picom.conf @@ -0,0 +1,318 @@ +################################# +# Shadows # +################################# + +# Enabled client-side shadows on windows. Note desktop windows +# (windows with '_NET_WM_WINDOW_TYPE_DESKTOP') never get shadow, +# unless explicitly requested using the wintypes option. +# +# Can be set per-window using rules. +# +# Default: false +shadow = true; + +# The blur radius for shadows, in pixels. +# +# Default: 12 +shadow-radius = 7; + +# The opacity of shadows. +# +# Range: 0.0 - 1.0 +# Default: 0.75 +# shadow-opacity = .75 + +# The left offset for shadows, in pixels. +# +# Default: -15 +shadow-offset-x = -7; + +# The top offset for shadows, in pixels. +# +# Default: -15 +shadow-offset-y = -7; + +# Hex string color value of shadow. Formatted like "#RRGGBB", e.g. "#C0FFEE". +# +# Default: #000000 +# shadow-color = "#000000" + +# Crop shadow of a window fully on a particular monitor to that monitor. This is +# currently implemented using the X RandR extension. +# +# Default: false +# crop-shadow-to-monitor = false + +shadow-exclude = "class_g = 'firefox' && argb", + +################################# +# Fading # +################################# + +# Fade windows in/out when opening/closing and when opacity changes, +# unless no-fading-openclose is used. Can be set per-window using rules. +# +# Default: false +fading = true; + +# Opacity change between steps while fading in. (0.01 - 1.0, defaults to 0.028) +fade-in-step = 0.1; + +# Opacity change between steps while fading out. (0.01 - 1.0, defaults to 0.03) +fade-out-step = 0.1; + +# The time between steps in fade step, in milliseconds. (> 0, defaults to 10) +# fade-delta = 10 + +# Do not fade on window open/close. +# no-fading-openclose = false + +# Do not fade destroyed ARGB windows with WM frame. Workaround of bugs in Openbox, Fluxbox, etc. +# no-fading-destroyed-argb = false + + +################################# +# Transparency / Opacity # +################################# + +# Opacity of window titlebars and borders. +# +# Range: 0.1 - 1.0 +# Default: 1.0 (disabled) +frame-opacity = 0.9; + +# Use fixed inactive dim value, instead of adjusting according to window opacity. +# +# Default: false +# inactive-dim-fixed = true + +################################# +# Corners # +################################# + +# Sets the radius of rounded window corners. When > 0, the compositor will +# round the corners of windows. Does not interact well with +# `transparent-clipping`. +# +# Default: 0 (disabled) +corner-radius = 0 + +################################# +# Blur # +################################# + +# Parameters for background blurring, see BLUR section in the man page for more information. +# blur-method = +# blur-size = 12 +# +# blur-deviation = false +# +# blur-strength = 5 + +# Blur background of semi-transparent / ARGB windows. +# Can be set per-window using rules. +# +# Default: false +# blur-background = false + +# Blur background of windows when the window frame is not opaque. +# Implies: +# blur-background +# +# Default: false +# blur-background-frame = false + +# Use fixed blur strength rather than adjusting according to window opacity. +# +# Default: false +# blur-background-fixed = false + + +# Specify the blur convolution kernel, with the following format: +# example: +# blur-kern = "5,5,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1"; +# Can also be a pre-defined kernel, see the man page. +# +# Default: "" +blur-kern = "3x3box"; + +################################# +# General Settings # +################################# + +# Enable remote control via D-Bus. See the man page for more details. +# +# Default: false +# dbus = true + +# Daemonize process. Fork to background after initialization. Causes issues with certain (badly-written) drivers. +# daemon = false + +# Specify the backend to use: `xrender`, `glx`, or `egl`. +# +# Default: "xrender" +backend = "xrender" + +# Use higher precision during rendering, and apply dither when presenting the +# rendered screen. Reduces banding artifacts, but may cause performance +# degradation. Only works with OpenGL. +dithered-present = false; + +# Enable/disable VSync. +# +# Default: false +vsync = true; + +# Try to detect windows with rounded corners and don't consider them +# shaped windows. The accuracy is not very high, unfortunately. +# +# Has nothing to do with `corner-radius`. +# +# Default: false +detect-rounded-corners = true; + +# Detect '_NET_WM_WINDOW_OPACITY' on client windows, useful for window managers +# not passing '_NET_WM_WINDOW_OPACITY' of client windows to frame windows. +# +# Default: false +detect-client-opacity = true; + +# Use EWMH '_NET_ACTIVE_WINDOW' to determine currently focused window, +# rather than listening to 'FocusIn'/'FocusOut' event. May be more accurate, +# provided that the WM supports it. +# +# Default: false +# use-ewmh-active-win = false + +# Unredirect all windows if a full-screen opaque window is detected, +# to maximize performance for full-screen windows. Known to cause flickering +# when redirecting/unredirecting windows. +# +# Default: false +# unredir-if-possible = false + +# Delay before unredirecting the window, in milliseconds. +# +# Default: 0. +# unredir-if-possible-delay = 0 + +# Use 'WM_TRANSIENT_FOR' to group windows, and consider windows +# in the same group focused at the same time. +# +# Default: false +detect-transient = true; + +# Use 'WM_CLIENT_LEADER' to group windows, and consider windows in the same +# group focused at the same time. This usually means windows from the same application +# will be considered focused or unfocused at the same time. +# 'WM_TRANSIENT_FOR' has higher priority if detect-transient is enabled, too. +# +# Default: false +# detect-client-leader = false + +# Use of damage information for rendering. This cause the only the part of the +# screen that has actually changed to be redrawn, instead of the whole screen +# every time. Should improve performance. +# +# Default: false +use-damage = true; + +# Use X Sync fence to wait for the completion of rendering of other windows, +# before using their content to render the current screen. +# +# Required for explicit sync drivers, such as nvidia. +# +# Default: false +# xrender-sync-fence = false + +# GLX backend: Use specified GLSL fragment shader for rendering window +# contents. Read the man page for a detailed explanation of the interface. +# +# Can be set per-window using rules. +# +# window-shader-fg = "default" + +# Force all windows to be painted with blending. Useful if you +# have a `window-shader-fg` that could turn opaque pixels transparent. +# +# Default: false +# force-win-blend = false + +# Do not use EWMH to detect fullscreen windows. +# Reverts to checking if a window is fullscreen based only on its size and coordinates. +# +# Default: false +# no-ewmh-fullscreen = false + +# Dimming bright windows so their brightness doesn't exceed this set value. +# Brightness of a window is estimated by averaging all pixels in the window, +# so this could comes with a performance hit. +# Setting this to 1.0 disables this behaviour. Requires --use-damage to be disabled. +# +# Default: 1.0 (disabled) +# max-brightness = 1.0 + +# Make transparent windows clip other windows like non-transparent windows do, +# instead of blending on top of them. e.g. placing a transparent window on top +# of another window will cut a "hole" in that window, and show the desktop background +# underneath. +# +# Default: false +# transparent-clipping = false + +# Set the log level. Possible values are: +# "trace", "debug", "info", "warn", "error" +# in increasing level of importance. Case insensitive. +# If using the "TRACE" log level, it's better to log into a file +# using *--log-file*, since it can generate a huge stream of logs. +# +# Default: "warn" +# log-level = "warn"; + +# Set the log file. +# If *--log-file* is never specified, logs will be written to stderr. +# Otherwise, logs will to written to the given file, though some of the early +# logs might still be written to the stderr. +# When setting this option from the config file, it is recommended to use an absolute path. +# +# log-file = "/path/to/your/log/file" + +# Write process ID to a file. +# write-pid-path = "/path/to/your/log/file" + +# Rule-based per-window options. +# +# See WINDOW RULES section in the man page for how these work. +rules: ({ + match = "window_type = 'tooltip'"; + fade = false; + shadow = true; + opacity = 0.75; + full-shadow = false; +}, { + match = "window_type = 'dock' || " + "window_type = 'desktop' || " + "_GTK_FRAME_EXTENTS@"; + blur-background = false; +}, { + match = "window_type != 'dock'"; + # shader = "my_shader.frag"; +}, { + match = "window_type = 'dock' || " + "window_type = 'desktop'"; + corner-radius = 0; +}, { + match = "name = 'Notification' || " + "class_g = 'Conky' || " + "class_g ?= 'Notify-osd' || " + "class_g = 'Cairo-clock' || " + "_GTK_FRAME_EXTENTS@"; + shadow = false; +}) + +# `@include` directive can be used to include additional configuration files. +# Relative paths are search either in the parent of this configuration file +# (when the configuration is loaded through a symlink, the symlink will be +# resolved first). Or in `$XDG_CONFIG_HOME/picom/include`. +# +# @include "extra.conf" diff --git a/polybar/colors.ini b/polybar/colors.ini new file mode 100644 index 0000000..12cda81 --- /dev/null +++ b/polybar/colors.ini @@ -0,0 +1,29 @@ +;========================================================== +[colors] + rosewater = #f5e0dc + flamingo = #f2cdcd + pink = #f5c2e7 + mauve = #cba6f7 + red = #f38ba8 + maroon = #eba0ac + peach = #fab387 + yellow = #f9e2af + green = #a6e3a1 + teal = #94e2d5 + sky = #89dceb + sapphire = #74c7ec + blue = #89b4fa + lavender = #b4befe + text = #cdd6f4 + subtext1 = #bac2de + subtext0 = #a6adc8 + overlay2 = #9399b2 + overlay1 = #7f849c + overlay0 = #6c7086 + surface2 = #585b70 + surface1 = #45475a + surface0 = #313244 + base = #1e1e2e + mantle = #181825 + crust = #11111b + transparent = #FF00000 diff --git a/polybar/config.ini b/polybar/config.ini new file mode 100644 index 0000000..37da765 --- /dev/null +++ b/polybar/config.ini @@ -0,0 +1,44 @@ +; Importing files +include-file = ~/.config/polybar/modules.ini +include-file = ~/.config/polybar/colors.ini + +;========================================================== + +[bar/i3_bar] +width = 100% +height = 20pt +radius = 0 +dpi = 100 +background = ${colors.crust} +foreground = ${colors.text} +line-size = 3 +border-size = 1pt +border-color = ${colors.crust} +module-margin = 0 +padding-left=0pt +padding-right=0pt +separator ="" +separator-foreground = ${colors.red} +seperator-background = ${colors.red} + +font-0 = "FiraCode Nerd Font Mono condensed:size=11;2" +font-1 = Font Awesome 6 Free:pixelsize=12;2 +font-2 = Font Awesome 6 Free Solid:pixelsize=12;2 +font-3 = Font Awesome 6 Brands:pixelsize=12;2 +font-4 = "FiraCode Nerd Font Mono:size=18:weight=bold;3" + +; Language Fonts +font-5 = "Noto Sans Bengali:size=12:weight=bold;1" +font-6 = "Noto Sans JP:size=12:weight=bold;1" +font-7 = "Noto Sans Arabic:size=12:weight=bold;1" +#font-8 = "FiraCode Nerd Font Mono:size=12;2" +modules-left = rofi ss i3 ss xwindow +modules-right = ss upspeed downspeed ss numkey ss xkeyboard ss uptime ss battery ss filesystem ss cpu ss temp ss tempgpu ss memory ss pulseaudio ss time +cursor-click = pointer +;cursor-scroll = ns-resize +enable-ipc = true +tray-position = right +tray-padding= 2 +tray-background = #000 +wm-restack = i3 + diff --git a/polybar/i3_bar.sh b/polybar/i3_bar.sh new file mode 100755 index 0000000..1bc1ece --- /dev/null +++ b/polybar/i3_bar.sh @@ -0,0 +1,13 @@ +#!/usr/bin/env bash + +# Terminate already running bar instances +# If all your bars have ipc enabled, you can use +polybar-msg cmd quit +# Otherwise you can use the nuclear option: +# killall -q polybar + +# Launch bar1 and bar2 +echo "---" | tee -a /tmp/polybar1.log /tmp/polybar2.log +polybar i3_bar 2>&1 | tee -a /tmp/polybar1.log & disown + +echo "Bars launched..." diff --git a/polybar/modules.ini b/polybar/modules.ini new file mode 100644 index 0000000..156dcc2 --- /dev/null +++ b/polybar/modules.ini @@ -0,0 +1,197 @@ +;========================================================== +[module/rofi] +type=custom/text +content=":)" +content-padding=3 +content-foreground=#ff0000 +content-background=#ffff00 + +;========================================================== +[module/ss] +type=custom/text +content=" " +content-foreground=${colors.red} +content-background=${colors.crust} + +;========================================================== +[module/i3] +type = internal/i3 +enable-scroll = true +show-urgent = true +strip-wsnumbers = false +index-sort = true +enable-click = true +wrapping-scroll = false + +format = +label-mode = %mode% +label-mode-padding = 1 +label-mode-background = ${colors.transparent} +label-mode-foreground = ${colors.transparent} + +label-focused-foreground = ${colors.crust} +label-focused-background = ${colors.red} +label-focused-underline = ${colors.transparent} +label-focused-padding = 4 + +label-unfocused-foreground = ${colors.transparent} +label-unfocused-padding = 4 + +label-visible-underline = ${colors.transparent} +label-visible-padding = 4 + +label-urgent-foreground = ${colors.transparent} +label-urgent-underline = ${colors.transparent} +label-urgent-padding = 4 + +label-separator = " | " +label-separator-padding = 1 +label-separator-foreground = ${colors.transparent} + +;========================================================== +[module/xwindow] +type = internal/xwindow +format-prefix=| +format-margin=2 +format-prefix-foreground=${colors.text} + +label = %title:0:200:% +label-foreground = ${colors.text} +label-padding-left=4 +label-padding-right=4 + +;========================================================== +[module/time] +type = internal/date +interval = 1 +format-prefix = "  " +format-prefix-foreground=${colors.pink} +format-underline= ${colors.pink} + +date = %a %d %b %H:%M:%S +label =%date% +label-foreground = ${colors.pink} +label-padding-left=2 +label-padding-right=2 + +;========================================================== +[module/filesystem] +type = internal/fs +interval = 2 +mount-0 = / +format-mounted-prefix = "  " +format-mounted-prefix-foreground = ${colors.red} +format-mounted-underline=${colors.red} + +label-mounted = %free% +label-unmounted = %mountpoint% not mounted +label-mounted-foreground = ${colors.red} +label-mounted-padding-left=2 +label-mounted-padding-right=2 + +;========================================================== +[module/cpu] +type = internal/cpu +interval = 1 +format-prefix = "  " +format-prefix-foreground = ${colors.peac} +format-underline= ${colors.peach} + +label = %percentage%% +label-foreground = ${colors.peach} +label-padding-left=2 +label-padding-right=2 + +;========================================================== +[module/temp] +type = internal/temperature +interval = 2 +thermal-zone = 0 +hwmon-path = /sys/class/hwmon/hwmon1/temp1_input +base-temperature = 20 +warn-temperature = 70 +units = true + +format =