rDrama
/
rDrama
9
10
Fork 7
Code Issues Pull Requests Packages Releases Wiki Activity

tie transparent theme to backgrounds

pull/55/head
Aevann1 2022-12-07 19:53:29 +02:00
parent b805eabf9b
commit 93063516ce
22 changed files with 70 additions and 78 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
chat/src/App.css
View File

@ -69,7 +69,7 @@ body {
.App-drawer { .App-drawer {
z-index: 2; z-index: 2;
display: flex; display: flex;
background: var(--background); background: rgb(var(--background));
height: 100%; height: 100%;
} }
@ -135,4 +135,4 @@ lite-youtube {
.btn-secondary:focus { .btn-secondary:focus {
border: none !important; border: none !important;
box-shadow: none !important; box-shadow: none !important;
} }

6
files/assets/css/4chan.css
View File

@ -17,7 +17,7 @@
--gray-700: #F0E0D6; --gray-700: #F0E0D6;
--gray-800: #F0E0D6; --gray-800: #F0E0D6;
--gray-900: #F0E0D6; --gray-900: #F0E0D6;
--background: #F0E0D6; --background: 240, 224, 214;
} }
.text-muted { .text-muted {
@ -83,7 +83,7 @@ blockquote p {
} }
.comment { .comment {
background-color: var(--background) !important; background-color: rgb(var(--background)) !important;
} }
.navbar-light, .navbar .container-fluid, #mobile-bottom-navigation-bar { .navbar-light, .navbar .container-fluid, #mobile-bottom-navigation-bar {
@ -119,7 +119,7 @@ blockquote a {
} }
.srd { .srd {
background-color: var(--background) !important; background-color: rgb(var(--background)) !important;
} }
.srd a { .srd a {

18
files/assets/css/classic.css
View File

@ -2,16 +2,16 @@
:root { :root {
--muted: #666; --muted: #666;
--black: #444; --black: #444;
--bgc: white;
--primary: #b40457; --primary: #b40457;
--grey: #888; --grey: #888;
--upvote: #ff8b60; --upvote: #ff8b60;
--downvote: #9393ff; --downvote: #9393ff;
--sticky: #228822; --sticky: #228822;
--background: 255, 255, 255;
} }
.container { .container {
background-color: var(--bgc) !important; background-color: rgb(var(--background)) !important;
} }
#frontpage .container, #thread .container { #frontpage .container, #thread .container {
@ -27,7 +27,7 @@
} }
.sidebar { .sidebar {
background-color: var(--bgc); background-color: rgb(var(--background));
border-radius: 0px; border-radius: 0px;
margin-top: 0; margin-top: 0;
margin-right: 0; margin-right: 0;
@ -38,7 +38,7 @@
} }
#mobile-bottom-navigation-bar, .navbar { #mobile-bottom-navigation-bar, .navbar {
background-color: var(--bgc) !important; background-color: rgb(var(--background)) !important;
} }
.btn-primary { .btn-primary {
@ -47,7 +47,7 @@
} }
.dropdown-menu { .dropdown-menu {
background-color: var(--bgc); background-color: rgb(var(--background));
} }
.dropdown-item i { .dropdown-item i {
@ -55,7 +55,7 @@
} }
input, textarea, .form-control { input, textarea, .form-control {
background-color: var(--bgc) !important; background-color: rgb(var(--background)) !important;
border: 1px solid; border: 1px solid;
} }
@ -90,7 +90,7 @@ input, textarea, .form-control {
} }
.tooltip { .tooltip {
background-color: var(--bgc); background-color: rgb(var(--background));
} }
a { a {
@ -145,7 +145,7 @@ a.btn-block[href~="/submit"] {
} }
.modal-content { .modal-content {
background-color: var(--bgc); background-color: rgb(var(--background));
} }
#frontpage .post-title a:not(:visited) { #frontpage .post-title a:not(:visited) {
@ -165,7 +165,7 @@ a.btn-block[href~="/submit"] {
} }
.comment-section, .comment { .comment-section, .comment {
background-color: var(--bgc); background-color: rgb(var(--background));
} }
blockquote { blockquote {

4
files/assets/css/classic_dark.css
View File

@ -1,7 +1,5 @@
@import 'classic.css?v=4031';
:root { :root {
--muted: #999; --muted: #999;
--black: #999; --black: #999;
--bgc: #222; --background: 34, 34, 34;
} }

2
files/assets/css/coffee.css
View File

@ -50,7 +50,7 @@
--gray-700: #DDD2C4; --gray-700: #DDD2C4;
--gray-800: #DDD2C4; --gray-800: #DDD2C4;
--gray-900: #DDD2C4; --gray-900: #DDD2C4;
--background: #DDD2C4; --background: 221, 210, 196;
} }

