css changes

This commit is contained in:
Gerome Matilla 2020-06-11 10:33:21 +08:00
parent 33ae0f6412
commit 644ed3e678
5 changed files with 53 additions and 18 deletions

View File

@ -1,7 +1,9 @@
:root { :root {
/* Colors */ /* Colors */
--base-body-bg: #1a1a1aff;
--base-bg: #00000060; --base-bg: #00000060;
--base-color: #f2f2f2; --base-color: #fefefeff;
--base-container: #f2f2f220; --base-container: #f2f2f220;
--base-hover-bg: #f2f2f230; --base-hover-bg: #f2f2f230;
@ -41,7 +43,7 @@ body {
margin: 0; margin: 0;
padding: 0; padding: 0;
overflow: hidden; overflow: hidden;
background: #1a1a1a; background: var(--base-body-bg);
color: var(--foreground); color: var(--foreground);
} }
@ -53,7 +55,7 @@ html, body {
/*Placeholder*/ /*Placeholder*/
::placeholder { ::placeholder {
color: var(--base-color); color: var(--base-color);
opacity: 0.75; opacity: 0.65;
} }
/*Scrollbar*/ /*Scrollbar*/
@ -84,6 +86,7 @@ select:focus{
outline: none; outline: none;
} }
/*Select*/
select { select {
text-align: center; text-align: center;
text-align-last: center; text-align-last: center;

View File

@ -7,9 +7,10 @@
} }
#dateMessage { #dateMessage {
color: #f2f2f2; color: var(--base-color);
font-size: 12pt; font-size: 12pt;
font-family: roboto, sans-serif; font-family: roboto, sans-serif;
font-weight: 400; font-weight: 400;
margin: 5px; margin: 5px;
word-wrap: break-word;
} }

View File

@ -33,9 +33,10 @@
} }
#searchEngineHeaderLabel { #searchEngineHeaderLabel {
text-align: left; font-family: roboto-bold, sans-serif;
font-weight: bold; font-weight: bold;
font-size: 14pt; font-size: 14pt;
text-align: left;
margin-top: auto; margin-top: auto;
margin-bottom: auto; margin-bottom: auto;
} }
@ -50,11 +51,16 @@
box-sizing: border-box; box-sizing: border-box;
margin-top: 5px; margin-top: 5px;
border: none; border: none;
text-align: center; text-align: center;
border-radius: 6px; border-radius: 6px;
color: var(--base-color); color: var(--base-color);
background: var(--base-container); background: var(--base-container);
font-family: roboto, sans-serif;
font-size: 12pt;
font-weight: 400;
-webkit-appearance: none; -webkit-appearance: none;
-moz-appearance: none; -moz-appearance: none;
appearance: none; appearance: none;
@ -89,6 +95,11 @@ select::-ms-expand {
background: var(--base-container); background: var(--base-container);
color: var(--base-color); color: var(--base-color);
text-align: center; text-align: center;
font-family: roboto, sans-serif;
font-size: 12pt;
font-weight: 400;
width: 100%; width: 100%;
height: 32px; height: 32px;
margin-top: 5px; margin-top: 5px;

View File

@ -33,9 +33,10 @@
} }
#themeEngineHeaderLabel { #themeEngineHeaderLabel {
text-align: left; font-family: roboto-bold, sans-serif;
font-weight: bold; font-weight: bold;
font-size: 14pt; font-size: 14pt;
text-align: left;
margin-top: auto; margin-top: auto;
margin-bottom: auto; margin-bottom: auto;
} }
@ -78,6 +79,10 @@ select::-ms-expand {
background: var(--base-container); background: var(--base-container);
color: var(--base-color); color: var(--base-color);
text-align: center; text-align: center;
font-family: roboto, sans-serif;
font-size: 12pt;
font-weight: 400;
width: 100%; width: 100%;
height: 32px; height: 32px;
margin-top: 5px; margin-top: 5px;
@ -111,6 +116,13 @@ select::-ms-expand {
margin-top: 5px; margin-top: 5px;
} }
.themeEngineLabels {
font-family: roboto, sans-serif;
color: var(--base-color);
font-size: 11pt;
font-weight: 400;
}
.backgroundColorSetter, .backgroundColorSetter,
.foregroundColorSetter, .foregroundColorSetter,
.blurSetter, .blurSetter,
@ -125,14 +137,21 @@ select::-ms-expand {
} }
#backgroundSet, #backgroundSet,
#foregroundSet { #foregroundSet,
#backgroundOpacitySet,
#foregroundOpacitySet {
margin-right: 2.5px; margin-right: 2.5px;
height: 32px; height: 32px;
width: 100%; width: 100%;
box-sizing: border-box; box-sizing: border-box;
border: none; border: none;
text-align: center; text-align: center;
border-radius: 6px; border-radius: 6px;
font-family: roboto, sans-serif;
font-size: 12pt;
font-weight: 400;
color: var(--base-color); color: var(--base-color);
background: var(--panel-bg); background: var(--panel-bg);
} }
@ -140,14 +159,8 @@ select::-ms-expand {
#backgroundOpacitySet, #backgroundOpacitySet,
#foregroundOpacitySet { #foregroundOpacitySet {
margin-left: 2.5px; margin-left: 2.5px;
height: 32px; margin-right: 0;
width: 25%; width: 25%;
box-sizing: border-box;
border: none;
text-align: center;
border-radius: 6px;
color: var(--base-color);
background: var(--panel-bg);
} }
#blurSet, #blurSet,

View File

@ -33,9 +33,10 @@
} }
#weatherSettingsHeaderLabel { #weatherSettingsHeaderLabel {
text-align: left; font-family: roboto-bold, sans-serif;
font-weight: bold; font-weight: bold;
font-size: 14pt; font-size: 14pt;
text-align: left;
margin-top: auto; margin-top: auto;
margin-bottom: auto; margin-bottom: auto;
} }
@ -48,7 +49,9 @@
} }
.weatherSettingsLabels { .weatherSettingsLabels {
font-size: 12pt; font-family: roboto, sans-serif;
font-size: 11pt;
font-weight: 400;
text-align: left; text-align: left;
} }
@ -60,8 +63,12 @@
border: none; border: none;
text-align: center; text-align: center;
border-radius: 6px; border-radius: 6px;
color: var(--base-color);
background: var(--panel-bg); background: var(--panel-bg);
font-family: roboto, sans-serif;
font-size: 12pt;
font-weight: 400;
color: var(--base-color);
/*Center vertically*/ /*Center vertically*/
display: flex; display: flex;