mirror of
https://github.com/caddyserver/website.git
synced 2025-04-24 14:06:17 -04:00
Continue features page...
This commit is contained in:
parent
57d2d9d6af
commit
2c8892e4dd
4 changed files with 94 additions and 7 deletions
|
@ -24,7 +24,7 @@
|
|||
|
||||
<main>
|
||||
|
||||
<section class="diagonal up feature">
|
||||
<section class="feature">
|
||||
<div class="wrapper">
|
||||
<div class="legend">
|
||||
Features in <span class="nonstandard">this color</span> are provided by available plugins.
|
||||
|
@ -420,6 +420,39 @@
|
|||
</section>
|
||||
|
||||
|
||||
|
||||
|
||||
<section class="diagonal up dark feature">
|
||||
<div class="wrapper">
|
||||
<h2>
|
||||
Automatic HTTPS
|
||||
</h2>
|
||||
<p>
|
||||
Our flagship feature, Caddy enables HTTPS by default and automatically procure and maintain certificates for all your sites.
|
||||
</p>
|
||||
<p>
|
||||
TODO: Some strong marketing text
|
||||
</p>
|
||||
|
||||
<div class="feature-list">
|
||||
<div class="feature-row">
|
||||
<h4>TODO...</h4>
|
||||
<div class="benefits">
|
||||
TODO...
|
||||
</div>
|
||||
<div class="detail">
|
||||
TODO...
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<section class="diagonal down gray feature">
|
||||
<div class="wrapper">
|
||||
<h2>
|
||||
|
@ -441,6 +474,15 @@
|
|||
<li>HTTP/3</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="feature-row">
|
||||
<h4>HTTPS</h4>
|
||||
<div class="benefits">
|
||||
Caddy's flagship feature is enabling HTTPS automatically and by default. You can control how it works or disable aspects: HTTP redirects, certificate management, certain hostnames, etc.
|
||||
</div>
|
||||
<div class="detail">
|
||||
Automatic
|
||||
</div>
|
||||
</div>
|
||||
<div class="feature-row">
|
||||
<h4>Listen interfaces</h4>
|
||||
<div class="benefits">
|
||||
|
@ -486,6 +528,42 @@
|
|||
<li>Default for HTTP/2</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="feature-row">
|
||||
<h4>Error handling</h4>
|
||||
<div class="benefits">
|
||||
Caddy gives you full control over handling errors to give you clients the best/desired experience.
|
||||
</div>
|
||||
<div class="detail">
|
||||
Custom error routes
|
||||
</div>
|
||||
</div>
|
||||
<div class="feature-row">
|
||||
<h4>TLS termination</h4>
|
||||
<div class="benefits">
|
||||
Terminate TLS (formerly "SSL") with sensible defaults that you can customize to give you fine-grained control over TLS handshakes. You can assign policies to clients based on various factors such as ServerName (SNI) or remote IP.
|
||||
</div>
|
||||
<ul class="detail">
|
||||
<li>TLS 1.2</li>
|
||||
<li>TLS 1.3</li>
|
||||
<li>Client authentication (TLS mutual auth)</li>
|
||||
<li>Client auth modes: request, require, verify if given, require and verify</li>
|
||||
<li>Cipher suites</li>
|
||||
<li>Curves</li>
|
||||
<li>ALPN</li>
|
||||
<li>Limit protocol versions</li>
|
||||
<li>Default SNI</li>
|
||||
<li>Fallback SNI</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="feature-row">
|
||||
<h4>Cross-site security</h4>
|
||||
<div class="benefits">
|
||||
Caddy often serves multiple sites on the same socket, so Caddy automatically enables protections to keep your sites safe if any of them have TLS client auth enabled.
|
||||
</div>
|
||||
<div class="detail">
|
||||
Verification that TLS ServerName and HTTP Host header match
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
@ -29,6 +29,7 @@
|
|||
.dark {
|
||||
--body-bg: #0d171a;
|
||||
--text-color: #cbe2e4; /* #a4c0c2 */
|
||||
--text-color-muted: #92b2d5;
|
||||
--header-bg: rgba(44, 130, 164, 0.11);
|
||||
--header-border-color: transparent;
|
||||
--topbar-link-color-hover: white;
|
||||
|
|
|
@ -45,7 +45,7 @@
|
|||
|
||||
.feature-row {
|
||||
display: grid;
|
||||
grid: auto / 1fr 3fr 2fr;
|
||||
grid: auto / 1fr 2fr 1fr;
|
||||
gap: 2em;
|
||||
padding: 2em 0;
|
||||
border-bottom: 2px dashed #a4c8ff25; /* #e6eaf0 */
|
||||
|
@ -88,6 +88,10 @@
|
|||
/* TODO: Figure this out */
|
||||
@media (max-width: 800px) {
|
||||
.feature-row {
|
||||
grid: repeat(3, auto) / 1fr;
|
||||
grid: repeat(3,auto) / 1fr 1fr;
|
||||
}
|
||||
|
||||
.feature-row .benefits {
|
||||
grid-area: 2 / 1;
|
||||
}
|
||||
}
|
|
@ -186,8 +186,12 @@ section {
|
|||
color: #82e7ff;
|
||||
}
|
||||
|
||||
.dark section.gray {
|
||||
background-color: #1b1c1c;
|
||||
}
|
||||
|
||||
section.gray {
|
||||
section.gray,
|
||||
section.light.gray {
|
||||
background-color: #f5f8f9;
|
||||
}
|
||||
|
||||
|
@ -295,7 +299,7 @@ h3.green {
|
|||
color: #23a460; border-color: #23a460;
|
||||
}
|
||||
h3.purple {
|
||||
color: rgb(238, 89, 238); border-color: rgb(238, 89, 238);
|
||||
color: rgb(179, 80, 179); border-color: rgb(179, 80, 179);
|
||||
}
|
||||
h3.blue {
|
||||
color: rgb(14, 110, 189); border-color: rgb(14, 110, 189);
|
||||
|
@ -304,10 +308,10 @@ section.dark h3.green {
|
|||
color: #41e68f; border-color: #41e68f;
|
||||
}
|
||||
section.dark h3.purple {
|
||||
color: rgb(204, 82, 204); border-color: rgb(204, 82, 204);
|
||||
color: rgb(238, 89, 238); border-color: rgb(238, 89, 238);
|
||||
}
|
||||
section.dark h3.blue {
|
||||
color: rgb(81, 165, 234); border-color: rgb(81, 165, 234);
|
||||
color: rgb(113, 191, 255); border-color: rgb(113, 191, 255);
|
||||
}
|
||||
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue