All CSS font-size to % instead of px

This commit is contained in:
the-djmaze 2023-12-11 13:34:23 +01:00
parent c1c851c238
commit c3f7827683
21 changed files with 52 additions and 52 deletions

View file

@ -64,7 +64,7 @@ body#rl-app {
#rl-loading, #rl-loading-error, #rl-BadBrowser, #rl-NoCookie { #rl-loading, #rl-loading-error, #rl-BadBrowser, #rl-NoCookie {
color: var(--loading-color, #000); color: var(--loading-color, #000);
text-shadow: var(--loading-text-shadow); text-shadow: var(--loading-text-shadow);
font-size: 30px; font-size: 214%;
line-height: 130%; line-height: 130%;
position: fixed; position: fixed;
text-align: center; text-align: center;

View file

@ -11,7 +11,7 @@
color: var(--settings-menu-color, #333); color: var(--settings-menu-color, #333);
cursor: pointer; cursor: pointer;
display: block; display: block;
font-size: 18px; font-size: 128%;
line-height: 30px; line-height: 30px;
padding: 4px 10px; padding: 4px 10px;
text-decoration: none; text-decoration: none;

View file

@ -26,7 +26,7 @@
font-weight: bold; font-weight: bold;
} }
.package-desc { .package-desc {
font-size: 12px; font-size: 85%;
opacity: 0.7; opacity: 0.7;
} }

View file

@ -1,7 +1,7 @@
#V-PopupsAsk { #V-PopupsAsk {
.modal-body { .modal-body {
font-size: 18px; font-size: 128%;
padding: 3em 15px; padding: 3em 15px;
text-align: center; text-align: center;
} }

View file

