aboutsummaryrefslogtreecommitdiffstatshomepage
path: root/default.template
diff options
context:
space:
mode:
authordvs12025-02-22 18:35:36 +1000
committerdvs12025-02-22 18:35:36 +1000
commit238e5d8ff42a172a95d3c33526181108a7cc78a6 (patch)
tree5aae7bb74bd00dcfb0c8c6df892ad7de406d1202 /default.template
parentTODO++ (diff)
downloadnotYetAnotherWiki-238e5d8ff42a172a95d3c33526181108a7cc78a6.zip
notYetAnotherWiki-238e5d8ff42a172a95d3c33526181108a7cc78a6.tar.gz
notYetAnotherWiki-238e5d8ff42a172a95d3c33526181108a7cc78a6.tar.bz2
notYetAnotherWiki-238e5d8ff42a172a95d3c33526181108a7cc78a6.tar.xz
Much HTML and CSS tweakage.
Main new feature - dark / light theme switcher.
Diffstat (limited to '')
-rw-r--r--default.template77
1 files changed, 42 insertions, 35 deletions
diff --git a/default.template b/default.template
index 6da5a7b..f566f48 100644
--- a/default.template
+++ b/default.template
@@ -7,67 +7,74 @@
7 <link rel="icon" type="image/png" href="$favicon$" /> 7 <link rel="icon" type="image/png" href="$favicon$" />
8 <style> 8 <style>
9 a:hover {color: red;} 9 a:hover {color: red;}
10 10 body {height: 100vh; width: 100vw; font-family: sans-serif; margin: 0; padding: 0; border: none;}
11 html {font-family: sans-serif; 11 menu {list-style-type: none;}
12 margin: 0; padding: 0; border: none;
13 height: 100vh; width: 100vw;
14 }
15
16 menu {
17 list-style-type: none;
18 }
19
20 pre { 12 pre {
21 background-color: $onefangPurple$; 13 background-color: $onefangPurple$;
22 overflow-x: auto; 14 overflow-x: auto;
23 width: 84vw; 15 width: 84vw;
24 margin: 2px; 16 margin: 2px;
25 } 17 }
18 table, td, th {border-collapse: collapse;border: 2px solid grey;}
26 19
27 table, td, th {
28 border-collapse: collapse;
29 border: 2px solid white;
30 }
31 20
32 .contentBox { 21 .contentBox {
22 background: black; color: white;
33 } 23 }
34 .contentBox a:active {color: red;}
35 .contentBox a:link {color: yellow;}
36 .contentBox a:visited {color: yellowgreen;}
37 .contentBox a:hover {color: red;}
38
39 .boxWrapper { 24 .boxWrapper {
40 height: 99vh; width: 99vw; 25 height: 99vh; width: 99vw;
41 background-image: linear-gradient($karenPurple$, $onefangPurple$); 26 background-image: linear-gradient($karenPurple$, $onefangPurple$);
27 color: white;
42 display: grid; 28 display: grid;
43 grid-template-columns: 1fr 98fr 1fr; 29// grid-template-areas:
44 grid-template-rows: 1fr 1fr 98fr 1fr; 30// "logo trail"
31// "logo head"
32// "menu body"
33// "history foot";
34 grid-template-columns: auto 1fr auto;
35 grid-template-rows: auto auto 1fr auto;
36 grid-auto-columns: minmax(auto, auto);
45 grid-auto-rows: minmax(auto, auto); 37 grid-auto-rows: minmax(auto, auto);
46 overflow-x: hidden; overflow-y: auto; 38 overflow-x: hidden; overflow-y: auto;
47 } 39 }
48 .boxLogo {grid-column: 1 / 1; grid-row: 1 / 2;} 40 .boxLogo {grid-area: logo; grid-column: 1 / 1; grid-row: 1 / 2; height: min-content;}
49 .boxTrails {grid-column: 2 / 2; grid-row: 1 / 1;} 41 .boxTrail {grid-area: trail; grid-column: 2 / 2; grid-row: 1 / 1; height: min-content;}
50 .boxHead {grid-column: 2 / 4; grid-row: 2 / 2; text-align: right;} 42 .boxCheck {grid-area: head; grid-column: 2 / 2; grid-row: 2 / 2; height: min-content;}
51 .boxMenu {grid-column: 1 / 1; grid-row: 3 / 3; padding: 4px; vertical-align: top;} 43 .boxHead {grid-area: head; grid-column: 2 / 2; grid-row: 2 / 2; height: min-content; text-align: right;}
52 .boxBody {grid-column: 2 / 4; grid-row: 3 / 3; padding: 4px; vertical-align: top; 44 .boxMenu {grid-area: menu; grid-column: 1 / 1; grid-row: 3 / 3; height: min-content; vertical-align: top; padding: 4px;}
53 background-color: black; color: white; 45 .boxBody {grid-area: body; grid-column: 2 / 2; grid-row: 3 / 3; vertical-align: top;
54 height: 100%; width: 100%; 46 height: 100%; width: 100%;
47 background: black; color: white;
55 } 48 }
56 .boxHistory {grid-column: 1 / 1; grid-row: 4 / 4; } 49 .boxHistory {grid-area: history; grid-column: 1 / 1; grid-row: 4 / 4; height: min-content;}
57 .boxFooter {grid-column: 2 / 4; grid-row: 4 / 4; text-align: right;} 50 .boxFoot {grid-area: foot; grid-column: 2 / 2; grid-row: 4 / 4; height: min-content; text-align: right;}
51
52 /* Hide the toggle checkbox */
53 #mode-toggle {display: none;}
54 /* Style the button */
55 #mode-btn {
56 display: inline-block;
57 }
58// #mode-toggle:checked ~ .boxBody {background: white; color: black;}
59 #mode-toggle:checked ~ .contentBox {background: white; color: black;}
60
58 </style> 61 </style>
59 </head> 62 </head>
60 <body bgcolor="black" color="white" text="white" alink="red" link="yellow" vlink="yellowgreen"> 63 <body alink="red" link="yellow" vlink="yellowgreen">
61 <div class="boxWrapper"> 64 <div class="boxWrapper">
62 <div class="boxLogo"><header><nav><a href="$home$"><img src="$logo$" alt="Not (Yet) (Another / A) Wiki." title="Not (Yet) (Another / A) Wiki."/></a></nav></header></div> 65 <div class="boxLogo"><header><nav><a href="$home$"><img src="$logo$" alt="Not (Yet) (Another / A) Wiki." title="Not (Yet) (Another / A) Wiki."/></a></nav></header></div>
63 <div class="boxTrails"><header><nav>&#x1f463; &nbsp; $trail$</nav></header></div> 66 <div class="boxTrail"><header><nav>&#x1f463; &nbsp; $trail$</nav></header></div>
64 <div class="boxHead"><header><nav>$header$ &nbsp; plus login and register buttons &nbsp;</nav></header></div> 67 <div class="boxHead"><header><nav>$header$ &nbsp; plus login and register buttons &nbsp; </nav></header></div>
65 <div class="boxMenu"><header><nav>$menu$</nav></header></div>
66 <div class="boxBody"> 68 <div class="boxBody">
67 <main class="contentBox">$body$</main> 69 <input type="checkbox" id="mode-toggle" />
70 <main class="contentBox">$body$<br/></main>
68 </div> 71 </div>
72 <div class="boxMenu"><nav>
73 $menu$
74 <label for="mode-toggle" id="mode-btn">&#x1F576;</label>
75 </nav></div>
69 <div class="boxHistory"><footer>$history$</footer></div> 76 <div class="boxHistory"><footer>$history$</footer></div>
70 <div class="boxFooter"><footer>$footer$</footer></div> 77 <div class="boxFoot"><footer>$footer$</footer></div>
71 </div> 78 </div>
72 </body> 79 </body>
73</html> 80</html>
generated by cgit v1.1 at 2025-11-25 04:25:19 +0000