From 57cc77f6d595a003aa0702995439716cf12005b8 Mon Sep 17 00:00:00 2001 From: marijus Date: Sun, 2 Mar 2014 22:50:53 +0100 Subject: make navbar themable again --- view/theme/redbasic/css/style.css | 39 ++++++++++- view/theme/redbasic/php/config.php | 45 +++++++------ view/theme/redbasic/php/style.php | 104 +++++++++-------------------- view/theme/redbasic/schema/BS-Default.php | 18 +++++ view/theme/redbasic/tpl/theme_settings.tpl | 9 ++- 5 files changed, 118 insertions(+), 97 deletions(-) create mode 100644 view/theme/redbasic/schema/BS-Default.php (limited to 'view') diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css index c410c61bc..7641949e3 100644 --- a/view/theme/redbasic/css/style.css +++ b/view/theme/redbasic/css/style.css @@ -851,7 +851,7 @@ footer { margin: 15px; padding: 0px 5px 0px 5px; border-radius: 10px; - border: none; + border-color: $nav_bd; background-color: $search_background; transition: background-color 300ms ease 0s; } @@ -2183,6 +2183,7 @@ img.mail-list-sender-photo { } /* nav bootstrap */ + nav i { font-size: 14px; } @@ -2211,11 +2212,11 @@ nav .dropdown-menu { } #usermenu-caret { - color: #999; + color: $nav_icon_colour; } #avatar:hover + #usermenu-caret { - color: #fff; + color: $nav_active_icon_colour; } /* bootstrap overrides */ @@ -2231,3 +2232,35 @@ blockquote { .dropdown-menu img { border-radius: $radiuspx; } + +.navbar-inverse { + background-image: -webkit-linear-gradient(top, $nav_gradient_top 0%, $nav_gradient_bottom 100%); + background-image: linear-gradient(to bottom, $nav_gradient_top 0%, $nav_gradient_bottom 100%); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=$nav_gradient_top, endColorstr=$nav_gradient_bottom, GradientType=0); + background-color: $nav_bg; + border-color: $nav_bd; +} + +.navbar-inverse .navbar-nav > .active > a { + background-image: -webkit-linear-gradient(top, $nav_active_gradient_top 0%, $nav_active_gradient_bottom 100%); + background-image: linear-gradient(to bottom, $nav_active_gradient_top 0%, $nav_active_gradient_bottom 100%); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=$nav_active_gradient_top, endColorstr=$nav_active_gradient_bottom, GradientType=0); +} + + +.navbar-inverse .navbar-nav > li > a { + color: $nav_icon_colour; + text-shadow: 0px 0px 0px; +} + +.navbar-inverse .navbar-nav > li > a:hover, +.navbar-inverse .navbar-nav > li > a:focus { + color: $nav_active_icon_colour; +} + +.navbar-inverse .navbar-nav > .active > a, +.navbar-inverse .navbar-nav > .active > a:hover, +.navbar-inverse .navbar-nav > .active > a:focus { + color: $nav_active_icon_colour; + background-color: $nav_bg; +} diff --git a/view/theme/redbasic/php/config.php b/view/theme/redbasic/php/config.php index 2235a9742..608a9bda7 100644 --- a/view/theme/redbasic/php/config.php +++ b/view/theme/redbasic/php/config.php @@ -7,7 +7,14 @@ function theme_content(&$a) { $arr['schema'] = get_pconfig(local_user(),'redbasic', 'schema' ); $arr['narrow_navbar'] = get_pconfig(local_user(),'redbasic', 'narrow_navbar' ); - $arr['nav_colour'] = get_pconfig(local_user(),'redbasic', 'nav_colour' ); + $arr['nav_bg'] = get_pconfig(local_user(),'redbasic', 'nav_bg' ); + $arr['nav_gradient_top'] = get_pconfig(local_user(),'redbasic', 'nav_gradient_top' ); + $arr['nav_gradient_bottom'] = get_pconfig(local_user(),'redbasic', 'nav_gradient_bottom' ); + $arr['nav_active_gradient_top'] = get_pconfig(local_user(),'redbasic', 'nav_active_gradient_top' ); + $arr['nav_active_gradient_bottom'] = get_pconfig(local_user(),'redbasic', 'nav_active_gradient_bottom' ); + $arr['nav_bd'] = get_pconfig(local_user(),'redbasic', 'nav_bd' ); + $arr['nav_icon_colour'] = get_pconfig(local_user(),'redbasic', 'nav_icon_colour' ); + $arr['nav_active_icon_colour'] = get_pconfig(local_user(),'redbasic', 'nav_active_icon_colour' ); $arr['link_colour'] = get_pconfig(local_user(),'redbasic', 'link_colour' ); $arr['banner_colour'] = get_pconfig(local_user(),'redbasic', 'banner_colour' ); $arr['bgcolour'] = get_pconfig(local_user(),'redbasic', 'background_colour' ); @@ -35,7 +42,14 @@ function theme_post(&$a) { if (isset($_POST['redbasic-settings-submit'])) { set_pconfig(local_user(), 'redbasic', 'schema', $_POST['redbasic_schema']); set_pconfig(local_user(), 'redbasic', 'narrow_navbar', $_POST['redbasic_narrow_navbar']); - set_pconfig(local_user(), 'redbasic', 'nav_colour', $_POST['redbasic_nav_colour']); + set_pconfig(local_user(), 'redbasic', 'nav_bg', $_POST['redbasic_nav_bg']); + set_pconfig(local_user(), 'redbasic', 'nav_gradient_top', $_POST['redbasic_nav_gradient_top']); + set_pconfig(local_user(), 'redbasic', 'nav_gradient_bottom', $_POST['redbasic_nav_gradient_bottom']); + set_pconfig(local_user(), 'redbasic', 'nav_active_gradient_top', $_POST['redbasic_nav_active_gradient_top']); + set_pconfig(local_user(), 'redbasic', 'nav_active_gradient_bottom', $_POST['redbasic_nav_active_gradient_bottom']); + set_pconfig(local_user(), 'redbasic', 'nav_bd', $_POST['redbasic_nav_bd']); + set_pconfig(local_user(), 'redbasic', 'nav_icon_colour', $_POST['redbasic_nav_icon_colour']); + set_pconfig(local_user(), 'redbasic', 'nav_active_icon_colour', $_POST['redbasic_nav_active_icon_colour']); set_pconfig(local_user(), 'redbasic', 'link_colour', $_POST['redbasic_link_colour']); set_pconfig(local_user(), 'redbasic', 'background_colour', $_POST['redbasic_background_colour']); set_pconfig(local_user(), 'redbasic', 'banner_colour', $_POST['redbasic_banner_colour']); @@ -60,8 +74,6 @@ function theme_post(&$a) { function redbasic_form(&$a, $arr) { - - $scheme_choices = array(); $scheme_choices["---"] = t("Default"); $files = glob('view/theme/redbasic/schema/*.php'); @@ -72,22 +84,6 @@ function redbasic_form(&$a, $arr) { $scheme_choices[$f] = $scheme_name; } } - - - $nav_colours = array ( - '' => t('Scheme Default'), - 'red' => 'red', - 'pink' => 'pink', - 'green' => 'green', - 'blue' => 'blue', - 'purple' => 'purple', - 'black' => 'black', - 'orange' => 'orange', - 'brown' => 'brown', - 'grey' => 'grey', - 'gold' => 'gold', - 'silver' => t('silver'), - ); if(feature_enabled(local_user(),'expert')) $expert = 1; @@ -100,7 +96,14 @@ if(feature_enabled(local_user(),'expert')) '$title' => t("Theme settings"), '$schema' => array('redbasic_schema', t('Set scheme'), $arr['schema'], '', $scheme_choices), '$narrow_navbar' => array('redbasic_narrow_navbar',t('Narrow navbar'),$arr['narrow_navbar']), - '$nav_colour' => array('redbasic_nav_colour', t('Navigation bar colour'), $arr['nav_colour'], '', $nav_colours), + '$nav_bg' => array('redbasic_nav_bg', t('Navigation bar background colour'), $arr['nav_bg']), + '$nav_gradient_top' => array('redbasic_nav_gradient_top', t('Navigation bar gradient top colour'), $arr['nav_gradient_top']), + '$nav_gradient_bottom' => array('redbasic_nav_gradient_bottom', t('Navigation bar gradient bottom colour'), $arr['nav_gradient_bottom']), + '$nav_active_gradient_top' => array('redbasic_nav_active_gradient_top', t('Navigation active button gradient top colour'), $arr['nav_active_gradient_top']), + '$nav_active_gradient_bottom' => array('redbasic_nav_active_gradient_bottom', t('Navigation active button gradient bottom colour'), $arr['nav_active_gradient_bottom']), + '$nav_bd' => array('redbasic_nav_bd', t('Navigation bar border colour '), $arr['nav_bd']), + '$nav_icon_colour' => array('redbasic_nav_icon_colour', t('Navigation bar icon colour '), $arr['nav_icon_colour']), + '$nav_active_icon_colour' => array('redbasic_nav_active_icon_colour', t('Navigation bar active icon colour '), $arr['nav_active_icon_colour']), '$link_colour' => array('redbasic_link_colour', t('link colour'), $arr['link_colour'], '', $link_colours), '$banner_colour' => array('redbasic_banner_colour', t('Set font-colour for banner'), $arr['banner_colour']), '$bgcolour' => array('redbasic_background_colour', t('Set the background colour'), $arr['bgcolour']), diff --git a/view/theme/redbasic/php/style.php b/view/theme/redbasic/php/style.php index 01e81eb53..9e6adb2a4 100644 --- a/view/theme/redbasic/php/style.php +++ b/view/theme/redbasic/php/style.php @@ -7,13 +7,15 @@ if(! $a->install) { if($uid) load_pconfig($uid,'redbasic'); -// Nav colours are mess. Set $nav_colour as a single word for the sake of letting folk pick one -// but it actually consists of at least two colours to form a gradient - $nav_bg_1 and $nav_bg_2 -// A further two - $nav_bg_3 and $nav_bg_4 are used to create the hover, if any particular scheme -// wants to implement that - $nav_colour = get_pconfig($uid, "redbasic", "nav_colour"); - // Load the owners pconfig + $nav_bg = get_pconfig($uid, "redbasic", "nav_bg"); + $nav_gradient_top = get_pconfig($uid, "redbasic", "nav_gradient_top"); + $nav_gradient_bottom = get_pconfig($uid, "redbasic", "nav_gradient_bottom"); + $nav_active_gradient_top = get_pconfig($uid, "redbasic", "nav_active_gradient_top"); + $nav_active_gradient_bottom = get_pconfig($uid, "redbasic", "nav_active_gradient_bottom"); + $nav_bd = get_pconfig($uid, "redbasic", "nav_bd"); + $nav_icon_colour = get_pconfig($uid, "redbasic", "nav_icon_colour"); + $nav_active_icon_colour = get_pconfig($uid, "redbasic", "nav_active_icon_colour"); $narrow_navbar = get_pconfig($uid,'redbasic','narrow_navbar'); $banner_colour = get_pconfig($uid,'redbasic','banner_colour'); $link_colour = get_pconfig($uid, "redbasic", "link_colour"); @@ -68,13 +70,22 @@ if(! $a->install) { //Set some defaults - we have to do this after pulling owner settings, and we have to check for each setting //individually. If we don't, we'll have problems if a user has set one, but not all options. - if (! $nav_colour) { - $nav_colour = "red"; - $nav_bg_1 = "#f88"; - $nav_bg_2 = "#b00"; - $nav_bg_3 = "#f00"; - $nav_bg_4 = "#b00"; - } + if (! $nav_bg) + $nav_bg = "#222"; + if (! $nav_gradient_top) + $nav_gradient_top = "#3c3c3c"; + if (! $nav_gradient_bottom) + $nav_gradient_bottom = "#222"; + if (! $nav_active_gradient_top) + $nav_active_gradient_top = "#222"; + if (! $nav_active_gradient_bottom) + $nav_active_gradient_bottom = "#282828"; + if (! $nav_bd) + $nav_bd = "#080808"; + if (! $nav_icon_colour) + $nav_icon_colour = "#999"; + if (! $nav_active_icon_colour) + $nav_active_icon_colour = "#fff"; if (! $link_colour) $link_colour = "#0080FF"; if (! $banner_colour) @@ -123,70 +134,20 @@ if(! $a->install) { $nav_float_min_opacity = (float) $nav_min_opacity; $nav_percent_min_opacity = (int) 100 * $nav_min_opacity; } - - -// Nav colours have nested values, so we have to define the actual variables -// used in the CSS from the higher level "red", "black", etc here - if ($nav_colour == "red") { - $nav_bg_1 = $nav_bg_3 = "#ba002f"; - $nav_bg_2 = $nav_bg_4 = "#ad002c"; - $search_background = "#EEEEEE"; - $active_colour = '#444444'; - } - - if ($nav_colour == "black") { - $nav_bg_1 = $nav_bg_3 = "#000"; - $nav_bg_2 = $nav_bg_4 = "#222"; - $search_background = '#EEEEEE'; - $active_colour = '#AAAAAA'; - } - if ($nav_colour == "silver") { - $nav_bg_1 = $nav_bg_2 = $nav_bg_3 = $nav_bg_4 = "silver"; - $search_background = '#EEEEEE'; - } - if($nav_colour === "pink") { - $nav_bg_1 = $nav_bg_3 = "#FFC1CA"; - $nav_bg_2 = $nav_bg_4 = "#FFC1CA"; - } - if($nav_colour === "green") { - $nav_bg_1 = $nav_bg_3 = "#5CD65C"; - $nav_bg_2 = $nav_bg_4 = "#5CD65C"; - } - if($nav_colour === "blue") { - $nav_bg_1 = $nav_bg_3 = "#1872a2"; - $nav_bg_2 = $nav_bg_4 = "#1872a2"; - } - if($nav_colour === "purple") { - $nav_bg_1 = $nav_bg_3 = "#551A8B"; - $nav_bg_2 = $nav_bg_4 = "#551A8B"; - } - if($nav_colour === "orange") { - $nav_bg_1 = $nav_bg_3 = "#FF3D0D"; - $nav_bg_2 = $nav_bg_4 = "#FF3D0D"; - } - if($nav_colour === "brown") { - $nav_bg_1 = $nav_bg_3 = "#330000"; - $nav_bg_2 = $nav_bg_4 = "#330000"; - } - if($nav_colour === "grey") { - $nav_bg_1 = $nav_bg_3 = "#2e2f2e"; - $nav_bg_2 = $nav_bg_4 = "#2e2f2e"; - } - if($nav_colour === "gold") { - $nav_bg_1 = $nav_bg_3 = "#FFAA00"; - $nav_bg_2 = $nav_bg_4 = "#FFAA00"; - } - // Apply the settings if(file_exists('view/theme/redbasic/css/style.css')) { $x = file_get_contents('view/theme/redbasic/css/style.css'); $options = array ( -'$nav_bg_1' => $nav_bg_1, -'$nav_bg_2' => $nav_bg_2, -'$nav_bg_3' => $nav_bg_3, -'$nav_bg_4' => $nav_bg_4, +'$nav_bg' => $nav_bg, +'$nav_gradient_top' => $nav_gradient_top, +'$nav_gradient_bottom' => $nav_gradient_bottom, +'$nav_active_gradient_top' => $nav_active_gradient_top, +'$nav_active_gradient_bottom' => $nav_active_gradient_bottom, +'$nav_bd' => $nav_bd, +'$nav_icon_colour' => $nav_icon_colour, +'$nav_active_icon_colour' => $nav_active_icon_colour, '$link_colour' => $link_colour, '$banner_colour' => $banner_colour, '$search_background' => $search_background, @@ -214,7 +175,6 @@ $options = array ( ); echo str_replace(array_keys($options), array_values($options), $x); - } if($sloppy_photos && file_exists('view/theme/redbasic/css/sloppy_photos.css')) { diff --git a/view/theme/redbasic/schema/BS-Default.php b/view/theme/redbasic/schema/BS-Default.php new file mode 100644 index 000000000..401045c7b --- /dev/null +++ b/view/theme/redbasic/schema/BS-Default.php @@ -0,0 +1,18 @@ + {{if $expert}} -{{* include file="field_select.tpl" field=$nav_colour *}} {{include file="field_checkbox.tpl" field=$narrow_navbar}} +{{include file="field_input.tpl" field=$nav_bg}} +{{include file="field_input.tpl" field=$nav_gradient_top}} +{{include file="field_input.tpl" field=$nav_gradient_bottom}} +{{include file="field_input.tpl" field=$nav_active_gradient_top}} +{{include file="field_input.tpl" field=$nav_active_gradient_bottom}} +{{include file="field_input.tpl" field=$nav_bd}} +{{include file="field_input.tpl" field=$nav_icon_colour}} +{{include file="field_input.tpl" field=$nav_active_icon_colour}} {{include file="field_input.tpl" field=$banner_colour}} {{include file="field_input.tpl" field=$link_colour}} {{include file="field_input.tpl" field=$bgcolour}} -- cgit v1.2.3