2
files/assets/css/dark.css
View File

@ -17,7 +17,7 @@
--gray-700: #000000; --gray-700: #000000;
--gray-800: #000000; --gray-800: #000000;
--gray-900: #000000; --gray-900: #000000;
--background: #000000; --background: 0, 0, 0;
} }
* { * {

10
files/assets/css/dramblr.css
View File

@ -12,7 +12,7 @@
--gray-700: #2d3c50; --gray-700: #2d3c50;
--gray-800: #1e293b; --gray-800: #1e293b;
--gray-900: #0f172a; --gray-900: #0f172a;
--background: #2d3c50; --background: 45, 60, 80;
} }
.container.transparent, .card { .container.transparent, .card {
@ -20,7 +20,7 @@
} }
.navbar-light { .navbar-light {
background-color: var(--background) !important background-color: rgb(var(--background)) !important
} }
p { p {
@ -32,7 +32,7 @@ p {
} }
blockquote { blockquote {
background-color: var(--background); background-color: rgb(var(--background));
} }
#frontpage #main-content-row { #frontpage #main-content-row {
@ -65,7 +65,7 @@ blockquote {
} }
#mobile-bottom-navigation-bar { #mobile-bottom-navigation-bar {
background-color: var(--background) !important; background-color: rgb(var(--background)) !important;
border-color: var(--gray-600) !important; border-color: var(--gray-600) !important;
} }
@ -122,7 +122,7 @@ blockquote {
} }
.modal-content { .modal-content {
background-color: var(--background) background-color: rgb(var(--background))
} }
.tooltip{ .tooltip{

2
files/assets/css/light.css
View File

@ -18,7 +18,7 @@
--gray-200: #1e1e1e; --gray-200: #1e1e1e;
--white: #1e1e1e; --white: #1e1e1e;
--black: #262b32; --black: #262b32;
--background: #ffffff; --background: 255, 255, 255;
} }
* { * {

24
files/assets/css/main.css
View File

@ -1986,7 +1986,7 @@ button.close {
vertical-align: middle !important; vertical-align: middle !important;
} }
.bg-background { .bg-background {
background-color: var(--background); background-color: rgb(var(--background));
} }
.bg-primary { .bg-primary {
background-color: var(--primary) !important; background-color: var(--primary) !important;
@ -2647,7 +2647,7 @@ html {
} }
body { body {
color: var(--black); color: var(--black);
background-color: var(--background); background-color: rgb(var(--background));
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
} }
@ -2666,14 +2666,14 @@ pre {
background-color: var(--gray-600); background-color: var(--gray-600);
} }
#page { #page {
background-color: var(--background); background-color: rgb(var(--background));
} }
#article { #article {
padding-top: 0; padding-top: 0;
background-color: var(--background); background-color: rgb(var(--background));
} }
#thread, #userpage { #thread, #userpage {
background-color: var(--background); background-color: rgb(var(--background));
} }
#article .navbar-light .navbar-nav .nav-link { #article .navbar-light .navbar-nav .nav-link {
color: var(--black); color: var(--black);
@ -3479,7 +3479,7 @@ small, .small {
background-color: var(--gray-900); background-color: var(--gray-900);
} }
#thread .card { #thread .card {
background-color: var(--background); background-color: rgb(var(--background));
} }
#frontpage .posts .card:first-of-type, #userpage .posts .card:first-of-type, #search .posts .card:first-of-type { #frontpage .posts .card:first-of-type, #userpage .posts .card:first-of-type, #search .posts .card:first-of-type {
border-top-left-radius: 0.35rem; border-top-left-radius: 0.35rem;
@ -3832,7 +3832,7 @@ small, .small {
font-size: 1rem; font-size: 1rem;
} }
.comment-section { .comment-section {
background-color: var(--background); background-color: rgb(var(--background));
} }
.comment p { .comment p {
word-break: break-word; word-break: break-word;
@ -4284,7 +4284,7 @@ pre .com, code .com {
max-width: none; max-width: none;
} }
body, #settings, #notifications, #submit { body, #settings, #notifications, #submit {
background-color: var(--background); background-color: rgb(var(--background));
} }
#thread, #userpage { #thread, #userpage {
background-color: var(--gray-600); background-color: var(--gray-600);
@ -4622,7 +4622,7 @@ span.green {
border: 1px solid var(--primary); border: 1px solid var(--primary);
padding: 10px; padding: 10px;
border-radius: 3px; border-radius: 3px;
background-color: var(--background) !important; background-color: rgb(var(--background)) !important;
} }
.text-info { .text-info {
color: var(--primary) !important; color: var(--primary) !important;
@ -4636,10 +4636,10 @@ span.green {
color: black !important; color: black !important;
} }
.container, .container-fluid { .container, .container-fluid {
background-color: var(--background) !important; background-color: rgb(var(--background)) !important;
} }
.btn { .btn {
background-color: var(--background) !important; background-color: rgb(var(--background)) !important;
} }
.nobackground { .nobackground {
background: None !important; background: None !important;
@ -5612,7 +5612,7 @@ audio, video {
padding: 5px 5px 4px 5px; padding: 5px 5px 4px 5px;
text-align: center; text-align: center;
color: var(--muted); color: var(--muted);
background-color: var(--background); background-color: rgb(var(--background));
box-shadow: 0 0 0 1px var(--primary); box-shadow: 0 0 0 1px var(--primary);
} }

2
files/assets/css/midnight.css
View File

@ -17,7 +17,7 @@
--gray-700: #21262d; --gray-700: #21262d;
--gray-800: #161b22; --gray-800: #161b22;
--gray-900: #0d1117; --gray-900: #0d1117;
--background: #21262d; --background: 28, 34, 41;
} }

