Commit 5a0aba99 authored by Pat Kira's avatar Pat Kira Committed by Robert Lyon

Amend text colour class names

Task no: 23515
Modify subthemestarter to inherit these value properly
behatnotneeded: Styling only

Change-Id: I61e1d976e4075eadad5d206820b219fdff3a7545
parent 25350dd7
......@@ -346,7 +346,7 @@ EOF;
'type' => 'html',
'class' => $readonly ? '' : 'hidden',
'title' => get_string('blockcontent', 'blocktype.internal/textbox'),
'value' => '<div id="instconf_textreadonly_display" class="well text-medium">' . $text . '</div>',
'value' => '<div id="instconf_textreadonly_display" class="well text-midtone">' . $text . '</div>',
),
'makecopy' => array(
'type' => 'checkbox',
......
......@@ -58,7 +58,9 @@ If you want more flexibility, and you are comfortable with Sass and Gulp (or are
* `sass/utilities/_bootstrap-variables.scss` - the original variables file from Bootstrap. Here you can assign your theme variables to Bootstrap's component-based variables.
* `sass/utilities/_custom-variables.scss` - like the Bootstrap's variables file but for custom components.
Now you need to edit your `sass/style.scss` to point at your theme's copies of these files. For any file that you have copied, you need to change the start of the path from `../../raw/sass/utilities/` to `utilities/`.
You need to edit your copies so that every mention of [`!default`](http://sass-lang.com/documentation/file.SASS_REFERENCE.html#variable_defaults_) is removed. This is so your new values properly override the default ones you inherit from raw.
Now you need to edit your `sass/style.scss` to point at your theme's copies of these files. For any file that you have copied, add a new line that includes your new files (leave the import of raw versions).
5. `_custom.scss` is optional. It is a place for any small bits of CSS that don't warrant creating a new file to include, or for custom overrides of the existing components. If you don't want to use it, delete your new copy and remember to remove the reference to it from `style.scss`!
......
......@@ -110,7 +110,7 @@
</span>
{if $PAGEHELPNAME}<span class="page-help-icon">{$PAGEHELPICON|safe}</span>{/if}
{if $publicgroup && $rsswithtitle}
<a href="{$feedlink}" class="text-orange text-small pull-right ">
<a href="{$feedlink}" class="mahara-rss-icon text-small pull-right ">
<span class="icon-rss icon icon-lg"></span>
</a>
{/if}
......
......@@ -39,7 +39,7 @@
<span class="icon icon-check-square-o icon-lg text-success prs"></span>
<span class="sr-only">{str tag=completed section=artefact.plans}</span>
{else}
<span class="icon-square-o icon icon-lg text-light prs icon-placeholder"></span>
<span class="icon-square-o icon icon-lg text-lighttone prs icon-placeholder"></span>
<span class="sr-only">{str tag=incomplete section=artefact.plans}</span>
{/if}
......
{foreach from=$items item=item}
<li class="list-group-item">
<li class="list-group-item text-midtone">
<a href="{$item.url}" class="outer-link">
<span class="sr-only">{$item.name|str_shorten_text:60:true}</span>
</a>
......
......@@ -137,7 +137,7 @@
<ul id="groupviewlist" class="list-group list-unstyled list-group-unbordered">
{if $mysubmitted}
{foreach from=$mysubmitted item=item}
<li class="list-group-item {if $item.submittedstatus != '2'}pbm{/if}">
<li class="list-group-item text-midtone {if $item.submittedstatus != '2'}pbm{/if}">
<span>
{if $item.submittedtime}
{str tag=youhavesubmittedon section=view arg1=$item.url arg2=$item.name arg3=$item.submittedtime|format_date}
......
{foreach from=$items item=view}
<li class="list-group-item">
<li class="list-group-item text-midtone">
<a href="{$view.fullurl}" class="outer-link">
<span class="sr-only">{$view.title}</span>
</a>
......
{foreach from=$items item=collection}
<li class="list-group-item">
<li class="list-group-item text-midtone">
<a href="{$collection.fullurl}" class="outer-link">
<span class="sr-only">{$collection.name}</span>
</a>
......
......@@ -4,7 +4,7 @@
*}
{assign var='author_link_index' value=1}
{foreach from=$items item=view}
<li class="list-group-item">
<li class="list-group-item" text-midtone">
<a href="{$view.fullurl}" class="outer-link">
<span class="sr-only">{$view.title}</span>
</a>
......
......@@ -46,7 +46,7 @@
{if $publicgroup}
<a href="{$forum->feedlink}">
<span class="icon-rss icon icon-sm pls text-orange"></span>
<span class="icon-rss icon icon-sm pls mahara-rss-icon"></span>
</a>
{/if}
</h3>
......
......@@ -55,7 +55,7 @@
</a>
{if $publicgroup}
<a href="{$topic->feedlink}" class="pls">
<span class="icon-rss icon text-orange"></span>
<span class="icon-rss icon mahara-rss-icon"></span>
</a>
{/if}
<p>
......
......@@ -34,7 +34,7 @@
{$subheading}
{if $publicgroup}
<a href="{$feedlink}">
<span class="icon-rss icon-sm icon pls text-orange"></span>
<span class="icon-rss icon-sm icon pls mahara-rss-icon"></span>
</a>
{/if}
</h2>
......
......@@ -164,3 +164,7 @@
}
}
}
.mahara-rss-icon {
color: $rss-icon-color;
}
......@@ -3,20 +3,16 @@
color: $text-color;
}
.text-light {
color: #888;
.text-lighttone {
color: $theme-text-lighttone-color;
}
.text-medium {
color: #666;
}
.text-orange {
color: #FE6500;
.text-midtone {
color: $theme-text-midtone-color;
}
.text-link {
color: $link-color;
color: $link-color;
}
.text-watermark {
......@@ -29,11 +25,11 @@
}
.text-tiny {
font-size: $font-size-small - 3;
font-size: $font-size-small - 3;
}
.text-regular {
font-size: $font-size-base;
font-size: $font-size-base;
}
.text-inline.text-inline { // specificity
......
// Custom component variables (non-bootstrap components)
//Arrow component variables
$arrow-color: lighten(desaturate($brand-primary, 80%), 55%);
$arrow-text-color: $text-color;
$arrow-link-color: $link-color;
$arrow-link-hover-color: $text-color;
$arrow-link-active-color: $text-color;
//Arrow compoanent variables
$arrow-color: lighten(desaturate($brand-primary, 80%), 55%) !default;
$arrow-text-color: $text-color !default;
$arrow-link-color: $link-color !default;
$arrow-link-hover-color: $text-color !default;
$arrow-link-active-color: $text-color !default;
// color for the secondary title in sections (cf. groups)
$section-heading-color: #999;
$section-heading-color: #999 !default;
$admin-title-color: #fff !default;
$admin-title-bg: $brand-primary !default;
$dashboard-widget-bg: darken(#f9f9f9, 2%);
$dashboard-widget-color: $brand-primary;
$dashboard-widget-bg: darken(#f9f9f9, 2%) !default;
$dashboard-widget-color: $brand-primary !default;
$help-icon-color: darken(#22C49C, 5%);
$help-icon-color: darken(#22C49C, 5%) !default;
$rss-icon-color: #FE6500 !default;
......@@ -2,7 +2,10 @@
* Theme colours should be defined here, and (ideally) used only in the global variables files (bootstrap-variables, custom-variables)
*/
$theme-primary-color: #629600;
$theme-primary-color-dark: #335804;
$theme-text-color: #333;
$theme-accent-color: #211c00; // note this currently isn't used anywhere in raw
$theme-primary-color: #629600 !default;
$theme-primary-color-dark: #335804 !default;
$theme-text-color: #333 !default;
$theme-text-midtone-color: #666 !default;
$theme-text-lighttone-color: #888 !default;
$theme-accent-color: #211c00 !default; // note this currently isn't used anywhere in raw
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed.
......@@ -114,7 +114,7 @@
</span>
{if $PAGEHELPNAME}<span class="page-help-icon">{$PAGEHELPICON|safe}</span>{/if}
{if $publicgroup && $rsswithtitle}
<a href="{$feedlink}" class="text-orange text-small pull-right ">
<a href="{$feedlink}" class="mahara-rss-icon text-small pull-right ">
<span class="icon-rss icon icon-lg"></span>
</a>
{/if}
......
......@@ -8,7 +8,7 @@
{$title}
{if $feedlink}
<a href="{$feedlink}" class="secondary-link inner-link">
<span class="icon-rss icon icon-large pll text-orange"></span>
<span class="icon-rss icon icon-large pll mahara-rss-icon"></span>
<span class="sr-only">RSS</span>
</a>
{/if}
......
......@@ -34,7 +34,7 @@
<img class="thumbnail mb0" src="{$WWWROOT}skin/thumb.php?id={$currentskin}" alt="{$currenttitle}">
<ul class="metadata unstyled">
<li class="title">
<h3 class="h4 text-light mbs">{$currenttitle|safe}</h3>
<h3 class="h4 text-lighttone mbs">{$currenttitle|safe}</h3>
</li>
{if $currentmetadata}
<li class="metadisplayname">
......
......@@ -8,10 +8,13 @@
* This file is licensed under the same terms as Mahara itself
*/
// Import raw default variables (colors, fonts, padding, etc)
@import "../../raw/sass/utilities/theme-variables";
@import "../../raw/sass/utilities/bootstrap-variables";
@import "../../raw/sass/utilities/custom-variables";
// Import our theme based variables (colors, fonts, padding, etc)
@import "utilities/theme-variables"; // Import our theme variables
@import "../../raw/sass/utilities/bootstrap-variables"; // ...and our custom bootstrap variables file
@import "../../raw/sass/utilities/custom-variables"; // ...and our custom variables file
@import "../../raw/sass/utilities/bootstrap-index"; // bootstrap scss dependency file
......
......@@ -5,4 +5,7 @@
$theme-primary-color: #629600;
$theme-primary-color-dark: #335804;
$theme-text-color: #333;
$theme-text-midtone-color: #666;
$theme-text-lighttone-color: #888;
$theme-accent-color: #211c00; // note this currently isn't used anywhere in raw
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