One Hat Cyber Team

Edit File: index.html

<!DOCTYPE html>
<html>
<head>
	<title>Caddy works!</title>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link rel="icon" href="data:,">
	<style>
		* {
			box-sizing: border-box;
			padding: 0;
			margin: 0;
		}

body {
			background: #f1f4f5;
			font-family: Inter, sans-serif;
			font-size: 20px;
			-webkit-font-smoothing: antialiased;
		}

a {
			color: #2f79ff;
			text-decoration: none;
		}

a:hover {
			text-decoration: underline;
		}

.stack {
			width: 70%;
			max-width: 1150px;
			margin: 25px 0 150px 25px;
			display: flex;
			align-content: flex-start;
		}

.paper {
			position: relative;
			flex-shrink: 0;
			width: 100%;

background: white;
			border-radius: 3px;
			box-shadow: 1px 2px 4px 1px rgba(0, 0, 0, .15);
			padding: 100px;
		}

#paper1 {
			top: 45px;
			left: 50px;
		}

#paper2 {
			top: 20px;
			left: -100%;
		}

#paper3 {
			top: 25px;
			transform: rotate(-4deg);
			left: -200%;
		}

#caddy {
			max-width: 300px;
			margin-bottom: 50px;
		}

#caddy .caddy-color {
			fill: #005e7e;
		}

h1 {
			font-size: 20px;
			margin-bottom: 50px;
		}

h1 .emoji {
			font-size: 150%;
			vertical-align: middle;
		}

h1 .lang {
			margin-right: 1.25em;
		}

h2 {
			font-size: 28px;
			margin-top: 1.5em;
		}

p,
		ol,
		ul {
			color: #333;
			line-height: 1.5em;
		}

p {
			margin: 1.5em 0;
		}

ol,
		ul {
			margin: .5em 0 .5em 2em;
		}

ol li,
		ul li {
			margin-left: 1em;
			margin-bottom: .5em;
		}

li ol {
			list-style-type: lower-alpha;
		}

code {
			color: #000;
			font-family: Menlo, monospace;
			background: #f0f0f0;
			border-radius: 2px;
			padding: 4px 8px;
			font-size: 90%;
		}

.warn {
			color: #dd0000;
		}

footer {
			color: #777;
			font-size: 16px;
			text-align: center;
			max-width: 600px;
			margin: 0 auto 50px;
		}

#disclaimer {
			font-size: 14px;
			margin-top: 20px;
			display: inline-block;
			border-top: 1px solid #ccc;
			padding: 20px;
		}

@media (max-width: 1100px) {
			.stack {
				width: 85%;
			}
		}

@media (max-width: 800px) {
			.stack {
				margin: 0 0 50px 0;
				width: 100%;
			}

.paper {
				padding: 50px;
			}

#paper1,
			#paper2 {
				display: none;
			}

#paper3 {
				left: 0;
				transform: none;
				top: 0;
			}

#caddy {
				max-width: 300px;
				margin-bottom: 45px;
				display: block;
			}
		}
	</style>
</head>

<h1>
				 <span class="lang">Congratulations!</span>
				 <span class="lang">おめでとう!</span>
				 <span class="lang">¡Felicidades!</span>
				 <span class="lang">恭喜!</span>
				 <span class="lang">बधाई हो!</span>
				 <span class="lang">Поздравляю!</span>
				 <span class="lang">Вітаю!</span>
				 <span class="lang">Gefeliciteerd!</span>
				 <span class="lang">Glückwunsch!</span>
				<span class="emoji">🎊</span>
			</h1>

<p>
				Your web server is working. Now make it work for you. 💪
			</p>
			<p>
				Caddy is ready to serve your site over HTTPS:
			</p>
			<ol>
				<li>Point your domain's A/AAAA DNS records at this machine.</li>
				<li>Upload your site's files to <code>/var/www/html</code>.
				<li>
					Edit your Caddyfile at <code>/etc/caddy/Caddyfile</code>:
					<ol>
						<li>Replace <code>:80</code> with your domain name</li>
						<li>Change the site root to <code>/var/www/html</code></li>
					</ol>
				</li>
				<li>Reload the configuration: <code>systemctl reload caddy</code></li>
				<li>Visit your site!</li>
			</ol>
			<h2>If that worked 🥳</h2>
			<p>
				Awesome! You won't have to look at this slanted page anymore.
			</p>
			<p>
				Remember, Caddy can do a lot more than serve static files. It's also a powerful reverse proxy and
				application platform. You can use the Caddyfile to enable any other features you need. Or you could use
				Caddy's API to configure it programmatically.
			</p>
			<p>
				Everything you need to know is either in the <a href="https://caddyserver.com/docs/">📖 Caddy
					documentation</a> or the manual for your OS/platform. Have fun!
			</p>

<h2>If that didn't work 😶</h2>
			<p>
				It's okay, you can fix it! First check the following things:
			</p>
			<ul>
				<li>Service status: <code>systemctl status caddy</code></li>
				<li>Logs: <code>journalctl --no-pager -u caddy</code></li>
				<li>Are your site's files readable by the caddy user and group? <code>ls -la /var/www/html</code></li>
				<li>Is the caddy home directory writeable? <code>ls -la /var/lib/caddy</code></li>
				<li>Ensure your domain's A and/or AAAA records point to your machine's public IP address:
					<code>dig example.com</code></li>
				<li>Are your ports 80 and 443 externally reachable, and is Caddy able to bind to them? Check your
					firewalls, port forwarding, and other network configuration.</li>
			</ul>
			<p>
				<b class="warn">WAIT!</b> Before trying again, switch to <a
					href="https://letsencrypt.org/docs/staging-environment/">Let's Encrypt's staging environment</a> to
				avoid being accidentally <a href="https://letsencrypt.org/docs/rate-limits/">rate limited</a>. Once you
				get everything else working, it's safe to switch back.
			</p>
			<p>
				Depending on your DNS provider, it may take a while for the DNS records to propagate. Even when
				everything is configured properly, automated challenges to obtain TLS certificates usually take several
				seconds, but may take up to several minutes or hours.
			<p>
				If you still need help, we have a <a href="https://caddy.community/">great community</a>! First <a
					href="https://caddy.community/search">try a search</a>, and if your question is original, go ahead
				and ask it! Remember to pay it forward and help others too. 😁
			</p>
			<p>
				Visit Caddy on:
				<b><a href="https://github.com/caddyserver/caddy" title="Caddy on GitHub">GitHub</a></b>
				or
				<b><a href="https://twitter.com/caddyserver" title="@caddyserver on Twitter">Twitter</a></b>
				or
				<b><a href="https://caddy.community/" title="Caddy forums">Our Forum</a></b>
			</p>
		</div>
	</div>

<div id="disclaimer">
			The Caddy project is not responsible for the content, disposition, or behavior of this Web
			property, which is independently owned and maintained. For inquiries, please contact the site owner or
			hosting provider.
		</div>
	</footer>

</body>

</html>