mirror of
https://github.com/caddyserver/website.git
synced 2025-04-21 12:36:16 -04:00
Initial commit; starting new design
Dropdown menu
This commit is contained in:
Matthew Holt
Francis Lavoie
parent
5bb6d92c63
commit
18c3cd841e
8 changed files with 715 additions and 0 deletions
6
new/Caddyfile
Normal file
6
new/Caddyfile
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
localhost
|
||||
|
||||
file_server
|
||||
templates
|
||||
|
||||
try_files {path}.html {path}
|
||||
44
new/includes/head.html
Normal file
44
new/includes/head.html
Normal file
|
|
@ -0,0 +1,44 @@
|
|||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<!-- <link rel="preconnect" href="https://BH4D9OD16A-dsn.algolia.net" crossorigin /> -->
|
||||
|
||||
<link rel="icon" href="/resources/images/favicon.png">
|
||||
<!-- <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inter:400,700|Maven+Pro:400,700,900|Montserrat:400,700|PT+Mono&display=swap">-->
|
||||
<link rel="stylesheet" href="/resources/css/common.css">
|
||||
<script src="/resources/js/lib.js"></script>
|
||||
<script src="/resources/js/common.js"></script>
|
||||
|
||||
<!-- General metatags -->
|
||||
<!-- <meta name="author" content="Caddy Web Server">
|
||||
<meta name="description" content="Caddy is a powerful, enterprise-ready, open source web server with automatic HTTPS written in Go">
|
||||
<meta name="theme-color" content="#5ea9a2"> -->
|
||||
|
||||
<!-- Open Graph tags -->
|
||||
<!-- <meta property="og:type" content="website">
|
||||
<meta property="og:url" content="https://caddyserver.com/">
|
||||
<meta property="og:description" content="Caddy is a powerful, enterprise-ready, open source web server with automatic HTTPS written in Go">
|
||||
<meta property="og:image" content="https://caddyserver.com/resources/images/caddy-open-graph.jpg"> -->
|
||||
|
||||
<!-- Twitter card tags additive with the og: tags -->
|
||||
<!-- <meta name="twitter:card" content="summary_large_image">
|
||||
<meta name="twitter:domain" value="caddyserver.com">
|
||||
<meta name="twitter:description" value="Caddy is a powerful, enterprise-ready, open source web server with automatic HTTPS written in Go">
|
||||
<meta name="twitter:image" content="https://caddyserver.com/resources/images/caddy-open-graph.jpg">
|
||||
<meta name="twitter:url" value="https://caddyserver.com/"> -->
|
||||
|
||||
<!-- Algolia DocSearch -->
|
||||
<!-- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@docsearch/css@3"> -->
|
||||
|
||||
<!-- Global site tag (gtag.js) - Google Analytics (Stack Holdings) -->
|
||||
<!-- <script async src="https://www.googletagmanager.com/gtag/js?id=G-2DLB04LK4P"></script>
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
gtag('config', 'G-2DLB04LK4P');
|
||||
</script> -->
|
||||
|
||||
<!-- Alpine.js to augment markdown docs -->
|
||||
<!-- <script src="https://cdn.jsdelivr.net/npm/@alpinejs/persist@3.x.x/dist/cdn.min.js" defer></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js" defer></script> -->
|
||||
195
new/index.html
Normal file
195
new/index.html
Normal file
|
|
@ -0,0 +1,195 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Caddy - The Ultimate Server with Automatic HTTPS</title>
|
||||
{{include "/includes/head.html"}}
|
||||
<link rel="stylesheet" href="/resources/css/home.css">
|
||||
<!-- <meta property="og:title" content="Caddy 2 - The Ultimate Server with Automatic HTTPS">
|
||||
<meta name="twitter:title" value="Caddy 2 - The Ultimate Server with Automatic HTTPS"> -->
|
||||
</head>
|
||||
<body>
|
||||
<div class="hero">
|
||||
<header>
|
||||
<div class="topbar">
|
||||
<div class="wrapper">
|
||||
<a href="javascript:">GitHub</a>
|
||||
<a href="javascript:">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-brightness-half" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
||||
<path d="M12 9a3 3 0 0 0 0 6v-6z"></path>
|
||||
<path d="M6 6h3.5l2.5 -2.5l2.5 2.5h3.5v3.5l2.5 2.5l-2.5 2.5v3.5h-3.5l-2.5 2.5l-2.5 -2.5h-3.5v-3.5l-2.5 -2.5l2.5 -2.5z"></path>
|
||||
</svg>
|
||||
System theme
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="navbar wrapper">
|
||||
<a href="/"><img src="/resources/images/logo.svg" id="logo" alt="Caddy"></a>
|
||||
|
||||
<nav role="navigation" style="position: relative;">
|
||||
<ul>
|
||||
<li id="docs-link">
|
||||
<a href="/docs/">Documentation</a>
|
||||
<div id="docs-dropdown" class="dropdown hidden">
|
||||
<div class="row flatlinks">
|
||||
<a href="/docs/install">
|
||||
<b>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-server-bolt" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
||||
<path d="M3 4m0 3a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v2a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3z"></path>
|
||||
<path d="M15 20h-9a3 3 0 0 1 -3 -3v-2a3 3 0 0 1 3 -3h12"></path>
|
||||
<path d="M7 8v.01"></path>
|
||||
<path d="M7 16v.01"></path>
|
||||
<path d="M20 15l-2 3h3l-2 3"></path>
|
||||
</svg>
|
||||
Installation
|
||||
</b>
|
||||
Learn how to install Caddy for your platform
|
||||
</a>
|
||||
<a href="/docs/install">
|
||||
<b>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-file-text" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
||||
<path d="M14 3v4a1 1 0 0 0 1 1h4"></path>
|
||||
<path d="M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z"></path>
|
||||
<path d="M9 9l1 0"></path>
|
||||
<path d="M9 13l6 0"></path>
|
||||
<path d="M9 17l6 0"></path>
|
||||
</svg>
|
||||
Caddyfile
|
||||
</b>
|
||||
A simplified, human-friendly configuration format
|
||||
</a>
|
||||
<a href="/docs/install">
|
||||
<b>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-file-code" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
||||
<path d="M14 3v4a1 1 0 0 0 1 1h4"></path>
|
||||
<path d="M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z"></path>
|
||||
<path d="M10 13l-1 2l1 2"></path>
|
||||
<path d="M14 13l1 2l-1 2"></path>
|
||||
</svg>
|
||||
JSON
|
||||
</b>
|
||||
Powerful and programmable native config format
|
||||
</a>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="linkbox">
|
||||
<div class="col">
|
||||
<h2>Tutorials</h2>
|
||||
<a href="javascript:">Caddy basics</a>
|
||||
<a href="javascript:">Static files</a>
|
||||
<a href="javascript:">Reverse proxy</a>
|
||||
<a href="javascript:">Troubleshooting</a>
|
||||
</div>
|
||||
<div class="col">
|
||||
<h2>Reference</h2>
|
||||
<a href="javascript:">Command line</a>
|
||||
<a href="javascript:">Caddyfile</a>
|
||||
<a href="javascript:">API</a>
|
||||
<a href="javascript:">JSON Config</a>
|
||||
<a href="javascript:">Auto HTTPS</a>
|
||||
</div>
|
||||
<!-- <div class="col">
|
||||
<h2>Caddyfile</h2>
|
||||
<a href="javascript:">Directives</a>
|
||||
<a href="javascript:">Request matchers</a>
|
||||
<a href="javascript:">Global options</a>
|
||||
</div> -->
|
||||
<div class="col">
|
||||
<h2>Develop</h2>
|
||||
<a href="javascript:">Architecture</a>
|
||||
<a href="javascript:">Contribute</a>
|
||||
<a href="javascript:">Write a module</a>
|
||||
</div>
|
||||
<div class="col">
|
||||
<h2>Articles</h2>
|
||||
<a href="javascript:">Logging</a>
|
||||
<a href="javascript:">Monitoring</a>
|
||||
<a href="javascript:">Security</a>
|
||||
<a href="javascript:">Custom domains</a>
|
||||
<a href="javascript:">All articles...</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Make a new linkbox div for a separate section. -->
|
||||
</div>
|
||||
<div class="row featured">
|
||||
<a href="/docs/install">
|
||||
<b>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-atom-2" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
||||
<path d="M12 12m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0"></path>
|
||||
<path d="M12 21l0 .01"></path>
|
||||
<path d="M3 9l0 .01"></path>
|
||||
<path d="M21 9l0 .01"></path>
|
||||
<path d="M8 20.1a9 9 0 0 1 -5 -7.1"></path>
|
||||
<path d="M16 20.1a9 9 0 0 0 5 -7.1"></path>
|
||||
<path d="M6.2 5a9 9 0 0 1 11.4 0"></path>
|
||||
</svg>
|
||||
Examples
|
||||
</b>
|
||||
Learn from examples contributed by the community
|
||||
</a>
|
||||
<a href="/docs/install">
|
||||
<b>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-message-circle-question" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
||||
<path d="M15.02 19.52c-2.341 .736 -5 .606 -7.32 -.52l-4.7 1l1.3 -3.9c-2.324 -3.437 -1.426 -7.872 2.1 -10.374c3.526 -2.501 8.59 -2.296 11.845 .48c1.649 1.407 2.575 3.253 2.742 5.152"></path>
|
||||
<path d="M19 22v.01"></path>
|
||||
<path d="M19 19a2.003 2.003 0 0 0 .914 -3.782a1.98 1.98 0 0 0 -2.414 .483"></path>
|
||||
</svg>
|
||||
<!-- <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-help-hexagon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
||||
<path d="M19.875 6.27c.7 .398 1.13 1.143 1.125 1.948v7.284c0 .809 -.443 1.555 -1.158 1.948l-6.75 4.27a2.269 2.269 0 0 1 -2.184 0l-6.75 -4.27a2.225 2.225 0 0 1 -1.158 -1.948v-7.285c0 -.809 .443 -1.554 1.158 -1.947l6.75 -3.98a2.33 2.33 0 0 1 2.25 0l6.75 3.98h-.033z"></path>
|
||||
<path d="M12 16v.01"></path>
|
||||
<path d="M12 13a2 2 0 0 0 .914 -3.782a1.98 1.98 0 0 0 -2.414 .483"></path>
|
||||
</svg> -->
|
||||
FAQ
|
||||
</b>
|
||||
Get fast answers to common questions
|
||||
</a>
|
||||
<a href="/docs/install">
|
||||
<b>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-hexagons" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
||||
<path d="M4 18v-5l4 -2l4 2v5l-4 2z"></path>
|
||||
<path d="M8 11v-5l4 -2l4 2v5"></path>
|
||||
<path d="M12 13l4 -2l4 2v5l-4 2l-4 -2"></path>
|
||||
</svg>
|
||||
Modules
|
||||
</b>
|
||||
The official list of registered Caddy plugins
|
||||
</a>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="plainbox">
|
||||
<a href="javascript:">Documentation index</a>
|
||||
<a href="javascript:">Community wiki</a>
|
||||
<a href="javascript:">Contribute to docs</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://store.caddyserver.com">Store</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/account">Account</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/help">Help</a> <!-- TODO: a dropdown menu -->
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<div class="actions">
|
||||
<a href="/download" class="button secondary">Download</a>
|
||||
<a href="/sponsor" class="button primary">Sponsor</a>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
305
new/resources/css/common.css
Normal file
305
new/resources/css/common.css
Normal file
|
|
@ -0,0 +1,305 @@
|
|||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: Inter, system-ui;
|
||||
font-size: 16px;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
tab-size: 4;
|
||||
-moz-tab-size: 4;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
max-width: 1400px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
header {
|
||||
background: rgb(255 255 255 / .1);
|
||||
box-shadow: 0 0 50px rgb(0 0 0 / .2);
|
||||
backdrop-filter: blur(10px);
|
||||
}
|
||||
|
||||
header a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
header .topbar,
|
||||
header nav > ul {
|
||||
background: linear-gradient(to right, rgb(100 190 121), rgb(54 206 255));
|
||||
background-clip: text;
|
||||
-webkit-background-clip: text;
|
||||
}
|
||||
|
||||
.topbar {
|
||||
font-size: 14px;
|
||||
border-bottom: 1px solid hsl(203deg 100% 79% / 20%);
|
||||
}
|
||||
|
||||
.topbar .wrapper {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
gap: 1em;
|
||||
color: rgba(255, 255, 255, 0.75);
|
||||
}
|
||||
|
||||
.topbar a {
|
||||
display: inline-block;
|
||||
padding: 8px;
|
||||
color: inherit;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.topbar a:hover {
|
||||
background: rgb(0 0 0 / .5);
|
||||
}
|
||||
|
||||
.navbar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 2em;
|
||||
}
|
||||
|
||||
nav ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding-left: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 2em;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.topbar,
|
||||
.navbar nav > ul > li > a {
|
||||
-webkit-text-fill-color: rgba(0 0 0 / .1);
|
||||
}
|
||||
|
||||
.topbar a:hover,
|
||||
.navbar nav > ul > li > a:hover {
|
||||
-webkit-text-fill-color: rgba(255 255 255 / .4);
|
||||
}
|
||||
|
||||
.navbar nav > ul > li > a,
|
||||
.navbar .button {
|
||||
text-decoration: none;
|
||||
transition: all 250ms;
|
||||
color: inherit;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.navbar nav > ul > li > a {
|
||||
padding: 20px 5px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.icon {
|
||||
height: 1.4em;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
#logo {
|
||||
height: 2.25em;
|
||||
}
|
||||
|
||||
.navbar .actions {
|
||||
margin-left: auto;
|
||||
display: flex;
|
||||
gap: 1em;
|
||||
}
|
||||
|
||||
.button {
|
||||
padding: .6em 1.5em;
|
||||
border-radius: 6px;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.button.secondary {
|
||||
color: rgb(54 206 255);
|
||||
border: 1px solid rgb(54 206 255);
|
||||
}
|
||||
|
||||
.button.secondary:hover {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.button.primary {
|
||||
background: linear-gradient(135deg, white 25%, rgba(167,183,193) 80%);
|
||||
color: #222;
|
||||
box-shadow: 0 2px 8px rgb(0 0 0 / .3);
|
||||
}
|
||||
|
||||
.button.primary:hover {
|
||||
color: #1a71cb;
|
||||
transform: scale(1.08);
|
||||
box-shadow: 0 4px 15px rgb(0 0 0 / .2);
|
||||
}
|
||||
|
||||
.button.primary:active {
|
||||
transition: all 100ms;
|
||||
transform: scale(.95);
|
||||
box-shadow: 0 -1px 4px rgb(0 0 0 / .5);
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
#docs-link:hover .dropdown {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
transform-origin: top center;
|
||||
animation: rotateMenu 300ms ease;
|
||||
}
|
||||
|
||||
@keyframes rotateMenu {
|
||||
0% { transform: rotateX(-90deg) }
|
||||
100% { transform: rotateX(0deg) }
|
||||
}
|
||||
|
||||
|
||||
.dropdown {
|
||||
position: absolute;
|
||||
display: inline-block;
|
||||
background: #e8ecef;
|
||||
border-radius: 15px;
|
||||
line-height: 1.5;
|
||||
overflow: hidden;
|
||||
box-shadow: 0 20px 50px black;
|
||||
transition-duration: .2s;
|
||||
transition-property: opacity, transform;
|
||||
visibility: hidden;
|
||||
opacity: 0;
|
||||
top: calc(100% - 5px);
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.dropdown .row {
|
||||
display: flex;
|
||||
gap: 1px;
|
||||
margin-bottom: 1px;
|
||||
}
|
||||
|
||||
.dropdown .plainbox,
|
||||
.dropdown .linkbox {
|
||||
display: flex;
|
||||
gap: 4em;
|
||||
padding: 1.5em;
|
||||
}
|
||||
|
||||
.dropdown .plainbox {
|
||||
padding-top: .5em;
|
||||
width: 100%;
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
.dropdown .plainbox a {
|
||||
color: #647687;
|
||||
}
|
||||
|
||||
.dropdown .plainbox a:hover {
|
||||
color: #142633;
|
||||
}
|
||||
|
||||
.dropdown .linkbox {
|
||||
background: white;
|
||||
gap: 4em;
|
||||
}
|
||||
|
||||
.dropdown h2 {
|
||||
font-family: Poppins, ui-rounded;
|
||||
font-weight: 500;
|
||||
color: #444;
|
||||
font-size: 22px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.dropdown .col {
|
||||
min-width: 150px;
|
||||
}
|
||||
|
||||
.dropdown .col a {
|
||||
display: block;
|
||||
color: #647687;
|
||||
text-decoration: none;
|
||||
padding: 5px 0;
|
||||
}
|
||||
|
||||
|
||||
.dropdown .col a:hover {
|
||||
color: #142633;
|
||||
}
|
||||
|
||||
.dropdown .flatlinks a {
|
||||
background: white;
|
||||
padding: 1em 2em;
|
||||
color: #647687;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.dropdown .flatlinks a b,
|
||||
.dropdown .featured a b {
|
||||
display: block;
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.dropdown .flatlinks a b {
|
||||
color: #142633;
|
||||
margin-bottom: .25em;
|
||||
}
|
||||
|
||||
.dropdown .flatlinks a:hover {
|
||||
background: rgb(239, 244, 248);
|
||||
}
|
||||
|
||||
.dropdown .featured a b {
|
||||
color: #384f61;
|
||||
margin-bottom: .5em;
|
||||
}
|
||||
|
||||
.dropdown .featured a:hover b {
|
||||
color: #1e3141;
|
||||
}
|
||||
|
||||
|
||||
.dropdown .featured {
|
||||
gap: 1em;
|
||||
padding: 1em;
|
||||
/* background: white; */
|
||||
}
|
||||
|
||||
.dropdown .featured a {
|
||||
display: block;
|
||||
padding: 1em;
|
||||
font-size: 14px;
|
||||
line-height: 1.4;
|
||||
border-radius: 10px;
|
||||
color: #647687;
|
||||
font-size: 14px;
|
||||
background-color: white;
|
||||
background-image: linear-gradient(to bottom, rgb(239 244 247), rgba(252,252,252,0));
|
||||
/* background: linear-gradient(137deg, rgb(241 251 247) 0%, rgb(242 248 255) 100%); */
|
||||
flex: 1;
|
||||
transition: background-color 150ms;
|
||||
box-shadow: 0 1px 2px rgb(0 0 0 / .2);
|
||||
}
|
||||
|
||||
.dropdown .featured a:hover {
|
||||
background-color: rgb(223, 233, 238); /* rgb(232, 255, 254); */
|
||||
}
|
||||
|
||||
.dropdown .featured a b {
|
||||
display: block;
|
||||
color: #384f61;
|
||||
font-size: 16px;
|
||||
margin-bottom: .5em;
|
||||
font-weight: 600;
|
||||
}
|
||||
10
new/resources/css/home.css
Normal file
10
new/resources/css/home.css
Normal file
|
|
@ -0,0 +1,10 @@
|
|||
.hero {
|
||||
background-color: hsla(201,63%,15%,1);
|
||||
background-image:
|
||||
radial-gradient(at 50% 96%, hsla(0,100%,20%,0.35) 0px, transparent 50%),
|
||||
radial-gradient(at 5% 30%, hsla(136,95%,15%,1) 0px, transparent 50%),
|
||||
radial-gradient(at 91% 0%, hsla(214,83%,25%,1) 0px, transparent 50%),
|
||||
radial-gradient(at 82% 73%, hsla(265,72%,20%,1) 0px, transparent 50%);
|
||||
|
||||
min-height: 800px;
|
||||
}
|
||||
73
new/resources/images/logo.svg
Normal file
73
new/resources/images/logo.svg
Normal file
|
|
@ -0,0 +1,73 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg width="100%" height="100%" viewBox="0 0 100 27" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;">
|
||||
<g transform="matrix(1,0,0,1,-3639.07,-3116.43)">
|
||||
<g transform="matrix(0.875155,0,0,2.93093,3481.84,3067.03)">
|
||||
<g transform="matrix(0.297956,0,0,0.0889674,-994.219,-139.295)">
|
||||
<g id="Logo" transform="matrix(1,0,0,1,21.4759,36.7359)">
|
||||
<g id="Icon">
|
||||
<g>
|
||||
<g transform="matrix(-0.191794,-0.715786,0.715786,-0.191794,4329.14,4673.64)">
|
||||
<path d="M3901.56,610.734L3901.56,613.552C3892.96,614.059 3884.66,612.867 3877.03,610.1C3869,607.19 3861.75,602.568 3855.69,596.742C3853.24,594.39 3851.01,591.806 3849.01,589.049C3847.03,586.304 3845.27,583.38 3843.79,580.306C3839.51,571.425 3837.34,561.391 3837.68,550.868C3838.03,542.781 3839.84,535.125 3842.9,528.125C3846.02,520.981 3850.39,514.54 3855.79,509.095L3856.83,510.049C3852.08,515.696 3848.37,522.203 3845.94,529.307C3843.64,536.055 3842.57,543.321 3842.89,550.868C3843.21,560.381 3845.89,569.224 3850.13,577.066C3851.57,579.733 3853.2,582.281 3854.97,584.709C3856.76,587.149 3858.71,589.457 3860.8,591.633C3866.04,597.093 3872.24,601.608 3879.2,604.877C3886.06,608.1 3893.53,610.261 3901.56,610.734Z" style="fill:rgb(0,144,221);"/>
|
||||
</g>
|
||||
<g transform="matrix(-0.191794,-0.715786,0.715786,-0.191794,4329.14,4673.64)">
|
||||
<path d="M3875.69,496.573L3874.71,494.525C3878.89,492.683 3883.3,491.309 3887.89,490.397C3892.3,489.519 3896.87,489.06 3901.56,489.154C3903.86,489.054 3906.12,489.104 3908.37,489.229C3917.87,489.76 3926.88,492.192 3934.84,496.562C3939.26,498.99 3943.37,501.962 3946.95,505.478C3951.72,510.163 3955.57,515.775 3958.48,521.868C3962.66,530.628 3964.74,540.511 3964.36,550.868C3964.01,560.422 3961.47,569.34 3957.43,577.348C3955.66,580.853 3953.59,584.168 3951.31,587.319C3949.25,590.174 3947.02,592.903 3944.57,595.428C3938.83,601.355 3931.99,606.216 3924.28,609.566C3923.55,609.883 3922.86,610.344 3922.07,610.474C3921.47,610.573 3920.98,610.432 3920.37,610.389L3919.69,608.224C3920.14,607.854 3920.42,607.448 3920.93,607.167C3921.6,606.805 3922.37,606.721 3923.09,606.478C3928.53,604.619 3933.66,602.055 3938.27,598.768C3942.96,595.427 3947.22,591.461 3950.66,586.838C3953.7,582.753 3956.09,578.169 3957.88,573.322C3960.46,566.345 3961.61,558.748 3961.32,550.868C3960.96,541.186 3958.2,532.197 3953.85,524.232C3950.89,518.816 3947.09,513.98 3942.81,509.619C3939.59,506.335 3936.13,503.294 3932.31,500.683C3925.19,495.814 3917.13,492.147 3908.21,490.688C3906.03,490.332 3903.82,490.13 3901.56,490.032C3896.96,490.124 3892.49,490.704 3888.2,491.786C3883.8,492.897 3879.62,494.538 3875.69,496.573Z" style="fill:rgb(0,144,221);"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<g transform="matrix(-3.37109,-0.514565,0.514565,-3.37109,4078.07,1806.88)">
|
||||
<path d="M22,12C22,10.903 21.097,10 20,10C19.421,10 18.897,10.251 18.53,10.649C18.202,11.006 18,11.481 18,12C18,13.097 18.903,14 20,14C21.097,14 22,13.097 22,12Z" style="fill:none;fill-rule:nonzero;stroke:rgb(0,144,221);stroke-width:1.05px;"/>
|
||||
</g>
|
||||
<g transform="matrix(-5.33921,-5.26159,-3.12106,-6.96393,4073.87,1861.55)">
|
||||
<path d="M10.773,4.925L10.675,5.457C10.675,5.457 10.615,5.518 10.557,5.577C10.343,5.791 9.894,6.24 9.36,6.771C8.045,8.077 6.237,9.86 6.237,9.86L6.054,9.805C6.054,9.805 7.768,7.995 9.03,6.673C9.543,6.135 9.978,5.682 10.186,5.467C10.542,5.096 10.773,4.925 10.773,4.925Z" style="fill:rgb(0,144,221);"/>
|
||||
</g>
|
||||
</g>
|
||||
<g transform="matrix(3.11426,0,0,3.11426,3938.31,1737.25)">
|
||||
<g>
|
||||
<path d="M9.876,21L18.162,21C18.625,21 19,20.625 19,20.162L19,11.838C19,11.375 18.625,11 18.162,11L5.838,11C5.375,11 5,11.375 5,11.838L5,16.758" style="fill:none;stroke:rgb(35,194,56);stroke-width:1.89px;stroke-linecap:butt;stroke-linejoin:miter;"/>
|
||||
<path d="M8,11L8,7C8,4.806 9.806,3 12,3C14.194,3 16,4.806 16,7L16,11" style="fill:none;fill-rule:nonzero;stroke:rgb(35,194,56);stroke-width:1.89px;"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<g transform="matrix(5.30977,0.697415,-0.697415,5.30977,3852.72,1727.97)">
|
||||
<path d="M22,12C22,11.659 21.913,11.337 21.76,11.055C21.421,10.429 20.756,10 20,10C18.903,10 18,10.903 18,12C18,13.097 18.903,14 20,14C21.097,14 22,13.097 22,12Z" style="fill:none;fill-rule:nonzero;stroke:rgb(0,144,221);stroke-width:0.98px;"/>
|
||||
</g>
|
||||
<g transform="matrix(4.93114,2.49604,1.11018,5.44847,3921.41,1726.72)">
|
||||
<path d="M8.902,6.77L9.219,7.068C9.219,7.068 7.749,8.739 6.646,9.951C6.021,10.637 5.52,11.164 5.52,11.164L4.819,10.502C4.819,10.502 5.343,9.996 6.027,9.366C7.235,8.253 8.902,6.77 8.902,6.77Z" style="fill:rgb(0,144,221);"/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<g id="Wordmark" transform="matrix(1.54159,0,0,2.8744,2710.6,709.804)">
|
||||
<g id="y" transform="matrix(0.50291,0,0,0.281607,905.533,304.987)">
|
||||
<path d="M192.152,286.875L202.629,268.64C187.804,270.106 183.397,265.779 180.143,263.391C176.888,261.004 174.362,257.99 172.563,254.347C170.765,250.705 169.866,246.691 169.866,242.305L169.866,208.107L183.21,208.107L183.21,242.213C183.21,245.188 183.896,247.822 185.268,250.116C186.64,252.41 188.465,254.197 190.743,255.475C193.022,256.754 195.501,257.393 198.182,257.393C200.894,257.393 203.393,256.75 205.68,255.463C207.966,254.177 209.799,252.391 211.178,250.105C212.558,247.818 213.248,245.188 213.248,242.213L213.248,208.107L226.545,208.107L226.545,242.305C226.545,246.707 225.378,258.46 218.079,268.64C215.735,271.909 207.835,286.875 207.835,286.875L192.152,286.875Z" style="fill:rgb(230,230,230);fill-rule:nonzero;"/>
|
||||
</g>
|
||||
<g id="add" transform="matrix(0.525075,0,0,0.281607,801.871,304.987)">
|
||||
<g transform="matrix(116.242,0,0,116.242,161.846,267.39)">
|
||||
<path d="M0.276,0.012C0.227,0.012 0.185,-0 0.15,-0.024C0.115,-0.048 0.087,-0.08 0.069,-0.121C0.05,-0.161 0.04,-0.205 0.04,-0.254C0.04,-0.305 0.051,-0.35 0.073,-0.391C0.094,-0.431 0.125,-0.463 0.166,-0.487C0.206,-0.51 0.254,-0.522 0.31,-0.522C0.365,-0.522 0.412,-0.51 0.452,-0.487C0.491,-0.463 0.521,-0.431 0.542,-0.391C0.563,-0.35 0.573,-0.305 0.573,-0.256L0.573,-0L0.458,-0L0.458,-0.095L0.456,-0.095C0.446,-0.076 0.433,-0.059 0.417,-0.043C0.401,-0.026 0.381,-0.013 0.358,-0.003C0.335,0.007 0.307,0.012 0.276,0.012ZM0.307,-0.086C0.337,-0.086 0.363,-0.094 0.386,-0.109C0.408,-0.124 0.425,-0.144 0.438,-0.17C0.45,-0.195 0.456,-0.224 0.456,-0.256C0.456,-0.288 0.45,-0.317 0.438,-0.342C0.426,-0.367 0.409,-0.387 0.387,-0.402C0.365,-0.417 0.339,-0.424 0.308,-0.424C0.276,-0.424 0.249,-0.417 0.226,-0.402C0.203,-0.387 0.186,-0.366 0.174,-0.341C0.162,-0.316 0.156,-0.287 0.156,-0.255C0.156,-0.224 0.162,-0.195 0.174,-0.17C0.186,-0.144 0.203,-0.124 0.226,-0.109C0.248,-0.094 0.275,-0.086 0.307,-0.086Z" style="fill:rgb(230,230,230);fill-rule:nonzero;"/>
|
||||
</g>
|
||||
<g transform="matrix(116.242,0,0,116.242,224.849,267.39)">
|
||||
<path d="M0.306,0.012C0.265,0.012 0.229,0.005 0.196,-0.008C0.163,-0.021 0.135,-0.039 0.112,-0.064C0.089,-0.089 0.071,-0.118 0.059,-0.152C0.046,-0.185 0.04,-0.222 0.04,-0.263C0.04,-0.315 0.051,-0.36 0.071,-0.399C0.093,-0.438 0.122,-0.468 0.159,-0.49C0.196,-0.511 0.239,-0.522 0.287,-0.522C0.311,-0.522 0.334,-0.518 0.355,-0.511C0.376,-0.504 0.396,-0.493 0.413,-0.48C0.43,-0.467 0.444,-0.451 0.455,-0.433L0.456,-0.433L0.456,-0.73L0.571,-0.73L0.571,-0.261C0.571,-0.205 0.56,-0.157 0.538,-0.116C0.515,-0.075 0.484,-0.043 0.445,-0.021C0.405,0.001 0.359,0.012 0.306,0.012ZM0.306,-0.086C0.335,-0.086 0.361,-0.093 0.384,-0.108C0.406,-0.122 0.423,-0.142 0.436,-0.167C0.449,-0.192 0.455,-0.222 0.455,-0.255C0.455,-0.288 0.449,-0.318 0.436,-0.343C0.423,-0.368 0.406,-0.388 0.384,-0.403C0.361,-0.417 0.335,-0.424 0.305,-0.424C0.276,-0.424 0.251,-0.417 0.228,-0.402C0.205,-0.387 0.188,-0.367 0.175,-0.342C0.162,-0.317 0.156,-0.288 0.156,-0.255C0.156,-0.222 0.162,-0.192 0.175,-0.167C0.188,-0.142 0.205,-0.122 0.229,-0.108C0.252,-0.093 0.277,-0.086 0.306,-0.086Z" style="fill:rgb(230,230,230);fill-rule:nonzero;"/>
|
||||
</g>
|
||||
<g transform="matrix(116.242,0,0,116.242,287.154,267.39)">
|
||||
<path d="M0.306,0.012C0.265,0.012 0.229,0.005 0.196,-0.008C0.163,-0.021 0.135,-0.039 0.112,-0.064C0.089,-0.089 0.071,-0.118 0.059,-0.152C0.046,-0.185 0.04,-0.222 0.04,-0.263C0.04,-0.315 0.051,-0.36 0.071,-0.399C0.093,-0.438 0.122,-0.468 0.159,-0.49C0.196,-0.511 0.239,-0.522 0.287,-0.522C0.311,-0.522 0.334,-0.518 0.355,-0.511C0.376,-0.504 0.396,-0.493 0.413,-0.48C0.43,-0.467 0.444,-0.451 0.455,-0.433L0.456,-0.433L0.456,-0.73L0.571,-0.73L0.571,-0.261C0.571,-0.205 0.56,-0.157 0.538,-0.116C0.515,-0.075 0.484,-0.043 0.445,-0.021C0.405,0.001 0.359,0.012 0.306,0.012ZM0.306,-0.086C0.335,-0.086 0.361,-0.093 0.384,-0.108C0.406,-0.122 0.423,-0.142 0.436,-0.167C0.449,-0.192 0.455,-0.222 0.455,-0.255C0.455,-0.288 0.449,-0.318 0.436,-0.343C0.423,-0.368 0.406,-0.388 0.384,-0.403C0.361,-0.417 0.335,-0.424 0.305,-0.424C0.276,-0.424 0.251,-0.417 0.228,-0.402C0.205,-0.387 0.188,-0.367 0.175,-0.342C0.162,-0.317 0.156,-0.288 0.156,-0.255C0.156,-0.222 0.162,-0.192 0.175,-0.167C0.188,-0.142 0.205,-0.122 0.229,-0.108C0.252,-0.093 0.277,-0.086 0.306,-0.086Z" style="fill:rgb(230,230,230);fill-rule:nonzero;"/>
|
||||
</g>
|
||||
</g>
|
||||
<g id="c" transform="matrix(-0.0716462,0.31304,-0.583685,-0.0384251,1489.76,-444.051)">
|
||||
<path d="M2668.11,700.4C2666.79,703.699 2666.12,707.216 2666.12,710.766C2666.12,726.268 2678.71,738.854 2694.21,738.854C2709.71,738.854 2722.3,726.268 2722.3,710.766C2722.3,704.111 2719.93,697.672 2715.63,692.597L2707.63,699.378C2710.33,702.559 2711.57,706.602 2711.81,710.766C2712.2,717.38 2706.61,724.52 2697.27,726.637C2683.9,728.581 2676.61,720.482 2676.61,710.766C2676.61,708.541 2677.03,706.336 2677.85,704.269L2668.11,700.4Z" style="fill:rgb(230,230,230);"/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<g id="R" transform="matrix(0.670012,0,0,0.670012,1723.64,487.612)">
|
||||
<g transform="matrix(1,0,0,1,-0.10786,0.450801)">
|
||||
<g transform="matrix(12.1247,0,0,12.1247,3862.61,1929.9)">
|
||||
<path d="M0.079,-0L0.079,-0.716L0.396,-0.716C0.46,-0.716 0.508,-0.709 0.542,-0.697C0.575,-0.684 0.601,-0.661 0.621,-0.628C0.641,-0.596 0.651,-0.56 0.651,-0.521C0.651,-0.47 0.634,-0.427 0.602,-0.392C0.569,-0.357 0.518,-0.335 0.449,-0.326C0.474,-0.314 0.493,-0.302 0.506,-0.29C0.534,-0.265 0.56,-0.233 0.585,-0.195L0.709,-0L0.59,-0L0.496,-0.149C0.468,-0.192 0.445,-0.225 0.427,-0.248C0.409,-0.27 0.393,-0.286 0.379,-0.295C0.365,-0.305 0.351,-0.311 0.336,-0.314C0.325,-0.317 0.308,-0.318 0.283,-0.318L0.173,-0.318L0.173,-0L0.079,-0ZM0.173,-0.4L0.377,-0.4C0.42,-0.4 0.454,-0.404 0.479,-0.413C0.503,-0.422 0.521,-0.437 0.534,-0.456C0.547,-0.476 0.553,-0.497 0.553,-0.521C0.553,-0.554 0.541,-0.582 0.516,-0.604C0.492,-0.626 0.453,-0.637 0.4,-0.637L0.173,-0.637L0.173,-0.4Z" style="fill:rgb(230,230,230);fill-rule:nonzero;"/>
|
||||
</g>
|
||||
</g>
|
||||
<g transform="matrix(1,0,0,1,0.278569,0.101881)">
|
||||
<circle cx="3866.43" cy="1926.14" r="8.923" style="fill:none;stroke:rgb(230,230,230);stroke-width:2px;stroke-linecap:butt;stroke-linejoin:miter;"/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 12 KiB |
0
new/resources/js/common.js
Normal file
0
new/resources/js/common.js
Normal file
82
new/resources/js/lib.js
Normal file
82
new/resources/js/lib.js
Normal file
|
|
@ -0,0 +1,82 @@
|
|||
// AJQuery: https://github.com/coolaj86/ajquery.js (modified slightly by me)
|
||||
function $(sel, el) { return ((typeof el === 'string' ? $(el) : el) || document).querySelector(sel); }
|
||||
function $$(sel, el) { return (el || document).querySelectorAll(sel); }
|
||||
|
||||
|
||||
function ready(fn) {
|
||||
if (document.readyState !== 'loading') {
|
||||
fn();
|
||||
} else {
|
||||
document.addEventListener('DOMContentLoaded', fn);
|
||||
}
|
||||
}
|
||||
|
||||
function on(eventName, elemSelector, handler, capture) {
|
||||
let events = [eventName];
|
||||
if (eventName.indexOf(',') >= 0) {
|
||||
events = eventName.split(',');
|
||||
}
|
||||
|
||||
events.forEach(eventName => {
|
||||
// from youmightnotneedjquery.com
|
||||
document.addEventListener(eventName.trim(), function (e) {
|
||||
// loop parent nodes from the target to the delegation node
|
||||
for (let target = e.target; target && target != this; target = target.parentNode) {
|
||||
if (NodeList.prototype.isPrototypeOf(elemSelector)) {
|
||||
for (el of elemSelector) {
|
||||
if (el == target) {
|
||||
handler.call(target, e);
|
||||
return;
|
||||
}
|
||||
}
|
||||
} else if (!elemSelector || target.matches(elemSelector)) {
|
||||
handler.call(target, e);
|
||||
return;
|
||||
}
|
||||
}
|
||||
}, capture); // I find capture=true helpful when using :not() selectors to exclude one elem of the node tree
|
||||
});
|
||||
}
|
||||
|
||||
function trigger(el, eventType) {
|
||||
if (typeof el === 'string') {
|
||||
el = $(el); // assume it was a selector, for convenience
|
||||
}
|
||||
|
||||
// from youmightnotneedjquery.com
|
||||
if (typeof eventType === 'string' && typeof el[eventType] === 'function') {
|
||||
el[eventType]();
|
||||
} else {
|
||||
const event =
|
||||
typeof eventType === 'string'
|
||||
? new Event(eventType, { bubbles: true, cancelable: true })
|
||||
: eventType;
|
||||
el.dispatchEvent(event);
|
||||
}
|
||||
}
|
||||
|
||||
// cloneTemplate does a deep clone of the <template> tag selected by tplSelector.
|
||||
function cloneTemplate(tplSelector) {
|
||||
// Ohhhhhh wow, we need to use firstElementChild when cloning the content of a template tag (!!!!):
|
||||
// https://developer.mozilla.org/en-US/docs/Web/HTML/Element/template#avoiding_documentfragment_pitfall
|
||||
// I spent way too long on this.
|
||||
const elem = $(tplSelector);
|
||||
if (!elem) return;
|
||||
return elem.content.firstElementChild.cloneNode(true);
|
||||
// return document.importNode(elem.content, true);
|
||||
}
|
||||
|
||||
// isVisible returns true if elem (an element or selector) is visible.
|
||||
function isVisible(elem) {
|
||||
if (typeof elem === 'string') {
|
||||
elem = $(elem);
|
||||
}
|
||||
return elem.offsetParent !== null;
|
||||
}
|
||||
|
||||
// queryParam returns the named query string parameter's value(s).
|
||||
function queryParam(name) {
|
||||
const urlSearchParams = new URLSearchParams(window.location.search);
|
||||
const params = Object.fromEntries(urlSearchParams.entries());
|
||||
return params[name];
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue