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

Compare commits

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

12 Commits
5306609ea6 ... master

Author SHA1 Message Date
Ward Truyen
562615f7a7 Chore: added docker image name 2024-10-03 13:42:11 +02:00
Ward Truyen
9c1489e48b Chore: title shrink 2024-10-03 13:41:13 +02:00
Ward Truyen
5c87a4260e Chore: content update 2024-10-03 13:32:09 +02:00
Ward Truyen
03bd9c324b chore: added wterminal link 2024-09-23 09:06:16 +02:00
Ward Truyen
a348e01499 chore: removed css portrait 2024-09-09 22:26:38 +02:00
Ward Truyen
a7f2142bc6 chore: fixed backround ini css 2024-09-09 22:22:56 +02:00
Ward Truyen
a9d3d80959 chore: added missing theme.js 2024-09-09 22:19:29 +02:00
Ward Truyen
d825546505 chore: added theme switch 2024-09-09 21:48:20 +02:00
Ward Truyen
efc3a9d730 chore: <a> with target='blank' 2024-09-09 21:40:22 +02:00
Ward Truyen
22b664f6b2 chore: content update 2024-09-09 21:35:51 +02:00
Ward Truyen
9519d5db8b chore: corrected resolver 2024-07-31 18:36:02 +02:00
Ward Truyen
f6e08f3741 chore: enabled tls certificates 2024-07-31 17:18:45 +02:00
4 changed files with 76 additions and 23 deletions
Expand all files Collapse all files

7
compose.yml
View File

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

42
src/css/main.css
View File

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

12
src/index.html
View File

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

38
src/js/theme.js Normal file
View File

@@ -0,0 +1,38 @@
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();