Color variables

main2
Bob Mottram 2019-09-24 10:07:36 +01:00
parent 2c485093d0
commit b956be89e7
1 changed files with 16 additions and 12 deletions

View File

@ -21,6 +21,10 @@
--button-text: #FFFFFF; --button-text: #FFFFFF;
--button-background: #999; --button-background: #999;
--button-selected: #666; --button-selected: #666;
--button-highlighted: green;
--button-selected-highlighted: darkgreen;
--button-approve: darkgreen;
--button-deny: darkred;
} }
body, html { body, html {
@ -186,7 +190,7 @@ a:link {
.buttonhighlighted { .buttonhighlighted {
border-radius: 4px; border-radius: 4px;
background-color: green; background-color: var(--button-highlighted);
border: none; border: none;
color: var(--button-text); color: var(--button-text);
text-align: center; text-align: center;
@ -206,7 +210,7 @@ a:link {
.followApprove { .followApprove {
border-radius: 4px; border-radius: 4px;
background-color: darkgreen; background-color: var(--button-approve);
border: none; border: none;
color: #FFFFFF; color: #FFFFFF;
text-align: center; text-align: center;
@ -222,7 +226,7 @@ a:link {
.followDeny { .followDeny {
border-radius: 4px; border-radius: 4px;
background-color: darkred; background-color: var(--button-deny);
border: none; border: none;
color: #FFFFFF; color: #FFFFFF;
text-align: center; text-align: center;
@ -283,7 +287,7 @@ a:link {
.buttonselectedhighlighted { .buttonselectedhighlighted {
border-radius: 4px; border-radius: 4px;
background-color: darkgreen; background-color: var(--button-selected-highlighted);
border: none; border: none;
color: var(--button-text); color: var(--button-text);
text-align: center; text-align: center;
@ -811,7 +815,7 @@ input[type=checkbox]
} }
.buttonhighlighted { .buttonhighlighted {
border-radius: 4px; border-radius: 4px;
background-color: green; background-color: var(--button-highlighted);
border: none; border: none;
color: var(--button-text); color: var(--button-text);
text-align: center; text-align: center;
@ -841,7 +845,7 @@ input[type=checkbox]
} }
.buttonselectedhighlighted { .buttonselectedhighlighted {
border-radius: 4px; border-radius: 4px;
background-color: darkgreen; background-color: var(--button-selected-highlighted);
border: none; border: none;
color: var(--button-text); color: var(--button-text);
text-align: center; text-align: center;
@ -856,7 +860,7 @@ input[type=checkbox]
} }
.followApprove { .followApprove {
border-radius: 4px; border-radius: 4px;
background-color: darkgreen; background-color: var(--button-approve);
border: none; border: none;
color: #FFFFFF; color: #FFFFFF;
text-align: center; text-align: center;
@ -871,7 +875,7 @@ input[type=checkbox]
} }
.followDeny { .followDeny {
border-radius: 4px; border-radius: 4px;
background-color: darkred; background-color: var(--button-deny);
border: none; border: none;
color: #FFFFFF; color: #FFFFFF;
text-align: center; text-align: center;
@ -1036,7 +1040,7 @@ input[type=checkbox]
} }
.buttonhighlighted { .buttonhighlighted {
border-radius: 4px; border-radius: 4px;
background-color: green; background-color: var(--button-highlighted);
border: none; border: none;
color: var(--button-text); color: var(--button-text);
text-align: center; text-align: center;
@ -1066,7 +1070,7 @@ input[type=checkbox]
} }
.buttonselectedhighlighted { .buttonselectedhighlighted {
border-radius: 4px; border-radius: 4px;
background-color: darkgreen; background-color: var(--button-selected-highlighted);
border: none; border: none;
color: var(--button-text); color: var(--button-text);
text-align: center; text-align: center;
@ -1081,7 +1085,7 @@ input[type=checkbox]
} }
.followApprove { .followApprove {
border-radius: 4px; border-radius: 4px;
background-color: darkgreen; background-color: var(--button-approve);
border: none; border: none;
color: #FFFFFF; color: #FFFFFF;
text-align: center; text-align: center;
@ -1096,7 +1100,7 @@ input[type=checkbox]
} }
.followDeny { .followDeny {
border-radius: 4px; border-radius: 4px;
background-color: darkred; background-color: var(--button-deny);
border: none; border: none;
color: #FFFFFF; color: #FFFFFF;
text-align: center; text-align: center;