add dark mode

This commit is contained in:
fyr77 2020-10-31 10:53:07 +01:00
parent d1ef4f64a9
commit 423168edf7
6 changed files with 20 additions and 9 deletions

10
css/dark-mode.css Normal file
View file

@ -0,0 +1,10 @@
.bar-color {color:#000!important;background-color:#f1f1f1!important}
@media (prefers-color-scheme: dark) {
body {background-color: black;color: white;}
.bar-color{color:#000!important;background-color:#707070!important}
.w3-button{color: white}
.w3-container p{color: white}
input[type=text], select{background-color: #4c4c4c;}
input[type=text]::placeholder, select::placeholder{color: #9e9e9e;opacity: 1;}
.w3-green,.w3-hover-green:hover{color:#fff!important;background-color:#37823a!important}
}

View file

@ -10,7 +10,7 @@ input[type=text], select {
.optional::before {
content: "optional ";
color: grey
color: grey;
}
input[type=submit] {

View file

@ -5,17 +5,17 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>DNS Profile Creator</title>
<link rel="stylesheet" href="css/w3.css">
<link rel="stylesheet" href="css/form.css">
<link rel="stylesheet" href="css/dark-mode.css">
</head>
<body class="w3-container">
<div class="w3-container w3-light-gray">
<div class="w3-container bar-color">
<p>This website uses technical cookies. By continuing you agree to the use of these cookies. No personal data is stored or shared. <a href="legal.html">Learn more</a></p>
</div>
<h1>Secure DNS profile creator</h1>
<h2>For iOS 14 or later and macOS Big Sur or later</h2>
<div class="w3-bar w3-border w3-light-grey">
<div class="w3-bar w3-border bar-color">
<a href="/index.html" class="w3-bar-item w3-button w3-green w3-mobile">About</a>
<a href="/tool.html" class="w3-bar-item w3-button w3-mobile">Tool</a>
<a href="/premades.html" class="w3-bar-item w3-button w3-mobile">Pre-made profiles</a>

View file

@ -5,13 +5,13 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>DNS Profile Creator</title>
<link rel="stylesheet" href="css/w3.css">
<link rel="stylesheet" href="css/form.css">
<link rel="stylesheet" href="css/dark-mode.css">
</head>
<body class="w3-container">
<h1>Secure DNS profile creator</h1>
<h2>For iOS 14 or later and macOS Big Sur or later</h2>
<div class="w3-bar w3-border w3-light-grey">
<div class="w3-bar w3-border bar-color">
<a href="/index.html" class="w3-bar-item w3-button w3-mobile">About</a>
<a href="/tool.html" class="w3-bar-item w3-button w3-mobile">Tool</a>
<a href="/premades.html" class="w3-bar-item w3-button w3-mobile">Pre-made profiles</a>

View file

@ -5,14 +5,14 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>DNS Profile Creator</title>
<link rel="stylesheet" href="css/w3.css">
<link rel="stylesheet" href="css/form.css">
<link rel="stylesheet" href="css/dark-mode.css">
<script src="js/listPage.js"></script>
</head>
<body class="w3-container">
<h1>Secure DNS profile creator</h1>
<h2>For iOS 14 or later and macOS Big Sur or later</h2>
<div class="w3-bar w3-border w3-light-grey">
<div class="w3-bar w3-border bar-color">
<a href="/index.html" class="w3-bar-item w3-button w3-mobile">About</a>
<a href="/tool.html" class="w3-bar-item w3-button w3-mobile">Tool</a>
<a href="/premades.html" class="w3-bar-item w3-button w3-green w3-mobile">Pre-made profiles</a>

View file

@ -6,6 +6,7 @@
<title>DNS Profile Creator</title>
<link rel="stylesheet" href="css/w3.css">
<link rel="stylesheet" href="css/form.css">
<link rel="stylesheet" href="css/dark-mode.css">
<script src="js/FileSaver.min.js"></script>
<script src="js/uuidv4.min.js"></script>
<script src="js/tool.js"></script>
@ -14,7 +15,7 @@
<h1>Secure DNS profile creator</h1>
<h2>For iOS 14 or later and macOS Big Sur or later</h2>
<div class="w3-bar w3-border w3-light-grey">
<div class="w3-bar w3-border bar-color">
<a href="/" class="w3-bar-item w3-button w3-mobile">About</a>
<a href="/tool.html" class="w3-bar-item w3-button w3-green w3-mobile">Tool</a>
<a href="/premades.html" class="w3-bar-item w3-button w3-mobile">Pre-made profiles</a>