diff options
| author | Raimund Schlüßler <raimund.schluessler@mailbox.org> | 2020-07-23 23:01:30 +0300 |
|---|---|---|
| committer | Raimund Schlüßler <raimund.schluessler@mailbox.org> | 2020-07-23 23:01:30 +0300 |
| commit | ed3ab3281afd27f1baf210f6eafbe1ac8549dc5b (patch) | |
| tree | 0eccd75c148269e9a1a664a7b7358f7d41d28d27 /css | |
| parent | 3c4672a5635f15a37bf50b0aca65340026aaebad (diff) | |
Adjust checkbox css, also style details checkbox
Signed-off-by: Raimund Schlüßler <raimund.schluessler@mailbox.org>
Diffstat (limited to 'css')
| -rw-r--r-- | css/src/style.scss | 54 |
1 files changed, 39 insertions, 15 deletions
diff --git a/css/src/style.scss b/css/src/style.scss index 0b35f4c8..d9f941f5 100644 --- a/css/src/style.scss +++ b/css/src/style.scss @@ -5,9 +5,6 @@ $red_overdue: #b3312d; // overdue dates and high importance $yellow: #fd0; // medium importance $blue_due: #4271a6; // due dates and low importance -// Specify colors for each non-zero priority level -$priority_colors: ($red_overdue, $red_overdue, $red_overdue, $red_overdue, $yellow, $blue_due, $blue_due, $blue_due, $blue_due); - /** * rules for app-navigation */ @@ -527,13 +524,6 @@ $priority_colors: ($red_overdue, $red_overdue, $red_overdue, $red_overdue, $yell display: none; } - // Apply colors to checkboxes for each non-zero priority level - @for $i from 1 through 9 { - &[data-priority="#{$i}"]>.task-body>.task-checkbox>input[type='checkbox'].checkbox + label::before { - border-color: nth($priority_colors, $i); - } - } - .task-body { display: flex; flex-direction: row; @@ -555,10 +545,22 @@ $priority_colors: ($red_overdue, $red_overdue, $red_overdue, $red_overdue, $yell height: 44px; width: 44px; - input[type='checkbox'].checkbox + label::before { - border-width: 2px; - border-radius: var(--border-radius); - border-color: $color-lightgrey; + input[type='checkbox'].checkbox + label { + &::before { + border-width: 2px; + border-radius: var(--border-radius); + } + + &.priority-high::before { + border-color: $red_overdue; + } + &.priority-medium::before { + border-color: $yellow; + } + + &.priority-low::before { + border-color: $blue_due; + } } } @@ -870,7 +872,24 @@ $priority_colors: ($red_overdue, $red_overdue, $red_overdue, $red_overdue, $yell .detail-checkbox { padding: 11px 10px; - opacity: .5; + + input[type='checkbox'].checkbox + label { + &::before { + border-width: 2px; + border-radius: var(--border-radius); + } + + &.priority-high::before { + border-color: $red_overdue; + } + &.priority-medium::before { + border-color: $yellow; + } + + &.priority-low::before { + border-color: $blue_due; + } + } } .title-wrapper { @@ -1223,6 +1242,11 @@ $priority_colors: ($red_overdue, $red_overdue, $red_overdue, $red_overdue, $yell label { padding-left: 14px; width: 100%; + + &::before { + border-width: 2px; + border-radius: var(--border-radius); + } } div, |