From 5af0399fef55dfec0265cc4ac989bd82ecf9dcf7 Mon Sep 17 00:00:00 2001 From: Horst3180 Date: Sun, 3 Jan 2016 22:35:53 +0100 Subject: try to fix padding --- common/gtk-3.0/3.14/sass/_common.scss | 85 +++++++++++++++-------------------- 1 file changed, 37 insertions(+), 48 deletions(-) (limited to 'common/gtk-3.0/3.14/sass') diff --git a/common/gtk-3.0/3.14/sass/_common.scss b/common/gtk-3.0/3.14/sass/_common.scss index 3356d3e..e142c35 100644 --- a/common/gtk-3.0/3.14/sass/_common.scss +++ b/common/gtk-3.0/3.14/sass/_common.scss @@ -188,24 +188,22 @@ GtkFlowBox .grid-child { } } +$vert_padding: 5px; // // Text Entries // .entry { border: 1px solid; - padding: 5px 8px 6px; + padding: $vert_padding 8px; border-radius: 3px; transition: all 200ms $ease-out-quad; @include entry(normal); - .header-bar & { padding: 6px; } - - //&.image { // icons inside the entry - // &.left { padding-left: 0; } - // &.right { padding-right: 0; } - //} - &.image { padding-left: 3px; padding-right: 3px; } + &.image { // icons inside the entry + &.left { padding-left: 0; } + &.right { padding-right: 0; } + } &.flat, &.flat:focus { padding: 2px; @@ -359,9 +357,7 @@ $_dot_color: $selected_bg_color; transition: $_button_transition; border: 1px solid; border-radius: 3px; - padding: 5px 8px; - - .header-bar & { padding: 6px 11px; } + padding: $vert_padding 8px; @include button(normal); @@ -506,29 +502,23 @@ $_dot_color: $selected_bg_color; } } - &.image-button { padding: 8px; } - - .header-bar &.image-button { padding: 6px 9px; } + &.image-button { padding: 2px + $vert_padding 10px; } &.text-button { padding-left: 16px; padding-right: 16px; } - .header-bar &.text-button { padding: 6px 16px; } - &.text-button.image-button { // those buttons needs uneven horizontal padding, we want the icon side // to have the image-button padding, while the text side the text-button // one, so we're adding the missing padding to the label depending on // its position inside the button - padding: 4px 8px 5px; // same as .button + padding: $vert_padding 8px; // same as .button GtkLabel:first-child { padding-left: 8px; } GtkLabel:last-child { padding-right: 8px; } } - .header-bar &.text-button.image-button { padding: 6px 16px; } - .stack-switcher > & { // to position the needs attention dot, padding is added to the button // child, a label needs just lateral padding while an icon needs vertical @@ -543,21 +533,17 @@ $_dot_color: $selected_bg_color; > GtkImage { padding-left: 6px; padding-right: 6px; - padding-top: 5px; - padding-bottom: 5px; + padding-top: $vert_padding - 2px; + padding-bottom: $vert_padding - 2px; } - .header-bar > GtkLabel { padding: 6px 10px; } - - &.text-button { padding: 5px 10px; } - - .header-bar &.text-button { padding: 6px 10px; } + &.text-button { padding: $vert_padding 10px; } // needed or it will get overridden - &.image-button { padding: 1px 3px; } + &.image-button { padding: $vert_padding - 3px 4px; } &.needs-attention > GtkLabel, &.needs-attention > GtkImage { @extend %needs_attention; } - &.needs-attention:active > GtkLabel, + &.needs-attention:active > .label, &.needs-attention:active > GtkImage, &.needs-attention:checked > GtkLabel, &.needs-attention:checked > GtkImage { @@ -850,8 +836,6 @@ $_linked_separator_color: if($variant=='light', transparentize($button_border, 0 } } &.entry { - // we should remove the bottom edge hilight here, but seems - // like buttons are on top of it so it doesn't show up border-radius: 0; padding-left: 5px; padding-right: 5px; @@ -883,9 +867,9 @@ GtkComboBox { -GtkComboBox-arrow-scaling: 0.5; -GtkComboBox-shadow-type: none; - > .button { // Otherwise combos - padding-top: 3px; // are bigger than - padding-bottom: 4px; // buttons + > .button { // Otherwise combos + padding-top: $vert_padding - 2px; // are bigger than + padding-bottom: $vert_padding - 2px; // buttons } &:insensitive { @@ -1009,7 +993,7 @@ GtkComboBox { // Headerbars // .header-bar { - padding: 7px 7px 6px 7px; + padding: 5px 5px 4px 5px; border-width: 0 0 1px; border-style: solid; @@ -1027,12 +1011,14 @@ GtkComboBox { &:backdrop { color: transparentize($header_fg, 0.3); } .title { - padding: 0px 12px; + padding-left: 12px; + padding-right: 12px; } .subtitle { font-size: smaller; - padding: 0 12px; + padding-left: 12px; + padding-right: 12px; @extend .dim-label; } @@ -1113,8 +1099,8 @@ GtkComboBox { .csd &.default-decoration, // needed under wayland, since all gtk3 windows are csd windows &.default-decoration:backdrop, .csd &.default-decoration:backdrop { - padding-top: 5px; // less padding for ssd - padding-bottom: 5px; // + padding-top: 4px; // less padding for ssd + padding-bottom: 4px; // background-color: opacify($header_bg, 1); border-bottom-width: 0; @@ -1395,18 +1381,20 @@ GtkComboBox { // Pathbars // .path-bar .button { - padding-left: 6px; - padding-right: 6px; + padding: 5px 10px; + &:first-child { padding-left: 10px; } + &:last-child { padding-right: 10px; } &:only-child { - padding-left: 12px; - padding-right: 12px; + padding-left: 14px; + padding-right: 14px; } // the following is for spacing the icon and the label inside the home button - GtkLabel:last-child { padding-left: 2px; } - GtkLabel:first-child { padding-right: 2px; } - GtkLabel:only-child, GtkLabel { padding-right: 4px; padding-left: 4px; } + GtkLabel:last-child { padding-left: 4px; } + GtkLabel:first-child { padding-right: 4px; } + GtkLabel:only-child, GtkLabel { padding-right: 0; padding-left: 0; } + GtkImage { padding-top: 2px; padding-bottom: 1px; } } // @@ -2602,7 +2590,7 @@ GtkColorChooserWidget #add-color-button { } GtkColorButton.button { - padding: 4px; // Uniform padding on the GtkColorButton + padding: 5px; // Uniform padding on the GtkColorButton GtkColorSwatch { border-radius: 0; } } @@ -2702,11 +2690,12 @@ GtkVolumeButton.button { padding: 8px; } } .button.titlebutton { - padding: 7px 4px; + @extend .image-button; + padding: 8px 4px; @include button(undecorated); background-color: transparentize($header_bg, 1); - border-width: 0; + border-width: transparentize($header_bg, 1); color: transparent; background-position: center; -- cgit v1.2.3