Skip to content

Commit

Permalink
Add basic OHSU styling
Browse files Browse the repository at this point in the history
This commit adds OHSU colors, fonts, and the favicon. A
view override from Hyrax 2.0.0 is included to change the
logo.

The variables sass file overrides Bootstrap 3 SASS variables.

Closes #231
  • Loading branch information
little9 committed Jan 11, 2018
1 parent f4c86d4 commit 6c205dd
Show file tree
Hide file tree
Showing 10 changed files with 140 additions and 2 deletions.
4 changes: 2 additions & 2 deletions app/assets/stylesheets/hyrax.scss
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,8 @@
*= require jquery-ui
*= require select2
*= require_self
*/

*/
@import "mahonia/variables";
@import "bootstrap-sprockets";
@import 'bootstrap';
@import 'blacklight/blacklight';
Expand Down
3 changes: 3 additions & 0 deletions app/assets/stylesheets/mahonia.scss
Original file line number Diff line number Diff line change
@@ -1 +1,4 @@
@import 'mahonia/search_fields';
@import 'mahonia/footer';
@import 'mahonia/header';
@import 'mahonia/buttons';
9 changes: 9 additions & 0 deletions app/assets/stylesheets/mahonia/_buttons.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
@import 'variables';

.btn-primary {
background-image: linear-gradient(to bottom, $btn-primary-gradient-start, $btn-primary-gradient-end);
}

.btn-primary:hover {
background-image: linear-gradient(to bottom, $btn-primary-gradient-end, $btn-primary-gradient-start);
}
9 changes: 9 additions & 0 deletions app/assets/stylesheets/mahonia/_footer.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
@import 'variables';

.navbar.navbar-inverse.site-footer {
background: $ohsu-navbar;
color: $ohsu-navbar-text;
.navbar-text {
color: $ohsu-navbar-text;
}
}
56 changes: 56 additions & 0 deletions app/assets/stylesheets/mahonia/_header.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,56 @@
@import 'variables';

// Logo container
.navbar-brand {
margin-top: 1.35em;
}

// Logo text
.institution_name {
color: $ohsu-navbar;
font-size: 2em;
font-weight: 300;
}

// user_util_links -- the English and Login buttons in the header
.navbar-nav.navbar-right
{
margin-top: 1.7em;
margin-right: 1em;
li {
a {
color: $ohsu-link;
}
a:hover {
color: $ohsu-link-hover;
}
}
}

// Top navbar that contains the user_util_links
.navbar-inverse.navbar-static-top {
min-height:100px;
border: 0;
background: $ohsu-navbar-header-background;
border: 0;
}

// Navbar that contains the search bar
.navbar-default.navbar-static-top
{
background: $ohsu-navbar;
color: $ohsu-navbar-text;
border: 0;
}

// Navbar links
.navbar-default .navbar-nav {
li {
a {
color: $ohsu-navbar-text;
}
a:hover {
color: $ohsu-navbar-text-hover;
}
}
}
5 changes: 5 additions & 0 deletions app/assets/stylesheets/mahonia/_navbar.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
@import 'colors';

#masthead.navbar-inverse {
background-color: $ohsu-blue;
}
52 changes: 52 additions & 0 deletions app/assets/stylesheets/mahonia/_variables.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,52 @@
//== OHSU Custom Colors
$ohsu-link: #0072FF;
$ohsu-link-hover: #0E4D8F;
$ohsu-body-text: #555555;
$ohsu-alert: #C34D36;

$ohsu-navbar: #0e4d8f;
$ohsu-navbar-header-background: #fff;
$ohsu-navbar-text: #fff;
$ohsu-navbar-text-hover: #eee;
// OHSU uses this font for online identity
@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400');

//== Bootstrap overrides
// Follows this structure: https://github.com/twbs/bootstrap-sass/blob/master/assets/stylesheets/bootstrap/_variables.scss

//== Colors
$brand-primary: #0072FF;

//== Scaffolding
$text-color: $ohsu-body-text;

//== Typography
$font-family-sans-serif: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif !default;


//== Buttons
//
//## For each of Bootstrap's buttons, define text, background and border color.


$btn-primary-color: #805b16;
$btn-primary-bg: #ffd769;
$btn-primary-border: #edb519;

$btn-primary-gradient-start: $btn-primary-bg;
$btn-primary-gradient-end: #ffc529;

$btn-info-color: $btn-primary-color;
$btn-info-bg: $btn-primary-bg;
$btn-info-border: $btn-primary-border;

// Allows for customizing button radius independently from global border radius
$btn-border-radius-base: 25px;
$btn-border-radius-large: 25px;
$btn-border-radius-small: 25px;


//** Global textual link color.
$link-color: $ohsu-link;
//** Link hover color set via `darken()` function.
$link-hover-color: $ohsu-link-hover;
3 changes: 3 additions & 0 deletions app/views/_logo.html.erb
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
<a id="logo" class="navbar-brand" href="<%= hyrax.root_path %>" data-no-turbolink="true">
<span class="institution_name"><%= application_name %></span>
</a>
1 change: 1 addition & 0 deletions app/views/shared/_appearance_styles.html.erb
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
<% # Override this partial from Hyrax. You won't be able to change styles from the UI. %>
Binary file modified public/favicon.ico
Binary file not shown.

0 comments on commit 6c205dd

Please sign in to comment.