From 1bd02efcdaf76a661111a00e7a9cb86e3bbfbea0 Mon Sep 17 00:00:00 2001
From: Satyajit Sahoo <satyajit.happy@gmail.com>
Date: Sat, 13 Dec 2014 19:47:53 +0530
Subject: [PATCH] Fix linked button issues

---
 gtk-3.0/scss/_base.scss    |  5 --
 gtk-3.0/scss/_button.scss  | 97 ++++++++++++++++++++++----------------
 gtk-3.0/scss/_misc.scss    | 10 ++++
 gtk-3.0/scss/_osd.scss     |  4 +-
 gtk-3.0/scss/_toolbar.scss |  2 +
 5 files changed, 70 insertions(+), 48 deletions(-)

diff --git a/gtk-3.0/scss/_base.scss b/gtk-3.0/scss/_base.scss
index 1407017..0080480 100755
--- a/gtk-3.0/scss/_base.scss
+++ b/gtk-3.0/scss/_base.scss
@@ -125,8 +125,3 @@ GtkLabel {
 
 	&:insensitive { color: mix($fg_color, $bg_color, 0.50); }
 }
-
-.dim-label {
-	opacity: 0.5;
-	text-shadow: none;
-}
diff --git a/gtk-3.0/scss/_button.scss b/gtk-3.0/scss/_button.scss
index 606ca80..d8900a2 100755
--- a/gtk-3.0/scss/_button.scss
+++ b/gtk-3.0/scss/_button.scss
@@ -6,13 +6,33 @@
  ! Buttons
 **********/
 