7
files/assets/css/rDrama.css
View File

@ -1,7 +0,0 @@
.mod:before {
content: '(((';
}
.mod:after {
content: ')))';
}

4
files/assets/css/transparent.css
View File

@ -7,11 +7,11 @@
} }
.container, #userpage > div.container-fluid, #root > div.App { .container, #userpage > div.container-fluid, #root > div.App {
background: rgba(28, 34, 41, 0.90) !important; background: rgba(var(--background), 0.9) !important;
} }
.fixed-bottom, .popover, .modal-content, .dropdown-menu, .navbar, body, .form-control, #speed-carot-modal { .fixed-bottom, .popover, .modal-content, .dropdown-menu, .navbar, body, .form-control, #speed-carot-modal {
background-color: #21262d !important; background-color: rgb(var(--background)) !important;
} }
.App-side, .flaggers, .comment-section { .App-side, .flaggers, .comment-section {

2
files/assets/css/tron.css
View File

@ -162,7 +162,7 @@
--gray-700: #00001f; --gray-700: #00001f;
--gray-800: #00001f; --gray-800: #00001f;
--gray-900: #00001f; --gray-900: #00001f;
--background: #00001f; --background: 0, 0, 31;
} }

2
files/assets/css/win98.css
View File

@ -17,7 +17,7 @@
--gray-700: #c0c0c0; --gray-700: #c0c0c0;
--gray-800: #07090A; --gray-800: #07090A;
--gray-900: #000000; --gray-900: #000000;
--background: #c0c0c0; --background: 192, 192, 192;
} }

4
files/assets/offline.html
View File

