From 366fd630dc8eb2cb6dafaec6ed33d0fc1ddc0444 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Javi=20Mart=C3=ADn?= <javim@elretirao.net>
Date: Sat, 29 May 2021 17:14:24 +0200
Subject: [PATCH] Use $table-background to set table colors

This way it's possible to customize these colors by just changing a
variable.

The code is now quite a bit hacky; since I'm not an expert in color
design, I didn't want to change the colors we were using in case it made
the application have less appeal.

If slightly changing these colors isn't a problem, we could use
Foundation's defaults to simplify the code, maybe just changing the
`$table-color-scale` variable.
---
 app/assets/stylesheets/admin.scss  | 2 +-
 app/assets/stylesheets/layout.scss | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/app/assets/stylesheets/admin.scss b/app/assets/stylesheets/admin.scss
index a67c23f99..e2372ffa1 100644
--- a/app/assets/stylesheets/admin.scss
+++ b/app/assets/stylesheets/admin.scss
@@ -226,7 +226,7 @@ $table-header:   #ecf1f6;
       border: $table-border;
 
       &:hover {
-        background: #f3f6f7;
+        background: adjust-color(darken($table-background, 2%), $red: -4, $green: -1);
       }
     }
 
diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss
index 3a5341170..a54d1a0d7 100644
--- a/app/assets/stylesheets/layout.scss
+++ b/app/assets/stylesheets/layout.scss
@@ -1433,11 +1433,11 @@ table {
     }
 
     &:nth-child(odd) {
-      background: #fff;
+      background: $table-background;
     }
 
     &:nth-child(even) {
-      background: #fafcfb;
+      background: adjust-color($table-background, $red: -3, $green: -1, $blue: -2);
     }
   }