From aefe7ddd8fd09656f8c7311a7771e8be9e320388 Mon Sep 17 00:00:00 2001 From: Mario Date: Sat, 20 Aug 2022 09:31:30 +0000 Subject: redbasic: make use of css variables and implement link_hover_colour --- view/theme/redbasic/css/style.css | 49 ++++++++++++++++-------------- view/theme/redbasic/php/config.php | 5 ++- view/theme/redbasic/php/style.php | 10 ++++-- view/theme/redbasic/schema/dark.php | 4 ++- view/theme/redbasic/tpl/theme_settings.tpl | 3 +- 5 files changed, 43 insertions(+), 28 deletions(-) (limited to 'view/theme') diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css index d395ae78b..0a45f18f3 100644 --- a/view/theme/redbasic/css/style.css +++ b/view/theme/redbasic/css/style.css @@ -6,12 +6,33 @@ */ -/* generals */ +/* bootstrap variable */ :root { --bs-border-radius: $radius; + --bs-link-color: $link_colour; + --bs-link-hover-color: $link_hover_colour; +} + +.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 */ + html { font-size: $font_size; } @@ -109,7 +130,7 @@ abbr { a, .fakelink { - color: $link_colour; + color: var(--bs-link-color); } @@ -117,7 +138,7 @@ a:hover, a:focus, .fakelink:hover, .fakelink:focus { - color: $link_colour; + color: var(--bs-link-hover-color); } .fakelink, @@ -1410,22 +1431,6 @@ main.fullscreen .section-content-wrapper-np { /* bootstrap overrides */ -.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; -} - .form-control { border-radius: $radius; } @@ -1617,11 +1622,11 @@ dl.bb-dl > dd > li { } .onoffswitch.checkbox:hover label { - color: $link_colour; + color: var(--bs-link-color); } .onoffswitch.checkbox:hover > div label { - border-color: $link_colour; + border-color: var(--bs-link-color); } .onoffswitch-inner { @@ -1665,7 +1670,7 @@ dl.bb-dl > dd > li { .onoffswitch.checkbox > div > input:checked + label .onoffswitch-switch { right: 0px; - background-color: $link_colour; + background-color: var(--bs-link-color); } diff --git a/view/theme/redbasic/php/config.php b/view/theme/redbasic/php/config.php index 0de475fe5..9d242fab0 100644 --- a/view/theme/redbasic/php/config.php +++ b/view/theme/redbasic/php/config.php @@ -42,6 +42,7 @@ class RedbasicConfig { $arr['nav_icon_colour'] = get_pconfig(local_channel(),'redbasic', 'nav_icon_colour' ); $arr['nav_active_icon_colour'] = get_pconfig(local_channel(),'redbasic', 'nav_active_icon_colour' ); $arr['link_colour'] = get_pconfig(local_channel(),'redbasic', 'link_colour' ); + $arr['link_hover_colour'] = get_pconfig(local_channel(),'redbasic', 'link_hover_colour' ); $arr['banner_colour'] = get_pconfig(local_channel(),'redbasic', 'banner_colour' ); $arr['bgcolour'] = get_pconfig(local_channel(),'redbasic', 'background_colour' ); $arr['background_image'] = get_pconfig(local_channel(),'redbasic', 'background_image' ); @@ -69,6 +70,7 @@ class RedbasicConfig { set_pconfig(local_channel(), 'redbasic', 'nav_icon_colour', $_POST['redbasic_nav_icon_colour']); set_pconfig(local_channel(), 'redbasic', 'nav_active_icon_colour', $_POST['redbasic_nav_active_icon_colour']); set_pconfig(local_channel(), 'redbasic', 'link_colour', $_POST['redbasic_link_colour']); + set_pconfig(local_channel(), 'redbasic', 'link_hover_colour', $_POST['redbasic_link_hover_colour']); set_pconfig(local_channel(), 'redbasic', 'background_colour', $_POST['redbasic_background_colour']); set_pconfig(local_channel(), 'redbasic', 'banner_colour', $_POST['redbasic_banner_colour']); set_pconfig(local_channel(), 'redbasic', 'background_image', $_POST['redbasic_background_image']); @@ -100,7 +102,8 @@ class RedbasicConfig { '$nav_bg' => array('redbasic_nav_bg', t('Navigation bar background color'), $arr['nav_bg']), '$nav_icon_colour' => array('redbasic_nav_icon_colour', t('Navigation bar icon color '), $arr['nav_icon_colour']), '$nav_active_icon_colour' => array('redbasic_nav_active_icon_colour', t('Navigation bar active icon color '), $arr['nav_active_icon_colour']), - '$link_colour' => array('redbasic_link_colour', t('Link color'), $arr['link_colour'], '', $link_colours), + '$link_colour' => array('redbasic_link_colour', t('Link color'), $arr['link_colour'], '', $link_colour), + '$link_hover_colour' => array('redbasic_link_hover_colour', t('Link hover color'), $arr['link_hover_colour'], '', $link_hover_colour), '$banner_colour' => array('redbasic_banner_colour', t('Set font-color for banner'), $arr['banner_colour']), '$bgcolour' => array('redbasic_background_colour', t('Set the background color'), $arr['bgcolour']), '$background_image' => array('redbasic_background_image', t('Set the background image'), $arr['background_image']), diff --git a/view/theme/redbasic/php/style.php b/view/theme/redbasic/php/style.php index 38e71be34..45790ae37 100644 --- a/view/theme/redbasic/php/style.php +++ b/view/theme/redbasic/php/style.php @@ -16,6 +16,7 @@ if(! App::$install) { $banner_colour = get_pconfig($uid,'redbasic','banner_colour'); $narrow_navbar = get_pconfig($uid,'redbasic','narrow_navbar'); $link_colour = get_pconfig($uid, 'redbasic', 'link_colour'); + $link_hover_colour = get_pconfig($uid, 'redbasic', 'link_hover_colour'); $schema = get_pconfig($uid,'redbasic','schema'); $bgcolour = get_pconfig($uid, 'redbasic', 'background_colour'); $background_image = get_pconfig($uid, 'redbasic', 'background_image'); @@ -79,6 +80,8 @@ if (! $nav_active_icon_colour) $nav_active_icon_colour = 'rgba(255, 255, 255, 0.75)'; if (! $link_colour) $link_colour = '#0d6efd'; +if (! $link_hover_colour) + $link_hover_colour = '#0a58ca;'; if (! $banner_colour) $banner_colour = '#efefef'; if (! $bgcolour) @@ -111,9 +114,9 @@ if(file_exists('view/theme/redbasic/css/style.css')) { $x = file_get_contents('view/theme/redbasic/css/style.css'); - if($schema === 'dark' && file_exists('view/theme/redbasic/schema/bootstrap-nightfall.css')) { - $x .= file_get_contents('view/theme/redbasic/schema/bootstrap-nightfall.css'); - } + if($schema === 'dark' && file_exists('view/theme/redbasic/schema/bootstrap-nightfall.css')) { + $x .= file_get_contents('view/theme/redbasic/schema/bootstrap-nightfall.css'); + } if($narrow_navbar && file_exists('view/theme/redbasic/css/narrow_navbar.css')) { $x .= file_get_contents('view/theme/redbasic/css/narrow_navbar.css'); @@ -136,6 +139,7 @@ if(file_exists('view/theme/redbasic/css/style.css')) { '$nav_icon_colour' => $nav_icon_colour, '$nav_active_icon_colour' => $nav_active_icon_colour, '$link_colour' => $link_colour, + '$link_hover_colour' => $link_hover_colour, '$banner_colour' => $banner_colour, '$bgcolour' => $bgcolour, '$background_image' => $background_image, diff --git a/view/theme/redbasic/schema/dark.php b/view/theme/redbasic/schema/dark.php index 18e92ac93..cd9653a23 100644 --- a/view/theme/redbasic/schema/dark.php +++ b/view/theme/redbasic/schema/dark.php @@ -17,7 +17,9 @@ if (! $nav_active_icon_colour) $nav_active_icon_colour = "#fff"; if (! $link_colour) - $link_colour = "#fff"; + $link_colour = "#5f7b99;"; + if (! $link_hover_colour) + $link_hover_colour = "#4b6b8c"; if (! $banner_colour) $banner_colour = "#999"; if (! $bgcolour) diff --git a/view/theme/redbasic/tpl/theme_settings.tpl b/view/theme/redbasic/tpl/theme_settings.tpl index cc403f0a7..65b3a7883 100644 --- a/view/theme/redbasic/tpl/theme_settings.tpl +++ b/view/theme/redbasic/tpl/theme_settings.tpl @@ -15,6 +15,7 @@ {{*include file="field_input.tpl" field=$comment_indent*}} {{include file="field_colorinput.tpl" field=$font_colour}} {{include file="field_colorinput.tpl" field=$link_colour}} + {{include file="field_colorinput.tpl" field=$link_hover_colour}} {{include file="field_input.tpl" field=$radius}} {{include file="field_input.tpl" field=$shadow}} {{include file="field_input.tpl" field=$top_photo}} @@ -23,7 +24,7 @@