* Optimised big button. Fixed #452

pull/539/head
Megax 2016-08-29 09:24:36 +02:00
parent c961b4d204
commit 93602e545a
7 changed files with 61 additions and 21 deletions

View File

@ -43,7 +43,9 @@
}
%button {
padding: $spacing ($spacing + 2px);
min-height: 22px;
min-width: 20px;
padding: ($spacing - 3px) ($spacing + 1px);
border-width: 1px;
border-style: solid;
border-radius: $roundness;
@ -341,6 +343,27 @@
}
}
&.image-button {
min-width: 24px;
padding-left: $spacing;
padding-right: $spacing;
}
&.text-button {
padding-left: $spacing * 2;
padding-right: $spacing * 2;
}
&.text-button.image-button {
padding-left: $spacing;
padding-right: $spacing;
label {
padding-left: $spacing;
padding-right: $spacing;
}
}
&.separator, .separator {
border: 1px solid currentColor;
color: shade($bg, ($contrast + .1));
@ -351,6 +374,8 @@
@include exports("button") {
%close_button {
min-height: 22px;
min-width: 16px;
border: 1px solid transparent;
background-color: transparent;
background-image: none;
@ -372,8 +397,6 @@
}
button {
min-height: 22px;
min-width: 24px;
@include button(shade($bg_color, 1.2), $fg_color);
.inline-toolbar &,
@ -381,7 +404,21 @@
.linked.vertical > & { @include linked_vertical_button(shade($bg_color, 1.2)); }
&.circular { // FIXME: aggregate to buttons
&.osd {
@include button($osd_bg, $osd_fg);
&.image-button {
padding: 0;
min-height: 36px;
min-width: 36px;
}
}
&.circular,
&.circular-button { // FIXME: aggregate to buttons
padding: 0;
min-width: 26px;
min-height: 26px;
border-radius: 9999px; // Fixed: https://github.com/GNOME/gtk/commit/a6409458f0d50d673a4dc370b9251993b7835b6b
-gtk-outline-radius: 9999px;
@ -453,6 +490,12 @@
}
&.vertical {
button, entry {
min-width: 0;
padding-left: $spacing - 1px;
padding-right: $spacing - 1px;
}
entry {
// reset all the other props since the spinbutton node is styled here
border-radius: 0;
@ -494,7 +537,7 @@
box button, box entry {
@extend %linked_button;
padding: ($spacing - 2px) ($spacing + 1px);
padding: ($spacing - 3px) ($spacing + 1px);
}
.linked:not(.vertical) > & > box > button.combo {

View File

@ -140,7 +140,7 @@
}
button.color {
padding: $spacing;
padding: $spacing - 1px;
colorswatch:only-child {
&, overlay { border-radius: 0; }

View File

@ -87,6 +87,7 @@
}
%entry {
min-height: 22px;
border-width: 1px;
border-style: solid;
border-radius: $roundness;
@ -123,7 +124,7 @@
@include linear-gradient($bg, to top);
@include border($bg);
padding: $spacing;
padding: ($spacing - 3px) ($spacing + 3px);
color: $fg;
caret-color: $fg;

View File

@ -287,7 +287,9 @@
}
modelbutton {
padding: $spacing ($spacing + 2px);
min-height: 24px;
padding-left: ($spacing + 3px);
padding-right: ($spacing + 3px);
border: none;
transition: 150ms ease;
outline-color: transparent;

View File

@ -278,13 +278,9 @@
@include exports("stackswitcher") {
stackswitcher button {
&.text-button { min-width: 90px; } // FIXME aggregate with buttons
&.text-button { min-width: 80px; } // FIXME aggregate with buttons
&.circular { // FIXME aggregate with buttons
min-width: 32px;
min-height: 32px;
padding: 0;
}
&.circular { min-width: 0; } // FIXME aggregate with buttons
}
}

View File

@ -153,10 +153,7 @@
outline: none;
button, button:hover {
padding: $spacing - 4;
margin-left: 15px;
min-height: 18px;
min-width: 18px;
opacity: 0;
transition: opacity .3s ease-in;
}
@ -198,8 +195,12 @@
}
/* close button styling */
button {
button.flat {
@extend %close_button;
min-height: 16px;
min-width: 16px;
padding: 0;
}
}

View File

@ -19,9 +19,6 @@
background-origin: border-box;
}
button { @include button($osd_bg, $osd_fg); }
toolbar {
-GtkToolbar-button-relief: normal;