A fork of the Materia GTK theme.

Important information: Google announced that, from September 2026, Android devices will require ALL apps to be signed by Google, effectively leading to an iOS situation. Value your right to a computer that does what you want; do not tolerate this monopolistic practice! Contact me if you don't understand why it is bad. Click to learn more.

GTK3: Use margins for entry image spacing

by roundabout, Tuesday, 2 August 2016, 09:14:38 (1470129278), pushed by roundabout, Sunday, 11 May 2025, 13:21:58 (1746969718)

Author identity: nana-4 <hnmaigo@gmail.com>

44aaa117e19317fdf3c36fa930f60bd8d0a42acf

gtk-3.0/_common.scss

@@ -258,15 +258,21 @@ entry {

                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                }
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                image { // icons inside the entry
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              // @extend %button_basic.flat;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                        
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              min-height: $small_size;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              min-width: $small_size;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              -gtk-outline-radius: 100px;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              border-radius: 100px;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                  color: gtkalpha(currentColor, $enabled_opacity);
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                  &:hover, &:active { color: currentColor; }
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                  &:disabled { color: gtkalpha(currentColor, $hint_opacity); }
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              &.left { padding-left: 2px; padding-right: 6px; }
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              &.left { margin-left: -2px; margin-right: 2px; }
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              &.right { padding-left: 6px; padding-right: 2px; }
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              &.right { margin-left: 2px; margin-right: -2px; }
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                }
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                undershoot {
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                            
                                

gtk-3.0/gtk-dark.css

@@ -218,6 +218,10 @@ entry {

                                
                                
                                
                            
                                
                                    
                                        
                                            
                                              spinbutton:not(.vertical) image, notebook > stack:not(:only-child) revealer entry image,
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                              notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) image,
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                              entry image {
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            min-height: 24px;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            min-width: 24px;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            -gtk-outline-radius: 100px;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            border-radius: 100px;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                color: alpha(currentColor, 0.75); }
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                spinbutton:not(.vertical) image:hover, notebook > stack:not(:only-child) revealer entry image:hover,
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) image:hover, spinbutton:not(.vertical) image:active, notebook > stack:not(:only-child) revealer entry image:active,
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        

@@ -232,13 +236,13 @@ entry {

                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                spinbutton:not(.vertical) image.left, notebook > stack:not(:only-child) revealer entry image.left,
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) image.left,
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                entry image.left {
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              padding-left: 2px;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              padding-right: 6px; }
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              margin-left: -2px;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              margin-right: 2px; }
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                spinbutton:not(.vertical) image.right, notebook > stack:not(:only-child) revealer entry image.right,
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) image.right,
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                entry image.right {
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              padding-left: 6px;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              padding-right: 2px; }
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              margin-left: 2px;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              margin-right: -2px; }
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                              spinbutton:not(.vertical) undershoot.left, notebook > stack:not(:only-child) revealer entry undershoot.left,
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                              notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) undershoot.left,
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                              entry undershoot.left {
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                            
                                

gtk-3.0/gtk.css

@@ -218,6 +218,10 @@ entry {

                                
                                
                                
                            
                                
                                    
                                        
                                            
                                              spinbutton:not(.vertical) image, notebook > stack:not(:only-child) revealer entry image,
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                              notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) image,
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                              entry image {
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            min-height: 24px;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            min-width: 24px;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            -gtk-outline-radius: 100px;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            border-radius: 100px;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                color: alpha(currentColor, 0.75); }
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                spinbutton:not(.vertical) image:hover, notebook > stack:not(:only-child) revealer entry image:hover,
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) image:hover, spinbutton:not(.vertical) image:active, notebook > stack:not(:only-child) revealer entry image:active,
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        

@@ -232,13 +236,13 @@ entry {

                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                spinbutton:not(.vertical) image.left, notebook > stack:not(:only-child) revealer entry image.left,
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) image.left,
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                entry image.left {
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              padding-left: 2px;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              padding-right: 6px; }
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              margin-left: -2px;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              margin-right: 2px; }
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                spinbutton:not(.vertical) image.right, notebook > stack:not(:only-child) revealer entry image.right,
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) image.right,
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                                entry image.right {
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              padding-left: 6px;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              padding-right: 2px; }
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              margin-left: 2px;
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                              margin-right: -2px; }
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                              spinbutton:not(.vertical) undershoot.left, notebook > stack:not(:only-child) revealer entry undershoot.left,
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                              notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) undershoot.left,
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            
                                              entry undershoot.left {