@ -14,7 +14,7 @@
.descWrapper { .descWrapper {
color: var(--loading-color, #000); color: var(--loading-color, #000);
font-size: 30px; font-size: 214%;
margin-bottom: 10px; margin-bottom: 10px;
text-align: center; text-align: center;
text-shadow: var(--loading-text-shadow); text-shadow: var(--loading-text-shadow);
@ -68,7 +68,7 @@
} }
input { input {
font-size: 18px; font-size: 128%;
height: 40px; height: 40px;
padding-right: 30px; padding-right: 30px;
@ -92,7 +92,7 @@
.controls > .fontastic:first-child { .controls > .fontastic:first-child {
position: absolute; position: absolute;
font-size: 17px; font-size: 121%;
line-height: 38px; line-height: 38px;
left: 6px; left: 6px;
} }
@ -100,7 +100,7 @@
.btn { .btn {
text-transform: uppercase; text-transform: uppercase;
font-size: 13px; font-size: 90%;
&:hover, &:active { &:hover, &:active {
border-color: #fff; border-color: #fff;

View file

@ -52,7 +52,7 @@
} }
.iconBG { .iconBG {
font-size: 18px; font-size: 128%;
font-weight: bold; font-weight: bold;
line-height: 55px; line-height: 55px;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
@ -78,13 +78,13 @@
} }
.attachmentSize { .attachmentSize {
font-size: 12px; font-size: 85%;
opacity: 0.7; opacity: 0.7;
} }
.iconMain, .iconPreview { .iconMain, .iconPreview {
padding: 6px 0 0; padding: 6px 0 0;
font-size: 36px; font-size: 257%;
color: var(--main-color); color: var(--main-color);
filter: invert(33%); filter: invert(33%);
mix-blend-mode: difference; mix-blend-mode: difference;

View file

@ -52,7 +52,7 @@
.no-attachments-desc { .no-attachments-desc {
padding-top: 50px; padding-top: 50px;
text-align: center; text-align: center;
font-size: 24px; font-size: 171%;
opacity: 0.5; opacity: 0.5;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
} }
@ -65,7 +65,7 @@
.close, .minimize-custom { .close, .minimize-custom {
border-color: #eee; border-color: #eee;
float: none; float: none;
font-size: 24px; font-size: 171%;
opacity: 1; opacity: 1;
line-height: 28px; line-height: 28px;
margin-left: .7em; margin-left: .7em;
@ -145,7 +145,7 @@
line-height: 119px; line-height: 119px;
text-align: center; text-align: center;
background-color: var(--dialog-bg-clr, #fff); background-color: var(--dialog-bg-clr, #fff);
font-size: 24px; font-size: 171%;
border-radius: 10px; border-radius: 10px;

View file

@ -63,7 +63,7 @@
color: #999; color: #999;
text-align: center; text-align: center;
padding: 60px 10px; padding: 60px 10px;
font-size: 24px; font-size: 171%;
line-height: 30px; line-height: 30px;
} }
} }
@ -96,7 +96,7 @@
} }
.nameParent { .nameParent {
font-size: 16px; font-size: 114%;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
@ -150,13 +150,13 @@
line-height: 20px; line-height: 20px;
display: none; display: none;
padding: 5px 7px; padding: 5px 7px;
font-size: 18px; font-size: 128%;
display: none; display: none;
} }
.b-contact-view-desc { .b-contact-view-desc {
text-align: center; text-align: center;
font-size: 24px; font-size: 171%;
line-height: 30px; line-height: 30px;
padding-top: 120px; padding-top: 120px;
color: #999; color: #999;

View file

@ -48,7 +48,7 @@
} }
.emailaddresses li a { .emailaddresses li a {
font-size: 12px; font-size: 85%;
color: #999; color: #999;
padding: 1px; padding: 1px;
position: absolute; position: absolute;

View file

@ -142,7 +142,7 @@
background-color: var(--unread-count-bg-color, #999); background-color: var(--unread-count-bg-color, #999);
border-radius: 1em; border-radius: 1em;
color: var(--unread-count-color, #fff); color: var(--unread-count-color, #fff);
font-size: 11px; font-size: 80%;
line-height: 1.5em; line-height: 1.5em;
margin-top: 7px; margin-top: 7px;
min-width: 1.7em; min-width: 1.7em;
@ -212,6 +212,7 @@
max-height: 2em; max-height: 2em;
max-width: fit-content; max-width: fit-content;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis;
width: calc(100% - 48px); width: calc(100% - 48px);
} }

View file

@ -137,7 +137,7 @@ html.rl-left-panel-disabled {
a { a {
opacity: 0.5; opacity: 0.5;
text-decoration: none; text-decoration: none;
font-size: 22px; font-size: 157%;
padding: 0 3px; padding: 0 3px;
cursor: pointer; cursor: pointer;
@ -147,7 +147,7 @@ html.rl-left-panel-disabled {
&.current { &.current {
opacity: 1; opacity: 1;
font-size: 25px; font-size: 179%;
cursor: default; cursor: default;
} }
} }

View file

@ -32,7 +32,7 @@
.groupLabel { .groupLabel {
background:rgba(128,128,128,0.2); background:rgba(128,128,128,0.2);
cursor: pointer; cursor: pointer;
font-size: 12px; font-size: 85%;
line-height: 2; line-height: 2;
opacity: 0.6; opacity: 0.6;
text-align: center; text-align: center;
@ -63,7 +63,7 @@
display: inline-block; display: inline-block;
margin-top: 5px; margin-top: 5px;
margin-left: 5px; margin-left: 5px;
font-size: 18px; font-size: 128%;
cursor: help; cursor: help;
} }
} }
@ -75,7 +75,7 @@
} }
.btn.buttonMoreSearch { .btn.buttonMoreSearch {
font-size: 11px; font-size: 80%;
padding-left: 8px; padding-left: 8px;
padding-right: 8px; padding-right: 8px;
} }
@ -123,7 +123,7 @@
color: #999; color: #999;
text-align: center; text-align: center;
padding: 60px 10px; padding: 60px 10px;
font-size: 24px; font-size: 171%;
line-height: 30px; line-height: 30px;
} }
@ -147,13 +147,13 @@
} }
.listSearchDesc { .listSearchDesc {
font-size: 16px; font-size: 114%;
padding: 12px; padding: 12px;
border-bottom: 1px solid #eee; border-bottom: 1px solid #eee;
} }
.listThreadUidDesc { .listThreadUidDesc {
font-size: 16px; font-size: 114%;
padding: 7px 20px 6px 20px; padding: 7px 20px 6px 20px;
background-color: rgba(128,128,128,0.5); background-color: rgba(128,128,128,0.5);
border-bottom: 1px solid #888; border-bottom: 1px solid #888;
@ -185,7 +185,7 @@
border-bottom: 1px solid rgba(153, 153, 153, 0.2); border-bottom: 1px solid rgba(153, 153, 153, 0.2);
border-left: 6px solid transparent; border-left: 6px solid transparent;
display: flex; display: flex;
font-size: 13px; font-size: 90%;
line-height: 2; line-height: 2;
position: relative; position: relative;
/* /*
@ -212,7 +212,7 @@
} }
.messageCheckbox { .messageCheckbox {
font-size: 16px; font-size: 114%;
padding: 5px .5em 0; padding: 5px .5em 0;
white-space: nowrap; white-space: nowrap;
} }
@ -223,7 +223,7 @@
time, .sizeParent { time, .sizeParent {
margin: 0 5px 0 0; margin: 0 5px 0 0;
opacity: 0.7; opacity: 0.7;
font-size: 11px; font-size: 80%;
white-space: nowrap; white-space: nowrap;
min-width: 3.5em; min-width: 3.5em;
text-align: var(--right, right); text-align: var(--right, right);
@ -272,7 +272,7 @@
.threads-len { .threads-len {
border-radius: var(--border-radius, 5px); border-radius: var(--border-radius, 5px);
border: 1px solid #ccc; border: 1px solid #ccc;
font-size: 11px; font-size: 80%;
padding: 0 4px; padding: 0 4px;
white-space: nowrap; white-space: nowrap;
&:hover { &:hover {

View file

@ -18,7 +18,7 @@
position: relative; position: relative;
display: inline-block; display: inline-block;
color: white; color: white;
font-size: 20px; font-size: 143%;
line-height: 30px; line-height: 30px;
background: rgba(0, 0, 0, .6); background: rgba(0, 0, 0, .6);
padding: 15px; padding: 15px;
@ -68,7 +68,7 @@
.b-message-view-desc { .b-message-view-desc {
text-align: center; text-align: center;
font-size: 24px; font-size: 171%;
line-height: 30px; line-height: 30px;
color: #999; color: #999;
padding: 25vh 10px 0; padding: 25vh 10px 0;
@ -139,7 +139,7 @@
.subjectParent { .subjectParent {
display: flex; display: flex;
font-size: 18px; font-size: 128%;
font-weight: bold; font-weight: bold;
} }
@ -257,7 +257,7 @@
.loading { .loading {
text-align: center; text-align: center;
font-size: 24px; font-size: 171%;
color: grey; color: grey;
padding: 50px 0; padding: 50px 0;
} }
@ -392,7 +392,7 @@
img[data-x-src]:not([src]):hover::after { img[data-x-src]:not([src]):hover::after {
content: attr(data-x-src); content: attr(data-x-src);
font-family: var(--fontSans); font-family: var(--fontSans);
font-size: 11px; font-size: 80%;
height: auto; height: auto;
transform: translate(-25%,0); transform: translate(-25%,0);
width: fit-content; width: fit-content;

View file

@ -7,7 +7,7 @@
color: var(--settings-menu-color, #333); color: var(--settings-menu-color, #333);
cursor: pointer; cursor: pointer;
display: block; display: block;
font-size: 18px; font-size: 128%;
line-height: 2em; line-height: 2em;
max-height: 2em; max-height: 2em;
overflow: hidden; overflow: hidden;

View file

@ -18,7 +18,7 @@
} }
.squire-toolbar select { .squire-toolbar select {
font-size: 12px; font-size: 85%;
padding: 4px 1.5em 4px 6px; padding: 4px 1.5em 4px 6px;
text-align: var(--left, left); text-align: var(--left, left);
vertical-align: middle; vertical-align: middle;
@ -46,7 +46,6 @@
*/ */
.squire-wysiwyg, .squire-plain { .squire-wysiwyg, .squire-plain {
font-size: 13px;
height: 100%; height: 100%;
line-height: 16px; line-height: 16px;
min-height: 200px; min-height: 200px;

View file

@ -24,7 +24,7 @@
.audioPlace { .audioPlace {
cursor: pointer; cursor: pointer;
display: inline-block; display: inline-block;
font-size: 30px; font-size: 214%;
height: 1em; height: 1em;
margin-right: 10px; margin-right: 10px;
width: 1em; width: 1em;
@ -64,7 +64,7 @@
background-color: var(--unread-count-bg-color, #999); background-color: var(--unread-count-bg-color, #999);
border-radius: 1em; border-radius: 1em;
color: var(--unread-count-color, #fff); color: var(--unread-count-color, #fff);
font-size: 11px; font-size: 80%;
line-height: 1.5em; line-height: 1.5em;
min-width: 1.7em; min-width: 1.7em;
padding: 1px 4px; padding: 1px 4px;

View file

@ -8,7 +8,7 @@
border: 1px solid #999; border: 1px solid #999;
color: red; color: red;
content: attr(data-rainloopErrorTip); content: attr(data-rainloopErrorTip);
font-size: 13px; font-size: 90%;
left: 100%; left: 100%;
opacity: 1; opacity: 1;
padding: 0.25em; padding: 0.25em;

View file

@ -18,7 +18,7 @@
/* .b-contacts-content .b-view-content */ /* .b-contacts-content .b-view-content */
.iconsize24 { .iconsize24 {
font-size: 24px; font-size: 171%;
} }
.iconcolor-green { .iconcolor-green {

View file

@ -145,7 +145,7 @@ export class ContactsPopupView extends AbstractViewPopup {
addresses = addresses.slice(0,1); addresses = addresses.slice(0,1);
} }
addresses.forEach(address => { addresses.forEach(address => {
email = new EmailModel(address, name); email = new EmailModel(address.value(), name);
email.valid() && aE.push(email); email.valid() && aE.push(email);
}); });
/* /*

View file

@ -539,7 +539,7 @@
"LABEL_VIEW_MESSAGE_ENTER": "Bericht lezen (leesvenster uitgeschakeld)", "LABEL_VIEW_MESSAGE_ENTER": "Bericht lezen (leesvenster uitgeschakeld)",
"LABEL_SWITCH_TO_MESSAGE": "Schakel focus naar bericht", "LABEL_SWITCH_TO_MESSAGE": "Schakel focus naar bericht",
"LABEL_SWITCH_TO_FOLDER_LIST": "Schakel focus naar berichtenlijst", "LABEL_SWITCH_TO_FOLDER_LIST": "Schakel focus naar berichtenlijst",
"LABEL_FULLSCREEN_TOGGLE": "Schakel tussen normaal en lezen in volledig scherm", "LABEL_FULLSCREEN_TOGGLE": "Wissel volledige scherm modus",
"LABEL_BLOCKQUOTES_TOGGLE": "Schakel blok citaten aan of uit", "LABEL_BLOCKQUOTES_TOGGLE": "Schakel blok citaten aan of uit",
"LABEL_THREAD_NEXT": "Volgende bericht in groep", "LABEL_THREAD_NEXT": "Volgende bericht in groep",
"LABEL_THREAD_PREV": "Vorige bericht in groep", "LABEL_THREAD_PREV": "Vorige bericht in groep",

View file

@ -36,12 +36,12 @@ h1, h2, h3, h4, h5, h6 {
margin: 0.715em 0; margin: 0.715em 0;
text-rendering: optimizelegibility; // Fix the character spacing for headings text-rendering: optimizelegibility; // Fix the character spacing for headings
} }
h1 { font-size: 36px; } h1 { font-size: 257%; }
h2 { font-size: 30px; } h2 { font-size: 214%; }
h3 { font-size: 24px; } h3 { font-size: 171%; }
h4 { font-size: 18px; } h4 { font-size: 128%; }
h5 { font-size: 14px; } h5 { font-size: 100%; }
h6 { font-size: 12px; } h6 { font-size: 85%; }
h4, h5, h6 { line-height: 20px; } h4, h5, h6 { line-height: 20px; }