@ -8,7 +8,7 @@
} }
body { body {
background: var(--background); background: rgb(var(--background));
} }
.center { .center {
@ -37,7 +37,7 @@
} }
.button { .button {
background-color: var(--background)!important; background-color: rgb(var(--background))!important;
background: 0 0; background: 0 0;
font-weight: 600; font-weight: 600;
font-size: 1rem; font-size: 1rem;

2
files/helpers/const.py
View File

@ -200,7 +200,7 @@ WPD_CHANNEL_ID = 1013990963846332456
UNDER_SIEGE_CHANNEL_ID = 1041917843094110239 UNDER_SIEGE_CHANNEL_ID = 1041917843094110239
PIN_AWARD_TEXT = " (pin award)" PIN_AWARD_TEXT = " (pin award)"
THEMES = ["4chan","classic","classic_dark","coffee","dark","dramblr","light","midnight","transparent","tron","win98"] THEMES = ["4chan","classic","classic_dark","coffee","dark","dramblr","light","midnight","tron","win98"]
BACKGROUND_CATEGORIES = ["glitter", "anime", "fantasy", "solarpunk", "pixelart"] BACKGROUND_CATEGORIES = ["glitter", "anime", "fantasy", "solarpunk", "pixelart"]
COMMENT_SORTS = ["hot", "new", "old", "top", "bottom", "controversial"] COMMENT_SORTS = ["hot", "new", "old", "top", "bottom", "controversial"]
SORTS = COMMENT_SORTS + ["bump", "comments"] SORTS = COMMENT_SORTS + ["bump", "comments"]

3
files/routes/settings.py
View File

@ -43,7 +43,6 @@ def remove_background(v):
if v.background.startswith('/images/'): if v.background.startswith('/images/'):
os.remove(v.background) os.remove(v.background)
v.background = None v.background = None
if v.theme == 'transparent': v.theme = 'midnight'
g.db.add(v) g.db.add(v)
return {"message": "Background removed!"} return {"message": "Background removed!"}
@ -321,8 +320,6 @@ def settings_personal_post(v):
theme = request.values.get("theme") theme = request.values.get("theme")
if not updated and theme: if not updated and theme:
if theme in THEMES: if theme in THEMES:
if theme == "transparent" and not v.background:
abort(409, "You need to set a background to use the transparent theme")
v.theme = theme v.theme = theme
if theme == "win98": v.themecolor = "30409f" if theme == "win98": v.themecolor = "30409f"
updated = True updated = True

2
files/templates/comments.html
View File

@ -885,7 +885,7 @@
<div id="viewmore-{{offset}}"><button type="button" id="viewbtn" class="btn btn-primary" onclick="viewmore({{pid}},'{{sort}}',{{offset}},{{ids}})">VIEW MORE COMMENTS</a></div> <div id="viewmore-{{offset}}"><button type="button" id="viewbtn" class="btn btn-primary" onclick="viewmore({{pid}},'{{sort}}',{{offset}},{{ids}})">VIEW MORE COMMENTS</a></div>
{% endif %} {% endif %}
{% if SITE_NAME == 'rDrama' and not request.headers.get("xhr") and v and 'SamsungBrowser' not in g.agent and v.theme != 'transparent' %} {% if SITE_NAME == 'rDrama' and not request.headers.get("xhr") and v and 'SamsungBrowser' not in g.agent %}
<div id="detection" style="display:none;background-color:canvas;color-scheme:light"></div> <div id="detection" style="display:none;background-color:canvas;color-scheme:light"></div>
<script> <script>
const detectionDiv = document.querySelector('#detection'); const detectionDiv = document.querySelector('#detection');

3
files/templates/log.html
View File

@ -4,6 +4,9 @@
{% if v %} {% if v %}
<style>:root{--primary:#{{v.themecolor}}}</style> <style>:root{--primary:#{{v.themecolor}}}</style>
<link rel="stylesheet" href="{{'css/main.css' | asset}}"> <link rel="stylesheet" href="{{'css/main.css' | asset}}">
{% if v.theme == 'classic_dark' %}
<link rel="stylesheet" href="{{('css/classic.css') | asset}}">
{% endif %}
<link rel="stylesheet" href="{{('css/'~v.theme~'.css') | asset}}"> <link rel="stylesheet" href="{{('css/'~v.theme~'.css') | asset}}">
{% if v.agendaposter %} {% if v.agendaposter %}
<style> <style>

1
files/templates/userpage/userpage.html
View File

@ -3,6 +3,7 @@
{% block pagetitle %}@{{u.username}}'s profile{% endblock %} {% block pagetitle %}@{{u.username}}'s profile{% endblock %}
{% block head_final %} {% block head_final %}
{% if u and u.profile_background %} {% if u and u.profile_background %}
<link rel="stylesheet" href="{{('css/transparent.css') | asset}}">
<style> <style>
body { body {
background-image: url('{{u.profile_background}}') !important; background-image: url('{{u.profile_background}}') !important;

42
files/templates/util/html_head.html
View File

@ -105,7 +105,6 @@
{% endmacro %} {% endmacro %}
{% macro stylesheets(include_user_css) %} {% macro stylesheets(include_user_css) %}
{% set transparent = False %}
<link rel="stylesheet" href="{{'css/main.css' | asset}}"> <link rel="stylesheet" href="{{'css/main.css' | asset}}">
<link id="favicon" rel="icon" type="image/webp" href="/icon.webp?v=1"> <link id="favicon" rel="icon" type="image/webp" href="/icon.webp?v=1">
{% if v %} {% if v %}
@ -118,9 +117,8 @@
</style> </style>
{% endif %} {% endif %}
{% if include_user_css and not EVENT_STYLES %} {% if include_user_css and not EVENT_STYLES %}
{% if v.theme == 'transparent' %} {% if v.theme == 'classic_dark' %}
{% set transparent = True %} <link rel="stylesheet" href="{{('css/classic.css') | asset}}">
<link rel="stylesheet" href="{{('css/midnight.css') | asset}}">
{% endif %} {% endif %}
<link rel="stylesheet" href="{{('css/'~v.theme~'.css') | asset}}"> <link rel="stylesheet" href="{{('css/'~v.theme~'.css') | asset}}">
{% if v.css and not request.path.startswith('/settings/css') %} {% if v.css and not request.path.startswith('/settings/css') %}
@ -142,10 +140,6 @@
{{default_theme()}} {{default_theme()}}
{% endif %} {% endif %}
{% if not transparent and '@' in request.path and u and u.profile_background %}
<link rel="stylesheet" href="{{('css/transparent.css') | asset}}">
{% endif %}
<link rel="stylesheet" href="{{'css/awards.css' | asset}}"> <link rel="stylesheet" href="{{'css/awards.css' | asset}}">
{% if sub and sub.css and not request.path.endswith('settings') and not request.values.get('nocss') %} {% if sub and sub.css and not request.path.endswith('settings') and not request.values.get('nocss') %}
@ -153,7 +147,14 @@
{% endif %} {% endif %}
{% if SITE_NAME == 'rDrama' %} {% if SITE_NAME == 'rDrama' %}
<link rel="stylesheet" href="{{'css/rDrama.css' | asset}}"> <style>
.mod:before {
content: '(((';
}
.mod:after {
content: ')))';
}
</style>
{% endif %} {% endif %}
{% if EVENT_STYLES %} {% if EVENT_STYLES %}
@ -172,21 +173,22 @@
{% macro stylesheets_lower() %} {% macro stylesheets_lower() %}
{% if not (request.path.startswith('/@') and u) %} {% if not (request.path.startswith('/@') and u) %}
{% if SITE_NAME == 'rDrama' and (not v or v.is_banned or v.agendaposter) %} {% if SITE_NAME == 'rDrama' and v.agendaposter %}
{% set background = '/i/backgrounds/glitter/1.webp?v=4' %} {% set background = '/i/backgrounds/anime/1.webp?v=4' %}
{% elif v and v.background %} {% elif v and v.background %}
{% set background = v.background %} {% set background = v.background %}
{% endif %} {% endif %}
{% if background %} {% if background %}
<link rel="stylesheet" href="{{('css/transparent.css') | asset}}">
<style> <style>
body { body {
background:url("{{background}}") center center fixed; background:url("{{background}}") center center fixed;
background-color: var(--background); background-color: rgb(var(--background));
{% if 'anime/' not in background and not background.startswith('/images/') -%} {% if 'anime/' not in background and not background.startswith('/images/') -%}
background-size: cover; background-size: cover;
{%- endif %} {%- endif %}
} }
</style> </style>
{% endif %} {% endif %}
{% endif %} {% endif %}
@ -194,10 +196,6 @@
{% macro default_theme() %} {% macro default_theme() %}
<style>:root{--primary:#{{DEFAULT_COLOR}}}</style> <style>:root{--primary:#{{DEFAULT_COLOR}}}</style>
{% if DEFAULT_THEME == 'transparent' %}
{% set transparent = True %}
<link rel="stylesheet" href="{{('css/midnight.css') | asset}}">
{% endif %}
<link rel="stylesheet" href="{{('css/'~DEFAULT_THEME~'.css') | asset}}"> <link rel="stylesheet" href="{{('css/'~DEFAULT_THEME~'.css') | asset}}">
{% endmacro %} {% endmacro %}

2
migrations/20221207-transparent-rework.sql 100644
View File

@ -0,0 +1,2 @@
update users set theme='midnight' where theme='transparent';
update users set background=null where background='/i/backgrounds/glitter/1.webp';