Initial commit

Signed-off-by: mctaylors <cantsendmails@mctaylors.ru>

.gitignore

@@ -0,0 +1 @@
+.idea/

assets/css/fonts.css

@@ -0,0 +1,11 @@
+@font-face {
+    font-family: 'BlitzBold';
+    font-weight: normal;
+    src: url(/assets/woff2/BlitzBold.woff2);
+}
+
+@font-face {
+    font-family: 'BlitzMain';
+    font-weight: normal;
+    src: url(/assets/woff2/BlitzMain.woff2);
+}

assets/css/styles.css

@@ -0,0 +1,196 @@
+/*
+    Octobot for Discord. Made by mctaylors.
+    Inspired by splatoon3.ink.
+*/
+
+@import url(fonts.css);
+
+:root {
+    color: #eee;
+    background-color: #000;
+    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAOIAAADiBAMAAAChPgbkAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAqUExURRcXF0dwTBUVFRYWFgAAABoaGhkZGRUVFRgYGAAAAAAAAB4eHiQkJBISEkRDNy8AAAAOdFJOUxYAGBcDEwoMFQUBEQcOBwHpdgAAAjdJREFUeNrt271NBDEUReGnjUlGIoGICCKkbYIKqIASqIEm6IGMDiiBjtj5XXvGz9k9Cde5dfTFvo6Xc6TnacjP/Xd+7/TbuRi3r52b752bXw/5xedecaCRMdDIGGjkpQgjL0UYORZZ5FhkkVMRRU5FFDkXSeRcJJFLEUQuRRC5FjnkWuSQWxFDbkUMeS1SyGuRQhZFCFkUIWRZZJBlkUFWRQRZFRFkXSSQdZFA7ooAclcEkPuiHrkv6pGHohx5KMqRx6IaeSyqkY2iGNkoipGtohbZKmqRzaIU2SxKke2iEtkuKpFJUYhMikJkVtQhs6IOmRZlyLQoQ+ZFFTIvqpCdogjZKYqQvaIGGW80Mh5pZJxoZBhppJFGGmmkkUYaaaSRRhpppJFGGmmkkUYaaeR/Rp5pZHzQyPikkXFHI2OgkTHQyBho5KUII8f3RxY5Flnk9MaKIqciipzfkUnkXCSRy1s5iFyKIHLdA3DItcght80DhtyKGPK666CQ1yKFLLYrELIoQshyn8MgyyKDrDZICLIqIsh6Z0Ug6yKB3G3JAOSuCCD3ezk9cl/UIw+bQDnyUJQjj7tHNfJYVCMb204xslEUI1v7VS2yVdQimxtdKbJZlCLbO2Qlsl1UIpOttRCZFIXIbE+uQ2ZFHTLdzMuQaVGGzP8FqJB5UYXs/H0QITtFEbL3v0OD7BU1yPihkXFDIwNHhpFGGmmkkUYaaaSRRhpppJFGGmmkkUYaaaSRRhoJIgNH/gHUGcb6oO4YfwAAAABJRU5ErkJggg==");
+    font-family: BlitzMain, sans-serif;
+}
+
+a, a:visited {
+    color: chartreuse;
+}
+
+a:hover {
+    color: aquamarine;
+}
+
+a:active {
+    color: darkcyan;
+}
+
+a.alternative {
+    text-decoration: none;
+}
+
+.highlight {
+    font-family: BlitzBold, sans-serif;
+    font-size: 32px;
+}
+
+.header {
+    font-size: 24px;
+    padding: 16px;
+    position: fixed;
+    width: calc(100% - 48px);
+    z-index: 10;
+}
+
+.header > .left {
+    float: left;
+}
+
+.header > .right {
+    float: right;
+}
+
+.header > .left img {
+    margin: 0 8px;
+    height: 64px;
+}
+
+.header > .right .social img {
+    height: 32px;
+    width: 32px;
+    border: #999 1px solid;
+    border-radius: 16px;
+    background-color: #0009;
+    padding: 8px;
+    transition: 200ms;
+}
+
+.header > .right .social img:hover {
+    border-color: #eee;
+}
+
+.content {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: center;
+    gap: 32px 64px;
+    padding: 100px 16px 80px;
+}
+
+.content > .card {
+    mask-image: url("/assets/svg/card-header.svg");
+    mask-size: 2000px auto;
+    mask-position: top;
+    background-image: url("/assets/png/tapes-transparent.png");
+    background-size: contain;
+    width: 480px;
+    min-height: 520px;
+    padding: 48px 16px 8px;
+    border-radius: 16px;
+}
+
+.content > .card.first {
+    background-color: #1bbeab; /* Splatoon 3 TurquoisePink Alpha */
+    rotate: -2deg;
+}
+
+.content > .card.second {
+    background-color: #c43a6e; /* Splatoon 3 TurquoisePink Bravo */
+    rotate: 2deg;
+}
+
+.content > .card * {
+    text-align: left;
+}
+
+.content > .card span {
+    line-height: 1em;
+    filter: drop-shadow(1px 1px #000);
+}
+
+.content > .card > .title {
+    margin: 8px 0;
+}
+
+.content > .card > .title > * {
+    vertical-align: middle;
+}
+
+.content > .card > .title > span {
+    font-size: 24px;
+}
+
+.content > .card > .title > img {
+    height: 32px;
+    width: 32px;
+}
+
+.content > .card > .frame {
+    padding: 4px 8px 8px;
+    border-radius: 8px;
+    background-color: #0009;
+    backdrop-filter: blur(4px);
+}
+
+.content > .card > .frame > ul {
+    padding: 0 0 0 24px;
+}
+
+.invite {
+    margin-top: 8px;
+    padding: 12px 0;
+    width: 100%;
+    font-family: BlitzBold, sans-serif;
+    font-size: 20px;
+    color: white;
+    background-color: #4d5058;
+    border-radius: 4px;
+    border: 0;
+    display: flex;
+    justify-content: center;
+    gap: 8px;
+    transition: 200ms;
+}
+
+.invite:hover {
+    background-color: #6d6f78;
+    cursor: pointer;
+}
+
+.invite:active {
+    background-color: #80848e;
+}
+
+.invite > img {
+    height: 24px;
+    width: 24px;
+}
+
+.invite > span {
+    filter: none !important;
+}
+
+.invite > * {
+    vertical-align: middle;
+}
+
+.footer {
+    position: fixed;
+    left: 0;
+    bottom: 0;
+    width: 100%;
+    padding: 8px;
+    color: #999;
+    font-size: 14px;
+    text-align: center;
+    background-color: #0009;
+    backdrop-filter: blur(4px);
+}
+
+.footer img {
+    vertical-align: sub;
+}
+
+.splatoon {
+    height: 24px;
+    filter: brightness(75%);
+}

assets/svg/add-circle-white.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#fff"><path d="M440-440v120q0 17 11.5 28.5T480-280q17 0 28.5-11.5T520-320v-120h120q17 0 28.5-11.5T680-480q0-17-11.5-28.5T640-520H520v-120q0-17-11.5-28.5T480-680q-17 0-28.5 11.5T440-640v120H320q-17 0-28.5 11.5T280-480q0 17 11.5 28.5T320-440h120Zm40 360q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Z"/></svg>

assets/svg/card-header.svg

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg viewBox="0 0 2000 100%" xmlns="http://www.w3.org/2000/svg" xmlns:bx="https://boxy-svg.com">
+  <path d="M 1029.96 23.774 C 1029.761 26.218 1027.719 28.101 1025.267 28.102 L 975.732 28.102 C 975.601 28.102 975.477 28.075 975.348 28.064 C 972.917 27.866 971 25.859 971 23.384 C 971.004 20.775 973.123 18.664 975.732 18.668 L 993.936 18.668 C 993.93 18.562 993.919 18.458 993.919 18.353 C 993.919 14.901 996.727 12.103 1000.189 12.103 L 1000.809 12.103 C 1002.796 12.102 1004.666 13.045 1005.847 14.643 C 1006.648 15.714 1007.08 17.016 1007.08 18.353 C 1007.08 18.459 1007.07 18.563 1007.064 18.668 L 1025.267 18.668 C 1027.881 18.668 1030 20.779 1030 23.385 C 1030 23.518 1029.971 23.643 1029.96 23.774 M 2000 0 L 0 0 L 0 4000 L 2000 4000 L 2000 0 Z" fill-rule="evenodd" bx:origin="0.5 0.5"/>
+</svg>

assets/svg/github-mark-white.svg

@@ -0,0 +1 @@
+<svg width="98" height="96" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M48.854 0C21.839 0 0 22 0 49.217c0 21.756 13.993 40.172 33.405 46.69 2.427.49 3.316-1.059 3.316-2.362 0-1.141-.08-5.052-.08-9.127-13.59 2.934-16.42-5.867-16.42-5.867-2.184-5.704-5.42-7.17-5.42-7.17-4.448-3.015.324-3.015.324-3.015 4.934.326 7.523 5.052 7.523 5.052 4.367 7.496 11.404 5.378 14.235 4.074.404-3.178 1.699-5.378 3.074-6.6-10.839-1.141-22.243-5.378-22.243-24.283 0-5.378 1.94-9.778 5.014-13.2-.485-1.222-2.184-6.275.486-13.038 0 0 4.125-1.304 13.426 5.052a46.97 46.97 0 0 1 12.214-1.63c4.125 0 8.33.571 12.213 1.63 9.302-6.356 13.427-5.052 13.427-5.052 2.67 6.763.97 11.816.485 13.038 3.155 3.422 5.015 7.822 5.015 13.2 0 18.905-11.404 23.06-22.324 24.283 1.78 1.548 3.316 4.481 3.316 9.126 0 6.6-.08 11.897-.08 13.526 0 1.304.89 2.853 3.316 2.364 19.412-6.52 33.405-24.935 33.405-46.691C97.707 22 75.788 0 48.854 0z" fill="#fff"/></svg>

index.html

@@ -0,0 +1,91 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8"/>
+  <meta name="viewport" content="initial-scale=0.75 user-scalable=no"/>
+  <link rel="stylesheet" href="/assets/css/styles.css"/>
+  <link rel="icon" href="/assets/ico/octobot.ico"/>
+  <title>Octobot for Discord</title>
+</head>
+<body>
+<div class="header">
+  <div class="left">
+    <img src="/assets/png/octobot-web-logo.png" alt="Octobot Web logo" draggable="false"/>
+  </div>
+  <div class="right">
+    <div class="social">
+      <a href="https://github.com/TeamOctolings/Octobot">
+        <img src="/assets/svg/github-mark-white.svg" alt="GitHub logo" draggable="false"/>
+      </a>
+    </div>
+  </div>
+</div>
+<div class="content">
+  <div class="first card">
+    <div class="title">
+      <img src="/assets/ico/octobot.ico" alt="Octobot icon" draggable="false"/>
+      <span class="highlight">Veemo!</span>
+    </div>
+    <div class="frame">
+      <span>I'm a general-purpose bot for moderation written by Team Octolings in C# and Remora.Discord!</span>
+    </div>
+    <div class="title">
+      <img src="/assets/png/mem-cake-sardinium.png" alt="Mem Cake (Sardinium)" draggable="false"/>
+      <span class="highlight">Features</span>
+    </div>
+    <div class="frame">
+      <ul>
+        <li>Banning, muting, kicking, etc.</li>
+        <li>Reminding you about something if you wish</li>
+        <li>Reminding everyone about that new event you made</li>
+        <li>Renaming those annoying self-hoisting members</li>
+        <li>Log everything from joining the server to deleting messages</li>
+        <li>Listen to Inkantation!</li>
+        ...a-a-and more!
+      </ul>
+    </div>
+    <a class="alternative"
+       href="https://discord.com/oauth2/authorize?client_id=855023234407333888&permissions=1383382133894&scope=applications.commands%20bot">
+      <button class="invite">
+        <img src="/assets/svg/add-circle-white.svg" alt="Add icon"/>
+        <span>Add App</span>
+      </button>
+    </a>
+  </div>
+  <div class="second card">
+    <div class="title">
+      <img src="/assets/png/mem-cake-octoling.png" alt="Mem Cake (Rival Octoling)" draggable="false"/>
+      <span class="highlight">Bug Report / Feature Request</span>
+    </div>
+    <div class="frame">
+      <span>If you find some bug or want some new feature in Octobot, you can always use the Issues menu in our GitHub repository.</span>
+      <ul>
+        <li><a href="https://github.com/TeamOctolings/Octobot/issues">Open GitHub Issues</a></li>
+        <li><a
+            href="https://github.com/TeamOctolings/Octobot/issues/new?assignees=&labels=type%3A+bug&projects=&template=bug-report.yml">Report
+          a bug</a></li>
+        <li><a
+            href="https://github.com/TeamOctolings/Octobot/issues/new?assignees=&labels=type%3A+feature&projects=&template=feature-request.yml">Request
+          a feature</a></li>
+      </ul>
+    </div>
+    <div class="title">
+      <img src="/assets/png/mem-cake-mole.png" alt="Mem Cake (Mole)" draggable="false"/>
+      <span class="highlight">Building Octobot</span>
+    </div>
+    <div class="frame">
+      <span>Want to make your own Octobot with, for example, even more features?  Then, Octobot's Wiki is at your service!</span>
+      <ul>
+        <li><a href="https://github.com/TeamOctolings/Octobot/wiki/Installing-Windows">Building for Windows</a></li>
+        <li><a href="https://github.com/TeamOctolings/Octobot/wiki/Installing-Unix">Building for Linux/macOS</a></li>
+      </ul>
+    </div>
+  </div>
+</div>
+<div class="footer">
+  <span>Not an official <img class="splatoon" src="/assets/svg/splatoon.svg" alt="Splatoon™"/> product. We are in no way affiliated with or endorsed by Nintendo Company, or other rightsholders.</span>
+  <a href="https://github.com/TeamOctolings/Octobot/commit/master"><img
+      src="https://img.shields.io/github/last-commit/TeamOctolings/Octobot?logo=github" alt="Last commit"/></a>
+</div>
+</body>
+</html>