oss/wallabag
oss/wallabag
1
0
Fork 0
mirror of https://github.com/wallabag/wallabag.git synced 2025-09-15 18:57:05 +00:00
Code Wiki Activity

Merge pull request #4725 from wallabag/feat/dark-theme

Browse source 
Dark theme
This commit is contained in:
Jérémy Benoist 2020-11-23 07:53:10 +01:00 • committed by GitHub
commit 1443bb1998
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
18 changed files with 252 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

7
src/Wallabag/CoreBundle/Resources/translations/messages.en.yml
View file

@ -34,6 +34,9 @@ menu:
site_credentials: Site credentials
ignore_origin_instance_rules: 'Global ignore origin rules'
quickstart: "Quickstart"
theme_toggle_light: "Light theme"
theme_toggle_dark: "Dark theme"
theme_toggle_auto: "Automatic theme"
top:
add_new_entry: Add a new entry
search: Search
@ -273,6 +276,10 @@ entry:
delete_public_link: delete public link
export: Export
print: Print
theme_toggle: Theme toggle
theme_toggle_light: Light
theme_toggle_dark: Dark
theme_toggle_auto: Automatic
problem:
label: Problems?
description: Does this article appear wrong?

7
src/Wallabag/CoreBundle/Resources/translations/messages.fr.yml
View file

@ -34,6 +34,9 @@ menu:
site_credentials: Accès aux sites
ignore_origin_instance_rules: "Règles globales d'omission d'origine"
quickstart: "Pour bien débuter"
theme_toggle_light: "Thème clair"
theme_toggle_dark: "Thème sombre"
theme_toggle_auto: "Thème automatique"
top:
add_new_entry: Sauvegarder un nouvel article
search: Rechercher
@ -273,6 +276,10 @@ entry:
delete_public_link: Supprimer le lien public
export: Exporter
print: Imprimer
theme_toggle: Changer le thème
theme_toggle_light: "Clair"
theme_toggle_dark: "Sombre"
theme_toggle_auto: "Automatique"
problem:
label: Un problème ?
description: Est-ce que cet article s’affiche mal ?

2
src/Wallabag/CoreBundle/Resources/views/base.html.twig
View file

@ -4,7 +4,7 @@
<!--[if lte IE 7]><html class="no-js ie7 ie67 ie678"{% if lang is not empty %} lang="{{ lang }}"{% endif %}><![endif]-->
<!--[if IE 8]><html class="no-js ie8 ie678"{% if lang is not empty %} lang="{{ lang }}"{% endif %}><![endif]-->
<!--[if gt IE 8]><html class="no-js"{% if lang is not empty %} lang="{{ lang }}"{% endif %}><![endif]-->
<html{% if lang is not empty %} lang="{{ lang }}"{% endif %}>
<html{% if lang is not empty %} class="{{ theme_class() }}" lang="{{ lang }}"{% endif %}>
<head>
{% block head %}
<meta name="viewport" content="initial-scale=1.0">

26
src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entry.html.twig
View file

@ -97,6 +97,32 @@
<div class="collapsible-body"></div>
</li>
<li class="bold">
<a class="waves-effect collapsible-header">
<i class="material-icons small">brightness_medium</i>
<span>{{ 'entry.view.left_menu.theme_toggle'|trans }}</span>
</a>
<ul class="collapsible-body">
<li>
<a href="#" class="js-theme-toggle" data-theme="light">
<i class="theme-toggle-icon material-icons tiny">brightness_high</i>
<span>{{ 'entry.view.left_menu.theme_toggle_light'|trans }}</span>
</a>
</li>
<li>
<a href="#" class="js-theme-toggle" data-theme="dark">
<i class="theme-toggle-icon material-icons tiny">brightness_low</i>
<span>{{ 'entry.view.left_menu.theme_toggle_dark'|trans }}</span>
</a>
</li>
<li>
<a href="#" class="js-theme-toggle" data-theme="auto">
<i class="theme-toggle-icon material-icons tiny">brightness_auto</i>
<span>{{ 'entry.view.left_menu.theme_toggle_auto'|trans }}</span>
</a>
</li>
</ul>
</li>
{% if craue_setting('share_public')
or craue_setting('share_twitter')
or craue_setting('share_shaarli')

19
src/Wallabag/CoreBundle/Resources/views/themes/material/layout.html.twig
View file

@ -121,7 +121,26 @@
<li><a href="{{ path('user_index') }}"><i class="material-icons">people</i>{{ 'menu.left.users_management'|trans }}</a></li>
<li><a href="{{ path('craue_config_settings_modify') }}"><i class="material-icons">settings</i> {{ 'menu.left.internal_settings'|trans }}</a></li>
<li><a href="{{ path('ignore_origin_instance_rules_index') }}"><i class="material-icons">build</i> {{ 'menu.left.ignore_origin_instance_rules'|trans }}</a></li>
<li class="divider"></li>
{% endif %}
<li>
<a href="#" class="js-theme-toggle" data-theme="light">
<i class="theme-toggle-icon material-icons tiny">brightness_high</i>
<span>{{ 'menu.left.theme_toggle_light'|trans }}</span>
</a>
</li>
<li>
<a href="#" class="js-theme-toggle" data-theme="dark">
<i class="theme-toggle-icon material-icons tiny">brightness_low</i>
<span>{{ 'menu.left.theme_toggle_dark'|trans }}</span>
</a>
</li>
<li>
<a href="#" class="js-theme-toggle" data-theme="auto">
<i class="theme-toggle-icon material-icons tiny">brightness_auto</i>
<span>{{ 'menu.left.theme_toggle_auto'|trans }}</span>
</a>
</li>
<li class="divider"></li>
<li><a href="{{ path('howto') }}"><i class="material-icons">live_help</i> {{ 'menu.left.howto'|trans }}</a></li>
<li><a href="{{ path('quickstart') }}"><i class="material-icons">assistant_photo</i> {{ 'menu.left.quickstart'|trans }}</a></li>

6
src/Wallabag/CoreBundle/Twig/WallabagExtension.php
View file

@ -51,6 +51,7 @@ class WallabagExtension extends AbstractExtension implements GlobalsInterface
new TwigFunction('count_tags', [$this, 'countTags']),
new TwigFunction('display_stats', [$this, 'displayStats']),
new TwigFunction('asset_file_exists', [$this, 'assetFileExists']),
new TwigFunction('theme_class', [$this, 'themeClass']),
];
}
@ -171,6 +172,11 @@ class WallabagExtension extends AbstractExtension implements GlobalsInterface
return file_exists(realpath($this->rootDir . '/../web/' . $name));
}
public function themeClass()
{
return isset($_COOKIE['theme']) && 'dark' === $_COOKIE['theme'] ? 'dark-theme' : '';
}
public function getName()
{
return 'wallabag_extension';