update helpers/location to 'frosted' ui
[carveJwlIkooP6JGAAIwe30JlM.git] / web / index.php
1 <?php
2 $page = "main";
3 if( isset( $_GET["page"] ) ){
4 $page = $_GET["page"];
5 }
6 function srpage($name,$display){
7 global $page;
8 if($name==$page){
9 echo "<div class=\"navitemsel\">";
10 echo "<p>".$display."</p></div>";
11 }
12 else{
13 echo "<a href=\"index.php?page=".$name."\">";
14 echo "<div class=\"navitem\">";
15 echo "<p>".$display."</p></div></a>";
16 }
17 }
18 ?>
19 <!DOCTYPE html>
20 <html lang="en">
21 <head>
22 <link rel="apple-touch-icon" sizes="180x180"
23 href="/apple-touch-icon.png?v=Gv66x0ewwj">
24 <link rel="icon" type="image/png" sizes="32x32"
25 href="/favicon-32x32.png?v=Gv66x0ewwj">
26 <link rel="icon" type="image/png" sizes="16x16"
27 href="/favicon-16x16.png?v=Gv66x0ewwj">
28 <link rel="manifest" href="/site.webmanifest?v=Gv66x0ewwj">
29 <link rel="mask-icon" href="/safari-pinned-tab.svg?v=Gv66x0ewwj"
30 color="#5bbad5">
31 <link rel="shortcut icon" href="/favicon.ico?v=Gv66x0ewwj">
32 <meta name="msapplication-TileColor" content="#da532c">
33 <meta name="theme-color" content="#ffffff">
34
35 <meta charset="utf-8">
36 <meta http-equiv="X-UA-Compatible" content="IE=edge">
37 <meta name="viewport" content="width=device-width, initial-scale=1">
38
39 <style>
40 :root{
41 --k_ui_bg0: #1d2021;
42 --k_ui_bg1: #282828;
43 --k_ui_bg2: #3c3836;
44 --k_ui_bg3: #504945;
45 --k_ui_bg4: #665c54;
46 --k_ui_bg5: #7c6f64;
47 --k_ui_bg6: #928374;
48 --k_ui_bg7: #a89984;
49 --k_ui_fg0: #ebdbb2;
50 --k_ui_fg1: #fbf1c7;
51 --k_ui_fg2: #d5c4a1;
52 --k_ui_fg3: #bdae93;
53 --k_ui_fg4: #a89984;
54 --k_ui_fg5: #000000;
55 --k_ui_fg6: #000000;
56 --k_ui_fg7: #000000;
57 --k_ui_red0: #cc241d;
58 --k_ui_orange0: #d65d0e;
59 --k_ui_yellow0: #d79921;
60 --k_ui_green0: #98971a;
61 --k_ui_aqua0: #689d6a;
62 --k_ui_blue0: #458588;
63 --k_ui_purple0: #b16286;
64 --k_ui_gray0: #928374;
65 --k_ui_red1: #fb4934;
66 --k_ui_orange1: #fe8019;
67 --k_ui_yellow1: #fabd2f;
68 --k_ui_green1: #b8bb26;
69 --k_ui_aqua1: #8ec07c;
70 --k_ui_blue1: #83a598;
71 --k_ui_purple1: #d3869b;
72 --k_ui_gray1: #a89984;
73 }
74
75 table, th, td {
76 border:1px solid var(--k_ui_bg3);
77 }
78
79 body {
80 font-family: 'Roboto Condensed', sans-serif;
81 color: var(--k_ui_fg4);
82 background-color: var(--k_ui_bg0);
83 background-image: url("bg.jpg");
84 background-size: cover;
85 background-attachment: fixed;
86 background-position: center;
87 padding-left: 0px;
88 }
89
90 h1, h2 {
91 color: var(--k_ui_fg0);
92 display: inline;
93 }
94 h3 {
95 color: var(--k_ui_fg0);
96 display: inline;
97 }
98 a {
99 color: var(--k_ui_fg2);
100 }
101 a:hover{
102 color: var(--k_ui_orange1);
103 }
104 hr {
105 height: 20px;
106 border: 0;
107 box-shadow: inset 0 20px 12px -17px rgba(0, 0, 0, 0.34);
108 }
109 pre {
110 white-space: pre-wrap;
111 }
112
113
114 /* Content Wrapper */
115 .content {
116 margin: auto;
117 width: 98%;
118 max-width: 1200px;
119 padding-left: 0px;
120 /* background-color: var(--k_ui_bg1); */
121 color: var(--k_ui_fg0);
122 }
123 .realcontent {
124 background-color: var(--k_ui_bg1);
125 color: var(--k_ui_fg2);
126 outline-style: solid;
127 outline-width: 1px;
128 outline-color: var(--k_ui_bg4);
129 margin-left: 201px;
130 overflow-y:scroll;
131 box-shadow: 0px 0px 12px 1px rgba(0,0,0,0.5);
132 min-height: 600px;
133 }
134 .realcontent > p {
135 font-size: 19px;
136 }
137 .subcontent {
138 padding: 10px;
139 box-shadow: inset 0 20px 20px -20px rgba(0, 0, 0, 0.34);
140 }
141
142 /* Navigation panel */
143 .navpanel {
144 width: 200px;
145 float: left;
146 position: sticky;
147 top: 0;
148 }
149 .navside {
150 padding: 0px;
151 background-color: var(--k_ui_bg2);
152 box-shadow: inset -20px 0 18px -22px #080808;
153 }
154 .navside > a {
155 text-decoration:none;
156 color: var(--k_ui_fg1);
157 }
158
159 .navitem {
160 background-color: var(--k_ui_bg3);/*#301717;*/
161 padding: 8px;
162 box-shadow: inset -20px 0 18px -22px #080808;
163 border: 1px solid var(--k_ui_bg2);
164 }
165 .navitem:hover{
166 background-color: #444;
167 }
168
169 .navitemsel {
170 background-color: var(--k_ui_bg1);
171 color: var(--k_ui_fg0);
172 padding: 8px;
173 border: 1px solid var(--k_ui_bg4);
174 border-right: 0;
175 width:184px;
176 }
177
178 @media only screen and (max-width: 750px) {
179 .navpanel {
180 width: auto;
181 float: none;
182 position: static;
183 }
184 .navitemsel {
185 width: auto;
186 border: 1px solid var(--k_ui_fg0);
187 background-color: var(--k_ui_bg4);
188 color: var(--k_ui_fg1);
189 }
190 .realcontent {
191 margin-left: auto;
192 }
193 }
194 </style>
195 <title>Skaterift</title>
196 </head>
197
198 <body>
199 <center>
200 <br>
201 <img src="skaterift.svg" style="max-height:110px; max-width:100%;"/>
202 <br><br>
203 </center>
204 <div class="content">
205 <div class="navpanel">
206 <br>
207 <div class="navside">
208 <div style="padding:15px; text-align: center;">
209 <h3>Menu</h3>
210 </div>
211 <?php
212 srpage( "main", "About" );
213 //srpage( "leaderboards", "Leaderboards" );
214 ?>
215 <div style="padding:15px; text-align: center;">
216 <h3>Workshop</h3>
217 </div>
218 <?php
219 srpage( "workshop_content", "Content" );
220 srpage( "workshop_board", "Custom board guide" );
221 srpage( "workshop_world", "World guide" );
222 srpage( "workshop_player", "Avatar guide" );
223 ?>
224 </div>
225 </div>
226 <div class="realcontent">
227 <?php
228 $content = "frag/".$page.".html";
229 if( !file_exists( $content ) ){
230 $content = "frag/sr404.html";
231 }
232 echo file_get_contents( $content );
233 ?>
234 </div>
235 </div>
236 <center><p>Copyright ©2021-2023 Mt.Zero Software. All rights reserved.
237 All trademarks are property of their respective owners</p>
238 </center>
239 </body>
240 </html>