forked from svrjs/svrjs
feat: redesign index, tests and licenses pages
This commit is contained in:
parent
58d252defa
commit
1637e9dfcf
5 changed files with 116 additions and 41 deletions
|
|
@ -1,18 +1,18 @@
|
|||
<h1>Welcome to <%= name %> <%= version %></h1>
|
||||
<% if (version.indexOf("Nightly-") == 0) { %>
|
||||
<div style="background-color: #ffff00; color: #000000; border-color: #ff7f00; border-width: 5px; border-style: solid; padding: 5px; display: inline-block;">
|
||||
<div class="warning">
|
||||
<b style="font-size: 26px">WARNING!</b><br />
|
||||
This version is only for test purposes and may be unstable.
|
||||
</div>
|
||||
<br />
|
||||
<% } %>
|
||||
<br />
|
||||
<img src="/logo.png" style="width: 400px; max-width: 100%;" />
|
||||
<img src="/logo.png" class="logo" />
|
||||
<br />
|
||||
<p>If you see this page that means that the server is working properly. You can further configure the server and replace <i>index.html</i> and <i>tests.html</i> pages with custom ones.</p>
|
||||
<p>Default <i>config.json</i> looks like this:</p>
|
||||
<code style="padding: 5px; text-align: left; display: block; display: inline-block;">
|
||||
<pre style="margin: 0.2em; white-space: pre-wrap; overflow-wrap: break-word; word-wrap: break-word; word-break: break-all; word-break: break-word; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;">{
|
||||
<code class="example-configuration">
|
||||
<pre>{
|
||||
"users": [],
|
||||
"port": 80,
|
||||
"pubport": 80,
|
||||
|
|
@ -77,7 +77,7 @@
|
|||
}</pre>
|
||||
</code>
|
||||
<p>Changes:</p>
|
||||
<ul style="display: inline-block; margin: 0;">
|
||||
<ul>
|
||||
<% changes.forEach((change) => {%>
|
||||
<li><%= change %></li>
|
||||
<% }); %>
|
||||
|
|
|
|||
|
|
@ -6,22 +6,18 @@
|
|||
<meta charset="UTF-8" />
|
||||
<style>
|
||||
html {
|
||||
background-color: #dfffdf;
|
||||
background-color: #ffffff;
|
||||
color: #000000;
|
||||
font-family: FreeSans, Helvetica, Tahoma, Verdana, Arial, sans-serif;
|
||||
font-family: Poppins, FreeSans, Helvetica, Tahoma, Verdana, Arial, sans-serif;
|
||||
margin: 0.75em;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #ffffff;
|
||||
padding: 0.5em 0.5em 0.1em;
|
||||
margin: 0.5em auto;
|
||||
width: 90%;
|
||||
max-width: 800px;
|
||||
-webkit-box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.15);
|
||||
-moz-box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.15);
|
||||
box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.15)
|
||||
}
|
||||
|
||||
h1 {
|
||||
|
|
@ -32,10 +28,9 @@
|
|||
|
||||
pre,
|
||||
code {
|
||||
background-color: #dfffdf;
|
||||
-webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
|
||||
-moz-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
|
||||
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
|
||||
background-color: #f9f9fa;
|
||||
border: 1px solid #e4e4e7;
|
||||
border-radius: 7px;
|
||||
display: block;
|
||||
padding: 0.2em;
|
||||
font-family: "DejaVu Sans Mono", "Bitstream Vera Sans Mono", Hack, Menlo, Consolas, Monaco, monospace;
|
||||
|
|
@ -44,25 +39,105 @@
|
|||
width: 95%;
|
||||
}
|
||||
|
||||
iframe {
|
||||
border: 1px solid #e4e4e7;
|
||||
border-radius: 10px;
|
||||
background-color: #ffffff;
|
||||
width: 100%;
|
||||
max-width: 600px;
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
.warning {
|
||||
background-color: #ffff00;
|
||||
color: #000000;
|
||||
border: 5px solid #ff7f00;
|
||||
border-radius: 10px;
|
||||
padding: 5px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.logo {
|
||||
width: 400px;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
code.example-configuration {
|
||||
padding: 5px;
|
||||
text-align: left;
|
||||
display: block;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
code.example-configuration pre {
|
||||
margin: 0.2em;
|
||||
white-space: pre-wrap;
|
||||
overflow-wrap: break-word;
|
||||
word-wrap: break-word;
|
||||
word-break: break-all;
|
||||
word-break: break-word;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
ul {
|
||||
display: inline-block;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.license-svrjs {
|
||||
display: inline-block;
|
||||
text-align: left;
|
||||
border: 2px solid #e4e4e7;
|
||||
border-radius: 10px;
|
||||
background-color: #ffffff;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
.license-card {
|
||||
width: 100%;
|
||||
background-color: #f9f9fa;
|
||||
border: 1px solid #e4e4e7;
|
||||
border-radius: 7px;
|
||||
text-align: left;
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.license-card .license-type {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.license-card .license-name {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.license-card .license-description {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
@media screen and (prefers-color-scheme: dark) {
|
||||
html {
|
||||
background-color: #002000;
|
||||
color: #ffffff
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #000f00;
|
||||
-webkit-box-shadow: 0 5px 10px 0 rgba(127, 127, 127, 0.15);
|
||||
-moz-box-shadow: 0 5px 10px 0 rgba(127, 127, 127, 0.15);
|
||||
box-shadow: 0 5px 10px 0 rgba(127, 127, 127, 0.15)
|
||||
background-color: #0c0a09;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
pre,
|
||||
code {
|
||||
background-color: #002000;
|
||||
-webkit-box-shadow: 0 2px 4px 0 rgba(127, 127, 127, 0.1);
|
||||
-moz-box-shadow: 0 2px 4px 0 rgba(127, 127, 127, 0.1);
|
||||
box-shadow: 0 2px 4px 0 rgba(127, 127, 127, 0.1)
|
||||
background-color: #191817;
|
||||
border-color: #27272a;
|
||||
}
|
||||
|
||||
iframe {
|
||||
border-color: #27272a;
|
||||
}
|
||||
|
||||
.license-svrjs {
|
||||
background-color: #191817;
|
||||
border-color: #27272a;
|
||||
}
|
||||
|
||||
.license-card {
|
||||
background-color: #191817;
|
||||
border-color: #27272a;
|
||||
}
|
||||
|
||||
a {
|
||||
|
|
@ -70,7 +145,7 @@
|
|||
}
|
||||
|
||||
a:hover {
|
||||
color: #00ff00
|
||||
color: #ffffff
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
<div style="width: 100%; background-color: #ccc; background-color: rgba(200, 200, 200, 0.3); border: 1px solid green; text-align: left; margin: 10px 0;">
|
||||
<div style="float: right;">License: <%= license ? license : "Unknown" %></div>
|
||||
<div style="font-size: 20px;">
|
||||
<div class="license-card">
|
||||
<div class="license-type">License: <%= license ? license : "Unknown" %></div>
|
||||
<div class="license-name">
|
||||
<b><%= moduleName %></b><% if (author) { %> (by <%= author %>)<% } %>
|
||||
</div>
|
||||
<div style="font-size: 12px;">
|
||||
<div class="license-description">
|
||||
<%= description %><% if (required) { %><br/>
|
||||
<b>Required by <%= name %>.</b><% } %>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<h1><%= name %> <%= version %> Licenses</h1>
|
||||
<h2><%= name %> <%= version %></h2>
|
||||
<div style="display: inline-block; text-align: left; border-width: 2px; border-style: solid; border-color: gray; padding: 8px;">
|
||||
<div class="license-svrjs">
|
||||
MIT License<br/>
|
||||
<br/>
|
||||
Copyright (c) 2018-2024 SVR.JS<br/>
|
||||
|
|
|
|||
|
|
@ -1,18 +1,18 @@
|
|||
<h1><%= name %> <%= version %> Tests</h1>
|
||||
<h2>Directory (without trailing slash)</h2>
|
||||
<iframe src="/testdir" width="75%" height="300px"></iframe>
|
||||
<iframe src="/testdir"></iframe>
|
||||
<h2>Directory (with query)</h2>
|
||||
<iframe src="/testdir/?query=value" width="75%" height="300px"></iframe>
|
||||
<iframe src="/testdir/?query=value"></iframe>
|
||||
<h2>Directory (personalized)</h2>
|
||||
<iframe src="/testdir/.personalized" width="75%" height="300px"></iframe>
|
||||
<iframe src="/testdir/.personalized"></iframe>
|
||||
<h2>404 Error</h2>
|
||||
<iframe src="/tfhgfhggf" width="75%" height="300px"></iframe>
|
||||
<iframe src="/tfhgfhggf"></iframe>
|
||||
<h2>Server Side Javascript</h2>
|
||||
<iframe src="/hello.svr" width="75%" height="300px"></iframe>
|
||||
<iframe src="/hello.svr"></iframe>
|
||||
<h2>Proxy test</h2>
|
||||
<iframe src="/proxy.svr/this/hello.svr" width="75%" height="300px" id="proxy"></iframe>
|
||||
<iframe src="/proxy.svr/this/hello.svr"></iframe>
|
||||
<h2>URL rewriting test (/testdir_rewritten => /testdir)</h2>
|
||||
<iframe src="/testdir_rewritten" width="75%" height="300px"></iframe>
|
||||
<iframe src="/testdir_rewritten"></iframe>
|
||||
<br/>
|
||||
<br/>
|
||||
<img src="/powered.png" />
|
||||
|
|
|
|||
Reference in a new issue