Difference between revisions of "SUNScholar/XMLUI Theme/M2/Customisation/Palette"
Jump to navigation
Jump to search
| (7 intermediate revisions by the same user not shown) | |||
| Line 17: | Line 17: | ||
**/ | **/ | ||
| − | $brand-primary: # | + | $brand-primary: #60223b; |
| + | $brand-warning: #ff9b33; | ||
$brand-success: #5cb85c; | $brand-success: #5cb85c; | ||
$brand-info: #5bc0de; | $brand-info: #5bc0de; | ||
| − | |||
$brand-danger: #d9534f; | $brand-danger: #d9534f; | ||
| Line 32: | Line 32: | ||
Adjust the settings to suit your institution. | Adjust the settings to suit your institution. | ||
| − | ===Step 3 - Define anchor colours CSS=== | + | ===Step 3 - Define body background color CSS=== |
| + | Go to the bottom of the file and add the following: | ||
| + | <pre> | ||
| + | /** | ||
| + | * Body background CSS | ||
| + | **/ | ||
| + | $body-bg: $gray-lighter !default; | ||
| + | </pre> | ||
| + | |||
| + | ===Step 4 - Define anchor colours CSS=== | ||
Go to the bottom of the file and add the following: | Go to the bottom of the file and add the following: | ||
<pre> | <pre> | ||
| Line 43: | Line 52: | ||
</pre> | </pre> | ||
| − | ===Step | + | ===Step 5 - Define text colour CSS=== |
Go to the bottom of the file and add the following: | Go to the bottom of the file and add the following: | ||
<pre> | <pre> | ||
| Line 51: | Line 60: | ||
$text-color: $gray-dark !default; | $text-color: $gray-dark !default; | ||
</pre> | </pre> | ||
| + | [[Category:Customisation]] | ||
Latest revision as of 12:11, 28 May 2016
Back to Mirage 2 Customisation
Contents
Introduction
This wiki page helps to setup the default colours for the web site.
Step 1 - Review palette preferences
See: http://wiki.lib.sun.ac.za/index.php/SUNScholar/Theme/Color_Palette
Step 2 - Define colours CSS
Edit the following file:
nano $HOME/source/dspace-xmlui-mirage2/src/main/webapp/styles/classic_mirage_color_scheme/_bootstrap_variables.scss
Go to the bottom of the file and add the following:
/** * Colours CSS **/ $brand-primary: #60223b; $brand-warning: #ff9b33; $brand-success: #5cb85c; $brand-info: #5bc0de; $brand-danger: #d9534f; $gray-base: #000; $gray-darker: #222; $gray-dark: #333; $gray: #555; $gray-light: #777; $gray-lighter: #eee;
Adjust the settings to suit your institution.
Step 3 - Define body background color CSS
Go to the bottom of the file and add the following:
/** * Body background CSS **/ $body-bg: $gray-lighter !default;
Step 4 - Define anchor colours CSS
Go to the bottom of the file and add the following:
/** * Links CSS **/ $link-color: $brand-primary; $link-hover-color: $brand-warning; $link-hover-decoration: underline;
Step 5 - Define text colour CSS
Go to the bottom of the file and add the following:
/** * Text CSS **/ $text-color: $gray-dark !default;