From 47baf782a6b025d32d13827b2cbabd93687aeb2a Mon Sep 17 00:00:00 2001 From: Samuel Chin Date: Thu, 18 May 2023 10:47:16 -0400 Subject: [PATCH 1/5] Fix dark mode problem --- assets/js/theme.js | 59 ++++++++++++++++++++++------------------------ 1 file changed, 28 insertions(+), 31 deletions(-) diff --git a/assets/js/theme.js b/assets/js/theme.js index d247e4ad8e76..cf06c858a7d9 100644 --- a/assets/js/theme.js +++ b/assets/js/theme.js @@ -6,10 +6,9 @@ let toggleTheme = (theme) => { } else { setTheme("dark"); } -} - +}; -let setTheme = (theme) => { +let setTheme = (theme) => { transTheme(); setHighlight(theme); setGiscusTheme(theme); @@ -18,12 +17,12 @@ let setTheme = (theme) => { document.documentElement.setAttribute("data-theme", theme); // Add class to tables. - let tables = document.getElementsByTagName('table'); - for(let i = 0; i < tables.length; i++) { + let tables = document.getElementsByTagName("table"); + for (let i = 0; i < tables.length; i++) { if (theme == "dark") { - tables[i].classList.add('table-dark'); + tables[i].classList.add("table-dark"); } else { - tables[i].classList.remove('table-dark'); + tables[i].classList.remove("table-dark"); } } } else { @@ -32,15 +31,16 @@ let setTheme = (theme) => { localStorage.setItem("theme", theme); // Updates the background of medium-zoom overlay. - if (typeof medium_zoom !== 'undefined') { + if (typeof medium_zoom !== "undefined") { medium_zoom.update({ - background: getComputedStyle(document.documentElement) - .getPropertyValue('--global-bg-color') + 'ee', // + 'ee' for trasparency. - }) + background: + getComputedStyle(document.documentElement).getPropertyValue( + "--global-bg-color" + ) + "ee", // + 'ee' for trasparency. + }); } }; - let setHighlight = (theme) => { if (theme == "dark") { document.getElementById("highlight_theme_light").media = "none"; @@ -49,44 +49,41 @@ let setHighlight = (theme) => { document.getElementById("highlight_theme_dark").media = "none"; document.getElementById("highlight_theme_light").media = ""; } -} - +}; let setGiscusTheme = (theme) => { - function sendMessage(message) { - const iframe = document.querySelector('iframe.giscus-frame'); + const iframe = document.querySelector("iframe.giscus-frame"); if (!iframe) return; - iframe.contentWindow.postMessage({ giscus: message }, 'https://giscus.app'); + iframe.contentWindow.postMessage({ giscus: message }, "https://giscus.app"); } sendMessage({ setConfig: { - theme: theme - } + theme: theme, + }, }); - -} - +}; let transTheme = () => { document.documentElement.classList.add("transition"); window.setTimeout(() => { document.documentElement.classList.remove("transition"); - }, 500) -} - + }, 500); +}; let initTheme = (theme) => { - if (theme == null || theme == 'null') { + if (theme == null || theme == "null") { const userPref = window.matchMedia; - if (userPref && userPref('(prefers-color-scheme: dark)').matches) { - theme = 'dark'; + if (userPref && userPref("(prefers-color-scheme: dark)").matches) { + theme = "dark"; } } - setTheme(theme); -} - + // Wait for the DOM to finish loading before setting theme + document.addEventListener("DOMContentLoaded", function () { + setTheme(theme); + }); +}; initTheme(localStorage.getItem("theme")); From 5c2a98e97f235db0ffc8d528503adef40ca4f4ce Mon Sep 17 00:00:00 2001 From: Samuel Chin Date: Thu, 18 May 2023 10:50:19 -0400 Subject: [PATCH 2/5] Prettier single quotes --- assets/js/theme.js | 54 +++++++++++++++++++++++----------------------- 1 file changed, 27 insertions(+), 27 deletions(-) diff --git a/assets/js/theme.js b/assets/js/theme.js index cf06c858a7d9..0f78fac7792f 100644 --- a/assets/js/theme.js +++ b/assets/js/theme.js @@ -1,10 +1,10 @@ // Has to be in the head tag, otherwise a flicker effect will occur. let toggleTheme = (theme) => { - if (theme == "dark") { - setTheme("light"); + if (theme == 'dark') { + setTheme('light'); } else { - setTheme("dark"); + setTheme('dark'); } }; @@ -14,48 +14,48 @@ let setTheme = (theme) => { setGiscusTheme(theme); if (theme) { - document.documentElement.setAttribute("data-theme", theme); + document.documentElement.setAttribute('data-theme', theme); // Add class to tables. - let tables = document.getElementsByTagName("table"); + let tables = document.getElementsByTagName('table'); for (let i = 0; i < tables.length; i++) { - if (theme == "dark") { - tables[i].classList.add("table-dark"); + if (theme == 'dark') { + tables[i].classList.add('table-dark'); } else { - tables[i].classList.remove("table-dark"); + tables[i].classList.remove('table-dark'); } } } else { - document.documentElement.removeAttribute("data-theme"); + document.documentElement.removeAttribute('data-theme'); } - localStorage.setItem("theme", theme); + localStorage.setItem('theme', theme); // Updates the background of medium-zoom overlay. - if (typeof medium_zoom !== "undefined") { + if (typeof medium_zoom !== 'undefined') { medium_zoom.update({ background: getComputedStyle(document.documentElement).getPropertyValue( - "--global-bg-color" - ) + "ee", // + 'ee' for trasparency. + '--global-bg-color' + ) + 'ee', // + 'ee' for trasparency. }); } }; let setHighlight = (theme) => { - if (theme == "dark") { - document.getElementById("highlight_theme_light").media = "none"; - document.getElementById("highlight_theme_dark").media = ""; + if (theme == 'dark') { + document.getElementById('highlight_theme_light').media = 'none'; + document.getElementById('highlight_theme_dark').media = ''; } else { - document.getElementById("highlight_theme_dark").media = "none"; - document.getElementById("highlight_theme_light").media = ""; + document.getElementById('highlight_theme_dark').media = 'none'; + document.getElementById('highlight_theme_light').media = ''; } }; let setGiscusTheme = (theme) => { function sendMessage(message) { - const iframe = document.querySelector("iframe.giscus-frame"); + const iframe = document.querySelector('iframe.giscus-frame'); if (!iframe) return; - iframe.contentWindow.postMessage({ giscus: message }, "https://giscus.app"); + iframe.contentWindow.postMessage({ giscus: message }, 'https://giscus.app'); } sendMessage({ @@ -66,24 +66,24 @@ let setGiscusTheme = (theme) => { }; let transTheme = () => { - document.documentElement.classList.add("transition"); + document.documentElement.classList.add('transition'); window.setTimeout(() => { - document.documentElement.classList.remove("transition"); + document.documentElement.classList.remove('transition'); }, 500); }; let initTheme = (theme) => { - if (theme == null || theme == "null") { + if (theme == null || theme == 'null') { const userPref = window.matchMedia; - if (userPref && userPref("(prefers-color-scheme: dark)").matches) { - theme = "dark"; + if (userPref && userPref('(prefers-color-scheme: dark)').matches) { + theme = 'dark'; } } // Wait for the DOM to finish loading before setting theme - document.addEventListener("DOMContentLoaded", function () { + document.addEventListener('DOMContentLoaded', function () { setTheme(theme); }); }; -initTheme(localStorage.getItem("theme")); +initTheme(localStorage.getItem('theme')); From 545633afcf60728ec169c4433eec132ff9709436 Mon Sep 17 00:00:00 2001 From: Samuel Chin Date: Thu, 18 May 2023 10:51:33 -0400 Subject: [PATCH 3/5] Prettier double quotes --- assets/js/theme.js | 54 +++++++++++++++++++++++----------------------- 1 file changed, 27 insertions(+), 27 deletions(-) diff --git a/assets/js/theme.js b/assets/js/theme.js index 0f78fac7792f..cf06c858a7d9 100644 --- a/assets/js/theme.js +++ b/assets/js/theme.js @@ -1,10 +1,10 @@ // Has to be in the head tag, otherwise a flicker effect will occur. let toggleTheme = (theme) => { - if (theme == 'dark') { - setTheme('light'); + if (theme == "dark") { + setTheme("light"); } else { - setTheme('dark'); + setTheme("dark"); } }; @@ -14,48 +14,48 @@ let setTheme = (theme) => { setGiscusTheme(theme); if (theme) { - document.documentElement.setAttribute('data-theme', theme); + document.documentElement.setAttribute("data-theme", theme); // Add class to tables. - let tables = document.getElementsByTagName('table'); + let tables = document.getElementsByTagName("table"); for (let i = 0; i < tables.length; i++) { - if (theme == 'dark') { - tables[i].classList.add('table-dark'); + if (theme == "dark") { + tables[i].classList.add("table-dark"); } else { - tables[i].classList.remove('table-dark'); + tables[i].classList.remove("table-dark"); } } } else { - document.documentElement.removeAttribute('data-theme'); + document.documentElement.removeAttribute("data-theme"); } - localStorage.setItem('theme', theme); + localStorage.setItem("theme", theme); // Updates the background of medium-zoom overlay. - if (typeof medium_zoom !== 'undefined') { + if (typeof medium_zoom !== "undefined") { medium_zoom.update({ background: getComputedStyle(document.documentElement).getPropertyValue( - '--global-bg-color' - ) + 'ee', // + 'ee' for trasparency. + "--global-bg-color" + ) + "ee", // + 'ee' for trasparency. }); } }; let setHighlight = (theme) => { - if (theme == 'dark') { - document.getElementById('highlight_theme_light').media = 'none'; - document.getElementById('highlight_theme_dark').media = ''; + if (theme == "dark") { + document.getElementById("highlight_theme_light").media = "none"; + document.getElementById("highlight_theme_dark").media = ""; } else { - document.getElementById('highlight_theme_dark').media = 'none'; - document.getElementById('highlight_theme_light').media = ''; + document.getElementById("highlight_theme_dark").media = "none"; + document.getElementById("highlight_theme_light").media = ""; } }; let setGiscusTheme = (theme) => { function sendMessage(message) { - const iframe = document.querySelector('iframe.giscus-frame'); + const iframe = document.querySelector("iframe.giscus-frame"); if (!iframe) return; - iframe.contentWindow.postMessage({ giscus: message }, 'https://giscus.app'); + iframe.contentWindow.postMessage({ giscus: message }, "https://giscus.app"); } sendMessage({ @@ -66,24 +66,24 @@ let setGiscusTheme = (theme) => { }; let transTheme = () => { - document.documentElement.classList.add('transition'); + document.documentElement.classList.add("transition"); window.setTimeout(() => { - document.documentElement.classList.remove('transition'); + document.documentElement.classList.remove("transition"); }, 500); }; let initTheme = (theme) => { - if (theme == null || theme == 'null') { + if (theme == null || theme == "null") { const userPref = window.matchMedia; - if (userPref && userPref('(prefers-color-scheme: dark)').matches) { - theme = 'dark'; + if (userPref && userPref("(prefers-color-scheme: dark)").matches) { + theme = "dark"; } } // Wait for the DOM to finish loading before setting theme - document.addEventListener('DOMContentLoaded', function () { + document.addEventListener("DOMContentLoaded", function () { setTheme(theme); }); }; -initTheme(localStorage.getItem('theme')); +initTheme(localStorage.getItem("theme")); From 38e27fbe69f6c89af9d64601bbc04a199a4446a9 Mon Sep 17 00:00:00 2001 From: Samuel Chin Date: Thu, 25 May 2023 18:19:02 -0400 Subject: [PATCH 4/5] Nicer fix. --- _includes/cv/map.html | 16 ++++++++-------- assets/js/theme.js | 5 +---- 2 files changed, 9 insertions(+), 12 deletions(-) diff --git a/_includes/cv/map.html b/_includes/cv/map.html index e0d1983ef0ee..7f93945c82a2 100644 --- a/_includes/cv/map.html +++ b/_includes/cv/map.html @@ -1,8 +1,8 @@ - - {% for content in entry.contents %} - - - - - {% endfor %} -
{{ content.name }}{{ content.value }}
\ No newline at end of file + + {% for content in entry.contents %} + + + + + {% endfor %} +
{{ content.name }}{{ content.value }}
diff --git a/assets/js/theme.js b/assets/js/theme.js index cf06c858a7d9..5f57ac47dbc8 100644 --- a/assets/js/theme.js +++ b/assets/js/theme.js @@ -80,10 +80,7 @@ let initTheme = (theme) => { } } - // Wait for the DOM to finish loading before setting theme - document.addEventListener("DOMContentLoaded", function () { - setTheme(theme); - }); + setTheme(theme); }; initTheme(localStorage.getItem("theme")); From cc14560ce27cfede2b0cdb490a24f6ada615adad Mon Sep 17 00:00:00 2001 From: Samuel Chin Date: Fri, 26 May 2023 12:11:40 -0400 Subject: [PATCH 5/5] Refactor into a table-cv-map class. --- _includes/cv/map.html | 2 +- _sass/_base.scss | 6 ++++++ 2 files changed, 7 insertions(+), 1 deletion(-) diff --git a/_includes/cv/map.html b/_includes/cv/map.html index 7f93945c82a2..83908dafd6e6 100644 --- a/_includes/cv/map.html +++ b/_includes/cv/map.html @@ -1,4 +1,4 @@ - +
{% for content in entry.contents %} diff --git a/_sass/_base.scss b/_sass/_base.scss index 48f8ba144d51..2165cb7ae088 100644 --- a/_sass/_base.scss +++ b/_sass/_base.scss @@ -376,6 +376,12 @@ footer.sticky-bottom { } } +.table-cv-map { + background-color: transparent; + border: none; + color: var(--global-text-color); +} + // Repositories @media (min-width: 768px) {
{{ content.name }}