From 6b05ef8f8f32cbd55c99786ef8a858280231d02b Mon Sep 17 00:00:00 2001 From: James Lyne Date: Tue, 7 Dec 2021 21:48:54 +0000 Subject: [PATCH] Add CSS variables for marker colours --- index.html | 4 +++- src/scss/leaflet/_markers.scss | 6 +++--- 2 files changed, 6 insertions(+), 4 deletions(-) diff --git a/index.html b/index.html index a292f5d..f3e7159 100644 --- a/index.html +++ b/index.html @@ -153,9 +153,10 @@ /* Theme colours */ :root { --background-base: #222222; /* Foreground UI elements */ - --background-dark: #121212; /* Body/map labels */ + --background-dark: #121212; /* Body/Splash screen/Shadows */ --background-light: #363636; /* Scrollbars/inputs */ --background-error: #771616; /* Errors */ + --background-marker: var(--background-dark); /* Map markers */ --background-disabled: #555555; /* Disabled controls */ --background-hover: #363636; /* :hovered buttons/menu items */ @@ -173,6 +174,7 @@ --text-emphasis: rgba(255, 255, 255, 0.87); /* Chat messages/:focus inputs */ --text-subtle: rgba(255, 255, 255, 0.5); /* Skeletons/secondary text */ --text-disabled: var(--text-subtle); /* Disabled controls */ + --text-marker: var(--text-base); /* Map markers */ --text-hover: var(--text-base); /* Text in :hover buttons */ --text-active: var(--text-base); /* Text in :active buttons */ diff --git a/src/scss/leaflet/_markers.scss b/src/scss/leaflet/_markers.scss index a319702..c6767e3 100644 --- a/src/scss/leaflet/_markers.scss +++ b/src/scss/leaflet/_markers.scss @@ -36,7 +36,7 @@ position: absolute; left: 0; background-color: var(--text-emphasis); - border: 0.2rem solid var(--background-dark); + border: 0.2rem solid var(--background-marker); border-radius: 50%; } @@ -116,8 +116,8 @@ font-size: 1.5rem; line-height: 1; white-space: pre-line; - color: var(--text-base); - background: var(--background-dark); + color: var(--text-marker); + background: var(--background-marker); padding: 0.2rem; display: none; margin-left: 0.2rem;