AuroraMiddleware/gtk
1
0
Fork 1
mirror of https://gitlab.gnome.org/GNOME/gtk.git synced 2024-09-30 02:57:38 +00:00
Code Issues Projects Releases Wiki Activity

Adwaita: added style for vertically linked entries

Browse Source
This commit is contained in:
Lapo Calamandrei 2014-10-04 20:23:10 +02:00
parent a03583d14f
commit 1f8b0852a4
4 changed files with 342 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

92
gtk/resources/theme/Adwaita/_common.scss
View File

@ -237,19 +237,23 @@ GtkTextView { // This will get overridden by .view, needed by gedit line numbers
.entry {
border: 1px solid;
padding: 5px 8px 6px;
&.image { // icons inside the entry
&.left { padding-left: 0; }
&.right { padding-right: 0; }
}
border-radius: 3px;
transition: all 200ms ease-out;
@include entry(normal);
&.flat, &.flat:focus {
padding: 2px;
@include entry(normal, $edge:none);
border: none;
border-radius: 0;
}
&:focus { @include entry(focus); }
&:insensitive { @include entry(insensitive); }
&:backdrop { @include entry(backdrop); }
@ -258,10 +262,12 @@ GtkTextView { // This will get overridden by .view, needed by gedit line numbers
background-color: $selected_bg_color;
color: $selected_fg_color;
}
&:selected,
&:selected:focus {
@extend %selected_items;
}
&.progressbar {
margin: 1px;
border-radius: 0;
@ -273,19 +279,22 @@ GtkTextView { // This will get overridden by .view, needed by gedit line numbers
box-shadow: none;
&:backdrop { background-color: transparent; }
}
.linked & { //FIXME: use same buttons linking logic and template
border-radius: 0;
&:first-child {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
&:dir(rtl) { border-right-style: none;}
}
&:last-child {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
border-left-style: none;
&:dir(rtl) { border-left-style: solid; }
}
}
&.error {
color: $error_color;
border-color: $error_color;
@ -298,6 +307,7 @@ GtkTextView { // This will get overridden by .view, needed by gedit line numbers
&:selected:backdrop { color: $backdrop_base_color; }
}
}
&.warning {
color: $warning_color;
border-color: $warning_color;
@ -310,12 +320,86 @@ GtkTextView { // This will get overridden by .view, needed by gedit line numbers
&:selected:backdrop { color: $backdrop_base_color; }
}
}
&.image { // entry icons colors
color: mix($fg_color,$base_color,80%);
&:hover { color: $fg_color; }
&:active { color: $selected_bg_color; }
&:backdrop { color: mix($backdrop_fg_color,$backdrop_base_color,80%); }
}
.linked.vertical & {
@include entry(normal, $edge: none);
background-image: linear-gradient(to bottom, $base_color);
border-bottom-color: mix($borders_color, $base_color, 30%);
box-shadow: none;
@extend %linked_vertical;
&:focus {
border-color: entry_focus_border($selected_bg_color);
box-shadow: entry_focus_glow($selected_bg_color),
0 -1px 0 0 entry_focus_border($selected_bg_color);
@extend %linked_vertical;
}
&:insensitive {
@include entry(insensitive, $edge: none);
border-bottom-color: mix($borders_color, $base_color, 30%);
@extend %linked_vertical;
&:backdrop {
@include entry(backdrop-insensitive, $edge: none);
border-bottom-color: mix($backdrop_borders_color, $backdrop_base_color, 30%);
@extend %linked_vertical;
}
}
&:backdrop {
@include entry(backdrop, $edge: none);
border-bottom-color: mix($backdrop_borders_color, $backdrop_base_color, 30%);
@extend %linked_vertical;
}
&:first-child {
@include entry(normal, $edge: none);
border-bottom-color: mix($borders_color, $base_color, 30%);
&:focus { @include entry(focus, $edge: none); }
&:insensitive {
@include entry(insensitive, $edge: none);
border-bottom-color: mix($backdrop_borders_color, $backdrop_base_color, 30%);
@extend %linked_vertical:first-child;
&:backdrop {
@include entry(backdrop-insensitive, $edge: none);
border-bottom-color: mix($backdrop_borders_color, $backdrop_base_color, 30%);
border-top-style: solid;
}
}
&:backdrop {
@include entry(backdrop, $edge: none);
border-bottom-color: mix($backdrop_borders_color, $backdrop_base_color, 30%);
@extend %linked_vertical:first-child;
}
}
&:last-child {
@include entry(normal);
background-image: linear-gradient(to bottom, $base_color);
box-shadow: _widget_edge();
&:focus {
border-color: entry_focus_border($selected_bg_color);
box-shadow: entry_focus_glow($selected_bg_color),
0 -1px 0 0 entry_focus_border($selected_bg_color),
_widget_edge();
@extend %linked_vertical;
}
&:insensitive {
@include entry(insensitive);
@extend %linked_vertical:last-child;
&:backdrop {
@include entry(backdrop-insensitive);
@extend %linked_vertical:last-child;
}
}
&:backdrop {
@include entry(backdrop);
@extend %linked_vertical:last-child;
}
}
}
}
/***********

25
gtk/resources/theme/Adwaita/_drawing.scss
View File

@ -19,6 +19,17 @@
// entries
@function entry_focus_border($fc) {
@if $variant == 'light' { @return $fc; }
@else { @return if($fc==$selected_bg_color, $selected_borders_color, darken($fc,35%)); }
}
@function entry_focus_glow($fc) {
$_focus_glow_color: if($variant=='light', transparentize($fc,0.85),
transparentize($fc,0.3));
@return inset 0 0 0 1px $_focus_glow_color;
}
@function entry_gradient($c) {
@return linear-gradient(to bottom, darken($c,3%), $c 90%);
}
@ -48,26 +59,18 @@
$_blank_inner_shadows: inset 0 3px transparentize(black, 1),
inset 0 2px transparentize(black, 1),
inset 0 1px transparentize(black, 1);
$_focus_glow_color: if($variant=='light', transparentize($fc,0.85),
transparentize($fc,0.3));
@if $t==normal {
border-color: $borders_color;
@include _shadows($_inner_shadows,
inset 0 0 0 1px transparentize($fc,1),
entry_focus_glow(transparentize($fc,1)),
$_entry_edge);
// the second transparent shadow is needed for the transition to work
}
@if $t==focus {
@include _shadows($_inner_shadows,
inset 0 0 0 1px $_focus_glow_color,
entry_focus_glow($fc),
$_entry_edge);
@if $variant == 'light' { border-color: $fc; }
@else {
border-color: if($fc==$selected_bg_color,
$selected_borders_color,
darken($fc,35%));
}
border-color: entry_focus_border($fc);
}
@if $t==insensitive {
color: $insensitive_fg_color;

138
gtk/resources/theme/Adwaita/gtk-contained-dark.css
View File

@ -227,17 +227,19 @@ GtkTextView {
box-shadow: none; }
.entry.progressbar:backdrop {
background-color: transparent; }
.linked .entry:first-child {
border-top-right-radius: 0;
border-bottom-right-radius: 0; }
.linked .entry:first-child:dir(rtl) {
border-right-style: none; }
.linked .entry:last-child {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
border-left-style: none; }
.linked .entry:last-child:dir(rtl) {
border-left-style: solid; }
.linked .entry {
border-radius: 0; }
.linked .entry:first-child {
border-top-left-radius: 3px;
border-bottom-left-radius: 3px; }
.linked .entry:first-child:dir(rtl) {
border-right-style: none; }
.linked .entry:last-child {
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
border-left-style: none; }
.linked .entry:last-child:dir(rtl) {
border-left-style: solid; }
.entry.error {
color: #cc0000;
border-color: #cc0000; }
@ -274,6 +276,108 @@ GtkTextView {
color: #215d9c; }
.entry.image:backdrop {
color: #a9aba9; }
.linked.vertical .entry {
background-color: transparent;
background-image: linear-gradient(to bottom, #212121, #292929 90%);
border-color: #1c1f1f;
box-shadow: inset 0 3px rgba(0, 0, 0, 0.02), inset 0 2px rgba(0, 0, 0, 0.03), inset 0 1px rgba(0, 0, 0, 0.08), inset 0 0 0 1px rgba(33, 93, 156, 0);
background-image: linear-gradient(to bottom, #292929);
border-bottom-color: #252626;
box-shadow: none; }
.linked.vertical .entry:focus {
border-color: #0f2b48;
box-shadow: inset 0 0 0 1px rgba(33, 93, 156, 0.7), 0 -1px 0 0 #0f2b48; }
.linked.vertical .entry:insensitive {
background-color: transparent;
background-image: linear-gradient(to bottom, #212121, #292929 90%);
color: #939695;
border-color: #1c1f1f;
background-image: linear-gradient(to bottom, #323636);
box-shadow: inset 0 3px transparent, inset 0 2px transparent, inset 0 1px transparent;
border-bottom-color: #252626; }
.linked.vertical .entry:insensitive:backdrop {
background-color: transparent;
background-image: linear-gradient(to bottom, #212121, #292929 90%);
color: #5d6767;
border-color: #1e2222;
background-image: linear-gradient(to bottom, #323636);
box-shadow: inset 0 3px transparent, inset 0 2px transparent, inset 0 1px transparent;
border-bottom-color: #272929; }
.linked.vertical .entry:backdrop {
background-color: transparent;
background-image: linear-gradient(to bottom, #212121, #292929 90%);
color: #c9cbc9;
border-color: #1e2222;
background-image: linear-gradient(to bottom, #2c2c2c);
box-shadow: inset 0 3px transparent, inset 0 2px transparent, inset 0 1px transparent;
border-bottom-color: #272929; }
.linked.vertical .entry:first-child {
background-color: transparent;
background-image: linear-gradient(to bottom, #212121, #292929 90%);
border-color: #1c1f1f;
box-shadow: inset 0 3px rgba(0, 0, 0, 0.02), inset 0 2px rgba(0, 0, 0, 0.03), inset 0 1px rgba(0, 0, 0, 0.08), inset 0 0 0 1px rgba(33, 93, 156, 0);
border-bottom-color: #252626; }
.linked.vertical .entry:first-child:focus {
background-color: transparent;
background-image: linear-gradient(to bottom, #212121, #292929 90%);
box-shadow: inset 0 3px rgba(0, 0, 0, 0.02), inset 0 2px rgba(0, 0, 0, 0.03), inset 0 1px rgba(0, 0, 0, 0.08), inset 0 0 0 1px rgba(33, 93, 156, 0.7);
border-color: #0f2b48; }
.linked.vertical .entry:first-child:insensitive {
background-color: transparent;
background-image: linear-gradient(to bottom, #212121, #292929 90%);
color: #939695;
border-color: #1c1f1f;
background-image: linear-gradient(to bottom, #323636);
box-shadow: inset 0 3px transparent, inset 0 2px transparent, inset 0 1px transparent;
border-bottom-color: #272929; }
.linked.vertical .entry:first-child:insensitive:backdrop {
background-color: transparent;
background-image: linear-gradient(to bottom, #212121, #292929 90%);
color: #5d6767;
border-color: #1e2222;
background-image: linear-gradient(to bottom, #323636);
box-shadow: inset 0 3px transparent, inset 0 2px transparent, inset 0 1px transparent;
border-bottom-color: #272929;
border-top-style: solid; }
.linked.vertical .entry:first-child:backdrop {
background-color: transparent;
background-image: linear-gradient(to bottom, #212121, #292929 90%);
color: #c9cbc9;
border-color: #1e2222;
background-image: linear-gradient(to bottom, #2c2c2c);
box-shadow: inset 0 3px transparent, inset 0 2px transparent, inset 0 1px transparent;
border-bottom-color: #272929; }
.linked.vertical .entry:last-child {
background-color: transparent;
background-image: linear-gradient(to bottom, #212121, #292929 90%);
border-color: #1c1f1f;
box-shadow: inset 0 3px rgba(0, 0, 0, 0.02), inset 0 2px rgba(0, 0, 0, 0.03), inset 0 1px rgba(0, 0, 0, 0.08), inset 0 0 0 1px rgba(33, 93, 156, 0), 0 1px rgba(238, 238, 236, 0.1);
background-image: linear-gradient(to bottom, #292929);
box-shadow: 0 1px rgba(238, 238, 236, 0.1); }
.linked.vertical .entry:last-child:focus {
border-color: #0f2b48;
box-shadow: inset 0 0 0 1px rgba(33, 93, 156, 0.7), 0 -1px 0 0 #0f2b48, 0 1px rgba(238, 238, 236, 0.1); }
.linked.vertical .entry:last-child:insensitive {
background-color: transparent;
background-image: linear-gradient(to bottom, #212121, #292929 90%);
color: #939695;
border-color: #1c1f1f;
background-image: linear-gradient(to bottom, #323636);
box-shadow: inset 0 3px transparent, inset 0 2px transparent, inset 0 1px transparent, 0 1px rgba(238, 238, 236, 0.1); }
.linked.vertical .entry:last-child:insensitive:backdrop {
background-color: transparent;
background-image: linear-gradient(to bottom, #212121, #292929 90%);
color: #5d6767;
border-color: #1e2222;
background-image: linear-gradient(to bottom, #323636);
box-shadow: inset 0 3px transparent, inset 0 2px transparent, inset 0 1px transparent, 0 1px rgba(238, 238, 236, 0); }
.linked.vertical .entry:last-child:backdrop {
background-color: transparent;
background-image: linear-gradient(to bottom, #212121, #292929 90%);
color: #c9cbc9;
border-color: #1e2222;
background-image: linear-gradient(to bottom, #2c2c2c);
box-shadow: inset 0 3px transparent, inset 0 2px transparent, inset 0 1px transparent, 0 1px rgba(238, 238, 236, 0); }
/***********
* Buttons *
@ -1088,15 +1192,15 @@ GtkCalendar.header .inline-toolbar GtkToolButton:backdrop:only-child > .button.t
border-radius: 3px;
border-style: solid; }
.linked.vertical .button, .linked.vertical .button:hover, .linked.vertical .button:active, .linked.vertical .button:checked, .linked.vertical .button:backdrop {
.linked.vertical .entry, .linked.vertical .entry:focus, .linked.vertical .entry:insensitive, .linked.vertical .entry:insensitive:backdrop, .linked.vertical .entry:backdrop, .linked.vertical .entry:last-child:focus, .linked.vertical .button, .linked.vertical .button:hover, .linked.vertical .button:active, .linked.vertical .button:checked, .linked.vertical .button:backdrop {
border-left-style: solid;
border-top-style: none; }
.linked.vertical .button:first-child {
.linked.vertical .entry:first-child, .linked.vertical .entry:first-child:last-child:focus, .linked.vertical .button:first-child {
border-style: solid;
border-radius: 3px 3px 0 0; }
.linked.vertical .button:last-child {
.linked.vertical .entry:last-child, .linked.vertical .button:last-child {
border-radius: 0 0 3px 3px; }
.linked.vertical .button:only-child {
.linked.vertical .entry:only-child, .linked.vertical .entry:only-child:last-child:focus, .linked.vertical .button:only-child {
border-radius: 3px;
border-style: solid; }
@ -4181,10 +4285,6 @@ GtkCalendar.header .menuitem.titlebutton.button:selected, .list-row:selected {
.context-menu {
font: initial; }
/* Decouple the font of context menus from their entry/textview */
.context-menu {
font: initial; }
/* GTK NAMED COLORS */
@define-color theme_fg_color #eeeeec;
@define-color theme_bg_color #393f3f;

138
gtk/resources/theme/Adwaita/gtk-contained.css
View File

@ -227,17 +227,19 @@ GtkTextView {
box-shadow: none; }
.entry.progressbar:backdrop {
background-color: transparent; }
.linked .entry:first-child {
border-top-right-radius: 0;
border-bottom-right-radius: 0; }
.linked .entry:first-child:dir(rtl) {
border-right-style: none; }
.linked .entry:last-child {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
border-left-style: none; }
.linked .entry:last-child:dir(rtl) {
border-left-style: solid; }
.linked .entry {
border-radius: 0; }
.linked .entry:first-child {
border-top-left-radius: 3px;
border-bottom-left-radius: 3px; }
.linked .entry:first-child:dir(rtl) {
border-right-style: none; }
.linked .entry:last-child {
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
border-left-style: none; }
.linked .entry:last-child:dir(rtl) {
border-left-style: solid; }
.entry.error {
color: #cc0000;
border-color: #cc0000; }
@ -266,6 +268,108 @@ GtkTextView {
color: #4a90d9; }
.entry.image:backdrop {
color: #75797a; }
.linked.vertical .entry {
background-color: transparent;
background-image: linear-gradient(to bottom, #f7f7f7, #ffffff 90%);
border-color: #a1a1a1;
box-shadow: inset 0 3px rgba(0, 0, 0, 0.02), inset 0 2px rgba(0, 0, 0, 0.03), inset 0 1px rgba(0, 0, 0, 0.08), inset 0 0 0 1px rgba(74, 144, 217, 0);
background-image: linear-gradient(to bottom, #ffffff);
border-bottom-color: #e2e2e2;
box-shadow: none; }
.linked.vertical .entry:focus {
border-color: #4a90d9;
box-shadow: inset 0 0 0 1px rgba(74, 144, 217, 0.15), 0 -1px 0 0 #4a90d9; }
.linked.vertical .entry:insensitive {
background-color: transparent;
background-image: linear-gradient(to bottom, #f7f7f7, #ffffff 90%);
color: #8d9091;
border-color: #a1a1a1;
background-image: linear-gradient(to bottom, #f4f4f4);
box-shadow: inset 0 3px transparent, inset 0 2px transparent, inset 0 1px transparent;
border-bottom-color: #e2e2e2; }
.linked.vertical .entry:insensitive:backdrop {
background-color: transparent;
background-image: linear-gradient(to bottom, #f7f7f7, #ffffff 90%);
color: #c7c7c7;
border-color: #a8a8a8;
background-image: linear-gradient(to bottom, #f4f4f4);
box-shadow: inset 0 3px transparent, inset 0 2px transparent, inset 0 1px transparent;
border-bottom-color: #e2e2e2; }
.linked.vertical .entry:backdrop {
background-color: transparent;
background-image: linear-gradient(to bottom, #f7f7f7, #ffffff 90%);
color: #54595a;
border-color: #a8a8a8;
background-image: linear-gradient(to bottom, #fcfcfc);
box-shadow: inset 0 3px transparent, inset 0 2px transparent, inset 0 1px transparent;
border-bottom-color: #e2e2e2; }
.linked.vertical .entry:first-child {
background-color: transparent;
background-image: linear-gradient(to bottom, #f7f7f7, #ffffff 90%);
border-color: #a1a1a1;
box-shadow: inset 0 3px rgba(0, 0, 0, 0.02), inset 0 2px rgba(0, 0, 0, 0.03), inset 0 1px rgba(0, 0, 0, 0.08), inset 0 0 0 1px rgba(74, 144, 217, 0);
border-bottom-color: #e2e2e2; }
.linked.vertical .entry:first-child:focus {
background-color: transparent;
background-image: linear-gradient(to bottom, #f7f7f7, #ffffff 90%);
box-shadow: inset 0 3px rgba(0, 0, 0, 0.02), inset 0 2px rgba(0, 0, 0, 0.03), inset 0 1px rgba(0, 0, 0, 0.08), inset 0 0 0 1px rgba(74, 144, 217, 0.15);
border-color: #4a90d9; }
.linked.vertical .entry:first-child:insensitive {
background-color: transparent;
background-image: linear-gradient(to bottom, #f7f7f7, #ffffff 90%);
color: #8d9091;
border-color: #a1a1a1;
background-image: linear-gradient(to bottom, #f4f4f4);
box-shadow: inset 0 3px transparent, inset 0 2px transparent, inset 0 1px transparent;
border-bottom-color: #e2e2e2; }
.linked.vertical .entry:first-child:insensitive:backdrop {
background-color: transparent;
background-image: linear-gradient(to bottom, #f7f7f7, #ffffff 90%);
color: #c7c7c7;
border-color: #a8a8a8;
background-image: linear-gradient(to bottom, #f4f4f4);
box-shadow: inset 0 3px transparent, inset 0 2px transparent, inset 0 1px transparent;
border-bottom-color: #e2e2e2;
border-top-style: solid; }
.linked.vertical .entry:first-child:backdrop {
background-color: transparent;
background-image: linear-gradient(to bottom, #f7f7f7, #ffffff 90%);
color: #54595a;
border-color: #a8a8a8;
background-image: linear-gradient(to bottom, #fcfcfc);
box-shadow: inset 0 3px transparent, inset 0 2px transparent, inset 0 1px transparent;
border-bottom-color: #e2e2e2; }
.linked.vertical .entry:last-child {
background-color: transparent;
background-image: linear-gradient(to bottom, #f7f7f7, #ffffff 90%);
border-color: #a1a1a1;
box-shadow: inset 0 3px rgba(0, 0, 0, 0.02), inset 0 2px rgba(0, 0, 0, 0.03), inset 0 1px rgba(0, 0, 0, 0.08), inset 0 0 0 1px rgba(74, 144, 217, 0), 0 1px white;
background-image: linear-gradient(to bottom, #ffffff);
box-shadow: 0 1px white; }
.linked.vertical .entry:last-child:focus {
border-color: #4a90d9;
box-shadow: inset 0 0 0 1px rgba(74, 144, 217, 0.15), 0 -1px 0 0 #4a90d9, 0 1px white; }
.linked.vertical .entry:last-child:insensitive {
background-color: transparent;
background-image: linear-gradient(to bottom, #f7f7f7, #ffffff 90%);
color: #8d9091;
border-color: #a1a1a1;
background-image: linear-gradient(to bottom, #f4f4f4);
box-shadow: inset 0 3px transparent, inset 0 2px transparent, inset 0 1px transparent, 0 1px white; }
.linked.vertical .entry:last-child:insensitive:backdrop {
background-color: transparent;
background-image: linear-gradient(to bottom, #f7f7f7, #ffffff 90%);
color: #c7c7c7;
border-color: #a8a8a8;
background-image: linear-gradient(to bottom, #f4f4f4);
box-shadow: inset 0 3px transparent, inset 0 2px transparent, inset 0 1px transparent, 0 1px rgba(255, 255, 255, 0); }
.linked.vertical .entry:last-child:backdrop {
background-color: transparent;
background-image: linear-gradient(to bottom, #f7f7f7, #ffffff 90%);
color: #54595a;
border-color: #a8a8a8;
background-image: linear-gradient(to bottom, #fcfcfc);
box-shadow: inset 0 3px transparent, inset 0 2px transparent, inset 0 1px transparent, 0 1px rgba(255, 255, 255, 0); }
/***********
* Buttons *
@ -1080,15 +1184,15 @@ GtkCalendar.header .inline-toolbar GtkToolButton:backdrop:only-child > .button.t
border-radius: 3px;
border-style: solid; }
.linked.vertical .button, .linked.vertical .button:hover, .linked.vertical .button:active, .linked.vertical .button:checked, .linked.vertical .button:backdrop {
.linked.vertical .entry, .linked.vertical .entry:focus, .linked.vertical .entry:insensitive, .linked.vertical .entry:insensitive:backdrop, .linked.vertical .entry:backdrop, .linked.vertical .entry:last-child:focus, .linked.vertical .button, .linked.vertical .button:hover, .linked.vertical .button:active, .linked.vertical .button:checked, .linked.vertical .button:backdrop {
border-left-style: solid;
border-top-style: none; }
.linked.vertical .button:first-child {
.linked.vertical .entry:first-child, .linked.vertical .entry:first-child:last-child:focus, .linked.vertical .button:first-child {
border-style: solid;
border-radius: 3px 3px 0 0; }
.linked.vertical .button:last-child {
.linked.vertical .entry:last-child, .linked.vertical .button:last-child {
border-radius: 0 0 3px 3px; }
.linked.vertical .button:only-child {
.linked.vertical .entry:only-child, .linked.vertical .entry:only-child:last-child:focus, .linked.vertical .button:only-child {
border-radius: 3px;
border-style: solid; }
@ -4343,10 +4447,6 @@ GtkCalendar.header .menuitem.titlebutton.button:selected, .list-row:selected {
.context-menu {
font: initial; }
/* Decouple the font of context menus from their entry/textview */
.context-menu {
font: initial; }
/* GTK NAMED COLORS */
@define-color theme_fg_color #2e3436;
@define-color theme_bg_color #ededed;