Commit edc2bec8 authored by Jen Zajac's avatar Jen Zajac Committed by Aaron Wells
Browse files

Custom theme reworking (Bug 1496139)

New template inherits from raw as before but limits major colour
changes to the site header. Because there are fewer configurable
options after the upgrade, some options from before the upgrade
are discarded.

behatnotneeded: Can't test upgrade-related issues

Bug #1496139
(For ref, original feature was BUG 814354)

Change-Id: I29e9d215019916102ea47ad53678aaec97796bca
parent ddd420a6
......@@ -30,18 +30,12 @@ $limit = 20;
$customthemedefaults = array(
'background' => array('type' => 'color', 'value' => '#182768'),
'background' => array('type' => 'color', 'value' => '#530E53'),
'backgroundfg' => array('type' => 'color', 'value' => '#FFFFFF'),
'link' => array('type' => 'color', 'value' => '#d66800'),
'headings' => array('type' => 'color', 'value' => '#182768'),
'sidebarbg' => array('type' => 'color', 'value' => '#182768'),
'sidebarfg' => array('type' => 'color', 'value' => '#f1f2f8'),
'sidebarlink' => array('type' => 'color', 'value' => '#182768'),
'navbg' => array('type' => 'color', 'value' => '#f6871f'),
'link' => array('type' => 'color', 'value' => '#255ECC'),
'headings' => array('type' => 'color', 'value' => '#530E53'),
'navbg' => array('type' => 'color', 'value' => '#8A458A'),
'navfg' => array('type' => 'color', 'value' => '#FFFFFF'),
'subbg' => array('type' => 'color', 'value' => '#fff4ea'),
'subfg' => array('type' => 'color', 'value' => '#14336F'),
'rowbg' => array('type' => 'color', 'value' => '#fff4ea'),
);
if (!$USER->get('admin')) {
......@@ -1126,24 +1120,16 @@ function search_submit(Pieform $form, $values) {
// Hide/disable options based on theme selected
$themeoptionsjs = '
jQuery(function($) {
if ($("#institution_theme").val() == "sitedefault") {
$("#institution_dropdownmenu").attr("disabled", true);
$("#institution_dropdownmenu").attr("checked", false);
if ($("#institution_theme").val() === "custom") {
$(".customtheme").removeClass("js-hidden");
}
$("#institution_theme").change(function() {
if ($(this).value == "custom") {
if ($(this).val() === "custom") {
$(".customtheme").removeClass("js-hidden");
}
else {
$(".customtheme").addClass("js-hidden");
}
if ($(this).value == "sitedefault") {
$("#institution_dropdownmenu").attr("disabled", true);
$("#institution_dropdownmenu").attr("checked", false);
}
else {
$("#institution_dropdownmenu").removeAttr("disabled");
}
});
});
';
......
......@@ -916,9 +916,9 @@ $string['logodescription'] = 'You can upload an image here that will be displaye
$string['deletelogo'] = 'Delete logo';
$string['deletelogodescription1'] = 'If set to "Yes", revert to the standard header logo for your institution\'s theme.';
$string['customtheme'] = 'Custom theme configuration';
$string['customtheme.background'] = 'Background';
$string['customtheme.backgroundfg'] = 'Text on background';
$string['customtheme.link'] = 'Link';
$string['customtheme.background'] = 'Header background';
$string['customtheme.backgroundfg'] = 'Text on header background';
$string['customtheme.link'] = 'Links';
$string['customtheme.headings'] = 'Headings';
$string['customtheme.navbg'] = 'Navigation background';
$string['customtheme.navfg'] = 'Navigation text';
......
......@@ -4093,7 +4093,7 @@ function xmldb_core_upgrade($oldversion=0) {
if ($oldversion < 2015042800) {
log_debug('Clear Dwoo cache of unescaped institution names');
require_once(get_config('libroot').'dwoo/dwoo/Dwoo/Core.php');
require_once('dwoo/dwoo/dwooAutoload.php');
@unlink(get_config('dataroot') . 'dwoo/compile/default' . get_config('docroot') . 'theme/raw/' . 'templates/view/accesslistrow.tpl.d'.Dwoo_Core::RELEASE_TAG.'.php');
@unlink(get_config('dataroot') . 'dwoo/compile/default' . get_config('docroot') . 'theme/raw/' . 'templates/admin/users/accesslistitem.tpl.d'.Dwoo_Core::RELEASE_TAG.'.php');
}
......@@ -4196,5 +4196,28 @@ function xmldb_core_upgrade($oldversion=0) {
install_system_portfolio_view();
}
if ($oldversion < 2015091700) {
log_debug('Update cached customizable theme CSS');
$styles = get_records_array('institution', 'theme', 'custom', 'id', 'displayname, style');
if ($styles) {
foreach ($styles as $newinstitution) {
$styleid = $newinstitution->style;
$properties = array();
$record = (object) array('style' => $styleid);
$proprecs = get_records_array('style_property', 'style', $styleid, 'field', 'field, value');
foreach ($proprecs as $p) {
$properties[$p->field] = $p->value;
}
// Update the css
$smarty = smarty_core();
$smarty->assign('data', $properties);
set_field('style', 'css', $smarty->fetch('customcss.tpl'), 'id', $styleid);
}
}
}
return $status;
}
......@@ -16,7 +16,7 @@ $config = new stdClass();
// See https://wiki.mahara.org/index.php/Developer_Area/Version_Numbering_Policy
// For upgrades on stable branches, increment the version by one. On master, use the date.
$config->version = 2015082500;
$config->version = 2015091700;
$config->series = '15.10';
$config->release = '15.10dev';
$config->minupgradefrom = 2009022600;
......
/*
Additional styles for the configurable theme.
The bulk of the styles live in htdocs/theme/raw/templates/customcss.tpl
*/
<?php
/**
*
* @package mahara
* @subpackage core
* @author Catalyst IT Ltd
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL version 3 or later
* @copyright For copyright information on Mahara, please see the README file distributed with this software.
*/
$theme = new stdClass();
$theme->displayname = 'Configurable Theme';
$theme->parent = 'raw';
/* If we are using normal CSS, this should be false. If we are using SASS, it should be true. */
$theme->overrideparentcss = false;
/* Allow skins to be used on this theme */
$theme->skins = true;
/* Limit this theme to certain institutions */
// $theme->institutions = array('institution_a', 'institution_b');
body {
{* this template powers the css that is stored in the database for the configurable theme *}
.header.navbar,
.dashboard-widget-container .circle-bg,
.dashboard-widget-container .logged-in .widget-detail,
.modal-docked .modal-header,
.modal-header {
background: {$data.background};
}
.navbar.header {
border-color: {$data.background};
}
@media (max-width: 767px) {
.top-nav.navbar-nav {
/* 1px alpha channel black to darken by 25% */
background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3wkPAhEFWvh1jAAAAA1JREFUCNdjYGBgcAAAAEUAQT9reqQAAAAASUVORK5CYII=') {$data.background};
}
}
.dashboard-widget-container .widget-heading {
border-top-color: {$data.background};
}
.dashboard-widget-container .logged-in .widget-heading p,
a.panel-footer:hover .icon.pull-right,
.modal-docked .modal-header .close:hover .times,
.modal-docked .modal-header .close:focus .times {
color: {$data.background};
}
@media (max-width: 767px) {
.dashboard-widget-container .logged-in .widget-detail p,
.dashboard-widget-container .logged-in:hover .widget-detail p {
color: {$data.backgroundfg};
}
}
.header.navbar,
.header.navbar-default .navbar-text,
.header.navbar-default .navbar-nav > li > a,
.dashboard-widget-container .logged-in .widget-detail,
.modal-docked .modal-header,
.modal-header,
.close,
.modal-header .close:focus .times,
.modal-header .close:hover .times,
.search-toggle {
color: {$data.backgroundfg};
}
.navbar-default .navbar-toggle .icon-bar {
background-color: {$data.backgroundfg};
}
.close {
text-shadow: none;
}
h1,
h2,
h3,
h4,
h5,
h6 {
h6,
.title a {
color: {$data.headings};
}
.modal-header h1,
.modal-header h2,
.modal-header h3,
.modal-header h4,
.modal-header h5,
.modal-header h6 {
color: {$data.backgroundfg};
}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:focus,
.nav-tabs > li.active > a:hover,
.nav-tabs.nav li > a:focus,
.nav-tabs.nav li > a:hover {
color: {$data.headings};
border-bottom-color: {$data.headings};
}
a,
a:visited,
a:link,
a:active,
a:hover,
a:focus {
a:focus,
.list-group-item-link a:hover,
.form-group.submitcancel .cancel,
.form-group.submitcancel .cancel:hover,
.list-group a.text-link,
.text-link,
.list-group-item-heading a:hover,
.list-group-item-heading a:hover .metadata,
.arrow-bar .nav-inpage.nav > li > a,
.arrow-bar .nav-inpage.nav > li > button,
.nav-inpage.nav > li.active > a:focus,
.nav-inpage.nav > li.active > a:hover,
.nav-inpage.nav > li.active > button:focus,
.nav-inpage.nav > li.active > button:hover {
color: {$data.link};
}
.title a {
color: {$data.headings};
.btn-primary {
background: {$data.background};
border-color: {$data.background};
}
.btn-primary.active,
.btn-primary.focus,
.btn-primary:active,
.btn-primary:focus,
.btn-primary:hover,
.open > .btn-primary.dropdown-toggle {
/* 1px alpha channel white to lighten by 12% */
background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3wkPAic6ZYLJxAAAAA1JREFUCNdj+P//vzwACRsDHRWss5MAAAAASUVORK5CYII=') {$data.background};
}
.btn-primary.btn:disabled,
.btn-primary.disabled,
.btn-primary[disabled] {
/* 1px alpha channel white to lighten by 25% */
background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3wkPAhMnva5W6gAAAA1JREFUCNdj+P//vz0ACTsDPd3TBh4AAAAASUVORK5CYII=') {$data.background};
border-color: {$data.background};
}
.main-nav {
background: {$data.navbg};
}
.r0,
.r0 td,
.d0,
.r1,
.r1 td,
.d1 {
background-color: {$data.rowbg};
.main-nav li a,
.main-nav li a:link,
.main-nav li a:visited,
.main-nav li a:active,
.main-nav li a:hover,
.main-nav li a:focus,
.navbar-inverse .navbar-nav > li > a:focus,
.navbar-inverse .navbar-nav > li > a:hover {
color: {$data.navfg};
}
.linkbtn {
color: {$data.link};
.main-nav .dropdown-nav-home li a,
.main-nav .dropdown-nav-home li a:link,
.main-nav .dropdown-nav-home li a:active,
.main-nav .dropdown-nav-home li a:visited,
.main-nav .dropdown-nav-home li a:hover,
.main-nav .dropdown-nav-home li a:focus {
color: {$data.headings};
}
#header-right label {
@media (max-width: 767px) {
.navbar-inverse .navbar-nav > .active > a,
.navbar-inverse .navbar-nav > .active > a:focus,
.navbar-inverse .navbar-nav > .active > a:hover,
.navbar-showchildren.collapsed .icon {
color: {$data.navfg};
}
.main-nav .child-nav a {
color: #333 !important;
}
.main-nav .nav > li > a {
border-top-color: transparent;
border-bottom-color: transparent;
}
}
#sub-nav.navbar-default .navbar-nav > .active > a,
#sub-nav.navbar-default .navbar-nav > .active > a:link,
#sub-nav.navbar-default .navbar-nav > .active > a:visited {
background: {$data.background};
color: {$data.backgroundfg};
border-radius: 3px;
}
#right-nav li a,
#right-nav li.identity a {
color: {$data.backgroundfg};
#sub-nav.navbar-default .navbar-nav > .active > a:active,
#sub-nav.navbar-default .navbar-nav > .active > a:hover {
background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3wkPAhMnva5W6gAAAA1JREFUCNdj+P//vz0ACTsDPd3TBh4AAAAASUVORK5CYII=') {$data.background};
}
.viewheadertop #mainnav-container #mainnav a,
.viewheadertop #mainnav-container #mainnav a:link,
.viewheadertop #mainnav-container #mainnav a:visited,
.viewheadertop #mainnav-container #mainnav a:active,
.viewheadertop #mainnav-container #mainnav a:hover {
color: {$data.backgroundfg};
#sub-nav.navbar-default .navbar-nav > li > a:focus,
#sub-nav.navbar-default .navbar-nav > li > a:hover {
color: {$data.background};
background: transparent;
}
.main-nav ul {
background: {$data.navbg};
.arrow-bar {
background-color: #F1F1F1;
}
.main-nav li a,
.main-nav li a:link,
.main-nav li a:visited,
.main-nav li a:active,
.main-nav li a:hover, .main-nav li a:focus {
color: {$data.navfg};
.arrow-bar .arrow {
background-color: #DBDBDB;
}
.arrow-bar .arrow:after {
border-left-color: #DBDBDB;
}
.main-nav li.selected a,
.main-nav li.selected a:link,
.main-nav li.selected a:visited,
.main-nav li.selected a:active,
.main-nav li.selected a:hover {
color: {$data.subfg};
background: {$data.subbg};
}
#sub-nav {
background-color: {$data.subbg};
}
#sub-nav li a,
#sub-nav li a:link,
#sub-nav li a:visited,
#sub-nav li a:active,
#sub-nav li a:hover {
color: {$data.subfg};
}
.main-nav .dropdown-sub li a,
.main-nav .dropdown-sub li a:link,
.main-nav .dropdown-sub li a:visited,
.main-nav .dropdown-sub li a:active {
color: {$data.navfg} !important;
background: {$data.navbg} !important;
}
.main-nav .dropdown-sub li a:hover, .main-nav .dropdown-sub li a:focus {
color: {$data.subfg} !important;
background: {$data.subbg} !important;
}
.sideblock {
background-color: {$data.sidebarbg};
}
.sideblock .sidebar-content {
background: {$data.sidebarfg};
}
.sideblock h3,
.sideblock h3 a,
.sideblock h3 a:link,
.sideblock h3 a:visited,
.sideblock h3 a:active,
.sideblock h3 a:hover,
.sideblock #lastminutes {
color: {$data.sidebarfg};
}
.sideblock .sidebar-content a,
.sideblock .sidebar-content a:link,
.sideblock .sidebar-content a:visited,
.sideblock .sidebar-content a:active,
.sideblock .sidebar-content a:hover,
#quota_used,
#quota_total {
color: {$data.sidebarlink};
}
#footer-wrap,
#footer a,
#footer a:link,
#footer a:visited,
#footer a:active,
#footer a:hover {
header.header .header-search-form .form-control {
background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3wkPAic6ZYLJxAAAAA1JREFUCNdj+P//vzwACRsDHRWss5MAAAAASUVORK5CYII=') {$data.background};
border: 0px none;
color: {$data.backgroundfg};
}
ul.colnav li a,
ul.colnav li a:link,
ul.colnav li a:visited,
ul.colnav li a:active {
color: {$data.navfg} !important;
background: {$data.navbg} !important;
}
\ No newline at end of file
header.header .header-search-form .form-control:focus {
background-color: {$data.backgroundfg};
color: {$data.background};
}
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment