Update dark mode instructions

This commit is contained in:
Job Bautista 2021-05-07 19:22:26 +08:00
parent 7a8d882aec
commit 1eff15b95f
16 changed files with 12 additions and 41 deletions

View File

@ -5,8 +5,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Contact Job Bautista</title>
<link href="/~job/index.css" rel="stylesheet" type="text/css" media="all">
<link href="/~job/light.css" rel="stylesheet" type="text/css" media="all" title="Light mode">
<link href="/~job/dark.css" rel="alternate stylesheet" type="text/css" media="all" title="Dark mode">
<link rel="top" href="/~job/" title="Job Bautista's personal website">
<link rel="up" href="/~job/" title="Job Bautista's personal website">
<link rel="icon" type="image/x-icon" href="/~job/favicon.ico">

View File

@ -5,8 +5,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Job Bautista's personal website</title>
<link href="/~job/index.css" rel="stylesheet" type="text/css" media="all">
<link href="/~job/light.css" rel="stylesheet" type="text/css" media="all" title="Light mode">
<link href="/~job/dark.css" rel="alternate stylesheet" type="text/css" media="all" title="Dark mode">
<link rel="icon" type="image/x-icon" href="/~job/favicon.ico">
<link rel="top" href="/~job/" title="Job Bautista's personal website">
</head>

View File

@ -5,8 +5,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Infographics about chemical elements - Job Bautista</title>
<link href="/~job/index.css" rel="stylesheet" type="text/css" media="all">
<link href="/~job/light.css" rel="stylesheet" type="text/css" media="all" title="Light mode">
<link href="/~job/dark.css" rel="alternate stylesheet" type="text/css" media="all" title="Dark mode">
<link rel="top" href="/~job/" title="Job Bautista's personal website">
<link rel="up" href="/~job/" title="Job Bautista's personal website">
<link rel="icon" type="image/x-icon" href="/~job/favicon.ico">

View File

@ -5,8 +5,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>404 - Page Not Found</title>
<link href="/~job/index.css" rel="stylesheet" type="text/css" media="all">
<link href="/~job/light.css" rel="stylesheet" type="text/css" media="all" title="Light mode">
<link href="/~job/dark.css" rel="alternate stylesheet" type="text/css" media="all" title="Dark mode">
<link rel="top" href="/~job/" title="Job Bautista's personal website">
<link rel="icon" type="image/x-icon" href="/~job/favicon.ico">
</head>

View File

@ -5,8 +5,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Where to find Job Bautista</title>
<link href="/~job/index.css" rel="stylesheet" type="text/css" media="all">
<link href="/~job/light.css" rel="stylesheet" type="text/css" media="all" title="Light mode">
<link href="/~job/dark.css" rel="alternate stylesheet" type="text/css" media="all" title="Dark mode">
<link rel="top" href="/~job/" title="Job Bautista's personal website">
<link rel="up" href="/~job/" title="Job Bautista's personal website">
<link rel="icon" type="image/x-icon" href="/~job/favicon.ico">

View File

