silva
/
new_site
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fixes "General Information" section of CV in dark mode (#1432) 

When the dark mode is default, or if you set the page to dark mode and
then refresh, the content in "General Information" can't be seen.
This PR fixes the problem.
This commit is contained in:
Samuel Chin 2023-06-10 21:30:13 -04:00 committed by GitHub
parent 983762c63a
commit 3083172d99
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 38 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
_includes/cv/map.html
View File

@ -1,8 +1,8 @@
<table class="table table-sm table-borderless table-responsive">
{% for content in entry.contents %}
<tr>
<td class="p-1 pr-2 font-weight-bold"><b>{{ content.name }}</b></td>
<td class="p-1 pl-2 font-weight-light text">{{ content.value }}</td>
</tr>
{% endfor %}
</table>
<table class="table table-sm table-borderless table-responsive table-cv-map">
{% for content in entry.contents %}
<tr>
<td class="p-1 pr-2 font-weight-bold"><b>{{ content.name }}</b></td>
<td class="p-1 pl-2 font-weight-light text">{{ content.value }}</td>
</tr>
{% endfor %}
</table>

6
_sass/_base.scss
View File

@ -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) {

54
assets/js/theme.js
View File

@ -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,38 @@ 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);
}
};
initTheme(localStorage.getItem("theme"));