-@mixin linked_button($bg, $shadow) {
-	border: 1px solid border_normal($bg);
+%button {
+	padding: ($spacing - 1px) ($spacing + 1px);
+	border-width: 1px;
+	border-style: solid;
+	border-radius: $roundness;
+	transition: 100ms ease;
+
+	-GtkWidget-focus-padding: 1;
+	-GtkWidget-focus-line-width: 0;
+
+	&.flat {
+		color: inherit;
+		border: none;
+		background-color: transparent;
+		background-image: none;
+		box-shadow: none;
+	}
+
+	&.separator, .separator { border: 1px solid currentColor; }
+}
+
+%linked_button {
+	border-width: 1px;
+	border-style: solid;
 	border-radius: 0;
 	border-right-style: none;
 	border-left-style: none;
-	box-shadow: inset -1px 0 border_normal($bg),
-				0 1px 2px -1px alpha($shadow, .3);
 
 	&:first-child {
 		border-width: 1px;
@@ -42,14 +62,22 @@
 		}
 	}
 
-	&:only-child {
+	&:only-child, &:first-child:only-child {
 		border-width: 1px;
+		border-style: solid;
 		border-radius: $roundness;
 	}
+}
+
+@mixin linked_button($bg) {
+	@extend %linked_button;
+
+	box-shadow: inset -1px 0 border_normal($bg),
+				0 1px 2px -1px alpha($dark_shadow, .3);
 
 	&:focus, &:hover {
 		box-shadow: inset -1px 0 border_focus($bg),
-					0 1px 2px -1px alpha($shadow, .3);
+					0 1px 2px -1px alpha($dark_shadow, .3);
 	}
 
 	&:active, &:active:hover,
@@ -57,9 +85,9 @@
 	&:checked, &:checked:hover,
 	&:checked:focus, &:checked:hover:focus {
 		box-shadow: inset -1px 0 border_active($bg),
-					inset 1px 0 alpha($shadow, .07),
-					inset 0 1px alpha($shadow, .08),
-					inset 0 -1px alpha($shadow, .05);
+					inset 1px 0 alpha($dark_shadow, .07),
+					inset 0 1px alpha($dark_shadow, .08),
+					inset 0 -1px alpha($dark_shadow, .05);
 	}
 
 	&:insensitive { box-shadow: inset -1px 0 border_insensitive($bg); }
@@ -70,37 +98,39 @@
 	&:checked:insensitive:last-child, &:checked:insensitive:only-child { box-shadow: none; }
 
 	&:active:last-child, &:active:only-child,
-	&:checked:last-child, &:checked:only-child {
-		box-shadow: inset 1px 0 alpha($shadow, .07),
-					inset 0 1px alpha($shadow, .08),
-					inset -1px 0 alpha($shadow, .07);
+	&:active:last-child:focus, &:active:only-child:focus,
+	&:active:last-child:hover, &:active:only-child:hover,
+	&:active:last-child:hover:focus, &:active:only-child:hover:focus,
+	&:checked:last-child, &:checked:only-child,
+	&:checked:last-child:focus, &:checked:only-child:focus,
+	&:checked:last-child:hover, &:checked:only-child:hover,
+	&:checked:last-child:hover:focus, &:checked:only-child:hover:focus {
+		box-shadow: inset 1px 0 alpha($dark_shadow, .07),
+					inset 0 1px alpha($dark_shadow, .08),
+					inset -1px 0 alpha($dark_shadow, .07);
 	}
 }
 
 @mixin button($bg, $fg) {
 	@include linear-gradient(shade($bg, 1.05));
 	@include border(shade($bg, 1.05));
+	@extend %button;
 
-	padding: ($spacing - 1px) ($spacing + 1px);
-	border-width: 1px;
-	border-radius: $roundness;
-	border-style: solid;
+	border-color: border_normal($bg);
 	color: $fg;
-	transition: 100ms ease;
 	box-shadow: 0 1px 2px -1px alpha($dark_shadow, .3);
 
-	-GtkWidget-focus-padding: 1;
-	-GtkWidget-focus-line-width: 0;
-
 	&:focus, &:hover {
 		@include linear-gradient(shade($bg, 1.1));
 
+		border-color: border_focus($bg);
 		box-shadow: 0 1px 3px -1px alpha($dark_shadow, .5);
 	}
 
 	&:checked, &:active {
 		@include linear-gradient(shade($bg, .95));
 
+		border-color: border_active($bg);
 		box-shadow: inset 1px 0 alpha($dark_shadow, .07),
 					inset 0 1px alpha($dark_shadow, .08),
 					inset -1px 0 alpha($dark_shadow, .07),
@@ -110,6 +140,7 @@
 	&:insensitive {
 		@include linear-gradient(shade($bg, .95));
 
+		border-color: border_insensitive($bg);
 		color: mix($bg, $fg, .5);
 		box-shadow: none;
 	}
@@ -121,29 +152,11 @@
 		box-shadow: none;
 	}
 
-	&.flat {
-		color: inherit;
-
-		&, &:hover, &:focus,
-		&:active, &:active:hover, &:active:focus,
-		&:checked, &:checked:hover, &:checked:focus {
-			border: none;
-			background-color: transparent;
-			background-image: none;
-			box-shadow: none;
-		}
-
-		// TODO
-	}
-
 	&.separator, .separator {
 		color: shade($bg, ($contrast + .05));
-		border: 1px solid currentColor;
 
 		&:insensitive { color: shade($bg, .85); }
 	}
-
-	.linked & { @include linked_button($bg, $dark_shadow); }
 }
 
 @include exports("button") {
@@ -173,10 +186,12 @@
 
 		&.default { @include button($selected_bg_color, $selected_fg_color); }
 
+		.linked & { @include linked_button($bg_color); }
+
 		.spinbutton & {
 			color: mix($text_color, $base_color, 0.4);
-			padding: 2px 4px;
-			border-width: 0;
+			padding: $spacing ($spacing * 2);
+			border: none;
 			border-radius: 0;
 			border-style: none;
 			background-color: transparent;
diff --git a/gtk-3.0/scss/_misc.scss b/gtk-3.0/scss/_misc.scss
index 35a271c..ee3644f 100644
--- a/gtk-3.0/scss/_misc.scss
+++ b/gtk-3.0/scss/_misc.scss
@@ -2,6 +2,16 @@
 @import "global";
 
 
+/***************
+! Dimmed label *
+****************/
+
+.dim-label {
+	opacity: 0.5;
+	text-shadow: none;
+}
+
+
 /***********
  ! Tooltip *
 ************/
diff --git a/gtk-3.0/scss/_osd.scss b/gtk-3.0/scss/_osd.scss
index a2d3e5a..673a262 100644
--- a/gtk-3.0/scss/_osd.scss
+++ b/gtk-3.0/scss/_osd.scss
@@ -29,7 +29,7 @@ GtkOverlay.osd {
         -GtkToolbar-button-relief: normal;
 
         padding: $spacing;
-        border-width: 1px solid border_normal($osd_bg);
+        border: 1px solid border_normal($osd_bg);
         border-radius: $roundness;
         background-color: $osd_bg;
         background-image: none;
@@ -114,7 +114,7 @@ GtkOverlay.osd {
     GtkIconView.cell {
         &:selected, &:selected:focus {
             background-color: transparent;
-            border: 3px solid solid mix(shade($osd_bg, 0.87), $osd_fg, 0.21);
+            border: 3px solid mix(shade($osd_bg, 0.87), $osd_fg, 0.21);
             border-radius: $roundness;
             outline-color: transparent;
         }
diff --git a/gtk-3.0/scss/_toolbar.scss b/gtk-3.0/scss/_toolbar.scss
index 79ca6c1..cea024a 100755
--- a/gtk-3.0/scss/_toolbar.scss
+++ b/gtk-3.0/scss/_toolbar.scss
@@ -31,6 +31,8 @@
 
     .button { @include button($bg, $fg); }
 
+    .linked .button { @include linked_button($bg); }
+
     GtkComboBox, .button {
         padding: $spacing - 1px;