diff options
Diffstat (limited to 'view')
| -rw-r--r-- | view/theme/redbasic/css/style.css | 12 | ||||
| -rw-r--r-- | view/theme/redbasic/js/redbasic.js | 40 | ||||
| -rw-r--r-- | view/theme/redbasic/php/config.php | 3 | ||||
| -rw-r--r-- | view/theme/redbasic/php/style.php | 16 | ||||
| -rw-r--r-- | view/theme/redbasic/php/theme.php | 5 | ||||
| -rw-r--r-- | view/theme/redbasic/tpl/theme_settings.tpl | 4 | ||||
| -rw-r--r-- | view/tpl/navbar_default.tpl | 8 |
7 files changed, 44 insertions, 44 deletions
diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css index ed70631d3..9548d73f5 100644 --- a/view/theme/redbasic/css/style.css +++ b/view/theme/redbasic/css/style.css @@ -34,22 +34,10 @@ background-color: $nav_bg_dark !important; } -.nav-tabs { - --bs-nav-tabs-border-radius: $radius; -} - -.nav-pills { - --bs-nav-pills-border-radius: $radius; -} - .btn { --bs-btn-border-radius: $radius; } -.card { - --bs-card-border-radius: $radius; -} - /* generals */ diff --git a/view/theme/redbasic/js/redbasic.js b/view/theme/redbasic/js/redbasic.js index 7a6d795a4..b7036262d 100644 --- a/view/theme/redbasic/js/redbasic.js +++ b/view/theme/redbasic/js/redbasic.js @@ -3,21 +3,35 @@ */ let redbasic_dark_mode = localStorage.getItem('redbasic_dark_mode'); +let redbasic_theme_color = localStorage.getItem('redbasic_theme_color'); if (redbasic_dark_mode == 1) { + $('html').attr('data-bs-theme', 'dark'); +} +if (redbasic_dark_mode == 0) { $('html').attr('data-bs-theme', 'light'); - $('#theme-switch-icon').removeClass('fa-sun-o').addClass('fa-moon-o'); } -if (redbasic_dark_mode == 2) { - $('html').attr('data-bs-theme', 'dark'); - $('#theme-switch-icon').removeClass('fa-moon-o').addClass('fa-sun-o'); -} +if (redbasic_theme_color) { + $('meta[name=theme-color]').attr('content', redbasic_theme_color); +} $(document).ready(function() { - $('meta[name=theme-color]').attr('content', $('nav').css('background-color')); + 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')); + } // CSS3 calc() fallback (for unsupported browsers) $('body').append('<div id="css3-calc" style="width: 10px; width: calc(10px + 10px); display: none;"></div>'); @@ -58,16 +72,22 @@ $(document).ready(function() { $('#theme-switch').click(function() { if ($('html').attr('data-bs-theme') === 'dark') { - $('html').attr('data-bs-theme', 'light'); - localStorage.setItem('redbasic_dark_mode', 1); + 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'); - localStorage.setItem('redbasic_dark_mode', 2); + $('[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'); } $('meta[name=theme-color]').attr('content', $('nav').css('background-color')); + localStorage.setItem('redbasic_theme_color', $('nav').css('background-color')); }); 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/style.php b/view/theme/redbasic/php/style.php index b58ac98d8..4d5bd42be 100644 --- a/view/theme/redbasic/php/style.php +++ b/view/theme/redbasic/php/style.php @@ -101,18 +101,6 @@ if (! $background_image) if (! $background_image_dark) $background_image_dark = ''; -if (! $item_color) - $item_color = '#fff'; - -if (! $item_color_dark) - $item_color_dark = '#212529'; - -if (! $header_item_color) - $header_item_color = '#f8f9fa'; - -if (! $header_item_color_dark) - $header_item_color_dark = '#212529'; - if (! $font_size) $font_size = '0.875rem'; @@ -160,10 +148,6 @@ if(file_exists('view/theme/redbasic/css/style.css')) { '$bgcolor_dark' => $bgcolor_dark, '$background_image' => $background_image, '$background_image_dark' => $background_image_dark, - '$item_color' => $item_color, - '$item_color_dark' => $item_color_dark, - '$header_item_color' => $header_item_color, - '$header_item_color_dark' => $header_item_color_dark, '$font_size' => $font_size, '$radius' => $radius, '$converse_width' => $converse_width, 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}} diff --git a/view/tpl/navbar_default.tpl b/view/tpl/navbar_default.tpl index d376647e3..36363bcf1 100644 --- a/view/tpl/navbar_default.tpl +++ b/view/tpl/navbar_default.tpl @@ -1,4 +1,4 @@ -<nav class="navbar fixed-top navbar-expand-lg bg-body-tertiary"> +<nav class="navbar fixed-top navbar-expand-lg bg-body-tertiary" {{$navbar_color_mode}}> <div class="container-fluid flex-nowrap"> {{if $userinfo}} <div class="d-flex" style="max-width: 50%"> @@ -8,7 +8,7 @@ <i class="navbar-text fa fa-caret-down"></i> </div> {{if $is_owner}} - <div class="dropdown-menu"> + <div class="dropdown-menu" {{$color_mode}}> {{foreach $nav.usermenu as $usermenu}} <a class="dropdown-item{{if $usermenu.2}} active{{/if}}" href="{{$usermenu.0}}" title="{{$usermenu.3}}" role="menuitem" id="{{$usermenu.4}}">{{$usermenu.1}}</a> {{/foreach}} @@ -116,7 +116,7 @@ <div class="navbar-text navbar-banner">{{$banner}}</div> <ul id="nav-right" class="navbar-nav"> - <li class="nav-item collapse clearfix" id="nav-search"> + <li class="nav-item collapse clearfix" id="nav-search" {{$color_mode}}> <form class="form-inline" method="get" action="{{$nav.search.4}}" role="search"> <input class="form-control form-control-sm mt-1 me-2" id="nav-search-text" type="text" value="" placeholder="{{$help}}" name="search" title="{{$nav.search.3}}" onclick="this.submit();" onblur="closeMenu('nav-search'); openMenu('nav-search-btn');"/> </form> @@ -134,7 +134,7 @@ {{/if}} {{if $localuser || $nav.pubs}} <li id="notifications-btn" class="nav-item d-xl-none"> - <a class="nav-link text-white notifications-btn" href="#"><i id="notifications-btn-icon" class="fa fa-exclamation-circle notifications-btn-icon"></i></a> + <a class="nav-link notifications-btn" href="#"><i id="notifications-btn-icon" class="fa fa-exclamation-circle notifications-btn-icon"></i></a> </li> {{/if}} {{if $navbar_apps}} |