[CSS] Background noise is back, default_theme directory hierarchy simplified

[PLUGINS][Oomox] Fixed issue where resetting colours when no entity was present would lead to an error (it expected an entity, but NULL was given)
This commit is contained in:
Eliseu Amaro 2022-02-08 14:12:59 +00:00
parent 7b0667109d
commit ba131bdb16
Signed by: eliseuamaro
GPG Key ID: 96DA09D4B97BC2D5
29 changed files with 108 additions and 95 deletions

View File

@ -5,7 +5,7 @@
{% block stylesheets %}
{{ parent() }}
<link rel="stylesheet" href="{{ asset('assets/default_theme/css/pages/feeds.css') }}" type="text/css">
<link rel="stylesheet" href="{{ asset('assets/default_theme/pages/feeds.css') }}" type="text/css">
{% endblock stylesheets %}
{% block body %}

View File

@ -4,8 +4,8 @@
{% block stylesheets %}
{{ parent() }}
<link rel="preload" href="{{ asset('assets/default_theme/css/pages/settings.css') }}" as="style" type="text/css">
<link rel="stylesheet" href="{{ asset('assets/default_theme/css/pages/settings.css') }}">
<link rel="preload" href="{{ asset('assets/default_theme/pages/settings.css') }}" as="style" type="text/css">
<link rel="stylesheet" href="{{ asset('assets/default_theme/pages/settings.css') }}">
{% endblock stylesheets %}
{% block body %}

View File

@ -6,7 +6,7 @@
{% block stylesheets %}
{{ parent() }}
<link rel="stylesheet" href="{{ asset('assets/default_theme/css/pages/feeds.css') }}" type="text/css">
<link rel="stylesheet" href="{{ asset('assets/default_theme/pages/feeds.css') }}" type="text/css">
{% endblock stylesheets %}
{% block body %}

View File

@ -2,7 +2,7 @@
{% block stylesheets %}
{{ parent() }}
<link rel="stylesheet" href="{{ asset('assets/default_theme/css/pages/feeds.css') }}" type="text/css">
<link rel="stylesheet" href="{{ asset('assets/default_theme/pages/feeds.css') }}" type="text/css">
{% endblock stylesheets %}
{% macro edit_feeds_form_row(child) %}

View File

@ -2,7 +2,7 @@
{% block stylesheets %}
{{ parent() }}
<link rel="stylesheet" href="{{ asset('assets/default_theme/css/pages/feeds.css') }}" type="text/css">
<link rel="stylesheet" href="{{ asset('assets/default_theme/pages/feeds.css') }}" type="text/css">
{% endblock stylesheets %}
{% block body %}

View File

@ -3,7 +3,7 @@
{% block stylesheets %}
{{ parent() }}
<link rel="stylesheet" href="{{ asset('assets/default_theme/css/pages/feeds.css') }}" type="text/css">
<link rel="stylesheet" href="{{ asset('assets/default_theme/pages/feeds.css') }}" type="text/css">
{% endblock stylesheets %}
{% block body %}

View File

@ -57,7 +57,7 @@ class AttachmentShowRelated extends Plugin
public function onEndShowStyles(array &$styles, string $path): bool
{
if ($path === 'note_attachment_show') {
$styles[] = '/assets/default_theme/css/pages/feeds.css';
$styles[] = '/assets/default_theme/pages/feeds.css';
}
return Event::next;
}

View File

@ -5,7 +5,7 @@
{% block stylesheets %}
{{ parent() }}
<link rel="stylesheet" href="{{ asset('assets/default_theme/css/pages/feeds.css') }}" type="text/css">
<link rel="stylesheet" href="{{ asset('assets/default_theme/pages/feeds.css') }}" type="text/css">
{% endblock stylesheets %}
{% block body %}

View File

@ -5,7 +5,7 @@
{% block stylesheets %}
{{ parent() }}
<link rel="stylesheet" href="{{ asset('assets/default_theme/css/pages/feeds.css') }}" type="text/css">
<link rel="stylesheet" href="{{ asset('assets/default_theme/pages/feeds.css') }}" type="text/css">
{% endblock stylesheets %}
{% block body %}

View File

@ -5,7 +5,7 @@
{% block stylesheets %}
{{ parent() }}
<link rel="stylesheet" href="{{ asset('assets/default_theme/css/pages/feeds.css') }}" type="text/css">
<link rel="stylesheet" href="{{ asset('assets/default_theme/pages/feeds.css') }}" type="text/css">
{% endblock stylesheets %}
{% block body %}

View File

