-
-
Notifications
You must be signed in to change notification settings - Fork 1.1k
/
index.html
120 lines (103 loc) · 7.59 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
<!DOCTYPE html>
<!---
Hi! If you're good at web or UX design
and want to contribute to the theme,
head on over to the GitHub page.
All help is welcome, even feedback.
--->
<html lang="en_US">
<head>
<meta charset="UTF-8">
<title>Discord+</title>
<link rel="icon" type="image/icon" href="https://plusinsta.github.io/discord-plus/assets/web/favicon.ico"/>
<link rel="icon" type="image/png" sizes="16x16" href="https://plusinsta.github.io/discord-plus/assets/web/favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="https://plusinsta.github.io/discord-plus/assets/web/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="48x48" href="https://plusinsta.github.io/discord-plus/assets/web/favicon-48x48.png">
<link rel="shortcut icon" href="https://plusinsta.github.io/discord-plus/assets/web/favicon-16x16.png" type="image/png"/>
<link rel="apple-touch-icon" sizes="180x180" href="https://plusinsta.github.io/discord-plus/assets/web/apple-touch-icon.png">
<link rel="manifest" href="https://plusinsta.github.io/discord-plus/assets/web/site.webmanifest">
<link rel="mask-icon" href="https://plusinsta.github.io/discord-plus/assets/web/safari-pinned-tab.svg" color="#871f60">
<meta name="apple-mobile-web-app-title" content="Discord+">
<meta name="application-name" content="Discord+">
<meta name="msapplication-TileColor" content="#871f60">
<meta name="msapplication-config" content="https://plusinsta.github.io/discord-plus/assets/web/browserconfig.xml">
<meta property="og:title" content="Discord+">
<meta property="og:locale" content="en_US">
<meta name="description" content="A sleek, customizable Discord theme.">
<meta property="og:description" content="A sleek, customizable Discord theme.">
<link rel="canonical" href="https://plusinsta.github.io/discord-plus/">
<meta property="og:url" content="https://plusinsta.github.io/discord-plus/">
<meta property="og:site_name" content="PlusInsta presents">
<meta property="og:image" content="https://plusinsta.github.io/discord-plus/assets/web/DPlusImg.png" type="image/png">
<meta property="og:image:height" content="1024" type="image/png">
<meta property="og:image:width" content="1024" type="image/png">
<meta property="og:image:alt" content="The Discord+ logo over an illustration of a landscape">
<script type="application/ld+json">
{"name":"Discord+","description":"A sleek, customizable Discord theme.","@type":"WebSite","url":"https://plusinsta.github.io/discord-plus/","headline":"PlusInsta presents","@context":"http://schema.org"}</script>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="theme-color" content="#802060">
<link rel="stylesheet" href="assets/web/style.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins:400,700|Roboto:400,700|Righteous">
<body>
<div id="wrapper">
<section class="page-header">
<h1 class="project-name">
<img id="discord-plus-logo" src="assets/web/dpluslogo.svg"/>
<h2 class="project-tagline">A sleek, customizable Discord theme, inspired by Material.</h2>
<p>
<a href="https://gibbu.github.io/ThemePreview/?file=https://cdn.jsdelivr.net/gh/PlusInsta/discord-plus/DiscordPlus.theme.css">
<img id="headerScreenshot" src="https://cdn.discordapp.com/attachments/560369937084973067/852549506298150922/unknown.png" alt="Screenshot of Discord+ in dark theme">
</a>
</p>
<p>
<a href="https://gibbu.github.io/ThemePreview/?file=https://cdn.jsdelivr.net/gh/PlusInsta/discord-plus/DiscordPlus.theme.css&lightTheme=true">
<img id="headerScreenshot" src="https://cdn.discordapp.com/attachments/560369937084973067/852549509154471946/unknown.png" alt="Screenshot of Discord+ in light theme">
</a>
</p>
<div id="buttons">
<a id="temptation" href="https://github.com/PlusInsta/discord-plus/releases" class="btn">Download from <img class="githubicon"/> GitHub</a>
<a id="githubbutton" href="https://betterdiscord.app/theme?id=209" class="btn">View on BetterDiscord</a>
</div>
</section>
<section class="background">
<section class="main-content">
<h1 id="what-is-this">What is this?</h2>
<p><strong>Discord+</strong> is a theme for <a href="https://discord.com">Discord</a>. It's both sleek and customizable, without getting in your way. Its top priority is balancing between looks and performance.</p>
<p id="requirements">All you need to install my theme is <a href="https://betterdiscord.app">BetterDiscord</a> or <a href="https://powercord.dev">Powercord</a>. If you already have either, you're ready to install my theme!</p>
<p class="mobile">All you need to install my theme is a supported computer with Discord and <a href="https://betterdiscord.app">BetterDiscord</a> or <a href="https://powercord.dev">Powercord</a> installed.</p>
<h1 id="user-customization">User customization</h2>
<p>This theme is <strong>very customizable</strong>.
The variables in the theme file allow you to change many things, including but not limited to:
<ul>
<li>Background image
<li>Accent color
<li>Up to three fonts
<li>Home icon
<li>Background cover colors
<li>UI corner roundness
<li>Overall spacing
</ul>
</p>
<p>If customizing the theme is difficult, my Discord server has a detailed FAQ with answers to common questions! If that still doesn't solve your problem, someone may volunteer to help you in the <span id="channelname">#get-help</span> channel.</p>
<h1>Download</h1>
<a id="temptation" href="https://github.com/PlusInsta/discord-plus/releases" class="btn">Download from <img class="githubicon"/> GitHub</a>
<p/>
<iframe src="https://discordapp.com/widget?id=408433554477809665&theme=dark" width="350" height="500" allowtransparency="true" frameborder="0"></iframe>
<footer class="site-footer">
<span class="site-footer-owner">
<p>
Disclaimer: This project is not affiliated with Discord or discord.com in any way.
</p>
<a href="https://github.com/PlusInsta/discord-plus"><svg id="wordmark" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 65 16"><style>.st1{fill:white}</style><path d="M4.6 3.1H1v4.1l2.4 2.2v-4h1.3c.8 0 1.2.4 1.2 1v3c0 .6-.4 1.1-1.2 1.1H1v2.3h3.6c1.9 0 3.7-1 3.7-3.2V6.4c0-2.3-1.8-3.3-3.7-3.3zm18.7 6.6V6.3c0-1.2 2.1-1.5 2.8-.3l2-.8C27.3 3.5 25.9 3 24.7 3c-1.9 0-3.8 1.1-3.8 3.3v3.3c0 2.2 1.9 3.3 3.8 3.3 1.2 0 2.6-.6 3.4-2.2l-2.1-1c-.5 1.5-2.7 1.1-2.7 0zm-6.5-2.9c-.7-.2-1.2-.4-1.3-.9 0-1.1 1.8-1.2 2.8-.1l1.6-1.2c-1-1.2-2.1-1.6-3.3-1.6-1.8 0-3.5 1-3.5 2.9S14.5 8.7 16 9c.8.1 1.7.4 1.6 1-.1 1-2.2 1-3.1-.2L13 11.3c.9 1.2 2.1 1.8 3.3 1.8 1.8 0 3.7-1 3.8-2.9.1-2.5-1.6-3.1-3.3-3.4zm-7.2 6.1H12V3.1H9.6v9.8zm40.7-9.8h-3.6v4.1l2.4 2.2v-4h1.3c.8 0 1.2.4 1.2 1v3c0 .6-.4 1.1-1.2 1.1h-3.7v2.3h3.6c1.9 0 3.7-1 3.7-3.2V6.4c0-2.3-1.8-3.3-3.7-3.3zM32.7 3c-2 0-4 1.1-4 3.3v3.3c0 2.2 2 3.3 4 3.3s4-1.1 4-3.3V6.3c0-2.2-2-3.3-4-3.3zm1.6 6.7c0 .7-.8 1.1-1.5 1.1-.8 0-1.6-.3-1.6-1.1V6.3c0-.7.8-1.1 1.5-1.1.8 0 1.6.3 1.6 1.1v3.4zm11.1-3.4c-.1-2.3-1.6-3.2-3.6-3.2H38v9.7h2.4v-3h.4l2.2 3.1h3l-2.6-3.3c1.2-.4 2-1.5 2-3.3zm-3.6 1.4h-1.4V5.4h1.4c1.6 0 1.6 2.3 0 2.3z" fill="#fff"/><path class="st1" d="M55.3 6.8H65v2.1h-9.7z"/><path class="st1" d="M59.1 3h2.1v9.7h-2.1z"/></svg>
</a> is a passion project by <a id="author" href="https://github.com/PlusInsta">Insta</a>.
<br>
</span>
<span class="ramblings" style="color: grey; opacity: 0.5;">I just really like CSS.</span>
</footer>
</section>
</section>
<div id="easterEgg">
<!--- a little easter egg for people who scroll past the animated intro -->
<h2>Have some patience!<br><span style="font-size: 75%">Fine, be that way.</span></h2>
</div>
</div></body>