🏡 index : ~doyle/chartered.git

author Jordan Doyle <jordan@doyle.la> 2021-10-16 22:43:39.0 +01:00:00
committer Jordan Doyle <jordan@doyle.la> 2021-10-16 22:43:39.0 +01:00:00
commit
2b4da52a640081d6183657d064781a8a4ed6e3be [patch]
tree
1ac306a637a3562ebcbaaa8f230b8eb49fcd2d23
parent
9c375ffe72b5e4846a20fb2c963f4a8e4ff418b1
download
2b4da52a640081d6183657d064781a8a4ed6e3be.tar.gz

fiddle with dark mode colours



Diff

 chartered-frontend/src/dark.sass           | 19 +++++++++++++++----
 chartered-frontend/src/pages/Dashboard.tsx |  2 +-
 2 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/chartered-frontend/src/dark.sass b/chartered-frontend/src/dark.sass
index 45d3a88..4b63e3c 100644
--- a/chartered-frontend/src/dark.sass
+++ a/chartered-frontend/src/dark.sass
@@ -1,17 +1,19 @@
@import "../node_modules/bootstrap/scss/functions"
@import "../node_modules/bootstrap/scss/variables"
@import "../node_modules/bootstrap/scss/mixins"
@import "../node_modules/bootstrap/scss/_navbar"

$dark-bg-color: hsl(213, 44%, 10%)

html, body
  @media(prefers-color-scheme: dark)
    background: hsl(213, 44%, 7%) !important
    background: $dark-bg-color !important

.dark
  $primary: hsl(212, 70%, 30%)
  $secondary: hsl(213, 44%, 7%)
  $primary: hsl(212, 70%, 49%)
  $secondary: $dark-bg-color
  $dark: hsl(0, 0%, 0%)
  $card-border-color: hsl(212, 25%, 12%)
  $card-border-color: hsl(212, 25%, 22%)
  $light: rgba(255, 255, 255, 0.55)
  $link-color: $primary

@@ -34,7 +36,14 @@
    color: $body-color !important

  a.btn
    color: white
    color: $link-color

  .btn-outline-light
    border-color: $link-color

    &:hover
      color: $body-color
      background-color: $link-color

  table
    border-color: $card-border-color !important
diff --git a/chartered-frontend/src/pages/Dashboard.tsx b/chartered-frontend/src/pages/Dashboard.tsx
index b713d79..948355b 100644
--- a/chartered-frontend/src/pages/Dashboard.tsx
+++ a/chartered-frontend/src/pages/Dashboard.tsx
@@ -160,7 +160,7 @@
      className="text-decoration-none"
    >
      <div className="card border-0 mb-2 shadow-sm">
        <div className="card-body text-black d-flex flex-row">
        <div className="card-body d-flex flex-row">
          <div className="flex-grow-1 align-self-center">
            <h6 className="text-primary my-0">
              <span className="text-muted">{organisation}/</span>