ward/truyen-network-site
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Compare commits

base: ward:master
Branches Tags
ward:master
..
compare: ward:5306609ea67dcd043a0306e9d8852792f7655734
Branches Tags
ward:master

No commits in common. "master" and "5306609ea67dcd043a0306e9d8852792f7655734" have entirely different histories.
master ... 5306609ea6

4 changed files with 23 additions and 76 deletions
Show Stats Expand all files Collapse all files

7
compose.yml
View File

@ -1,12 +1,9 @@
services:
siteroot:
build: .
image: truyen/web
container_name: truyen-web
restart: always
labels:
- "traefik.http.routers.siteroot.rule=Host(`truyen.network`) && PathPrefix(`/`)"
- "traefik.http.routers.siteroot.entrypoints=websecure"
- "traefik.http.routers.siteroot.tls=true"
- "traefik.http.routers.siteroot.tls.certresolver=myresolver"
# - "traefik.http.routers.siteroot.tls=true"
# - "traefik.http.routers.siteroot.tls.certresolver=letsencrypt"
- "traefik.enable=true"

42
src/css/main.css
View File

@ -2,6 +2,10 @@
* Version: 1.0.0
*/
:root {
color-scheme: light dark;
}
html,
body {
margin: 0px;
@ -9,28 +13,24 @@ body {
height: 100%;
display: flex;
flex-direction: column;
}
html {
/* colors */
background-image: linear-gradient(-30deg, #C0E0FF6F 70%, #FFE0C04F);
}
main {
margin: auto;
margin-top: 1em;
width: 80%;
padding: 10px;
min-height: 40%;
overflow-y: scroll;
/* colors */
border: 1px solid darkblue;
background-color: white;
box-shadow: 3px 3px 3px #30303090;
box-shadow: 3px 3px 3px #30303090;
}
main h1 {
font-family: "Raleway", sans-serif;
font-size: 3em;
font-size: 4em;
margin-top: 4px;
margin-bottom: 8px;
text-decoration: underline;
@ -46,24 +46,20 @@ main a {
color: red;
}
html.theme-dark {
color-scheme: dark;
background-image: linear-gradient(-10deg, #1010206F 60%, #5050506F);
color: white;
}
@media(prefers-color-scheme: dark) {
.theme-dark>body>main {
border: 1px solid darkgray;
background-color: black;
box-shadow: 3px 3px 5px #101010C0;
}
html,
body {
background-image: linear-gradient(-10deg, #1010206F 60%, #5050506F);
}
.theme-dark>body>main>h1 {
text-shadow: 0px 0px 3px blue, 2px 2px 6px;
}
@media(orientation: portrait) {
main {
margin-top: 0;
border: 1px solid darkgray;
background-color: black;
box-shadow: 3px 3px 5px #101010C0;
}
main h1 {
text-shadow: 0px 0px 3px blue, 2px 2px 6px;
}
}

12
src/index.html
View File

@ -3,27 +3,19 @@
<head>
<title>Truyen home</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/main.css" />
</head>
<body>
<main>
<button style="float: right; font-size:large;" title="Dark theme on/off" onclick="toggleTheme();">&#9728;</button>
<h1>Truyen home</h1>
<h2>Status:</h2>
<p class="text-red">Under construction</p>
<h2>Subdomains</h2>
<a href="https://git.truyen.network" target="_blank">git.truyen.network</a>
<a href="https://ward.truyen.network" target="_blank">ward.truyen.network</a>
<a href="https://willem.truyen.network" target="_blank">willem.truyen.network</a>
<a href="https://wterminal.truyen.network" target="_blank">wterminal.truyen.network</a>
<a href="https://tds.truyen.network" target="_blank">tds.truyen.network</a>
<a href="https://sf.truyen.network" target="_blank">sf.truyen.network</a>
<h2>Links</h2>
<a href="https://ward.truyen.network">ward.truyen.network</a>
</main>
<script src="js/theme.js"></script>
</body>
</html>

38
src/js/theme.js
View File

@ -1,38 +0,0 @@
function toggleTheme() {
const theme = "theme-dark";//localStorage.getItem('theme');
const root = document.querySelector(":root");
root.classList.toggle(theme);
if (root.classList.contains(theme)) {
localStorage.setItem('theme', theme);
} else {
localStorage.setItem('theme', "theme-light");
}
}
function setTheme(themeName) {
console.log("setting theme: " + themeName);
const root = document.querySelector(":root");
root.classList.add(themeName);
localStorage.setItem('theme', themeName);
}
function detectTheme() {
const theme = localStorage.getItem('theme');
if (theme === 'theme-dark' || theme === 'theme-light') {
setTheme(theme);
return;
}
if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
setTheme('theme-dark');
return;
}
if (window.matchMedia('(prefers-color-scheme: light)').matches) {
setTheme('theme-light');
return;
}
setTheme('theme-light');
}
detectTheme();