Skip to content
GitLab
Commit bbfb90e2 authored by Evonne Cheung's avatar Evonne Cheung Committed by Cecilia Vela Gurovic
Browse files

Bug 1765276: Fixing subtheme inheritance 

behatnotneeded

Change-Id: Id9720bcebf690ca9c32e7fead9fd8252a5849ad4
parent ec17b5f1
Hide whitespace changes
Inline Side-by-side
htdocs/theme/default/sass/components/_list-group.scss
View file @ bbfb90e2
......@@ -3,7 +3,7 @@
color: $link-color;
&:hover {
color: $link-hover-color;
background-color: rgba(#9db577, 0.1);
background-color: scale-color($theme-primary-color, $lightness: 90%);
}
}
}
......
htdocs/theme/default/sass/components/_toggles.scss 0 → 100644
View file @ bbfb90e2
// Navigation toggle styles
.nav-toggle-area {
.user-icon {
&:hover,
&:focus {
color: $navbar-toggle-hover-color;
background-color: $navbar-toggle-hover-bg;
}
}
}
.navbar-toggle {
color: $navbar-toggle-color;
background-color: $navbar-toggle-bg;
background-image: none;
border: 1px solid transparent;
&:hover,
&:focus {
color: $navbar-toggle-hover-color;
background-color: $navbar-toggle-hover-bg;
}
&.collapsed {
background-color: transparent;
&:hover,
&:focus {
color: $navbar-toggle-hover-color;
background-color: $navbar-toggle-hover-bg;
}
}
&.search-toggle {
@include media-breakpoint-up(md) {
display: none;
}
.icon {
color: $navbar-toggle-color;
background-color: $navbar-toggle-bg;
}
}
&.user-toggle {
color: $navbar-toggle-color;
background-color: $navbar-toggle-bg;
@include media-breakpoint-up(md) {
border-left-width: 1px;
}
&:hover,
&:focus {
color: $navbar-toggle-hover-color;
background-color: $navbar-toggle-hover-bg;
}
}
&:last-of-type {
border-left-width: 1px;
}
}
// navbar menu children toggles
.nav {
.navbar-showchildren {
color: $navbar-inverse-toggle-color;
background: $navbar-inverse-toggle-bg;
border: 0;
&:hover,
&:focus {
background: $navbar-inverse-toggle-hover-bg;
.icon {
color: $navbar-inverse-toggle-hover-color;
}
}
.active & {
background-color: $navbar-inverse-toggle-active-bg;
.icon {
color: $navbar-inverse-toggle-active-color;
}
}
}
}
htdocs/theme/default/sass/features/_dashboard-widget.scss
View file @ bbfb90e2
......@@ -72,7 +72,7 @@ $logged-in-height-mobile: 125px;
}
.icon {
color: #9db577;
color: scale-color($theme-primary-color, $lightness: 60%);
padding-top:16px;
font-size: 72px;
......@@ -177,7 +177,7 @@ $logged-in-height-mobile: 125px;
vertical-align: middle;
display: block;
z-index: 2;
background-color: #423017;
background-color: #333333;
height: $logged-in-height;
width: $logged-in-height;
border-radius: 50%;
......
htdocs/theme/default/sass/layout/_footer.scss
View file @ bbfb90e2
.footer {
background: #799152;
color: #2e3a1c;
background-color: $site-footer-bg;
.footer-inner {
padding: 20px 10px;
.footer-nav {
> li {
> a {
color: #2e3a1c;
font-weight: 700;
&:hover {
background-color: transparent;
color: #FFFFFF;
}
}
.nav-link {
color: $site-footer-color;
font-weight: 700;
&:hover,
&:focus {
background-color: $site-footer-hover-bg;
color: $site-footer-hover-color;
}
}
.metadata {
color: #2e3a1c;
color: $site-footer-color;
}
}
&.upgrade-footer a {
font-weight: 700;
color: #2e3a1c;
}
}
......
htdocs/theme/default/sass/layout/_profile-block.scss
View file @ bbfb90e2
......@@ -14,7 +14,7 @@
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
.card-header {
background-color: #2e3a1c;
background-color: $theme-secondary-color;
}
}
.card .list-group {
......
htdocs/theme/default/sass/layout/card/_card-footer.scss
View file @ bbfb90e2
a.card-footer {
color: $link-color;
background-color: $card-footer-bg;
&:focus,
&:hover {
background-color: #f1f6eb;
background-color: scale-color($theme-primary-color, $lightness: 95%);
color: $link-hover-color;
}
}
......
htdocs/theme/default/sass/layout/card/_card-header.scss
View file @ bbfb90e2
......@@ -26,7 +26,7 @@
color: #FFFFFF;
.help a .icon {
color: $theme-primary-color-light;
color: #FFFFFF;
}
a {
......
htdocs/theme/default/sass/layout/card/_card-secondary.scss
View file @ bbfb90e2
......@@ -12,7 +12,7 @@
&.card {
.card-header {
border-color: #9db577;
border-color: $card-secondary-border;
font-family: $font-family-sans-serif;
padding-left: 0;
padding-right: 0;
......
htdocs/theme/default/sass/layout/nav/_main-nav.scss 0 → 100644
View file @ bbfb90e2
.navbar-main {
.navbar-collapse {
border: 1px solid $navbar-default-link-border;
@include media-breakpoint-down(sm) {
border-width: 1px 0 0 0;
}
&.navbar-form {
border: 0;
}
}
// Top level navigation items use colour variables from "navbar-default"
.navbar-nav {
> li > a {
color: $navbar-default-link-color;
background-color: $navbar-default-link-bg;
border-top: 1px solid $navbar-default-link-border;
border-bottom: 1px solid $navbar-default-link-border;
&:hover,
&:focus {
background-color: $navbar-default-link-hover-bg;
color: $navbar-default-link-hover-color;
}
@include media-breakpoint-up(md) {
border: 1px solid $navbar-default-link-border;
}
}
> .active > a {
background-color: $navbar-default-active-bg;
color: $navbar-default-active-color;
&:hover,
&:focus {
background-color: $navbar-default-active-bg;
color: $navbar-default-active-color;
}
}
}
// Child navigation items
.child-nav {
li > a {
color: $navbar-inverse-link-color;
background-color: $navbar-inverse-bg;
&:hover,
&:focus {
background-color: $navbar-inverse-link-hover-bg;
color: $navbar-inverse-link-hover-color;
}
}
.active > a {
background-color: $navbar-inverse-link-active-bg;
color: $navbar-inverse-link-active-color;
&:hover,
&:focus {
background-color: $navbar-inverse-link-hover-bg;
color: $navbar-inverse-link-hover-color;
}
}
}
}
htdocs/theme/default/sass/layout/nav/_nav-tabs.scss
View file @ bbfb90e2
.nav-tabs {
border-bottom: 2px solid #bc9f54;
border-bottom: 2px solid $theme-accent-color;
&.nav {
li > a {
font-weight: 400;
border: 0;
border-bottom: 1px solid #bc9f54;
color: #423017;
border-bottom: 1px solid $theme-accent-color;
color: $theme-text-color;
&:focus,
&:hover {
border: 0;
border-bottom: 1px solid #bc9f54;
background-color: scale-color(#bc9f54, $lightness: 35%);
color: #423017;
border-bottom: 1px solid $theme-accent-color;
background-color: scale-color($theme-accent-color, $lightness: 70%);
color: $theme-text-color;
}
&.active {
background-color: scale-color(#bc9f54, $lightness: 25%);
color: #423017;
background-color: scale-color($theme-accent-color, $lightness: 60%);
color: $theme-text-color;
border: 0;
border-bottom: 1px solid #bc9f54;
border-bottom: 1px solid $theme-accent-color;
&:focus,
&:hover {
background-color: scale-color(#bc9f54, $lightness: 10%);
color: #423017;
background-color: scale-color($theme-accent-color, $lightness: 70%);
color: $theme-text-color;
border: 0;
border-bottom: 1px solid #bc9f54;
border-bottom: 1px solid $theme-accent-color;
}
}
}
......
htdocs/theme/default/sass/utilities/_custom-variables.scss
View file @ bbfb90e2
......@@ -11,49 +11,54 @@ $arrow-link-background-color: #fff;
// color for the secondary title in sections (cf. groups)
$section-heading-color: #999;
$admin-title-color: theme-color("primary");
$admin-title-bg: theme-color("primary");
$section-heading-color: #999;
$admin-title-color: theme-color("primary");
$admin-title-bg: theme-color("primary");
$dashboard-widget-bg: theme-color("primary");
$dashboard-widget-color: #FFFFFF;
$dashboard-widget-bg: theme-color("primary");
$dashboard-widget-color: #FFFFFF;
$help-icon-color: #5b8fc8;
$help-icon-color: #5b8fc8;
// Pages and collections page header
$pageheader-bg: #f0f5ea;
$pageheader-bg: #f0f5ea;
// Site footer background colors
$site-footer-bg: scale-color($theme-secondary-color, $lightness: 70%);
$site-footer-color: $theme-secondary-color;
$site-footer-hover-color: $theme-secondary-color;
$site-footer-hover-bg: transparent;
// LEGACY BOOTSTRAP 3 VARIABLES
// Header navbar
// Site header
$navbar-default-bg: #fff;
$navbar-default-border: transparent;
// Navbar toggle
$navbar-toggle-color: $link-color;
$navbar-toggle-color: $theme-primary-color;
$navbar-toggle-bg: #fff;
$navbar-toggle-hover-color: $link-color;
$navbar-toggle-hover-bg: #f1f6eb;
$navbar-toggle-active-color: $link-color;
$navbar-toggle-active-bg: #f1f6eb;
$navbar-toggle-hover-color: $theme-primary-color;
$navbar-toggle-hover-bg: scale-color($theme-primary-color, $lightness: 90%);
$navbar-toggle-active-color: $theme-primary-color;
$navbar-toggle-active-bg: scale-color($theme-primary-color, $lightness: 90%);
// Navbar menu
$navbar-default-link-border: $link-hover-color;
$navbar-default-link-border: scale-color($theme-primary-color, $lightness: 5%);
$navbar-default-link-color: #FFF;
$navbar-default-link-hover-color: #FFF;
$navbar-default-link-bg: $theme-primary-color;
$navbar-default-link-hover-bg: #637e3a;
$navbar-default-link-hover-bg: scale-color($theme-primary-color, $lightness: 6%);
$navbar-default-active-color: #FFF;
$navbar-default-active-bg: #3a4a22;
$navbar-default-active-bg: scale-color($theme-primary-color, $lightness: -30%);
// Navbar menus children
$navbar-inverse-bg: $link-hover-color;
$navbar-inverse-bg: scale-color($theme-primary-color, $lightness: 10%);
$navbar-inverse-link-color: #FFFFFF;
$navbar-inverse-link-hover-color: #FFFFFF;
$navbar-inverse-link-hover-bg: scale-color($link-hover-color, $lightness: 5%);
$navbar-inverse-link-hover-bg: scale-color($theme-primary-color, $lightness: 15%);
$navbar-inverse-link-active-color: #FFFFFF;
$navbar-inverse-link-active-bg: $link-hover-color;
$navbar-inverse-link-active-bg: scale-color($theme-primary-color, $lightness: 10%);
// Navbar menu children toggles
$navbar-inverse-toggle-color: #FFF;
......@@ -88,8 +93,8 @@ $btn-primary-border: #556d32;
// cards
//** Border color for elements within cards
$card-footer-bg: #f0f5ea;
$card-header-bg: #fff;
$card-border-color: #d9d9d9;
$card-header-bg: #fff;
$card-footer-bg: scale-color($theme-primary-color, $lightness: 90%);
$card-border: #d9d9d9;
$card-header-bg: #FFFFFF;
$card-secondary-border: scale-color($theme-primary-color, $lightness: 70%);
htdocs/theme/default/sass/utilities/_index.scss
View file @ bbfb90e2
......@@ -16,6 +16,7 @@
@import "../layout/card/card";
// Navigation
@import "../layout/nav/main-nav";
@import "../layout/nav/nav-tabs";
// Components - small reusable design elements
......@@ -23,6 +24,7 @@
@import "../components/btn";
@import "../components/indicator";
@import "../components/list-group";
@import "../components/toggles";
// Feature related sass. We avoid this where we can in favour of reusable components
@import "../features/dashboard-widget";
......
htdocs/theme/default/sass/utilities/_theme-variables.scss
View file @ bbfb90e2
......@@ -2,15 +2,10 @@
* Theme colours should be defined here, and (ideally) used only in the global variables file (bootstrap-variables)
*/
$theme-primary-color: #556d32;
$theme-primary-color-dark: #2e3a1c;
$theme-primary-color-light: #799152;
$theme-text-color: #333333;
$theme-accent-color: #6e5e31;
$theme-primary-color: #556d32; // mid green
$theme-secondary-color: #2e3a1c; // dark green
$theme-text-color: #333333; // black
$theme-text-midtone-color: #666666; // mid gray
$theme-text-lighttone-color: #767676; // light gray (still passes contrast standards on white)
$theme-text-lighttone-color: #767676;
$theme-text-midtone-color: #666666;
// Navbar message notification count
$navbar-notification-count-bg: #FC9F1A;
$navbar-notification-count-text: #000000;
$theme-accent-color: #6e5e31; // mid brown
htdocs/theme/modern/sass/_custom.scss
View file @ bbfb90e2
......@@ -2,7 +2,7 @@
&.text-danger,
&.text-success,
&.text-warning {
color: $text-color;
color: $theme-text-color;
}
}
......@@ -15,7 +15,7 @@
// Lighten the Administration link in the menu bar in the admin area
div.admin-title a {
color:#4DB1D6;
color:#FFFFFF;
}
.loggedout {
......
htdocs/theme/modern/sass/components/_arrow-bar.scss
View file @ bbfb90e2
.arrow-bar {
background-color: #157c62;
background-color: $arrow-bar-bg;
.arrow {
background-color: $arrow-color;
&:after {
border-left: 14px solid $arrow-color;
}
.text {
color: #FFF;
color: $arrow-text-color;
}
}
.nav-inpage.nav {
li {
a {
color: #FFF;
&:hover {
color: #FFF;
background-color: $accent-color;
}
}
button {
color: #FFF;
&:hover {
color: #FFF;
background-color: $accent-color;
text-decoration: none;
}
}
.nav-inpage {
&.nav > li {
> a, button {
color: $arrow-link-color;
&:hover,
&:focus {
background: scale-color($arrow-bar-bg, $lightness: 5%);
color: $arrow-link-hover-color;
}
&.active a,
&.active button {
background-color: #FFF;
color: #333;
}
&.active > a,
&.active > button {
color: $theme-text-color;
background: $arrow-link-background-color;
&:hover,
&:focus {
color: $arrow-link-active-color;
}
}
}
......
htdocs/theme/modern/sass/components/_btn.scss
View file @ bbfb90e2
......@@ -2,7 +2,7 @@
&.btn {
border-color: $danger;
color: $danger;
background-color: lighten($danger, 35%);
background-color: scale-color($danger, $lightness: 70%);
&:hover,
&:focus {
color:#FFFFFF;
......@@ -15,7 +15,7 @@
&.btn-toolbar {
&.btn-group-top{
.active {
background-color: $primary;
background-color: $theme-primary-color;
color: #FFF;
}
}
......@@ -32,7 +32,7 @@
font-family: $font-family-sans-serif;
&:hover {
background-color: darken($btn-primary-bg, 5%);
background-color: scale-color($btn-primary-bg, $lightness: -5%);
}
.mce-txt {
......@@ -54,7 +54,7 @@
color: $btn-primary-color;
&:hover {
background-color: darken($btn-primary-bg, 5%);
background-color: scale-color($btn-primary-bg, $lightness: -5%);
}
}
}
......
htdocs/theme/modern/sass/components/_toggles.scss 0 → 100644
View file @ bbfb90e2
// Navigation toggle styles
.nav-toggle-area {
.user-icon {
&:hover,
&:focus {
color: $navbar-toggle-hover-color;
background-color: $navbar-toggle-hover-bg;
}
}
}
.navbar-toggle {
color: $navbar-toggle-color;
background-color: $navbar-toggle-bg;
background-image: none;
border: 1px solid transparent;
&:hover,
&:focus {
color: $navbar-toggle-hover-color;
background-color: $navbar-toggle-hover-bg;
}
&.collapsed {
background-color: transparent;
&:hover,
&:focus {
color: $navbar-toggle-hover-color;
background-color: $navbar-toggle-hover-bg;
}
}
&.search-toggle {
@include media-breakpoint-up(md) {
display: none;
}
.icon {
color: $navbar-toggle-color;
background-color: $navbar-toggle-bg;
}
}
&.user-toggle {
color: $navbar-toggle-color;
background-color: $navbar-toggle-bg;
@include media-breakpoint-up(md) {
border-left-width: 1px;
}
&:hover,
&:focus {
color: $navbar-toggle-hover-color;