@ -77,7 +77,7 @@ class Oomox
$current_foreground = $current_oomox_settings->getColourForegroundLight() ?: '#09090d';
$current_background_hard = $current_oomox_settings->getColourBackgroundHardLight() ?: '#ebebeb';
$current_background_card = $current_oomox_settings->getColourBackgroundCardLight() ?: '#f0f0f0';
$current_border = $current_oomox_settings->getColourBorderLight() ?: '#d5d5d5';
$current_border = $current_oomox_settings->getColourBorderLight() ?: '#C2C2C2';
$current_accent = $current_oomox_settings->getColourAccentLight() ?: '#a22430';
} else {
$current_foreground = $current_oomox_settings->getColourForegroundDark() ?: '#eff0f1';
@ -87,10 +87,10 @@ class Oomox
$current_accent = $current_oomox_settings->getColourAccentDark() ?: '#5ddbcf';
}
} else {
$current_foreground = $is_light ? '#09090d' : '#f0f6f6';
$current_background_hard = $is_light ? '#ebebeb' : '#141216';
$current_background_card = $is_light ? '#f0f0f0' : '#131217';
$current_border = $is_light ? '#d5d5d5' : '#201f25';
$current_foreground = $is_light ? '#09090d' : '#eff0f1';
$current_background_hard = $is_light ? '#ebebeb' : '#0E0E0F';
$current_background_card = $is_light ? '#f0f0f0' : '#0E0E0F';
$current_border = $is_light ? '#C2C2C2' : '#26262C';
$current_accent = $is_light ? '#a22430' : '#5ddbcf';
}
@ -151,9 +151,7 @@ class Oomox
/** @var SubmitButton $reset_button */
$reset_button = $form_light->get('colour_reset_light');
if ($reset_button->isClicked()) {
if (!\is_null($current_oomox_settings)) {
$current_oomox_settings->resetTheme(true);
}
$current_oomox_settings?->resetTheme(true);
} else {
$data = $form_light->getData();
$current_oomox_settings = EntityOomox::create(
@ -168,9 +166,14 @@ class Oomox
);
}
DB::merge($current_oomox_settings);
DB::flush();
Cache::delete(PluginOomox::cacheKey($user));
if ($current_oomox_settings) {
if ($reset_button->isClicked()) {
DB::remove(EntityOomox::getByPK($actor_id));
} else {
DB::merge($current_oomox_settings);
}
DB::flush();
}
throw new RedirectException();
}
@ -212,8 +215,15 @@ class Oomox
);
}
DB::merge($current_oomox_settings);
DB::flush();
if ($current_oomox_settings) {
if ($reset_button->isClicked()) {
DB::remove(EntityOomox::getByPK($actor_id));
} else {
DB::merge($current_oomox_settings);
}
DB::flush();
}
Cache::delete(PluginOomox::cacheKey($user));
throw new RedirectException();
}

View File

@ -206,13 +206,13 @@ class Oomox extends Entity
$this->colour_background_hard_light = '#09090d';
$this->colour_background_card_light = '#ebebeb';
$this->colour_foreground_light = '#f0f0f0';
$this->colour_border_light = '#d5d5d5';
$this->colour_border_light = '#C2C2C2';
$this->colour_accent_light = '#a22430';
} else {
$this->colour_background_hard_dark = '#141216';
$this->colour_background_card_dark = '#131217';
$this->colour_foreground_dark = '#f0f6f6';
$this->colour_border_dark = '#201f25';
$this->colour_background_hard_dark = '#eff0f1';
$this->colour_background_card_dark = '#0E0E0F';
$this->colour_foreground_dark = '#0E0E0F';
$this->colour_border_dark = '#26262C';
$this->colour_accent_dark = '#5ddbcf';
}
}

View File

