AuroraMiddleware/gtk
1
0
Fork 1
mirror of https://gitlab.gnome.org/GNOME/gtk.git synced 2025-01-04 09:40:19 +00:00
Code Issues Projects Releases Wiki Activity

HighContrast: basic port of emoji CSS from Adwaita

Browse Source 
This is better than nothing: without specific CSS, the Chooser was too
large, the emoji were too small, and the buttons were generally ugly.

https://bugzilla.gnome.org/show_bug.cgi?id=786956
This commit is contained in:
Daniel Boles 2017-09-02 17:41:59 +01:00 committed by Matthias Clasen
parent 99b314084b
commit 9514ef0d03
3 changed files with 97 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
gtk/theme/HighContrast/_common.scss
View File

@ -3394,3 +3394,58 @@ stackswitcher button.circular {
min-width: 0px;
}
/*********
* Emoji *
********/
popover.emoji-picker { padding-left: 0; padding-right: 0; }
button.emoji-section,
button.emoji-section:backdrop { /* Dodge stuff inherited from backdrop button */
border-color: transparent;
border-width: 3px;
border-style: none none solid;
border-radius: 0;
margin: 2px 4px 2px 4px;
padding: 3px 0 0;
min-width: 32px;
min-height: 28px;
/* reset props inherited from the button style */
background: none;
box-shadow: none;
text-shadow: none;
outline-offset: -5px;
&:backdrop:not(:checked) { border-color: transparent; }
&:hover { border-color: $borders_color; }
&:checked { border-color: $selected_bg_color; }
label {
padding: 0;
opacity: 0.55;
}
&:hover label { opacity: 0.775; }
&:checked label {
opacity: 1;
/* Dodge default inversion to white for non-flat, selected button */
color: $fg_color;
}
}
.emoji {
font-size: x-large;
padding: 6px;
border-radius: 6px;
:hover {
background: $selected_bg_color;
}
}

21
gtk/theme/HighContrast/gtk-contained-inverse.css
View File

@ -1580,3 +1580,24 @@ row:selected button.circular:active { color: #000; }
stackswitcher button.text-button { min-width: 100px; }
stackswitcher button.circular { min-width: 0px; }
/********* Emoji * */
popover.emoji-picker { padding-left: 0; padding-right: 0; }
button.emoji-section, button.emoji-section:backdrop { /* Dodge stuff inherited from backdrop button */ border-color: transparent; border-width: 3px; border-style: none none solid; border-radius: 0; margin: 2px 4px 2px 4px; padding: 3px 0 0; min-width: 32px; min-height: 28px; /* reset props inherited from the button style */ background: none; box-shadow: none; text-shadow: none; outline-offset: -5px; }
button.emoji-section:backdrop:not(:checked), button.emoji-section:backdrop:backdrop:not(:checked) { border-color: transparent; }
button.emoji-section:hover, button.emoji-section:backdrop:hover { border-color: gray; }
button.emoji-section:checked, button.emoji-section:backdrop:checked { border-color: #ddd; }
button.emoji-section label, button.emoji-section:backdrop label { padding: 0; opacity: 0.55; }
button.emoji-section:hover label, button.emoji-section:backdrop:hover label { opacity: 0.775; }
button.emoji-section:checked label, button.emoji-section:backdrop:checked label { opacity: 1; /* Dodge default inversion to white for non-flat, selected button */ color: #fff; }
.emoji { font-size: x-large; padding: 6px; border-radius: 6px; }
.emoji :hover { background: #ddd; }

21
gtk/theme/HighContrast/gtk-contained.css
View File

@ -1586,3 +1586,24 @@ row:selected button.circular:active { color: #fff; }
stackswitcher button.text-button { min-width: 100px; }
stackswitcher button.circular { min-width: 0px; }
/********* Emoji * */
popover.emoji-picker { padding-left: 0; padding-right: 0; }
button.emoji-section, button.emoji-section:backdrop { /* Dodge stuff inherited from backdrop button */ border-color: transparent; border-width: 3px; border-style: none none solid; border-radius: 0; margin: 2px 4px 2px 4px; padding: 3px 0 0; min-width: 32px; min-height: 28px; /* reset props inherited from the button style */ background: none; box-shadow: none; text-shadow: none; outline-offset: -5px; }
button.emoji-section:backdrop:not(:checked), button.emoji-section:backdrop:backdrop:not(:checked) { border-color: transparent; }
button.emoji-section:hover, button.emoji-section:backdrop:hover { border-color: gray; }
button.emoji-section:checked, button.emoji-section:backdrop:checked { border-color: #000; }
button.emoji-section label, button.emoji-section:backdrop label { padding: 0; opacity: 0.55; }
button.emoji-section:hover label, button.emoji-section:backdrop:hover label { opacity: 0.775; }
button.emoji-section:checked label, button.emoji-section:backdrop:checked label { opacity: 1; /* Dodge default inversion to white for non-flat, selected button */ color: #000; }
.emoji { font-size: x-large; padding: 6px; border-radius: 6px; }
.emoji :hover { background: #000; }