initial commit

1 files changed, 360 insertions, 0 deletions

diff --git a/gtk-3.0/_drawing.scss b/gtk-3.0/_drawing.scss
new file mode 100644
index 0000000..eda1f1f
--- /dev/null
+++ b/gtk-3.0/_drawing.scss
@@ -0,0 +1,360 @@
+// Drawing mixins
+
+// generic drawing of more complex things
+
+@mixin _shadows($shadow1, $shadow2:none, $shadow3:none, $shadow4:none) {
+//
+// Helper function to stack up to 4 box-shadows;
+//
+
+  @if $shadow4!=none { box-shadow: $shadow1, $shadow2, $shadow3, $shadow4; }
+  @else if $shadow3!=none { box-shadow: $shadow1, $shadow2, $shadow3; }
+  @else if $shadow2!=none { box-shadow: $shadow1, $shadow2; }
+  @else { box-shadow: $shadow1; }
+}
+
+// Entries
+
+@mixin entry($t) {
+//
+// Entries drawing function
+//
+// $t: entry type
+//
+
+  @if $t==normal {
+  //
+  // normal entry
+  //
+    color: $text_color;
+    border-color: $entry_border;
+    background-color: $entry_bg;
+    background-image: linear-gradient(to bottom, $entry_bg);
+  }
+
+  @if $t==focus {
+  //
+  // focused entry
+  //
+    color: $text_color;
+    border-color: $selected_bg_color;
+    background-color: $entry_bg;
+    background-image: linear-gradient(to bottom, $entry_bg);
+  }
+
+  @if $t==insensitive {
+  //
+  // insensitive entry
+  //
+    color: $insensitive_fg_color;
+    border-color: transparentize($entry_border, 0.45);
+    background-color: transparentize($entry_bg, 0.45);
+    background-image: linear-gradient(to bottom, transparentize($entry_bg, 0.45));
+  }
+
+  @if $t==header-normal {
+  //
+  // normal header-bar entry
+  //
+    color: $header_fg;
+    border-color: transparentize($header_fg, 0.7);
+    background-image: linear-gradient(to bottom, transparentize($base_color, 0.1));
+    background-color: transparent;
+
+    &.image, &.image:hover { color: inherit; }
+  }
+
+  @if $t==header-focus {
+  //
+  // focused header-bar entry
+  //
+    color: $selected_fg_color;
+    border-color: $selected_bg_color;
+    background-image: linear-gradient(to bottom, $selected_bg_color);
+  }
+
+  @if $t==header-insensitive {
+  //
+  // insensitive header-bar entry
+  //
+    color: transparentize($header_fg, 0.45);
+    background-image: linear-gradient(to bottom, transparentize($base_color, 0.45));
+  }
+
+  @if $t==osd {
+    color: $osd_text_color;
+    border-color: $osd_borders_color;
+    background-image: linear-gradient(to bottom, transparentize(opacify($osd_borders_color, 1), 0.5));
+    background-clip: padding-box;
+
+    text-shadow: 0 1px black;
+    icon-shadow: 0 1px black;
+  }
+
+  @if $t==osd-focus {
+    color: $osd_text_color;
+    border-color: $selected_bg_color;
+    background-image: linear-gradient(to bottom, transparentize(opacify($osd_borders_color, 1), 0.5));
+    background-clip: padding-box;
+
+    text-shadow: 0 1px black;
+    icon-shadow: 0 1px black;
+  }
+
+  @if $t==osd-insensitive {
+    color: $osd_insensitive_fg_color;
+    border-color: $osd_borders_color;
+    background-image: linear-gradient(to bottom, $osd_insensitive_bg_color);
+    background-clip: padding-box;
+
+    text-shadow: none;
+    icon-shadow: none;
+  }
+}
+
+// Buttons
+
+@mixin button($t) {
+//
+// Button drawing function
+//
+// $t:    button type,
+//
+
+  @if $t==normal {
+  //
+  // normal button
+  //
+    color: $fg_color;
+    outline-color: transparentize($fg_color, 0.7);
+    border-color: $button_border;
+    background-color: $button_bg;
+  }
+
+  @else if $t==hover {
+  //
+  // hovered button
+  //
+    color: $fg_color;
+    outline-color: transparentize($fg_color, 0.7);
+    border-color: $selected_bg_color;
+    background-color: $button_bg;
+  }
+
+  @else if $t==active {
+  //
+  // pushed button
+  //
+    color: $selected_fg_color;
+    outline-color: transparentize($selected_fg_color, 0.7);
+    border-color: $selected_bg_color;
+    background-color: $selected_bg_color;
+  }
+
+  @else if $t==insensitive {
+  //
+  // insensitive button
+  //
+    color: $insensitive_fg_color;
+    border-color: transparentize($button_border, 0.45);
+    background-color: transparentize($button_bg, 0.45);
+
+    > GtkLabel { color: inherit; }
+  }
+
+  @else if $t==insensitive-active {
+  //
+  // insensitive pushed button
+  //
+    color: transparentize($selected_fg_color, 0.45);
+    border-color: transparentize($selected_bg_color, 0.45);
+    background-color: transparentize($selected_bg_color, 0.45);
+
+    opacity: 0.6;
+
+    > GtkLabel { color: inherit; }
+  }
+
+  @if $t==header-normal {
+  //
+  // normal header-bar button
+  //
+    color: $header_fg;
+    outline-color: transparentize($header_fg, 0.7);
+    outline-offset: -3px;
+    background-color: transparentize($header_bg, 1);
+    border-color: transparentize($header_bg, 1);
+  }
+
+  @else if $t==header-hover {
+  //
+  // hovered header-bar button
+  //
+    color: $header_fg;
+    outline-color: transparentize($header_fg, 0.7);
+    border-color: transparentize($header_fg, 0.7);
+    background-color: transparentize($button_bg, 0.1);
+  }
+
+  @else if $t==header-active {
+  //
+  // pushed header-bar button
+  //
+    color: $selected_fg_color;
+    outline-color: transparentize($selected_fg_color, 0.7);
+    border-color: $selected_bg_color;
+    background-color: $selected_bg_color;
+  }
+
+  @else if $t==header-insensitive {
+  //
+  // insensitive header-bar button
+  //
+    color: transparentize($header_fg, 0.45);
+    background-color: transparentize($header_bg, 1);
+    border-color: transparentize($header_bg, 1);
+
+    > GtkLabel { color: inherit; }
+  }
+
+  @else if $t==header-insensitive-active {
+  //
+  // header-bar insensitive pushed button
+  //
+    color: transparentize($selected_fg_color, 0.45);
+    background-color: transparentize($header_bg, 1);
+    border-color: transparentize($header_bg, 1);
+  }
+
+  @else if $t==osd {
+  //
+  // normal osd button
+  //
+    color: $osd_fg_color;
+    outline-color: transparentize($osd_fg_color, 0.7);
+    border-color: transparentize($osd_fg_color, 0.7);
+    background-color: transparent;
+    background-image: linear-gradient(to bottom, darken($osd_bg_color, 5%));
+  }
+
+  @else if $t==osd-hover {
+  //
+  // active osd button
+  //
+    color: $selected_bg_color;
+    outline-color: transparentize($osd_fg_color, 0.7);
+    border-color: $selected_bg_color;
+    background-image: linear-gradient(to bottom, darken($osd_bg_color, 5%));
+  }
+
+  @else if $t==osd-active {
+  //
+  // active osd button
+  //
+    color: $selected_fg_color;
+    outline-color: transparentize($selected_fg_color, 0.7);
+    border-color: $selected_bg_color;
+    background-image: linear-gradient(to bottom, $selected_bg_color);
+  }
+
+  @else if $t==osd-insensitive {
+  //
+  // insensitive osd button
+  //
+    color: $osd_insensitive_fg_color;
+    border-color: transparentize($osd_fg_color, 0.8);
+    background-image: linear-gradient(to bottom, $osd_insensitive_bg_color);
+  }
+
+  @else if $t==undecorated {
+  //
+  // reset
+  //
+    border-color: transparent;
+    background-color: transparent;
+    background-image: none;
+  }
+}
+
+//
+// Overshoot
+//
+@mixin overshoot($p, $c:$selected_bg_color) {
+// $p: position
+// $c: base color
+//
+// possible $p values:
+// top, bottom, right, left
+//
+
+  $_big_gradient_length: 60%;
+
+  $_position: center top;
+  $_big_gradient_size: 100% $_big_gradient_length;
+
+  @if $p==bottom {
+    $_position: center bottom;
+  }
+
+  @else if $p==right {
+    $_position: right center;
+    $_big_gradient_size: $_big_gradient_length 100%;
+  }
+
+  @else if $p==left {
+    $_position: left center;
+    $_big_gradient_size: $_big_gradient_length 100%;
+  }
+
+  background-image: -gtk-gradient(radial,
+                                $_position, 0,
+                                $_position, 0.6,
+                                from(transparentize($c, 0.8)),
+                                to(transparentize($c, 1)));
+
+  background-size: $_big_gradient_size;
+  background-repeat: no-repeat;
+  background-position: $_position;
+
+  background-color: transparent; // reset some properties to be sure to not inherit them somehow
+  border: none;                  //
+  box-shadow: none;              //
+}
+
+//
+// Undershoot
+//
+@mixin undershoot($p) {
+// $p: position
+//
+// possible $p values:
+// top, bottom, right, left
+//
+
+  $_undershoot_color_dark: transparentize(black, 0.8);
+  $_undershoot_color_light: transparentize(white, 0.8);
+
+  $_gradient_dir: left;
+  $_dash_bg_size: 10px 1px;
+  $_gradient_repeat: repeat-x;
+  $_bg_pos: center $p;
+
+  background-color: transparent; // shouldn't be needed, but better to be sure;
+
+  @if ($p == left) or ($p == right) {
+    $_gradient_dir: top;
+    $_dash_bg_size: 1px 10px;
+    $_gradient_repeat: repeat-y;
+    $_bg_pos: $p center;
+  }
+
+  background-image: linear-gradient(to $_gradient_dir, // this is the dashed line
+                                    $_undershoot_color_light 50%,
+                                    $_undershoot_color_dark 50%);
+
+  padding-#{$p}: 1px;
+  background-size: $_dash_bg_size;
+  background-repeat: $_gradient_repeat;
+  background-origin: content-box;
+  background-position: $_bg_pos;
+}