tie transparent theme to backgrounds

master
Aevann1 2022-12-07 19:53:29 +02:00
parent b805eabf9b
commit 93063516ce
22 changed files with 70 additions and 78 deletions

View File

@ -69,7 +69,7 @@ body {
.App-drawer {
z-index: 2;
display: flex;
background: var(--background);
background: rgb(var(--background));
height: 100%;
}

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

@ -7,11 +7,11 @@
}
.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 {
background-color: #21262d !important;
background-color: rgb(var(--background)) !important;
}
.App-side, .flaggers, .comment-section {

View File

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

View File

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

View File

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

View File

@ -200,7 +200,7 @@ WPD_CHANNEL_ID = 1013990963846332456
UNDER_SIEGE_CHANNEL_ID = 1041917843094110239
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"]
COMMENT_SORTS = ["hot", "new", "old", "top", "bottom", "controversial"]
SORTS = COMMENT_SORTS + ["bump", "comments"]

View File

@ -43,7 +43,6 @@ def remove_background(v):
if v.background.startswith('/images/'):
os.remove(v.background)
v.background = None
if v.theme == 'transparent': v.theme = 'midnight'
g.db.add(v)
return {"message": "Background removed!"}
@ -321,8 +320,6 @@ def settings_personal_post(v):
theme = request.values.get("theme")
if not updated and theme:
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
if theme == "win98": v.themecolor = "30409f"
updated = True

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>
{% 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>
<script>
const detectionDiv = document.querySelector('#detection');

View File

@ -4,6 +4,9 @@
{% if v %}
<style>:root{--primary:#{{v.themecolor}}}</style>
<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}}">
{% if v.agendaposter %}
<style>

View File

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

View File

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

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';