aboutsummaryrefslogtreecommitdiffstats
path: root/view/theme/redbasic
diff options
context:
space:
mode:
Diffstat (limited to 'view/theme/redbasic')
-rw-r--r--view/theme/redbasic/js/redbasic.js26
-rw-r--r--view/theme/redbasic/php/config.php3
-rw-r--r--view/theme/redbasic/php/theme.php5
-rw-r--r--view/theme/redbasic/tpl/theme_settings.tpl4
4 files changed, 29 insertions, 9 deletions
diff --git a/view/theme/redbasic/js/redbasic.js b/view/theme/redbasic/js/redbasic.js
index ea74660b4..54d683ce7 100644
--- a/view/theme/redbasic/js/redbasic.js
+++ b/view/theme/redbasic/js/redbasic.js
@@ -5,13 +5,11 @@
let redbasic_dark_mode = localStorage.getItem('redbasic_dark_mode');
let redbasic_theme_color = localStorage.getItem('redbasic_theme_color');
-if (redbasic_dark_mode) {
+if (redbasic_dark_mode === 1) {
$('html').attr('data-bs-theme', 'dark');
- $('#theme-switch-icon').removeClass('fa-moon-o').addClass('fa-sun-o');
}
-else {
+if (redbasic_dark_mode === 0) {
$('html').attr('data-bs-theme', 'light');
- $('#theme-switch-icon').removeClass('fa-sun-o').addClass('fa-moon-o');
}
@@ -21,6 +19,15 @@ if (redbasic_theme_color) {
$(document).ready(function() {
+ if (redbasic_dark_mode === 1) {
+ $('#theme-switch-icon').removeClass('fa-moon-o').addClass('fa-sun-o');
+ $('[data-bs-theme="light"]').attr('data-bs-theme', 'dark');
+ }
+ if (redbasic_dark_mode === 0) {
+ $('#theme-switch-icon').removeClass('fa-sun-o').addClass('fa-moon-o');
+ $('[data-bs-theme="dark"]:not(nav)').attr('data-bs-theme', 'light');
+ }
+
if (redbasic_theme_color != $('nav').css('background-color')) {
$('meta[name=theme-color]').attr('content', $('nav').css('background-color'));
localStorage.setItem('redbasic_theme_color', $('nav').css('background-color'));
@@ -65,12 +72,17 @@ $(document).ready(function() {
$('#theme-switch').click(function() {
if ($('html').attr('data-bs-theme') === 'dark') {
- $('html').attr('data-bs-theme', 'light');
- localStorage.removeItem('redbasic_dark_mode');
+ if ($('nav').data('bs-theme') === 'dark') {
+ $('[data-bs-theme="dark"]:not(nav)').attr('data-bs-theme', 'light');
+ }
+ else {
+ $('[data-bs-theme="dark"]').attr('data-bs-theme', 'light');
+ }
+ localStorage.setItem('redbasic_dark_mode', 0);
$('#theme-switch-icon').removeClass('fa-sun-o').addClass('fa-moon-o');
}
else {
- $('html').attr('data-bs-theme', 'dark');
+ $('[data-bs-theme="light"]').attr('data-bs-theme', 'dark');
localStorage.setItem('redbasic_dark_mode', 1);
$('#theme-switch-icon').removeClass('fa-moon-o').addClass('fa-sun-o');
}
diff --git a/view/theme/redbasic/php/config.php b/view/theme/redbasic/php/config.php
index 87a4c45d5..ef1cb7a11 100644
--- a/view/theme/redbasic/php/config.php
+++ b/view/theme/redbasic/php/config.php
@@ -38,6 +38,7 @@ class RedbasicConfig {
$arr = array();
$arr['dark_mode'] = get_pconfig(local_channel(),'redbasic', 'dark_mode');
+ $arr['navbar_dark_mode'] = get_pconfig(local_channel(),'redbasic', 'navbar_dark_mode');
$arr['narrow_navbar'] = get_pconfig(local_channel(),'redbasic', 'narrow_navbar' );
$arr['nav_bg'] = get_pconfig(local_channel(),'redbasic', 'nav_bg' );
$arr['nav_bg_dark'] = get_pconfig(local_channel(),'redbasic', 'nav_bg_dark' );
@@ -65,6 +66,7 @@ class RedbasicConfig {
if (isset($_POST['redbasic-settings-submit'])) {
set_pconfig(local_channel(), 'redbasic', 'narrow_navbar', $_POST['redbasic_narrow_navbar']);
+ set_pconfig(local_channel(), 'redbasic', 'navbar_dark_mode', $_POST['redbasic_navbar_dark_mode']);
set_pconfig(local_channel(), 'redbasic', 'dark_mode', $_POST['redbasic_dark_mode']);
set_pconfig(local_channel(), 'redbasic', 'nav_bg', $_POST['redbasic_nav_bg']);
set_pconfig(local_channel(), 'redbasic', 'nav_bg_dark', $_POST['redbasic_nav_bg_dark']);
@@ -99,6 +101,7 @@ class RedbasicConfig {
'$expert' => $expert,
'$title' => t("Theme settings"),
'$dark_mode' => array('redbasic_dark_mode',t('Default to dark mode'),$arr['dark_mode'], '', array(t('No'),t('Yes'))),
+ '$navbar_dark_mode' => array('redbasic_navbar_dark_mode',t('Always use light icons for navbar'),$arr['navbar_dark_mode'], t('Enable this option if you use a dark navbar color in light mode'), array(t('No'),t('Yes'))),
'$narrow_navbar' => array('redbasic_narrow_navbar',t('Narrow navbar'),$arr['narrow_navbar'], '', array(t('No'),t('Yes'))),
'$nav_bg' => array('redbasic_nav_bg', t('Navigation bar background color'), $arr['nav_bg']),
'$nav_bg_dark' => array('redbasic_nav_bg_dark', t('Dark navigation bar background color'), $arr['nav_bg_dark']),
diff --git a/view/theme/redbasic/php/theme.php b/view/theme/redbasic/php/theme.php
index abfac05b6..8864f5ea5 100644
--- a/view/theme/redbasic/php/theme.php
+++ b/view/theme/redbasic/php/theme.php
@@ -18,18 +18,23 @@ use App;
function redbasic_init(&$a) {
$mode = '';
+ $navbar_mode = '';
if (local_channel()) {
$mode = ((get_pconfig(local_channel(), 'redbasic', 'dark_mode')) ? 'dark' : 'light');
+ $navbar_mode = ((get_pconfig(local_channel(), 'redbasic', 'navbar_dark_mode')) ? 'dark' : 'light');
}
if (App::$profile_uid) {
$mode = ((get_pconfig(App::$profile_uid, 'redbasic', 'dark_mode')) ? 'dark' : 'light');
+ $navbar_mode = ((get_pconfig(App::$profile_uid, 'redbasic', 'navbar_dark_mode')) ? 'dark' : 'light');
}
if (!$mode) {
$mode = ((get_config('redbasic', 'dark_mode')) ? 'dark' : 'light');
+ $navbar_mode = ((get_config('redbasic', 'navbar_dark_mode')) ? 'dark' : 'light');
}
App::$page['color_mode'] = 'data-bs-theme="' . $mode . '"';
+ App::$page['navbar_color_mode'] = (($navbar_mode === 'dark') ? 'data-bs-theme="' . $navbar_mode . '"' : '');
}
diff --git a/view/theme/redbasic/tpl/theme_settings.tpl b/view/theme/redbasic/tpl/theme_settings.tpl
index e91a68265..6e4fe55ed 100644
--- a/view/theme/redbasic/tpl/theme_settings.tpl
+++ b/view/theme/redbasic/tpl/theme_settings.tpl
@@ -6,6 +6,7 @@
{{if $expert}}
<h3>Light</h3>
+ {{include file="field_checkbox.tpl" field=$navbar_dark_mode}}
{{include file="field_colorinput.tpl" field=$nav_bg}}
{{include file="field_colorinput.tpl" field=$bgcolor}}
{{include file="field_colorinput.tpl" field=$background_image}}
@@ -26,8 +27,7 @@
<script>
$(function(){
- $('#id_redbasic_nav_bg, #id_redbasic_nav_bg_dark').colorpicker({format: 'rgba'});
- $('#id_redbasic_link_color, #id_redbasic_link_color_dark, #id_redbasic_link_hover_color, #id_redbasic_link_hover_color_dark, #id_redbasic_background_color, #id_redbasic_background_color_dark').colorpicker();
+ $('#id_redbasic_link_color, #id_redbasic_link_color_dark, #id_redbasic_link_hover_color, #id_redbasic_link_hover_color_dark, #id_redbasic_background_color, #id_redbasic_background_color_dark, #id_redbasic_nav_bg, #id_redbasic_nav_bg_dark').colorpicker({format: 'rgba'});
});
</script>
{{/if}}