shakecities/templates/city.html
Nathan Woodburn f1da43fbce
All checks were successful
Build Docker / Build Main Image (push) Successful in 18s
Build Docker / Build SLDs Image (push) Successful in 20s
feat: Add page metadata for social embeds
2023-11-17 13:21:38 +11:00

78 lines
5.8 KiB
HTML

<!DOCTYPE html>
<html data-bs-theme="light" lang="en" style="width: 100vw;height: 99vh;">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<title>ShakeCities</title>
<meta name="twitter:image" content="https://shakecities.com/assets/img/alexander-slattery-LI748t0BK8w-unsplash.webp">
<meta name="twitter:title" content="ShakeCities">
<meta property="og:title" content="ShakeCities">
<meta property="og:image" content="https://shakecities.com/assets/img/alexander-slattery-LI748t0BK8w-unsplash.webp">
<meta name="description" content="Embrace the future of web ownership with ShakeCities! Create your free, personalized Handshake domain website, secured with HTTPS powered by DANE. Easily integrate crypto addresses for payments and explore HNSChat and Varo auth. Join us in building a decentralized and innovative internet landscape. Experience simplicity and security at ShakeCities!">
<meta property="og:type" content="website">
<meta property="og:description" content="Embrace the future of web ownership with ShakeCities! Create your free, personalized Handshake domain website, secured with HTTPS powered by DANE. Easily integrate crypto addresses for payments and explore HNSChat and Varo auth. Join us in building a decentralized and innovative internet landscape. Experience simplicity and security at ShakeCities!">
<meta name="twitter:description" content="Embrace the future of web ownership with ShakeCities! Create your free, personalized Handshake domain website, secured with HTTPS powered by DANE. Easily integrate crypto addresses for payments and explore HNSChat and Varo auth. Join us in building a decentralized and innovative internet landscape. Experience simplicity and security at ShakeCities!">
<meta name="twitter:card" content="summary">
<link rel="icon" type="image/png" sizes="670x700" href="assets/img/HNS.png">
<link rel="icon" type="image/png" sizes="670x700" href="assets/img/HNSW.png" media="(prefers-color-scheme: dark)">
<link rel="icon" type="image/png" sizes="670x700" href="assets/img/HNS.png">
<link rel="icon" type="image/png" sizes="670x700" href="assets/img/HNSW.png" media="(prefers-color-scheme: dark)">
<link rel="icon" type="image/png" sizes="670x700" href="assets/img/HNS.png">
<link rel="icon" type="image/png" sizes="670x700" href="assets/img/HNS.png">
<link rel="icon" type="image/png" sizes="670x700" href="assets/img/HNS.png">
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="assets/css/styles.min.css">
</head>
<body style="height: 99vh;width: 100vw;color: #1fffff;background: #000000;overflow-x: hidden;">
<div style="margin: 10px;">
<div class="row row-cols-1 row-cols-sm-1 row-cols-md-1 row-cols-lg-1 row-cols-xl-2 row-cols-xxl-2 justify-content-center align-items-center" style="margin: 0px;">
<div class="col text-center align-self-center m-auto">
<div class="d-xl-flex align-items-xl-center" style="background: #f1ffff;padding: 10px;border-radius: 10px;"><img src="{{avatar}}" width="200vw" height="200vw" style="border-radius: 50%;">
<div class="d-none d-sm-none d-md-none d-lg-none d-xl-block d-xxl-block" style="width: 40px;"></div>
<div>
<div>
<p style="font-size: 24px;">{{hnschat|safe}}</p>
</div>
<div>
<p style="font-size: 24px;">{{email|safe}}</p>
</div>
<div>
<p style="font-size: 24px;">{{location|safe}}</p>
</div>
</div>
</div>
</div>
<div class="col text-center align-self-center m-auto">
<div class="d-xl-flex align-items-xl-center" style="background: #f1ffff;padding: 10px;border-radius: 10px;">
<div>
<div>
<p style="font-size: 24px;margin-bottom: 0px;"><a href="/.well-known/wallets/HNS" target="_blank">{{hns|safe}}</a></p>
</div>
<div>
<p style="font-size: 24px;margin-bottom: 0px;"><a href="/.well-known/wallets/BTC" target="_blank">{{btc|safe}}</a></p>
</div>
<div>
<p style="font-size: 24px;margin-bottom: 0px;"><a href="/.well-known/wallets/ETH" target="_blank">{{eth|safe}}</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
<div style="background: #f1ffff;border-radius: 10px;padding-top: 2%;padding-left: 2%;padding-right: 2%;padding-bottom: 2%;margin: 22px;">
<p style="font-size: 24px;">{{data|safe}}</p>
</div>
<div class="d-flex justify-content-xl-start align-items-xl-center" style="margin-right: 1%;margin-left: 1%;height: 6%;margin-top: 0.5%;">
<div class="d-inline-block d-print-inline-block d-sm-none d-md-none d-lg-none d-xl-inline-block d-xxl-inline-block" style="display: inline-flex;width: 3vw;height: 3vw;background: #f1ffff;padding: 4px;border-radius: 50%;"><img src="{{hns_icon}}" width="100%" height="100%"></div>
<div class="d-xl-flex align-items-xl-center" style="display: inline-flex;padding: 1%;height: 100%;margin-left: 2%;">
<p class="align-self-baseline" style="color: #f1ffff;">Powered by <a href="https://{{main_domain}}" target="_blank">ShakeCities</a></p>
</div>
</div>
<div style="height: 10px;"></div>
<script src="assets/bootstrap/js/bootstrap.min.js"></script>
<script src="assets/js/script.min.js"></script>
</body>
</html>