css variables

main2
Bob Mottram 2019-09-11 21:29:47 +01:00
parent dc726e2c78
commit 4b321074bb
3 changed files with 25 additions and 13 deletions

View File

@ -11,6 +11,10 @@
--font-size: 40px; --font-size: 40px;
--text-entry-foreground: #ccc; --text-entry-foreground: #ccc;
--text-entry-background: #111; --text-entry-background: #111;
--time-color: #aaa;
--button-text: #FFFFFF;
--button-background: #999;
--button-selected: #666;
} }
body, html { body, html {
@ -64,9 +68,9 @@ a:link {
.button { .button {
border-radius: 4px; border-radius: 4px;
background-color: #999; background-color: var(--button-background);
border: none; border: none;
color: white; color: var(--button-text);
text-align: center; text-align: center;
padding: 10px; padding: 10px;
font-size: var(--font-size); font-size: var(--font-size);
@ -95,7 +99,7 @@ input[type=text] {
border-radius: 4px; border-radius: 4px;
background-color: #999; background-color: #999;
border: none; border: none;
color: #FFFFFF; color: var(--button-text);
text-align: center; text-align: center;
font-size: var(--font-size); font-size: var(--font-size);
padding: 2px; padding: 2px;
@ -129,9 +133,9 @@ input[type=text] {
} }
.button { .button {
border-radius: 4px; border-radius: 4px;
background-color: #999; background-color: var(--button-background);
border: none; border: none;
color: white; color: var(--button-text);
text-align: center; text-align: center;
padding: 10px; padding: 10px;
font-size: 24px; font-size: 24px;
@ -157,9 +161,9 @@ input[type=text] {
} }
.button { .button {
border-radius: 4px; border-radius: 4px;
background-color: #999; background-color: var(--button-background);
border: none; border: none;
color: white; color: var(--button-text);
text-align: center; text-align: center;
padding: 10px; padding: 10px;
font-size: 40px; font-size: 40px;

View File

@ -12,6 +12,10 @@
--font-size-mobile: 40px; --font-size-mobile: 40px;
--text-entry-foreground: #ccc; --text-entry-foreground: #ccc;
--text-entry-background: #111; --text-entry-background: #111;
--time-color: #aaa;
--button-text: #FFFFFF;
--button-background: #999;
--button-selected: #666;
} }
body, html { body, html {
@ -56,8 +60,8 @@ input[type=text], input[type=password] {
} }
button { button {
background-color: #555; background-color: var(--button-background);
color: white; color: var(--button-text);
padding: 14px 20px; padding: 14px 20px;
margin: 8px 0; margin: 8px 0;
border: none; border: none;
@ -121,8 +125,8 @@ span.psw {
font-size: var(--font-size); font-size: var(--font-size);
} }
button { button {
background-color: #555; background-color: var(--button-background);
color: white; color: var(--button-text);
padding: 14px 20px; padding: 14px 20px;
margin: 8px 0; margin: 8px 0;
border: none; border: none;
@ -160,8 +164,8 @@ span.psw {
font-size: var(--font-size-mobile); font-size: var(--font-size-mobile);
} }
button { button {
background-color: #555; background-color: var(--button-background);
color: white; color: var(--button-text);
padding: 14px 20px; padding: 14px 20px;
margin: 8px 0; margin: 8px 0;
border: none; border: none;

View File

@ -14,6 +14,10 @@
--font-size: 22px; --font-size: 22px;
--text-entry-foreground: #ccc; --text-entry-foreground: #ccc;
--text-entry-background: #111; --text-entry-background: #111;
--time-color: #aaa;
--button-text: #FFFFFF;
--button-background: #999;
--button-selected: #666;
} }
body, html { body, html {