Gtk-4: Add initial suppport to gtk v4

2025-12-13 23:39:51 +01:00 · 2021-12-05 13:56:24 -06:00
parent 028fe82356
commit 15064551dd
61 changed files with 20832 additions and 0 deletions
--- a/gtk-4.0/widgets/_granite.scss
+++ b/gtk-4.0/widgets/_granite.scss
@@ -0,0 +1,206 @@
+/************
+ * Popovers *
+ ************/
+
+GraniteWidgetsPopOver {
+
+  -GraniteWidgetsPopOver-arrow-width: 21;
+  -GraniteWidgetsPopOver-arrow-height: 10;
+  -GraniteWidgetsPopOver-border-radius: 8px;
+  -GraniteWidgetsPopOver-border-width: 0;
+  -GraniteWidgetsPopOver-shadow-size: 12;
+  
+  border: 1px solid $base_color;
+  background: $base_color;
+  color: $fg_color;
+
+  .button {
+    background-image: none;
+    background: none;
+    border: none;
+
+    &:active,
+    &:active:hover, {
+      color: $selected_bg_color;
+    }
+  }
+
+  > .frame {
+    border:none;
+  }
+
+  .sidebar.view {
+    border: none;
+    background: none;
+  }
+}
+
+GraniteWidgetsStaticNotebook .frame {
+  border: none;
+}
+
+.popover_bg {
+  background-color: $base_color;
+  background-image: none;
+  border: 1px solid $base_color;
+  color: $fg_color;
+}
+
+
+/***********
+ * Welcome *
+ **********/
+
+GraniteWidgetsWelcome {
+  background-color: $base_color;
+
+  GtkLabel {
+    color: $fg_color;
+  }
+
+  .h1,.h3 {
+    color: transparentize($fg_color, 0.2);
+  }
+}
+
+/**************
+* Source List *
+***************/
+
+.source-list {
+  -GtkTreeView-horizontal-separator: 1px;
+  -GtkTreeView-vertical-separator: 6px;
+
+  background-color: $bg_color;
+  border: solid $borders_color;
+  color: $fg_color;
+  border-right-width: 1px;
+
+  &:backdrop {}
+
+  .category-expander {
+    color: transparent;
+  }
+
+  .badge {
+    background-image: none;
+    background-color: transparentize(black, 0.6);
+    color: $bg_color;
+    border-radius: 10px;
+    padding: 0 6px;
+    margin: 0 3px;
+    border-width: 0;
+
+    &:selected:backdrop,
+    &:selected:hover:backdrop {
+      background-color: transparentize(black, 0.8);
+      color: darken($bg_color, 5%);
+    }
+  }
+
+  row,
+  .list-row {
+    border:none;
+    padding: 0;
+
+    > GtkLabel,
+    > label {
+      padding-left: 6px;
+      padding-right: 6px;
+    }
+  }
+}
+
+
+/**************
+* Text Styles *
+**************/
+
+.h1 {
+  font-size: 24px;
+}
+
+.h2 {
+  font-weight: 300;
+  font-size: 18px;
+}
+
+.h3 {
+  font-size: 11px;
+}
+
+.h4,
+.category-label {
+  font-size: 12px;
+  padding: 6px;
+  color: transparentize($fg_color, 0.7);
+  font-weight: bold;
+  text-shadow: 0 1px transparentize(white,0.8);
+}
+
+
+/**************
+* Storage Bar *
+**************/
+.storage-bar {
+
+  .trough {
+    border: none;
+    box-shadow:0 1px 0 0 $bottom_highlight;
+    background-image: none;
+    background-color: transparent;
+    padding: 8px 6px;
+  }
+
+  .fill-block {
+    background-color: $yellow;
+    border:none;
+    box-shadow: inset 0 1px 0 0 transparentize(black, 0.9), inset 0 -1px 0 0 transparentize(black, 0.9);
+
+    transition: all 200ms ease-in-out;
+
+    padding: 8px 6px;
+  
+    &:first-child {
+      border-top-left-radius: 4px;
+      border-bottom-left-radius: 4px;
+      border-left-width: 1px;
+      box-shadow: inset 0 1px 0 0 transparentize(black, 0.9),
+                  inset 1px 0 0 transparentize(black, 0.9),
+                  inset 0 -1px 0 0 transparentize(black, 0.9);
+    }
+    
+    &:last-child {
+      border-top-right-radius: 4px;
+      border-bottom-right-radius: 4px;
+      box-shadow: inset 0 1px 0 0 transparentize(black, 0.9),
+                  inset -1px 0 0 transparentize(black, 0.9),
+                  inset 0 -1px 0 0 transparentize(black, 0.9);
+    }
+
+    &.empty-block {
+      background-color: $base_color;
+    }
+    
+    &.app {
+      background-color: $blue;
+    }
+
+    &.audio {
+      background-color: $orange;
+    }
+
+    &.photo {
+      background-color: $red;
+    }
+
+    &.video {
+      background-color: $purple;
+    }
+
+    .legend {
+      padding: 12px;
+      border-radius: 4px;
+    }
+  }
+}