mirrors/Simplewaita
1
0
Fork 0
mirror of https://git.disroot.org/eudaimon/Simplewaita.git synced 2026-03-09 20:21:07 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Squared entries

Browse source
This commit is contained in:
eudaimon 2022-04-26 16:51:06 +02:00
parent 85816f3421
commit 9f67a24480
7 changed files with 32 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

6
gtk-3.0/gtk.css
View file

@ -120,13 +120,13 @@ spinner:checked:disabled { opacity: 0.5; color: #552222; }
.caption { font-weight: 400; font-size: 9pt; }
/**************** Text Entries * */
spinbutton:not(.vertical), entry { min-height: 28px; padding-left: 8px; padding-right: 8px; border: 1px solid; border-radius: 5px; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); color: #241f31; border-color: #241f31; background-color: #908f8d; box-shadow: inset 0 0 0 1px rgba(176, 221, 126, 0), inset 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px rgba(255, 255, 255, 0.5); }
spinbutton:not(.vertical), entry { min-height: 28px; padding-left: 1px; padding-right: 1px; border: 1px solid; border-radius: 0px; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); color: #241f31; border-color: #241f31; background-color: #908f8d; box-shadow: inset 0 0 0 1px rgba(176, 221, 126, 0), inset 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px rgba(255, 255, 255, 0.5); }
spinbutton:not(.vertical) image.left, entry image.left { margin-right: 6px; }
spinbutton:not(.vertical) image.right, entry image.right { margin-left: 6px; }
spinbutton.flat:not(.vertical), entry.flat:focus, entry.flat:backdrop, entry.flat:disabled, entry.flat { min-height: 0; padding: 2px; background-color: transparent; border-color: transparent; border-radius: 0; }
spinbutton.flat:not(.vertical), entry.flat:focus, entry.flat:backdrop, entry.flat:disabled, entry.flat { min-height: 0; padding: 2px; padding-left: 1px; padding-right: 1px; background-color: transparent; border-color: transparent; border-radius: 0; }
spinbutton:focus:not(.vertical), entry:focus { box-shadow: inset 0 0 0 1px #b0dd7e, inset 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px rgba(255, 255, 255, 0.5); border-color: #b0dd7e; }
@ -170,6 +170,8 @@ spinbutton:not(.vertical) progress, entry progress { margin: 2px -6px; backgroun
spinbutton:not(.vertical) progress:backdrop, entry progress:backdrop { background-color: transparent; }
.linked:not(.vertical) > spinbutton:dir(rtl):not(.vertical), .linked:not(.vertical) > spinbutton:dir(ltr):not(.vertical), .linked:not(.vertical) > entry:dir(rtl), .linked:not(.vertical) > entry:dir(ltr), .linked:not(.vertical) > entry:first-child:dir(rtl), .linked:not(.vertical) > entry:first-child:dir(ltr), .linked:not(.vertical) > entry:last-child:dir(rtl), .linked:not(.vertical) > entry:last-child:dir(ltr), .linked:not(.vertical) > entry:only-child:dir(rtl), .linked:not(.vertical) > entry:only-child:dir(ltr) { border-radius: 0px; }
.linked:not(.vertical) > spinbutton:focus:not(.vertical) + spinbutton:not(.vertical), .linked:not(.vertical) > spinbutton:focus:not(.vertical) + button, .linked:not(.vertical) > spinbutton:focus:not(.vertical) + combobox > box > button.combo, .linked:not(.vertical) > spinbutton:focus:not(.vertical) + entry, .linked:not(.vertical) > entry:focus + button, .linked:not(.vertical) > entry:focus + combobox > box > button.combo, .linked:not(.vertical) > entry:focus + spinbutton:not(.vertical), .linked:not(.vertical) > entry:focus + entry { border-left-color: #b0dd7e; }
.linked:not(.vertical) > spinbutton:focus.error:not(.vertical) + spinbutton:not(.vertical), .linked:not(.vertical) > spinbutton:focus.error:not(.vertical) + button, .linked:not(.vertical) > spinbutton:focus.error:not(.vertical) + combobox > box > button.combo, .linked:not(.vertical) > spinbutton:focus.error:not(.vertical) + entry, .linked:not(.vertical) > entry:focus.error + button, .linked:not(.vertical) > entry:focus.error + combobox > box > button.combo, .linked:not(.vertical) > entry:focus.error + spinbutton:not(.vertical), .linked:not(.vertical) > entry:focus.error + entry { border-left-color: #990000; }

6
gtk-4.0/gtk.css
View file

@ -140,7 +140,7 @@ spinner:checked:disabled { opacity: 0.5; color: #552222; }
.caption { font-weight: 400; font-size: 9pt; }
/**************** Text Entries * */
spinbutton.vertical > text, spinbutton:not(.vertical), entry { min-height: 32px; padding-left: 8px; padding-right: 8px; border: 1px solid; border-radius: 5px; border-spacing: 6px; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); color: #241f31; border-color: #241f31; background-color: #908f8d; box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px rgba(255, 255, 255, 0.5); transition-property: outline, outline-width, outline-offset, outline-color; transition-duration: 300ms; animation-timing-function: ease-in-out; }
spinbutton.vertical > text, spinbutton:not(.vertical), entry { min-height: 32px; padding-left: 1px; padding-right: 1px; border: 1px solid; border-radius: 0px; border-spacing: 6px; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); color: #241f31; border-color: #241f31; background-color: #908f8d; box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px rgba(255, 255, 255, 0.5); transition-property: outline, outline-width, outline-offset, outline-color; transition-duration: 300ms; animation-timing-function: ease-in-out; }
spinbutton.vertical > text, spinbutton:not(.vertical), entry { outline: 0 solid transparent; outline-offset: 4px; }
@ -152,7 +152,7 @@ spinbutton.vertical > text > image.right, spinbutton:not(.vertical) > image.righ
spinbutton.vertical > text > text > block-cursor, spinbutton:not(.vertical) > text > block-cursor, entry > text > block-cursor { color: #908f8d; background-color: #241f31; }
spinbutton.vertical > text.flat, spinbutton.flat:not(.vertical), entry.flat:focus-within, entry.flat:backdrop, entry.flat:disabled, entry.flat { min-height: 0; padding: 2px; background-color: transparent; border-color: transparent; border-radius: 0; }
spinbutton.vertical > text.flat, spinbutton.flat:not(.vertical), entry.flat:focus-within, entry.flat:backdrop, entry.flat:disabled, entry.flat { min-height: 0; padding-top: 2px; padding-bottom: 2px; background-color: transparent; border-color: transparent; border-radius: 0; }
spinbutton.vertical > text:focus-within > placeholder, spinbutton:focus-within:not(.vertical) > placeholder, entry:focus-within > placeholder { opacity: 0; /* We hide placeholders on focus */ }
@ -908,7 +908,7 @@ switch:checked { color: #000000; border-color: #8bcd41; background-color: #b0dd7
switch:disabled { color: #552222; border-color: #797979; background-color: #938989; text-shadow: none; }
switch > slider { color: #241f31; background-color: #bcbeb9; border-color: #241f31; outline-color: rgba(176, 221, 126, 0.5); background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.15)); text-shadow: 0 1px rgba(255, 255, 255, 0.3); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.3); box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px 2px rgba(0, 0, 0, 0.4); margin: -1px; min-width: 24px; min-height: 24px; border: 1px solid; border-color: #797979; border-radius: 50%; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
switch > slider { color: #241f31; background-color: #bcbeb9; border-color: #241f31; outline-color: rgba(176, 221, 126, 0.5); background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.15)); text-shadow: 0 1px rgba(255, 255, 255, 0.3); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.3); box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px 2px rgba(0, 0, 0, 0.4); margin: -1px; min-width: 24px; min-height: 24px; border: 1px solid; border-radius: 50%; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
switch > image { color: transparent; }

1
source/common/common_common.scss
View file

@ -13,6 +13,7 @@ $_sel_menu_pad: if($_sizevariant=='default', 6px 10px, 4px 10px);
$_circ_btn_pad: if($_sizevariant=='default', 4px, 2px);
$_switch_margin: if($_sizevariant=='default', 10px, 7px);
$entry_radius: 0px;
$ease-out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94);
$asset_suffix: if($variant=='dark', '-dark', '');

15
source/gtk3/_common.scss
View file

@ -308,10 +308,10 @@ spinner {
entry {
%entry_basic, & {
min-height: $_entry_height;
padding-left: 8px;
padding-right: 8px;
padding-left: 1px;
padding-right: 1px;
border: 1px solid;
border-radius: $button_radius;
border-radius: $entry_radius;
transition: all 200ms $ease-out-quad;
@include entry(normal);
@ -326,6 +326,8 @@ entry {
&:focus, &:backdrop, &:disabled, &:backdrop:disabled, & {
min-height: 0;
padding: 2px;
padding-left: 1px;
padding-right: 1px;
background-color: transparent;
border-color: transparent;
border-radius: 0;
@ -401,7 +403,12 @@ entry {
}
// linked entries
.linked:not(.vertical) > & { @extend %linked; }
.linked:not(.vertical) > & {
@extend %linked;
&, &:first-child, &:last-child, &:only-child {
&:dir(rtl), &:dir(ltr) {border-radius:$entry_radius;} //breaking roundness if present, added for square theme. All this to get equal specificity!
}
}
.linked:not(.vertical) > &:focus + &,
.linked:not(.vertical) > &:focus + button,
.linked:not(.vertical) > &:focus + combobox > box > button.combo { border-left-color: entry_focus_border(); }

6
source/gtk3/gtk-new.css
View file

@ -120,13 +120,13 @@ spinner:checked:disabled { opacity: 0.5; color: #552222; }
.caption { font-weight: 400; font-size: 9pt; }
/**************** Text Entries * */
spinbutton:not(.vertical), entry { min-height: 28px; padding-left: 8px; padding-right: 8px; border: 1px solid; border-radius: 5px; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); color: #241f31; border-color: #241f31; background-color: #908f8d; box-shadow: inset 0 0 0 1px rgba(176, 221, 126, 0), inset 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px rgba(255, 255, 255, 0.5); }
spinbutton:not(.vertical), entry { min-height: 28px; padding-left: 1px; padding-right: 1px; border: 1px solid; border-radius: 0px; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); color: #241f31; border-color: #241f31; background-color: #908f8d; box-shadow: inset 0 0 0 1px rgba(176, 221, 126, 0), inset 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px rgba(255, 255, 255, 0.5); }
spinbutton:not(.vertical) image.left, entry image.left { margin-right: 6px; }
spinbutton:not(.vertical) image.right, entry image.right { margin-left: 6px; }
spinbutton.flat:not(.vertical), entry.flat:focus, entry.flat:backdrop, entry.flat:disabled, entry.flat { min-height: 0; padding: 2px; background-color: transparent; border-color: transparent; border-radius: 0; }
spinbutton.flat:not(.vertical), entry.flat:focus, entry.flat:backdrop, entry.flat:disabled, entry.flat { min-height: 0; padding: 2px; padding-left: 1px; padding-right: 1px; background-color: transparent; border-color: transparent; border-radius: 0; }
spinbutton:focus:not(.vertical), entry:focus { box-shadow: inset 0 0 0 1px #b0dd7e, inset 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px rgba(255, 255, 255, 0.5); border-color: #b0dd7e; }
@ -170,6 +170,8 @@ spinbutton:not(.vertical) progress, entry progress { margin: 2px -6px; backgroun
spinbutton:not(.vertical) progress:backdrop, entry progress:backdrop { background-color: transparent; }
.linked:not(.vertical) > spinbutton:dir(rtl):not(.vertical), .linked:not(.vertical) > spinbutton:dir(ltr):not(.vertical), .linked:not(.vertical) > entry:dir(rtl), .linked:not(.vertical) > entry:dir(ltr), .linked:not(.vertical) > entry:first-child:dir(rtl), .linked:not(.vertical) > entry:first-child:dir(ltr), .linked:not(.vertical) > entry:last-child:dir(rtl), .linked:not(.vertical) > entry:last-child:dir(ltr), .linked:not(.vertical) > entry:only-child:dir(rtl), .linked:not(.vertical) > entry:only-child:dir(ltr) { border-radius: 0px; }
.linked:not(.vertical) > spinbutton:focus:not(.vertical) + spinbutton:not(.vertical), .linked:not(.vertical) > spinbutton:focus:not(.vertical) + button, .linked:not(.vertical) > spinbutton:focus:not(.vertical) + combobox > box > button.combo, .linked:not(.vertical) > spinbutton:focus:not(.vertical) + entry, .linked:not(.vertical) > entry:focus + button, .linked:not(.vertical) > entry:focus + combobox > box > button.combo, .linked:not(.vertical) > entry:focus + spinbutton:not(.vertical), .linked:not(.vertical) > entry:focus + entry { border-left-color: #b0dd7e; }
.linked:not(.vertical) > spinbutton:focus.error:not(.vertical) + spinbutton:not(.vertical), .linked:not(.vertical) > spinbutton:focus.error:not(.vertical) + button, .linked:not(.vertical) > spinbutton:focus.error:not(.vertical) + combobox > box > button.combo, .linked:not(.vertical) > spinbutton:focus.error:not(.vertical) + entry, .linked:not(.vertical) > entry:focus.error + button, .linked:not(.vertical) > entry:focus.error + combobox > box > button.combo, .linked:not(.vertical) > entry:focus.error + spinbutton:not(.vertical), .linked:not(.vertical) > entry:focus.error + entry { border-left-color: #990000; }

11
source/gtk4/_common.scss
View file

@ -278,10 +278,10 @@ spinner {
entry {
%entry_basic, & {
min-height: 32px;
padding-left: 8px;
padding-right: 8px;
padding-left: 1px;
padding-right: 1px;
border: 1px solid;
border-radius: $button_radius;
border-radius: $entry_radius;
border-spacing: 6px;
transition: all 200ms $ease-out-quad;
@ -305,7 +305,8 @@ entry {
&.flat {
&:focus-within, &:backdrop, &:disabled, &:backdrop:disabled, & {
min-height: 0;
padding: 2px;
padding-top: 2px;
padding-bottom: 2px;
background-color: transparent;
border-color: transparent;
border-radius: 0;
@ -2379,7 +2380,7 @@ switch {
min-width: 24px;
min-height: 24px;
border: 1px solid;
border-color: $borders_color;
//border-color: $borders_color;
border-radius: 50%;
transition: $button_transition;
}

6
source/gtk4/gtk-new.css
View file

@ -140,7 +140,7 @@ spinner:checked:disabled { opacity: 0.5; color: #552222; }
.caption { font-weight: 400; font-size: 9pt; }
/**************** Text Entries * */
spinbutton.vertical > text, spinbutton:not(.vertical), entry { min-height: 32px; padding-left: 8px; padding-right: 8px; border: 1px solid; border-radius: 5px; border-spacing: 6px; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); color: #241f31; border-color: #241f31; background-color: #908f8d; box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px rgba(255, 255, 255, 0.5); transition-property: outline, outline-width, outline-offset, outline-color; transition-duration: 300ms; animation-timing-function: ease-in-out; }
spinbutton.vertical > text, spinbutton:not(.vertical), entry { min-height: 32px; padding-left: 1px; padding-right: 1px; border: 1px solid; border-radius: 0px; border-spacing: 6px; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); color: #241f31; border-color: #241f31; background-color: #908f8d; box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px rgba(255, 255, 255, 0.5); transition-property: outline, outline-width, outline-offset, outline-color; transition-duration: 300ms; animation-timing-function: ease-in-out; }
spinbutton.vertical > text, spinbutton:not(.vertical), entry { outline: 0 solid transparent; outline-offset: 4px; }
@ -152,7 +152,7 @@ spinbutton.vertical > text > image.right, spinbutton:not(.vertical) > image.righ
spinbutton.vertical > text > text > block-cursor, spinbutton:not(.vertical) > text > block-cursor, entry > text > block-cursor { color: #908f8d; background-color: #241f31; }
spinbutton.vertical > text.flat, spinbutton.flat:not(.vertical), entry.flat:focus-within, entry.flat:backdrop, entry.flat:disabled, entry.flat { min-height: 0; padding: 2px; background-color: transparent; border-color: transparent; border-radius: 0; }
spinbutton.vertical > text.flat, spinbutton.flat:not(.vertical), entry.flat:focus-within, entry.flat:backdrop, entry.flat:disabled, entry.flat { min-height: 0; padding-top: 2px; padding-bottom: 2px; background-color: transparent; border-color: transparent; border-radius: 0; }
spinbutton.vertical > text:focus-within > placeholder, spinbutton:focus-within:not(.vertical) > placeholder, entry:focus-within > placeholder { opacity: 0; /* We hide placeholders on focus */ }
@ -908,7 +908,7 @@ switch:checked { color: #000000; border-color: #8bcd41; background-color: #b0dd7
switch:disabled { color: #552222; border-color: #797979; background-color: #938989; text-shadow: none; }
switch > slider { color: #241f31; background-color: #bcbeb9; border-color: #241f31; outline-color: rgba(176, 221, 126, 0.5); background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.15)); text-shadow: 0 1px rgba(255, 255, 255, 0.3); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.3); box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px 2px rgba(0, 0, 0, 0.4); margin: -1px; min-width: 24px; min-height: 24px; border: 1px solid; border-color: #797979; border-radius: 50%; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
switch > slider { color: #241f31; background-color: #bcbeb9; border-color: #241f31; outline-color: rgba(176, 221, 126, 0.5); background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.15)); text-shadow: 0 1px rgba(255, 255, 255, 0.3); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.3); box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px 2px rgba(0, 0, 0, 0.4); margin: -1px; min-width: 24px; min-height: 24px; border: 1px solid; border-radius: 50%; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
switch > image { color: transparent; }