PVR/gokarna
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Fixes after running on mobile

Browse Source
This commit is contained in:
Avijit 🚀
2021-08-05 00:11:47 +02:00
committed by Yash Mehrotra
parent 534432aa94
commit 7c8ea65700
3 changed files with 21 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
themes/gokarna/layouts/_default/baseof.html
View File

@@ -2,6 +2,9 @@
<html> <html>
{{- partial "head.html" . -}} {{- partial "head.html" . -}}
<body> <body>
<script type="text/javascript">
setThemeByUserPref();
</script>
{{- partial "header.html" . -}} {{- partial "header.html" . -}}
<main id="content"> <main id="content">
{{- block "main" . }}{{- end }} {{- block "main" . }}{{- end }}

2
themes/gokarna/static/css/main.css
View File

@@ -370,6 +370,8 @@ main#content .post {
border-radius: inherit; border-radius: inherit;
opacity: 0.8; opacity: 0.8;
padding: 6px; padding: 6px;
position: relative;
z-index: -1;
} }
@media only screen and (max-width: 820px) { @media only screen and (max-width: 820px) {

30
themes/gokarna/static/js/main.js
View File

@@ -10,20 +10,7 @@ let darkThemeCss = '';
function ready() { function ready() {
feather.replace({ 'stroke-width': 1, width: 20, height: 20 }); feather.replace({ 'stroke-width': 1, width: 20, height: 20 });
darkThemeCss = document.getElementById("dark-theme"); setThemeByUserPref();
const savedTheme = localStorage.getItem(THEME_PREF_STORAGE_KEY) ||
(window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark': 'light');
const darkThemeToggles = document.querySelectorAll('.dark-theme-toggle');
setTheme(savedTheme, darkThemeToggles);
darkThemeToggles.forEach(el => el.addEventListener('click', (event) => {
toggleIcon = event.currentTarget.querySelector("a svg.feather");
if (toggleIcon.classList[1] === THEME_TO_ICON_CLASS.dark) {
setTheme('light', [event.currentTarget]);
} else if (toggleIcon.classList[1] === THEME_TO_ICON_CLASS.light) {
setTheme('dark', [event.currentTarget]);
}
}));
document.getElementById('hamburger-menu-toggle').addEventListener('click', () => { document.getElementById('hamburger-menu-toggle').addEventListener('click', () => {
const hamburgerMenu = document.getElementsByClassName('nav-hamburger-list')[0] const hamburgerMenu = document.getElementsByClassName('nav-hamburger-list')[0]
@@ -47,6 +34,21 @@ window.addEventListener('scroll', () => {
} }
}); });
function setThemeByUserPref() {
darkThemeCss = document.getElementById("dark-theme");
const savedTheme = localStorage.getItem(THEME_PREF_STORAGE_KEY) ||
(window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark': 'light');
const darkThemeToggles = document.querySelectorAll('.dark-theme-toggle');
setTheme(savedTheme, darkThemeToggles);
darkThemeToggles.forEach(el => el.addEventListener('click', (event) => {
toggleIcon = event.currentTarget.querySelector("a svg.feather");
if (toggleIcon.classList[1] === THEME_TO_ICON_CLASS.dark) {
setTheme('light', [event.currentTarget]);
} else if (toggleIcon.classList[1] === THEME_TO_ICON_CLASS.light) {
setTheme('dark', [event.currentTarget]);
}
}));
}
function setTheme(themeToSet, targets) { function setTheme(themeToSet, targets) {
localStorage.setItem(THEME_PREF_STORAGE_KEY, themeToSet); localStorage.setItem(THEME_PREF_STORAGE_KEY, themeToSet);