Support icon buttons elsewhere in the UI (e.g. in the messagebox).

This commit is contained in:
hackademix 2022-02-25 11:47:47 +01:00
parent 86fd2414ff
commit eb0d06b302
1 changed files with 36 additions and 27 deletions

View File

@ -20,11 +20,21 @@ body {
user-select: none; user-select: none;
} }
.icon {
#top .icon {
appearance: none !important; appearance: none !important;
-webkit-appearance: none !important; -webkit-appearance: none !important;
-moz-appearance: none !important; -moz-appearance: none !important;
cursor: pointer;
color: #048;
background: transparent no-repeat left;
padding-left: 1.6em;
border: none;
font-size: 1.2em;
background-size: contain;
margin: 0 1.2em 0 1.2em;
}
#top .icon {
width: 2em; width: 2em;
height: 2em; height: 2em;
margin: 0.25em; margin: 0.25em;
@ -32,9 +42,7 @@ body {
font-size: 1em; font-size: 1em;
font-family: sans-serif; font-family: sans-serif;
font-weight: bold; font-weight: bold;
color: black; background-position: center;
background: transparent no-repeat center;
background-size: 100%;
transform: unset; transform: unset;
transition: transform 0.3s; transition: transform 0.3s;
border: none; border: none;
@ -55,7 +63,7 @@ body {
left: 0; left: 0;
} }
#top .icon:after { .icon:after {
content: attr(title); content: attr(title);
} }
@ -73,8 +81,6 @@ body {
cursor: pointer; cursor: pointer;
} }
#top > .hider.open ~ .spacer { #top > .hider.open ~ .spacer {
display: none; display: none;
} }
@ -187,36 +193,36 @@ body {
} }
#top #revoke-temp { #revoke-temp {
background-image: url(/img/ui-revoke-temp64.png); background-image: url(/img/ui-revoke-temp64.png) !important;
} }
#top #temp-trust-page { #temp-trust-page {
background-image: url(/img/ui-temp-all64.png); background-image: url(/img/ui-temp-all64.png) !important;
} }
#top #enforce-tab { #enforce-tab {
background-image: url(/img/ui-tab-no64.png); background-image: url(/img/ui-tab-no64.png) !important;
} }
#top #enforce-tab[aria-pressed="true"] { #enforce-tab[aria-pressed="true"] {
background-image: url(/img/ui-tab64.png); background-image: url(/img/ui-tab64.png) !important;;
} }
#top #enforce { #enforce {
background-image: url(/img/ui-global-no64.png); background-image: url(/img/ui-global-no64.png) !important;
} }
#top #enforce[aria-pressed="true"] { #enforce[aria-pressed="true"] {
background-image: url(/img/ui-global64.png); background-image: url(/img/ui-global64.png) !important;
} }
#top #options { #options {
background-image: url(/img/noscript-options.png); background-image: url(/img/noscript-options.png) !important;
} }
#top #close { #close {
background-image: url(/img/ui-close64.png); background-image: url(/img/ui-close64.png) !important;
} }
#top #reload { #reload {
background-image: url(/img/ui-reload64.png); background-image: url(/img/ui-reload64.png) !important;;
} }
#sites { #sites {
@ -247,12 +253,15 @@ body {
height: auto; height: auto;
margin: .5em; margin: .5em;
padding: .8em 0 0 2.5em; padding: .8em 0 0 2.5em;
background-color: transparent;
background-size: 2em; background-size: 2em;
background-position: left top; background-position: left center;
background-repeat: no-repeat; background-repeat: no-repeat;
min-height: 3em; min-height: 3em;
font-size: 1.2em; font-size: 1.2em;
vertical-align: middle; vertical-align: middle;
white-space: normal;
max-width: 520px;
} }
#message.hidden { #message.hidden {
display: none; display: none;