@ -5,8 +5,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>You can now toggle dark mode on this website! - Job Bautista</title>
<link href="/~job/index.css" rel="stylesheet" type="text/css" media="all">
<link href="/~job/light.css" rel="stylesheet" type="text/css" media="all" title="Light mode">
<link href="/~job/dark.css" rel="alternate stylesheet" type="text/css" media="all" title="Dark mode">
<link rel="top" href="/~job/" title="Job Bautista's personal website">
<link rel="up" href="./" title="Job Bautista's writings">
<link rel="icon" type="image/x-icon" href="/~job/favicon.ico">
@ -17,15 +15,18 @@
</header>
<hr />
<h1>You can now toggle dark mode on this website!</h1>
<p>You may have noticed the <a href="https://www.w3.org/Style/Examples/007/alternatives.en.html">"alternate stylesheet"</a> while viewing the source code of this website. That's the CSS for <a href="https://en.wikipedia.org/wiki/Light-on-dark_color_scheme">dark mode</a>! You may be wondering how to switch to dark mode. It's easy, well at least if you're on desktop <a href="https://www.mozilla.org/en-US/firefox/new/">Firefox</a> (sorry <a href="https://www.google.com/chrome/browser/index.html">Chrome</a> and mobile users!).</p>
<p>On Firefox and its forks like <a href="https://www.palemoon.org">Pale Moon</a> and <a href="https://www.waterfox.net/">Waterfox</a>, follow these instructions:</p>
<ol>
<li><p>Toggle the menu bar (on Pale Moon and <a href="https://www.seamonkey-project.org/">SeaMonkey</a>, they are already toggled by default).</p>
<li><p>Click on "View", or the third item on the menu bar if you're using another language pack.</p>
<li><p>Hover on "Page Style". (On <a href="https://apps.kde.org/en/konqueror">Konqueror</a>, it's "Use StyleSheet".)</p>
<li><p>Click on "Dark mode". You can now enjoy my website while taking care of your eyes at night!</p>
</ol>
<p>For Google Chrome, you will have to install this <a href="https://chrome.google.com/webstore/detail/alt-css/deaodobjfcolfhkecnnghdclnlmfjdje">extension</a>.</p>
<p>You can now toggle dark mode by setting your browser's color scheme settings. Starting on Pale Moon 29.2.0, you can set which color scheme to prefer (<var>light</var>, <var>dark</var>, <var>no-preference</var>). For other browsers, please refer to their respective documentations.</p>
<strong class="txtcenter" style="color:#FF0000;font-size:large;">The following content is obsolete and no longer applies:</strong>
<h2>Obsolete instructions</h2>
<p>You may have noticed the <a href="https://www.w3.org/Style/Examples/007/alternatives.en.html">"alternate stylesheet"</a> while viewing the source code of this website. That's the CSS for <a href="https://en.wikipedia.org/wiki/Light-on-dark_color_scheme">dark mode</a>! You may be wondering how to switch to dark mode. It's easy, well at least if you're on desktop <a href="https://www.mozilla.org/en-US/firefox/new/">Firefox</a> (sorry <a href="https://www.google.com/chrome/browser/index.html">Chrome</a> and mobile users!).</p>
<p>On Firefox and its forks like <a href="https://www.palemoon.org">Pale Moon</a> and <a href="https://www.waterfox.net/">Waterfox</a>, follow these instructions:</p>
<ol>
<li><p>Toggle the menu bar (on Pale Moon and <a href="https://www.seamonkey-project.org/">SeaMonkey</a>, they are already toggled by default).</p>
<li><p>Click on "View", or the third item on the menu bar if you're using another language pack.</p>
<li><p>Hover on "Page Style". (On <a href="https://apps.kde.org/en/konqueror">Konqueror</a>, it's "Use StyleSheet".)</p>
<li><p>Click on "Dark mode". You can now enjoy my website while taking care of your eyes at night!</p>
</ol>
<p>For Google Chrome, you will have to install this <a href="https://chrome.google.com/webstore/detail/alt-css/deaodobjfcolfhkecnnghdclnlmfjdje">extension</a>.</p>
<hr />
<footer>
<script src="/~job/footer.js"></script>

View File

@ -5,8 +5,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Cyndaquil - Job Bautista</title>
<link href="/~job/index.css" rel="stylesheet" type="text/css" media="all">
<link href="/~job/light.css" rel="stylesheet" type="text/css" media="all" title="Light mode">
<link href="/~job/dark.css" rel="alternate stylesheet" type="text/css" media="all" title="Dark mode">
<link rel="icon" type="image/x-icon" href="/~job/favicon.ico">
<link rel="top" href="/~job/" title="Job Bautista's personal website">
<link rel="up" href="./" title=">Some of my best writeups in Everything2 - Job Bautista">

View File

@ -5,8 +5,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ideal Wi-Fi Mall - Job Bautista</title>
<link href="/~job/index.css" rel="stylesheet" type="text/css" media="all">
<link href="/~job/light.css" rel="stylesheet" type="text/css" media="all" title="Light mode">
<link href="/~job/dark.css" rel="alternate stylesheet" type="text/css" media="all" title="Dark mode">
<link rel="icon" type="image/x-icon" href="/~job/favicon.ico">
<link rel="top" href="/~job/" title="Job Bautista's personal website">
<link rel="up" href="./" title=">Some of my best writeups in Everything2 - Job Bautista">

View File

@ -5,8 +5,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Some of my best writeups in Everything2 - Job Bautista</title>
<link href="/~job/index.css" rel="stylesheet" type="text/css" media="all">
<link href="/~job/light.css" rel="stylesheet" type="text/css" media="all" title="Light mode">
<link href="/~job/dark.css" rel="alternate stylesheet" type="text/css" media="all" title="Dark mode">
<link rel="icon" type="image/x-icon" href="/~job/favicon.ico">
<link rel="top" href="/~job/" title="Job Bautista's personal website">
<link rel="up" href="/~job/writings" title="Job Bautista's writings">

View File

@ -5,8 +5,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Martsa ng Bayan - Job Bautista</title>
<link href="/~job/index.css" rel="stylesheet" type="text/css" media="all">
<link href="/~job/light.css" rel="stylesheet" type="text/css" media="all" title="Light mode">
<link href="/~job/dark.css" rel="alternate stylesheet" type="text/css" media="all" title="Dark mode">
<link rel="icon" type="image/x-icon" href="/~job/favicon.ico">
<link rel="top" href="/~job/" title="Job Bautista's personal website">
<link rel="up" href="./" title=">Some of my best writeups in Everything2 - Job Bautista">

View File

@ -5,8 +5,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Palengke - Job Bautista</title>
<link href="/~job/index.css" rel="stylesheet" type="text/css" media="all">
<link href="/~job/light.css" rel="stylesheet" type="text/css" media="all" title="Light mode">
<link href="/~job/dark.css" rel="alternate stylesheet" type="text/css" media="all" title="Dark mode">
<link rel="icon" type="image/x-icon" href="/~job/favicon.ico">
<link rel="top" href="/~job/" title="Job Bautista's personal website">
<link rel="up" href="./" title=">Some of my best writeups in Everything2 - Job Bautista">

View File

@ -5,8 +5,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Instances of Facebook defending Philippine fascism - Job Bautista</title>
<link href="/~job/index.css" rel="stylesheet" type="text/css" media="all">
<link href="/~job/light.css" rel="stylesheet" type="text/css" media="all" title="Light mode">
<link href="/~job/dark.css" rel="alternate stylesheet" type="text/css" media="all" title="Dark mode">
<link rel="top" href="/~job/" title="Job Bautista's personal website">
<link rel="up" href="./" title="Job Bautista's writings">
<link rel="icon" type="image/x-icon" href="/~job/favicon.ico">

View File

@ -5,8 +5,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Job Bautista's writings</title>
<link href="/~job/index.css" rel="stylesheet" type="text/css" media="all">
<link href="/~job/light.css" rel="stylesheet" type="text/css" media="all" title="Light mode">
<link href="/~job/dark.css" rel="alternate stylesheet" type="text/css" media="all" title="Dark mode">
<link rel="top" href="/~job/" title="Job Bautista's personal website">
<link rel="up" href="/~job/" title="Job Bautista's personal website">
<link rel="icon" type="image/x-icon" href="/~job/favicon.ico">

View File

@ -5,8 +5,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Reusing HTML - Job Bautista</title>
<link href="/~job/index.css" rel="stylesheet" type="text/css" media="all">
<link href="/~job/light.css" rel="stylesheet" type="text/css" media="all" title="Light mode">
<link href="/~job/dark.css" rel="alternate stylesheet" type="text/css" media="all" title="Dark mode">
<link rel="top" href="/~job/" title="Job Bautista's personal website">
<link rel="up" href="./" title="Job Bautista's writings">
<link rel="icon" type="image/x-icon" href="/~job/favicon.ico">

View File

@ -5,8 +5,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SineProgresibo, a torrent of Filipino progressive movies - Job Bautista</title>
<link href="/~job/index.css" rel="stylesheet" type="text/css" media="all">
<link href="/~job/light.css" rel="stylesheet" type="text/css" media="all" title="Light mode">
<link href="/~job/dark.css" rel="alternate stylesheet" type="text/css" media="all" title="Dark mode">
<link rel="top" href="/~job/" title="Job Bautista's personal website">
<link rel="up" href="./" title="Job Bautista's writings">
<link rel="icon" type="image/x-icon" href="/~job/favicon.ico">

View File

@ -5,8 +5,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Yoke, a poem by Job Bautista</title>
<link href="/~job/index.css" rel="stylesheet" type="text/css" media="all">
<link href="/~job/light.css" rel="stylesheet" type="text/css" media="all" title="Light mode">
<link href="/~job/dark.css" rel="alternate stylesheet" type="text/css" media="all" title="Dark mode">
<link rel="top" href="/~job/" title="Job Bautista's personal website">
<link rel="up" href="./" title="Job Bautista's writings">
<link rel="icon" type="image/x-icon" href="/~job/favicon.ico">