@ -100,7 +100,7 @@ class Oomox extends Plugin
public static function getEntity(LocalUser $user): ?Entity\Oomox
{
try {
return Cache::get(self::cacheKey($user), fn () => DB::findOneBy('oomox', ['actor_id' => $user->getId()]));
return Cache::get(self::cacheKey($user), static fn () => DB::findOneBy('oomox', ['actor_id' => $user->getId()]));
} catch (NotFoundException $e) {
return null;
}
@ -112,7 +112,7 @@ class Oomox extends Plugin
public function onEndShowStyles(array &$styles, string $route): bool
{
$user = Common::user();
if (!\is_null($user) && !\is_null(Cache::get(self::cacheKey($user), fn () => self::getEntity($user)))) {
if ($user && Cache::get(self::cacheKey($user), static fn () => self::getEntity($user))) {
$styles[] = Router::url('oomox_css');
}
return Event::next;

View File

@ -8,17 +8,16 @@
@media (prefers-color-scheme: dark) {
:root {
--foreground: {{ oomox.getColourForegroundDark() | default('#f0f6f6') | raw }};
--background-hard: {{ oomox.getColourBackgroundHardDark() | default('#141216') | raw }};
--background-card: {{ oomox.getColourBackgroundCardDark() | default('#131217') | raw }};
--border: {{ oomox.getColourBorderDark() | default('#201f25') | raw }};
--foreground: {{ oomox.getColourForegroundDark() | default('#eff0f1') | raw }};
--background-hard: {{ oomox.getColourBackgroundHardDark() | default('#0E0E0F') | raw }};
--background-card: {{ oomox.getColourBackgroundCardDark() | default('#0E0E0F') | raw }};
--border: {{ oomox.getColourBorderDark() | default('#26262C') | raw }};
--accent: {{ oomox.getColourAccentDark() | default('#5ddbcf') | raw }};
--shadow: 0px 25px 42px -10px rgba(0, 0, 0, 0.09) !important;
--shadow: 0 5px 20px -10px rgba(255,255,255,0.1)!important;
--shadow-inset-accent: inset 0 0 0 2px var(--accent);
--background-checkerboard: repeating-conic-gradient(#ffffff66 0 90deg, #ffffff33 0 180deg) 0 0/40px 40px round;
--gradient: linear-gradient(10deg, var(--border) 0, transparent 90%) !important;
--gradient-backwards: linear-gradient(290deg, var(--border) 0, var(--background-card) 100%) !important;
--background-checkerboard: repeating-conic-gradient(#ffffff66 0 90deg,#ffffff33 0 180deg) 0 0/40px 40px round;
--gradient: linear-gradient(5deg,var(--border) -33%,transparent 66%)!important;
--gradient-backwards: linear-gradient(-5deg,var(--border) -33%,transparent 66%)!important;
}
}
@ -27,13 +26,12 @@
--foreground: {{ oomox.getColourForegroundLight() | default('#09090d') | raw }};
--background-hard: {{ oomox.getColourBackgroundHardLight() | default('#ebebeb') | raw }};
--background-card: {{ oomox.getColourBackgroundCardLight() | default('#f0f0f0') | raw }};
--border: {{ oomox.getColourBorderLight() | default('#d5d5d5') | raw }};
--border: {{ oomox.getColourBorderLight() | default('#C2C2C2') | raw }};
--accent: {{ oomox.getColourAccentLight() | default('#a22430') | raw }};
--shadow: 0px 25px 42px -10px rgba(1, 1, 1, 0.09) !important;
--shadow: 0 25px 42px -10px rgba(0,0,0,0.1)!important;
--shadow-inset-accent: inset 0 0 0 2px var(--accent);
--background-checkerboard: repeating-conic-gradient(#ffffff66 0 90deg, #ffffff33 0 180deg) 0 0/40px 40px round;
--gradient: linear-gradient(10deg, var(--background-hard) 0, transparent 60%) !important;
--gradient-backwards: linear-gradient(290deg, var(--background-hard) 0, var(--background-card) 100%) !important;
--background-checkerboard: repeating-conic-gradient(#ffffff66 0 90deg,#ffffff33 0 180deg) 0 0/40px 40px round;
--gradient: linear-gradient(10deg,var(--background-hard) 0,transparent 60%)!important;
--gradient-backwards: linear-gradient(290deg,var(--background-hard) 0,var(--background-card) 100%)!important;
}
}

View File

@ -5,7 +5,7 @@
{% block stylesheets %}
{{ parent() }}
<link rel="stylesheet" href="{{ asset('assets/default_theme/css/pages/feeds.css') }}" type="text/css">
<link rel="stylesheet" href="{{ asset('assets/default_theme/pages/feeds.css') }}" type="text/css">
{% endblock stylesheets %}
{% block body %}

View File

@ -5,7 +5,7 @@
{% block stylesheets %}
{{ parent() }}
<link rel="stylesheet" href="{{ asset('assets/default_theme/css/pages/feeds.css') }}" type="text/css">
<link rel="stylesheet" href="{{ asset('assets/default_theme/pages/feeds.css') }}" type="text/css">
{% endblock stylesheets %}
{% block body %}

View File

@ -5,7 +5,7 @@
{% block stylesheets %}
{{ parent() }}
<link rel="stylesheet" href="{{ asset('assets/default_theme/css/pages/feeds.css') }}" type="text/css">
<link rel="stylesheet" href="{{ asset('assets/default_theme/pages/feeds.css') }}" type="text/css">
{% endblock stylesheets %}
{% block body %}

View File

@ -3,7 +3,7 @@
{% block stylesheets %}
{{ parent() }}
<link rel="stylesheet" href="{{ asset('assets/default_theme/css/pages/feeds.css') }}" type="text/css">
<link rel="stylesheet" href="{{ asset('assets/default_theme/pages/feeds.css') }}" type="text/css">
{% endblock stylesheets %}
{% block body %}

View File

@ -8,6 +8,12 @@ html {
scroll-margin-top: var(--xxl);
}
html,
html > * {
background-image: url('images/noise.png');
background-blend-mode: overlay;
}
hr {
margin-top: var(--s);
margin-bottom: var(--s);
@ -137,7 +143,6 @@ hr {
}
.section-panel .panel-content {
background: var(--background-hard);
display: block;
height: calc(100vh - var(--xxl));
overflow: auto;
@ -173,7 +178,7 @@ hr {
left: 0;
width: 100vw;
z-index: auto;
background: var(--background-hard);
background-color: var(--background-hard);
box-shadow: var(--shadow);
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 130 KiB

View File

@ -1,37 +1,37 @@
.favourite-button-container {
-moz-mask-image: url(../../icons/heart.svg);
-o-mask-image: url(../../icons/heart.svg);
-webkit-mask-image: url(../../icons/heart.svg);
mask-image: url(../../icons/heart.svg);
-moz-mask-image: url(../icons/heart.svg);
-o-mask-image: url(../icons/heart.svg);
-webkit-mask-image: url(../icons/heart.svg);
mask-image: url(../icons/heart.svg);
}
.reply-button-container {
-moz-mask-image: url(../../icons/reply.svg);
-o-mask-image: url(../../icons/reply.svg);
-webkit-mask-image: url(../../icons/reply.svg);
mask-image: url(../../icons/reply.svg);
-moz-mask-image: url(../icons/reply.svg);
-o-mask-image: url(../icons/reply.svg);
-webkit-mask-image: url(../icons/reply.svg);
mask-image: url(../icons/reply.svg);
}
.repeat-button-container {
-moz-mask-image: url(../../icons/repeat.svg);
-o-mask-image: url(../../icons/repeat.svg);
-webkit-mask-image: url(../../icons/repeat.svg);
mask-image: url(../../icons/repeat.svg);
-moz-mask-image: url(../icons/repeat.svg);
-o-mask-image: url(../icons/repeat.svg);
-webkit-mask-image: url(../icons/repeat.svg);
mask-image: url(../icons/repeat.svg);
}
.delete-button-container {
-moz-mask-image: url(../../icons/delete.svg);
-o-mask-image: url(../../icons/delete.svg);
-webkit-mask-image: url(../../icons/delete.svg);
mask-image: url(../../icons/delete.svg);
-moz-mask-image: url(../icons/delete.svg);
-o-mask-image: url(../icons/delete.svg);
-webkit-mask-image: url(../icons/delete.svg);
mask-image: url(../icons/delete.svg);
}
.icon-eye-opened {
background-color: var(--foreground);
-moz-mask-image: url(../../icons/eye-opened.svg);
-o-mask-image: url(../../icons/eye-opened.svg);
-webkit-mask-image: url(../../icons/eye-opened.svg);
mask-image: url(../../icons/eye-opened.svg);
-moz-mask-image: url(../icons/eye-opened.svg);
-o-mask-image: url(../icons/eye-opened.svg);
-webkit-mask-image: url(../icons/eye-opened.svg);
mask-image: url(../icons/eye-opened.svg);
display: inline-flex;
height: 1em;
width: 1em;
@ -39,10 +39,10 @@
.icon-eye-closed {
background-color: var(--foreground);
-moz-mask-image: url(../../icons/eye-closed.svg);
-o-mask-image: url(../../icons/eye-closed.svg);
-webkit-mask-image: url(../../icons/eye-closed.svg);
mask-image: url(../../icons/eye-closed.svg);
-moz-mask-image: url(../icons/eye-closed.svg);
-o-mask-image: url(../icons/eye-closed.svg);
-webkit-mask-image: url(../icons/eye-closed.svg);
mask-image: url(../icons/eye-closed.svg);
display: inline-flex;
height: 1em;
width: 1em;
@ -140,7 +140,7 @@
}
.h-entry {
background-color: var(--background-card) !important;
background-color: var(--background-card);
border-radius: var(--s);
display: flex;
}

View File

@ -16,8 +16,8 @@
--shadow: 0 5px 20px -10px rgba(255,255,255,0.1)!important;
--shadow-inset-accent: inset 0 0 0 2px var(--accent);
--background-checkerboard: repeating-conic-gradient(#ffffff66 0 90deg,#ffffff33 0 180deg) 0 0/40px 40px round;
--gradient: linear-gradient(10deg,var(--border) -33%,transparent 66%)!important;
--gradient-backwards: linear-gradient(-10deg,var(--border) -33%,transparent 66%)!important;
--gradient: linear-gradient(5deg,var(--border) -33%,transparent 66%)!important;
--gradient-backwards: linear-gradient(-5deg,var(--border) -33%,transparent 66%)!important;
}
}
@ -26,7 +26,7 @@
--foreground: #09090d;
--background-hard: #ebebeb;
--background-card: #f0f0f0;
--border: #d5d5d5;
--border: #C2C2C2;
--accent: #a22430;
--shadow: 0 25px 42px -10px rgba(0,0,0,0.1)!important;
--shadow-inset-accent: inset 0 0 0 2px var(--accent);

View File

@ -1,8 +1,8 @@
.add-actor-button-container {
-moz-mask-image: url(../../icons/add-actor.svg);
-o-mask-image: url(../../icons/add-actor.svg);
-webkit-mask-image: url(../../icons/add-actor.svg);
mask-image: url(../../icons/add-actor.svg);
-moz-mask-image: url(../icons/add-actor.svg);
-o-mask-image: url(../icons/add-actor.svg);
-webkit-mask-image: url(../icons/add-actor.svg);
mask-image: url(../icons/add-actor.svg);
}
.alert, .alert-danger, .form-error, .form-row-widget-error {
@ -143,8 +143,8 @@
}
.frame-section {
background-color: var(--background-card) !important;
border: 1px solid var(--border) !important;
background-color: var(--background-card);
border: 1px solid var(--border);
border-radius: var(--s);
box-shadow: var(--shadow);
display: flex;
@ -274,10 +274,10 @@
}
.remove-actor-button-container {
-moz-mask-image: url(../../icons/remove-actor.svg);
-o-mask-image: url(../../icons/remove-actor.svg);
-webkit-mask-image: url(../../icons/remove-actor.svg);
mask-image: url(../../icons/remove-actor.svg);
-moz-mask-image: url(../icons/remove-actor.svg);
-o-mask-image: url(../icons/remove-actor.svg);
-webkit-mask-image: url(../icons/remove-actor.svg);
mask-image: url(../icons/remove-actor.svg);
}
.section-details-subtitle .section-details-subtitle:not(:last-of-type) {
@ -355,7 +355,7 @@
}
.section-form {
background-color: var(--background-hard);
background-color: var(--background-card);
border-radius: var(--s);
display: block;
max-width: 100%;

View File

@ -20,7 +20,7 @@
<link rel='stylesheet' type='text/css' href="{{ asset('assets/default_theme/fonts/opensans/opensans.css') }}">
<link rel='stylesheet' type='text/css' href="{{ asset('assets/default_theme/fonts/poppins/poppins.css') }}">
<link rel='stylesheet' type='text/css' href="{{ asset('assets/default_theme/css/base.css') }}">
<link rel='stylesheet' type='text/css' href="{{ asset('assets/default_theme/base.css') }}">
{% for stylesheet in show_stylesheets(app.request.get('_route')) %}
<link rel='preload' type='text/css' as='style' href="{{ preload(asset(stylesheet), { as: 'style' }) }}">

View File

@ -5,7 +5,7 @@
{% block stylesheets %}
{{ parent() }}
<link rel="stylesheet" href="{{ asset('assets/default_theme/css/pages/feeds.css') }}" type="text/css">
<link rel="stylesheet" href="{{ asset('assets/default_theme/pages/feeds.css') }}" type="text/css">
{% endblock stylesheets %}
{% block body %}

View File

@ -6,8 +6,8 @@
{% block stylesheets %}
{{ parent() }}
<link rel="preload" href="{{ asset('assets/default_theme/css/pages/settings.css') }}" as="style" type="text/css">
<link rel="stylesheet" href="{{ asset('assets/default_theme/css/pages/settings.css') }}">
<link rel="preload" href="{{ asset('assets/default_theme/pages/settings.css') }}" as="style" type="text/css">
<link rel="stylesheet" href="{{ asset('assets/default_theme/pages/settings.css') }}">
{% endblock stylesheets %}
{% block body %}