[epiphany/wip/exalm/pinned: 2/2] Improve pinned tab styling

[Michael Catanzaro <mcatanzaro src gnome org>]

commit d7552468f8e7909622a610429d3f21b65beafdde
Author: Alexander Mikhaylenko <exalm7659 gmail com>
Date:   Thu Apr 4 23:29:00 2019 +0500

    Improve pinned tab styling

 src/ephy-notebook.c                     |  2 ++
 src/resources/themes/Adwaita-dark.css   | 16 ++++++++++++
 src/resources/themes/Adwaita.css        | 16 ++++++++++++
 src/resources/themes/_Adwaita-base.scss | 45 +++++++++++++++++++++++++++++++++
 4 files changed, 79 insertions(+)
---
diff --git a/src/ephy-notebook.c b/src/ephy-notebook.c
index 78c1c846d..c612f7eb4 100644
--- a/src/ephy-notebook.c
+++ b/src/ephy-notebook.c
@@ -536,6 +536,8 @@ ephy_notebook_init (EphyNotebook *notebook)
   g_signal_connect (EPHY_SETTINGS_UI,
                     "changed::" EPHY_PREFS_UI_TABS_BAR_VISIBILITY_POLICY,
                     G_CALLBACK (show_tabs_changed_cb), notebook);
+
+  gtk_style_context_add_class (gtk_widget_get_style_context (widget), "main-notebook");
 }
 
 static void
diff --git a/src/resources/themes/Adwaita-dark.css b/src/resources/themes/Adwaita-dark.css
index a60601c63..02ee94e22 100644
--- a/src/resources/themes/Adwaita-dark.css
+++ b/src/resources/themes/Adwaita-dark.css
@@ -223,3 +223,19 @@ row.narrow .page-row-close-button image { padding: 6px; }
 dzlsuggestionpopover > revealer > box > elastic > scrolledwindow > viewport > list > row > box { 
margin-left: 3px; }
 
 dzlsuggestionpopover > revealer > box > elastic > scrolledwindow > viewport > list > row > box .title { 
margin-left: 6px; }
+
+.main-notebook tab:not(.reorderable-page) { min-width: 16; }
+
+.main-notebook tab:not(.reorderable-page):hover { border-color: rgba(27, 27, 27, 0.3); background-color: 
rgba(53, 53, 53, 0.2); }
+
+.main-notebook tab:not(.reorderable-page):backdrop { border-color: transparent; background-color: 
transparent; }
+
+.main-notebook tab:not(.reorderable-page):checked { border-color: rgba(27, 27, 27, 0.5); background-color: 
rgba(53, 53, 53, 0.5); }
+
+.main-notebook tab:not(.reorderable-page):checked:hover { background-color: rgba(53, 53, 53, 0.7); }
+
+.main-notebook tab:not(.reorderable-page):backdrop:checked { border-color: #202020; background-color: 
#353535; }
+
+.main-notebook header.top tab, .main-notebook header.bottom tab { border-style: none solid; }
+
+.main-notebook header.left tab, .main-notebook header.right tab { border-style: solid none; }
diff --git a/src/resources/themes/Adwaita.css b/src/resources/themes/Adwaita.css
index 58a8e151d..f629c949f 100644
--- a/src/resources/themes/Adwaita.css
+++ b/src/resources/themes/Adwaita.css
@@ -223,3 +223,19 @@ row.narrow .page-row-close-button image { padding: 6px; }
 dzlsuggestionpopover > revealer > box > elastic > scrolledwindow > viewport > list > row > box { 
margin-left: 3px; }
 
 dzlsuggestionpopover > revealer > box > elastic > scrolledwindow > viewport > list > row > box .title { 
margin-left: 6px; }
+
+.main-notebook tab:not(.reorderable-page) { min-width: 16; }
+
+.main-notebook tab:not(.reorderable-page):hover { border-color: rgba(205, 199, 194, 0.3); background-color: 
rgba(246, 245, 244, 0.2); }
+
+.main-notebook tab:not(.reorderable-page):backdrop { border-color: transparent; background-color: 
transparent; }
+
+.main-notebook tab:not(.reorderable-page):checked { border-color: rgba(205, 199, 194, 0.5); 
background-color: rgba(246, 245, 244, 0.5); }
+
+.main-notebook tab:not(.reorderable-page):checked:hover { background-color: rgba(246, 245, 244, 0.7); }
+
+.main-notebook tab:not(.reorderable-page):backdrop:checked { border-color: #d5d0cc; background-color: 
#f6f5f4; }
+
+.main-notebook header.top tab, .main-notebook header.bottom tab { border-style: none solid; }
+
+.main-notebook header.left tab, .main-notebook header.right tab { border-style: solid none; }
diff --git a/src/resources/themes/_Adwaita-base.scss b/src/resources/themes/_Adwaita-base.scss
index 05a91c2d8..6ebcfe26c 100644
--- a/src/resources/themes/_Adwaita-base.scss
+++ b/src/resources/themes/_Adwaita-base.scss
@@ -290,3 +290,48 @@ dzlsuggestionpopover > revealer > box > elastic > scrolledwindow > viewport > li
     margin-left: 6px;
   }
 }
+
+// Pinned tabs
+.main-notebook {
+  tab:not(.reorderable-page) {
+    min-width: 16;
+
+    &:hover {
+      border-color: transparentize($borders_color, 0.7);
+      background-color: transparentize($bg_color, 0.8);
+    }
+
+    &:backdrop {
+      border-color: transparent;
+      background-color: transparent;
+    }
+
+    &:checked {
+      border-color: transparentize($borders_color, 0.5);
+      background-color: transparentize($bg_color, 0.5);
+
+      &:hover { background-color: transparentize($bg_color, 0.3); }
+    }
+
+    &:backdrop:checked {
+      border-color: $backdrop_borders_color;
+      background-color: $backdrop_bg_color;
+    }
+  }
+
+  header {
+    &.top,
+    &.bottom {
+      tab {
+        border-style: none solid;
+      }
+    }
+
+    &.left,
+    &.right {
+      tab {
+        border-style: solid none;
+      }
+    }
+  }
+}