Commit d09aaa6f authored by Birte Kristina Friesel's avatar Birte Kristina Friesel
Browse files

add a bit of dark mode

parent 7a8d2dde

bin/pyggle

+1 −1
Original line number Diff line number Diff line
@@ -146,7 +146,7 @@ def copy_files(base_dir): 
    imgwidth = f"{args.size}px"

    imgheight = f"{args.size}px"



    css_files = ["glightbox.min.css"]

    css_files = ["glightbox.min.css", "light.css", "dark.css"]

    js_files = ["glightbox.min.js"]



    for css_file in css_files:

share/css/dark.css

0 → 100644
+14 −0
Original line number Diff line number Diff line 
body, html {

	color: #eeeeee;

	background-color: #333333;

}



a {

	color: #9999ff;

}



.glightbox-clean

.gslide-description {

	color: #eeeeee!important;

	background-color: #333333!important;

}

share/css/light.css

0 → 100644
+3 −0
Original line number Diff line number Diff line 
a {

	color: #000099;

}

share/html_start

+25 −0
Original line number Diff line number Diff line
@@ -5,8 +5,33 @@ 
	<meta charset="utf-8">

	<meta name="viewport" content="width=device-width, initial-scale=1.0">

	<link rel="stylesheet" type="text/css" href=".data/css/main.css"/>

	<link rel="stylesheet" type="text/css" href=".data/css/light.css" id="theme"/>

	<!-- glightbox (C) biati digital, MIT licensed. <https://biati-digital.github.io/glightbox/> -->

	<link rel="stylesheet" href=".data/css/glightbox.min.css" />

	<script>

		function addStyleSheet(name, id) {

			var path = '.data/css/' + name + '.css';

			var old = document.getElementById(id);

			if (old && (old.href != path)) {

				old.href = path;

			}

		}

		var otherTheme = {

			'dark': 'light',

			'light': 'dark',

		};

		var currentTheme = localStorage.getItem('theme');

		if (!otherTheme.hasOwnProperty(currentTheme)) {

			currentTheme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';

		}

		addStyleSheet(currentTheme, 'theme');



		function toggleTheme() {

			currentTheme = otherTheme[currentTheme] || 'light';

			localStorage.setItem('theme', currentTheme);

			addStyleSheet(currentTheme, 'theme');

		}

	</script>

	<script src=".data/js/glightbox.min.js"></script>

</head>

<body><div>