diff options
| author | Ben Klein <robobenklein@gmail.com> | 2020-06-26 03:02:15 +0000 |
|---|---|---|
| committer | Shyam Sunder <sgsunder1@gmail.com> | 2020-07-08 17:45:21 -0400 |
| commit | 800a79f95f667fb03fc705835271a76a8d0a168c (patch) | |
| tree | 2834ffe4c08cfae0c38a812a89a11c164d813d6a /client | |
| parent | 13e2888ae4be027162f037246d36cf316a3072b1 (diff) | |
client/css/snapshot-list-view: use alpha for dark
using alpha and an is-dark check to support dark color schemes in the
history page
Diffstat (limited to 'client')
| -rw-r--r-- | client/css/snapshots-list-view.styl | 17 |
1 files changed, 13 insertions, 4 deletions
diff --git a/client/css/snapshots-list-view.styl b/client/css/snapshots-list-view.styl index b059a64..3a60237 100644 --- a/client/css/snapshots-list-view.styl +++ b/client/css/snapshots-list-view.styl @@ -1,8 +1,17 @@ +@import colors $snapshot-created-background-color = #E0F5E0 $snapshot-modified-background-color = #E0F5FF $snapshot-deleted-background-color = #FDE5E5 $snapshot-merged-background-color = #FEC +$is-dark = dark($window-color) + +if $is-dark + $snapshot-created-background-color = darken($snapshot-created-background-color, 80%) + $snapshot-modified-background-color = darken($snapshot-modified-background-color, 80%) + $snapshot-deleted-background-color = darken($snapshot-deleted-background-color, 80%) + $snapshot-merged-background-color = darken($snapshot-merged-background-color, 80%) + .snapshot-list text-align: left @@ -31,16 +40,16 @@ $snapshot-merged-background-color = #FEC div.operation-created background: $snapshot-created-background-color &+.details - background: lighten($snapshot-created-background-color, 50%) + background: alpha($snapshot-created-background-color, 50%) div.operation-modified background: $snapshot-modified-background-color &+.details - background: lighten($snapshot-modified-background-color, 50%) + background: alpha($snapshot-modified-background-color, 50%) div.operation-deleted background: $snapshot-deleted-background-color &+.details - background: lighten($snapshot-deleted-background-color, 50%) + background: alpha($snapshot-deleted-background-color, 50%) div.operation-merged background: $snapshot-merged-background-color &+.details - background: lighten($snapshot-merged-background-color, 50%) + background: alpha($snapshot-merged-background-color, 50%) |