update colours for better UX and implement AA minimum contrast

This commit is contained in:
Robin Scholtes 2023-05-15 14:18:10 +12:00
parent 9ec902a369
commit f5f0e91d51
3 changed files with 10 additions and 5 deletions

View file

@ -39,7 +39,7 @@
float: left; float: left;
margin: 0 10px 0 0; margin: 0 10px 0 0;
padding: 0; padding: 0;
color: var(--category-list-font-colour); color: var(--op-list-operation-font-colour);
opacity: .35; opacity: .35;
cursor: pointer; cursor: pointer;
} }
@ -54,7 +54,7 @@
.op-icon.check-icon { .op-icon.check-icon {
display: none; display: none;
color: #47d047; color: var(--checkmark-color);
} }
.operation.selected { .operation.selected {

View file

@ -46,8 +46,8 @@
/* Operation colours */ /* Operation colours */
--op-list-operation-font-colour: #3a87ad; --op-list-operation-font-colour: #2f6d8c;
--op-list-operation-bg-colour: #d9edf7; --op-list-operation-bg-colour: #e7f3f8;
--op-list-operation-border-colour: #bce8f1; --op-list-operation-border-colour: #bce8f1;
--rec-list-operation-font-colour: #468847; --rec-list-operation-font-colour: #468847;
@ -55,9 +55,12 @@
--rec-list-operation-border-colour: #d3e8c0; --rec-list-operation-border-colour: #d3e8c0;
--selected-operation-font-color: #c09853; --selected-operation-font-color: #c09853;
--selected-operation-bg-colour: rgba(217, 237, 247, 0.5); --selected-operation-bg-colour: #d5ebf5;
--selected-operation-border-colour: #fbeed5; --selected-operation-border-colour: #fbeed5;
/*mobile UI: selected operation checkmark*/
--checkmark-color: var(--op-list-operation-font-colour);
--breakpoint-font-colour: #b94a48; --breakpoint-font-colour: #b94a48;
--breakpoint-bg-colour: #f2dede; --breakpoint-bg-colour: #f2dede;
--breakpoint-border-colour: #eed3d7; --breakpoint-border-colour: #eed3d7;

View file

@ -54,6 +54,8 @@
--selected-operation-bg-colour: #3f3f3f; --selected-operation-bg-colour: #3f3f3f;
--selected-operation-border-colour: #444; --selected-operation-border-colour: #444;
--checkmark-color: #47d047;
--breakpoint-font-colour: #ddd; --breakpoint-font-colour: #ddd;
--breakpoint-bg-colour: #073655; --breakpoint-bg-colour: #073655;
--breakpoint-border-colour: #444; --breakpoint-border-colour: #444;