feat: add darkmode
This commit is contained in:
parent
8222502610
commit
b56ec9454c
|
|
@ -268,4 +268,101 @@ body {
|
|||
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--gray-950: #030712;
|
||||
--gray-900: #111827;
|
||||
--gray-800: #1f2937;
|
||||
--gray-700: #374151;
|
||||
--gray-600: #4b5563;
|
||||
--gray-500: #6b7280;
|
||||
--gray-400: #9ca3af;
|
||||
--gray-300: #d1d5db;
|
||||
--gray-200: #e5e7eb;
|
||||
--gray-100: #f3f4f6;
|
||||
--gray-50: #f9fafb;
|
||||
}
|
||||
|
||||
textarea {
|
||||
background-color: var(--gray-800);
|
||||
color: white
|
||||
}
|
||||
|
||||
/* fix some profile issues, this is important do NOT remove!!!! */
|
||||
iframe {
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
body {
|
||||
color: white;
|
||||
background-color: var(--gray-900);
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.post button, .post .commentdiv input, input, button {
|
||||
background-color: var(--gray-700);
|
||||
border-color: var(--gray-600);
|
||||
color: white;
|
||||
}
|
||||
|
||||
.navbar {
|
||||
background-color: var(--gray-800);
|
||||
}
|
||||
|
||||
.navbar a, a {
|
||||
color: white;
|
||||
border-size: 0px;
|
||||
border-color: var(--gray-800);
|
||||
}
|
||||
|
||||
.accountform button {
|
||||
background-color: var(--gray-700);
|
||||
border-color: var(--gray-600);
|
||||
color: white;
|
||||
}
|
||||
|
||||
.profileDiv .edit-button {
|
||||
color: var(--gray-50);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.post {
|
||||
background-color: var(--gray-800);
|
||||
}
|
||||
|
||||
.usernamelink {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.post .date {
|
||||
color: var(--gray-400);
|
||||
}
|
||||
|
||||
.post .commentsdiv {
|
||||
background-color: var(--gray-700);
|
||||
}
|
||||
|
||||
.messageBar {
|
||||
background-color: var(--gray-900);
|
||||
}
|
||||
|
||||
.channelDiv {
|
||||
background-color: var(--gray-800);
|
||||
}
|
||||
|
||||
.channelDiv button {
|
||||
background-color: var(--gray-700);
|
||||
color: white;
|
||||
}
|
||||
|
||||
.channelDiv button:hover {
|
||||
background-color: var(--gray-600);
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
|
@ -1,56 +1,56 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<style>
|
||||
body {
|
||||
overflow-y: hidden;
|
||||
}
|
||||
</style>
|
||||
|
||||
<head>
|
||||
<title>burgercat</title>
|
||||
<meta charset="UTF-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||
<link rel="stylesheet" type="text/css" href="/static/css/style.css" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="navbar">
|
||||
<h1>burgercat</h1>
|
||||
<a href="/">home</a>
|
||||
<a class="selected" href="/chat">chat</a>
|
||||
<a href="/post">post</a>
|
||||
{% if userdata %}
|
||||
<a href="/settings/logout" class="right r">log out</a>
|
||||
<a href="/settings" class="right">{{ userdata.username }}</a>
|
||||
{% else %}
|
||||
<a href="/signup" class="right r">sign up</a>
|
||||
<a href="/login" class="right">log in</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<div class="postDiv">
|
||||
{% if userdata %}
|
||||
{% if userdata.banned == "0" %}
|
||||
{% else %}
|
||||
<p class="warning">Your account has been banned. Reason: "{{ userdata.banned }}". <a href="/settings/logout">Log out</a></p>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
<div class="chatDiv">
|
||||
<div id="channelDiv" class="channelDiv">
|
||||
<p class="statusMessage" id="statusMessage">Connected</p>
|
||||
</div>
|
||||
<div id="messageDiv" class="messageDiv">
|
||||
</div>
|
||||
<div class="messageBar">
|
||||
<input id="messageBox" type="text" placeholder="Type something.." id="chatBox">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="/static/js/chat.js"></script>
|
||||
</body>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<style>
|
||||
body {
|
||||
overflow-y: hidden;
|
||||
}
|
||||
</style>
|
||||
|
||||
<head>
|
||||
<title>burgercat</title>
|
||||
<meta charset="UTF-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||
<link rel="stylesheet" type="text/css" href="/static/css/style.css" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="navbar">
|
||||
<h1>burgercat</h1>
|
||||
<a href="/">home</a>
|
||||
<a class="selected" href="/chat">chat</a>
|
||||
<a href="/post">post</a>
|
||||
{% if userdata %}
|
||||
<a href="/settings/logout" class="right r">log out</a>
|
||||
<a href="/settings" class="right">{{ userdata.username }}</a>
|
||||
{% else %}
|
||||
<a href="/signup" class="right r">sign up</a>
|
||||
<a href="/login" class="right">log in</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<div class="postDiv">
|
||||
{% if userdata %}
|
||||
{% if userdata.banned == "0" %}
|
||||
{% else %}
|
||||
<p class="warning">Your account has been banned. Reason: "{{ userdata.banned }}". <a href="/settings/logout">Log out</a></p>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
<div class="chatDiv">
|
||||
<div id="channelDiv" class="channelDiv">
|
||||
<p class="statusMessage" id="statusMessage">Connected</p>
|
||||
</div>
|
||||
<div id="messageDiv" class="messageDiv">
|
||||
</div>
|
||||
<div class="messageBar">
|
||||
<input id="messageBox" type="text" placeholder="Type something.." id="chatBox">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="/static/js/chat.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
@ -1,42 +1,43 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>burgercat</title>
|
||||
<meta charset="UTF-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||
<link rel="stylesheet" type="text/css" href="/static/css/style.css" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="navbar">
|
||||
<h1>burgercat</h1>
|
||||
<a class="selected" href="/">home</a>
|
||||
<a href="/post">post</a>
|
||||
{% if userdata %}
|
||||
<a href="/settings/logout" class="right r">log out</a>
|
||||
<a href="/settings" class="right">{{ userdata.username }}</a>
|
||||
{% else %}
|
||||
<a href="/signup" class="right r">sign up</a>
|
||||
<a href="/login" class="right">log in</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="postDiv">
|
||||
<div class="profileDiv">
|
||||
{% if userdata %}
|
||||
{% if pageuser.id == userdata.id %}
|
||||
<h2>edit mode</h2>
|
||||
<p>remote content from media.tenor.com and cdn.discordapp.com is allowed</p>
|
||||
<form class="editThing" method="post" enctype="multipart/form-data">
|
||||
<textarea class="htmlBox" name="code" type="text" placeholder="<p>Hello World!</p>">{{ userdata.htmldescription }}</textarea>
|
||||
<br><br>
|
||||
<input class="submit" type="submit" value="save">
|
||||
</form>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>burgercat</title>
|
||||
<meta charset="UTF-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||
<link rel="stylesheet" type="text/css" href="/static/css/style.css" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="navbar">
|
||||
<h1>burgercat</h1>
|
||||
<a class="selected" href="/">home</a>
|
||||
<a href="/chat">chat</a>
|
||||
<a href="/post">post</a>
|
||||
{% if userdata %}
|
||||
<a href="/settings/logout" class="right r">log out</a>
|
||||
<a href="/settings" class="right">{{ userdata.username }}</a>
|
||||
{% else %}
|
||||
<a href="/signup" class="right r">sign up</a>
|
||||
<a href="/login" class="right">log in</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="postDiv">
|
||||
<div class="profileDiv">
|
||||
{% if userdata %}
|
||||
{% if pageuser.id == userdata.id %}
|
||||
<h2>edit mode</h2>
|
||||
<p>remote content from media.tenor.com and cdn.discordapp.com is allowed</p>
|
||||
<form class="editThing" method="post" enctype="multipart/form-data">
|
||||
<textarea class="htmlBox" name="code" type="text" placeholder="<p>Hello World!</p>">{{ userdata.htmldescription }}</textarea>
|
||||
<br><br>
|
||||
<input class="submit" type="submit" value="save">
|
||||
</form>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
@ -13,6 +13,7 @@
|
|||
<div class="navbar">
|
||||
<h1>burgercat</h1>
|
||||
<a href="/">home</a>
|
||||
<a href="/chat">chat</a>
|
||||
<a href="/post">post</a>
|
||||
{% if userdata %}
|
||||
<a href="/settings/logout" class="right r">log out</a>
|
||||
|
|
|
|||
|
|
@ -1,49 +1,50 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>burgercat</title>
|
||||
<meta charset="UTF-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||
<link rel="stylesheet" type="text/css" href="/static/css/style.css" />
|
||||
</head>
|
||||
<body>
|
||||
<div class="navbar">
|
||||
<h1>burgercat</h1>
|
||||
<a class="selected" href="/">home</a>
|
||||
<a href="/post">post</a>
|
||||
{% if userdata %}
|
||||
<a href="/settings/logout" class="right r">log out</a>
|
||||
<a href="/settings" class="right">{{ userdata.username }}</a>
|
||||
{% else %}
|
||||
<a href="/signup" class="right r">sign up</a>
|
||||
<a href="/login" class="right">log in</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="postDiv">
|
||||
<div class="profileDiv">
|
||||
<h2>{{ pageuser.username }}</h2>
|
||||
<div class="badgeDiv">
|
||||
{% if pageuser.administrator == 1 %}
|
||||
<p>Administrator</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
<p>Joined on {{ createddate }}</p>
|
||||
{% if userdata %}
|
||||
{% if pageuser.id == userdata.id %}
|
||||
<a style="color: rgb(104, 104, 104); text-decoration: none;" href="/@{{ userdata.username }}/edit">edit page</a>
|
||||
<br><br>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</div>
|
||||
<iframe src="/api/page/{{ pageuser.id }}" class="profileIFrame" sandbox=""></iframe>
|
||||
</div>
|
||||
<style>
|
||||
body {
|
||||
overflow-y: hidden
|
||||
}
|
||||
</style>
|
||||
</body>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>burgercat</title>
|
||||
<meta charset="UTF-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||
<link rel="stylesheet" type="text/css" href="/static/css/style.css" />
|
||||
</head>
|
||||
<body>
|
||||
<div class="navbar">
|
||||
<h1>burgercat</h1>
|
||||
<a class="selected" href="/">home</a>
|
||||
<a href="/chat">chat</a>
|
||||
<a href="/post">post</a>
|
||||
{% if userdata %}
|
||||
<a href="/settings/logout" class="right r">log out</a>
|
||||
<a href="/settings" class="right">{{ userdata.username }}</a>
|
||||
{% else %}
|
||||
<a href="/signup" class="right r">sign up</a>
|
||||
<a href="/login" class="right">log in</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="postDiv">
|
||||
<div class="profileDiv">
|
||||
<h2>{{ pageuser.username }}</h2>
|
||||
<div class="badgeDiv">
|
||||
{% if pageuser.administrator == 1 %}
|
||||
<p>Administrator</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
<p>Joined on {{ createddate }}</p>
|
||||
{% if userdata %}
|
||||
{% if pageuser.id == userdata.id %}
|
||||
<a style="color: rgb(104, 104, 104); text-decoration: none;" href="/@{{ userdata.username }}/edit">edit page</a>
|
||||
<br><br>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</div>
|
||||
<iframe src="/api/page/{{ pageuser.id }}" class="profileIFrame" sandbox=""></iframe>
|
||||
</div>
|
||||
<style>
|
||||
body {
|
||||
overflow-y: hidden
|
||||
}
|
||||
</style>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Reference in New Issue