Improve some values based on the font-size (#1430)
This commit is contained in:
parent
1e4545107d
commit
75d0d333d8
@ -16,6 +16,12 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
|
--font-size-no-units: 14;
|
||||||
|
--font-size: calc(1px * var(--font-size-no-units));
|
||||||
|
|
||||||
|
--line-height-no-units: 20;
|
||||||
|
--line-height: calc(var(--line-height-no-units) / var(--font-size-no-units));
|
||||||
|
|
||||||
--badge-size: 16px;
|
--badge-size: 16px;
|
||||||
|
|
||||||
--warning-color: #96751c;
|
--warning-color: #96751c;
|
||||||
@ -26,7 +32,7 @@ body {
|
|||||||
padding: 10px;
|
padding: 10px;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
font-family: 'Segoe UI', Tahoma, sans-serif;
|
font-family: 'Segoe UI', Tahoma, sans-serif;
|
||||||
font-size: 14px;
|
font-size: var(--font-size);
|
||||||
}
|
}
|
||||||
|
|
||||||
h3 {
|
h3 {
|
||||||
@ -183,9 +189,9 @@ body[data-loaded=true] .toggle-group {
|
|||||||
.toggle-handle {
|
.toggle-handle {
|
||||||
display: block;
|
display: block;
|
||||||
padding: 6px 12px;
|
padding: 6px 12px;
|
||||||
font-size: 14px;
|
font-size: var(--font-size);
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
line-height: calc(20 / 14);
|
line-height: var(--line-height);
|
||||||
text-align: center;
|
text-align: center;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
@ -376,7 +382,7 @@ select.profile-select {
|
|||||||
opacity: 0;
|
opacity: 0;
|
||||||
outline: none;
|
outline: none;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
font-size: 14px;
|
font-size: var(--font-size);
|
||||||
}
|
}
|
||||||
.profile-select optgroup {
|
.profile-select optgroup {
|
||||||
color: #666666;
|
color: #666666;
|
||||||
|
@ -63,10 +63,10 @@
|
|||||||
|
|
||||||
--expression-space-size: 0.5em;
|
--expression-space-size: 0.5em;
|
||||||
|
|
||||||
--tag-font-size-no-units: calc(11 / 14);
|
--tag-font-size-no-units: 11;
|
||||||
--tag-font-size: calc(1em * var(--tag-font-size-no-units));
|
--tag-font-size: calc(1em * var(--tag-font-size-no-units) / var(--font-size-no-units));
|
||||||
--tag-border-size-no-units: 0;
|
--tag-border-size-no-units: 0;
|
||||||
--tag-border-size: calc(1em * (var(--tag-border-size-no-units) / (var(--font-size-no-units) * var(--tag-font-size-no-units))));
|
--tag-border-size: calc(1em * (var(--tag-border-size-no-units) / var(--tag-font-size-no-units)));
|
||||||
--tag-border-style: none;
|
--tag-border-style: none;
|
||||||
--tag-font-weight: bold;
|
--tag-font-weight: bold;
|
||||||
|
|
||||||
@ -256,7 +256,7 @@ h3 {
|
|||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
h5 {
|
h5 {
|
||||||
font-size: calc(12em / 14);
|
font-size: calc(12em / var(--font-size-no-units));
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
|
@ -1155,8 +1155,8 @@ button.popup-menu-item:not([hidden]) {
|
|||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
.popup-menu-item-icon {
|
.popup-menu-item-icon {
|
||||||
width: calc(16em / 14);
|
width: calc(16em / var(--font-size-no-units));
|
||||||
height: calc(16em / 14);
|
height: calc(16em / var(--font-size-no-units));
|
||||||
background-color: var(--button-current-content-color);
|
background-color: var(--button-current-content-color);
|
||||||
flex: 0 0 auto;
|
flex: 0 0 auto;
|
||||||
}
|
}
|
||||||
|
@ -15,6 +15,14 @@
|
|||||||
* along with this program. If not, see <https://www.gnu.org/licenses/>.
|
* along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
:root {
|
||||||
|
--font-size-no-units: 14;
|
||||||
|
--font-size: calc(1px * var(--font-size-no-units));
|
||||||
|
|
||||||
|
--line-height-no-units: 20;
|
||||||
|
--line-height: calc(var(--line-height-no-units) / var(--font-size-no-units));
|
||||||
|
}
|
||||||
|
|
||||||
html {
|
html {
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
color: #333333;
|
color: #333333;
|
||||||
@ -28,8 +36,8 @@ body {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||||
font-size: 14px;
|
font-size: var(--font-size);
|
||||||
line-height: calc(20 / 14);
|
line-height: var(--line-height);
|
||||||
}
|
}
|
||||||
ul {
|
ul {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
@ -16,6 +16,12 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
|
--font-size-no-units: 14;
|
||||||
|
--font-size: calc(1px * var(--font-size-no-units));
|
||||||
|
|
||||||
|
--line-height-no-units: 20;
|
||||||
|
--line-height: calc(var(--line-height-no-units) / var(--font-size-no-units));
|
||||||
|
|
||||||
--animation-duration: 0s;
|
--animation-duration: 0s;
|
||||||
}
|
}
|
||||||
:root[data-loaded=true] {
|
:root[data-loaded=true] {
|
||||||
@ -40,7 +46,8 @@ body {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||||
font-size: 14px;
|
font-size: var(--font-size);
|
||||||
|
line-height: var(--line-height);
|
||||||
}
|
}
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
|
Loading…
Reference in New Issue
Block a user