From 8f960bbae6c16d15b2bb0b0269ccb914751b4189 Mon Sep 17 00:00:00 2001
From: George <31376482+george-gca@users.noreply.github.com>
Date: Sun, 14 May 2023 22:10:29 -0300
Subject: [PATCH] Fix table color (#1424)

Fix table color when dark mode is default.

---------

Signed-off-by: George Araujo <george.gcac@gmail.com>
---
 _config.yml                 |  2 ++
 _includes/head.html         |  2 +-
 _includes/scripts/misc.html |  2 +-
 _sass/_base.scss            |  5 ++++-
 assets/js/no_defer.js       | 12 ++++++------
 5 files changed, 14 insertions(+), 9 deletions(-)

diff --git a/_config.yml b/_config.yml
index fb0f615..ff92783 100644
--- a/_config.yml
+++ b/_config.yml
@@ -378,6 +378,8 @@ bootstrap:
   integrity:
     css: "sha256-DF7Zhf293AJxJNTmh5zhoYYIMs2oXitRfBjY+9L//AY="
     js: "sha256-fgLAgv7fyCGopR/gBNq2iW3ZKIdqIcyshnUULC4vex8="
+bootstrap-table:
+  version: "1.21.4"
 fontawesome:
   version: "5.15.4"
   integrity: "sha256-mUZM63G8m73Mcidfrv5E+Y61y7a12O5mW4ezU3bxqW4="
diff --git a/_includes/head.html b/_includes/head.html
index b05a0d6..e717c18 100644
--- a/_includes/head.html
+++ b/_includes/head.html
@@ -6,7 +6,7 @@
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/mdbootstrap@{{ site.mdb.version }}/css/mdb.min.css" integrity="{{ site.mdb.integrity.css }}" crossorigin="anonymous" />
 
     <!-- Bootstrap Table -->
-    <link defer rel="stylesheet" href="https://unpkg.com/bootstrap-table@1.21.3/dist/bootstrap-table.min.css">
+    <link defer rel="stylesheet" href="https://unpkg.com/bootstrap-table@{{ site.bootstrap-table.version }}/dist/bootstrap-table.min.css">
 
     <!-- Fonts & Icons -->
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@{{ site.fontawesome.version }}/css/all.min.css" integrity="{{ site.fontawesome.integrity }}" crossorigin="anonymous">
diff --git a/_includes/scripts/misc.html b/_includes/scripts/misc.html
index 6679e80..ddd6ee8 100644
--- a/_includes/scripts/misc.html
+++ b/_includes/scripts/misc.html
@@ -17,7 +17,7 @@
 {% endif %}
 
   <!-- Bootstrap Table -->
-  <script defer src="https://unpkg.com/bootstrap-table@1.21.3/dist/bootstrap-table.min.js"></script>
+  <script defer src="https://unpkg.com/bootstrap-table@{{ site.bootstrap-table.version }}/dist/bootstrap-table.min.js"></script>
 
   <!-- Load Common JS -->
   <script src="{{ '/assets/js/no_defer.js' | relative_url }}"></script>
diff --git a/_sass/_base.scss b/_sass/_base.scss
index 545f03d..6462b5f 100644
--- a/_sass/_base.scss
+++ b/_sass/_base.scss
@@ -48,6 +48,10 @@ table.table a {
   }
 }
 
+.table-dark {
+  background-color: transparent;
+}
+
 figure,
 img {
   max-width: 90vw;
@@ -946,4 +950,3 @@ nav[data-toggle="toc"] {
     top: 0;
   }
 }
-
diff --git a/assets/js/no_defer.js b/assets/js/no_defer.js
index 95e8b2e..574f2f5 100644
--- a/assets/js/no_defer.js
+++ b/assets/js/no_defer.js
@@ -1,6 +1,12 @@
 // add bootstrap classes to tables
 $(document).ready(function() {
   $('table').each(function() {
+    if (document.documentElement.getAttribute("data-theme") == "dark") {
+      $(this).addClass('table-dark');
+    } else {
+      $(this).removeClass('table-dark');
+    }
+
     // only select tables that are not inside an element with "news" (about page) or "card" (cv page) class
     if($(this).parents('[class*="news"]').length==0 &&
         $(this).parents('[class*="card"]').length==0 &&
@@ -10,12 +16,6 @@ $(document).ready(function() {
       // add some classes to make the table look better
       // $(this).addClass('table-sm');
       $(this).addClass('table-hover');
-
-      if (document.documentElement.getAttribute("data-theme") == "dark") {
-        $(this).addClass('table-dark');
-      } else {
-        $(this).removeClass('table-dark');
-      }
     }
   })
 });