Skip to content

Commit

Permalink
Merge pull request #20 from scientist-softserv/styling
Browse files Browse the repository at this point in the history
Styling
  • Loading branch information
laritakr authored Oct 3, 2023
2 parents e1c95ee + eed8be1 commit c352e63
Show file tree
Hide file tree
Showing 19 changed files with 190 additions and 75 deletions.
2 changes: 0 additions & 2 deletions app/assets/stylesheets/adl-overrides/adl-overrides.scss
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
@import url("https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,200;0,300;0,400;0,600;0,700;0,900;1,200;1,300;1,400;1,600;1,700;1,900&display=swap");

body.public-facing {
font-family: "Source Sans Pro" !important;
font-size: 17px;
color: $darkgrey;

Expand All @@ -17,7 +16,6 @@ body.public-facing {
.h4,
.h5,
.h6 {
font-family: "Source Sans Pro" !important;
font-weight: 600;
}

Expand Down
26 changes: 26 additions & 0 deletions app/assets/stylesheets/adl-overrides/viewer.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
.viewer-wrapper {
height: 900px;
}

.viewer {
height: 100%;
padding: 10px;

}

#viewer-modal {
.modal-content {
padding: 20px;
}
picture {
background-color: rgb(46,46,46);
}
button.close {
margin-bottom: 10px;
}
}

.video-embed-viewer {
aspect-ratio: auto;
width: 100%;
}
46 changes: 46 additions & 0 deletions app/assets/stylesheets/adl-variables.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
@import url(https://fonts.googleapis.com/css?family=Nobile:400,700,300);

$primary-font-family: "Nobile", sans-serif;

$jumbotron-heading-font-size: 2.5em;
$jumbotron-heading-color: #30373b;
$jumbotron-sub-heading-color: #444;
$jumbotron-button-background-color: #7ab55c;

$features-section-background-color: #f4f4f4;
$features-section-border-color: #ddd;


// BRAND COLORS
$white: #ffffff;
$lightgrey: #F5F5F6;
$lightgreyborder: #e5e5e5;
$lightgrey2: #b8b8b8;
$mediumgrey: #5b5b5b;
$darkgrey: #2C2C2C;
$black: #000000;
$lightyellow: #FFBD42;
$mediumyellow: #CE8C00;
$darkyellow: #985F03;
$transparentwhite: rgba(255, 255, 255, .8);

// Breakpoints

//use for max widths
// X-Small devices (portrait phones, less than 576px)
$xs-max: 575.98px;
// Small devices (landscape phones, less than 768px)
$sm-max: 767.98px;
// Medium devices (tablets, less than 992px)
$md-max: 991.98px;
// Large devices (desktops, less than 1200px)
$lg-max: 1251.98px;
// X-Large devices (large desktops, less than 1400px)
$xl-max: 1399.98px;

// use for min-widths
$xs-min: 576px;
$sm-min: 768px;
$md-min: 992px;
$lg-min: 1252px;
$xl-min: 1400px;
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
@import "adl-variables";
@import "../adl-overrides/*";
/*
* This is a manifest file that'll be compiled into application.css, which will include all the files
* listed below.
Expand All @@ -13,12 +15,3 @@
*= require_tree .
*= require_self
*/

.viewer-wrapper {
height: 900px !important;
}

.video-embed-viewer {
aspect-ratio: auto;
width: 100%;
}
19 changes: 0 additions & 19 deletions app/assets/stylesheets/hyrax/_viewer.scss

This file was deleted.

49 changes: 28 additions & 21 deletions app/forms/hyrax/forms/admin/appearance_decorator.rb
Original file line number Diff line number Diff line change
@@ -1,33 +1,40 @@
# frozen_string_literal: true

# OVERRIDE to add adventist's custom colors and fonts
module Hyrax
module Forms
module Admin
module AppearanceDecorator
DEFAULT_COLORS = {
'header_and_footer_background_color' => '#3c3c3c',
'header_and_footer_text_color' => '#dcdcdc',
ADL_DEFAULT_COLORS = {
'custom_adl_header_footer_color' => '#CE8C00',
'header_and_footer_background_color' => '#000000',
'header_and_footer_text_color' => '#2C2C2C',
'navbar_background_color' => '#000000',
'navbar_link_background_hover_color' => '#ffffff',
'navbar_link_text_color' => '#eeeeee',
'navbar_link_text_hover_color' => '#eeeeee',
'link_color' => '#2e74b2',
'link_hover_color' => '#215480',
'footer_link_color' => '#ffebcd',
'footer_link_hover_color' => '#ffffff',
'primary_button_hover_color' => '#286090',
'default_button_background_color' => '#ffffff',
'default_button_border_color' => '#cccccc',
'default_button_text_color' => '#333333',
# 'active_tabs_background_color' => '#337ab7',
'facet_panel_background_color' => '#f5f5f5',
'facet_panel_text_color' => '#333333',
'custom_adl_header_footer_color' => '#CE8C00'
'navbar_link_background_hover_color' => '#000000',
'navbar_link_text_color' => '#2C2C2C',
'navbar_link_text_hover_color' => '#FFFFFF',
'link_color' => '#985F03',
'link_hover_color' => '#FFBD42',
'footer_link_color' => '#985F03',
'footer_link_hover_color' => '#000000',
'primary_button_hover_color' => '#CE8C00',
'default_button_border_color' => '#5B5B5B',
'default_button_text_color' => '#FFFFFF',
'active_tabs_background_color' => '#FFFFFF',
'facet_panel_background_color' => '#000000',
'facet_panel_text_color' => '#FFFFFF'
}.freeze

# TODO: do we need this adl_header_footer_color?
# 'custom_adl_header_footer_color' => '#CE8C00'
# OVERRIDE here to add adventist's custom header & footer
ADL_DEFAULT_FONTS = {
'body_font' => 'Nobile, sans-serif;',
'headline_font' => 'Nobile, sans-serif;'
}.freeze

# OVERRIDE to add adventist's custom header & footer
def default_values
ADL_DEFAULT_FONTS.merge(ADL_DEFAULT_COLORS)
end

def custom_adl_header_footer_color
block_for('custom_adl_header_footer_color')
end
Expand Down
6 changes: 3 additions & 3 deletions app/views/_masthead.html.erb
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
<nav id="masthead" class="navbar navbar-inverse navbar-static-top" role="navigation" aria-label="masthead">
<div class="container-fluid">
<div class="nav-container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#top-navbar-collapse" aria-expanded="false">
<%= render '/logo' %>
<button type="button" class="navbar-toggle collapsed ml-auto pr-5" data-toggle="collapse" data-target="#top-navbar-collapse" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<%= render '/logo' %>
</div>

<div class="collapse navbar-collapse" id="top-navbar-collapse">
Expand Down
43 changes: 43 additions & 0 deletions app/views/_user_util_links.html.erb
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
<ul id="user_utility_links" class="nav navbar-nav navbar-right">
<%= render 'shared/locale_picker' if available_translations.size > 1 %>
<%#= Nav Links added here to improve mobile responsivity %>
<li <%= 'class=active' if current_page?(hyrax.root_path) %>>
<%= link_to t(:'hyrax.controls.home'), hyrax.root_path, aria: current_page?(hyrax.root_path) ? {current: 'page'} : nil %></li>
<li <%= 'class=active' if current_page?(hyrax.about_path) %>>
<%= link_to t(:'hyrax.controls.about'), hyrax.about_path, aria: current_page?(hyrax.about_path) ? {current: 'page'} : nil %></li>
<% if defined?(resources_path) %> <%#= TODO remove when path fix is merged %>
<li <%= 'class=active' if current_page?(main_app.resources_path) %>>
<%= link_to t(:'hyrax.controls.resources'), main_app.resources_path, aria: current_page?(main_app.resources_path) ? {current: 'page'} : nil %></li>
<% end %>
<li <%= 'class=active' if current_page?(hyrax.contact_path) %>>
<%= link_to t(:'hyrax.controls.contact'), hyrax.contact_path, aria: current_page?(hyrax.contact_path) ? {current: 'page'} : nil %></li>
<% if user_signed_in? %>
<li>
<%= render_notifications(user: current_user) %>
</li>
<li class="dropdown">
<%= link_to hyrax.dashboard_profile_path(current_user), role: 'button', data: { toggle: 'dropdown' }, aria: { haspopup: true, expanded: false} do %>
<span class="sr-only"><%= t("hyrax.toolbar.profile.sr_action") %></span>
<span class="hidden-xs">&nbsp;<%= current_user.name %></span>
<span class="sr-only"> <%= t("hyrax.toolbar.profile.sr_target") %></span>
<span class="fa fa-user"></span>
<span class="caret"></span>
<% end %>
<ul class="dropdown-menu dropdown-menu-right" role="menu">
<li><%= link_to t("hyrax.toolbar.dashboard.menu"), hyrax.dashboard_path %></li>

<li class="divider"></li>
<% if Devise.mappings[:user].registerable? %>
<li><%= link_to t("hyku.toolbar.profile.edit_registration"), main_app.edit_user_registration_path %></li>
<% end %>
<li><%= link_to t("hyrax.toolbar.profile.logout"), main_app.destroy_user_session_path %></li>
</ul>
</li><!-- /.btn-group -->
<% else %>
<li>
<%= link_to main_app.new_user_session_path do %>
<span class="glyphicon glyphicon-log-in" aria-hidden="true"></span> <%= t("hyrax.toolbar.profile.login") %>
<% end %>
</li>
<% end %>
</ul>
11 changes: 11 additions & 0 deletions app/views/hyrax/admin/appearances/_default_colors_form.html.erb
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
<%= simple_form_for @form, url: admin_appearance_path do |f| %>
<div class="panel-body defaultable-colors">
<% @form.class::ADL_DEFAULT_COLORS.each do |color_name, hex| %>
<%= render 'color_input', f: f, color_name: color_name, hex: hex %>
<% end %>
</div>
<div class="panel-footer">
<%= link_to 'Restore All Defaults', '#color', class: 'btn btn-default restore-all-default-colors' %>
<%= f.submit class: 'btn btn-primary pull-right' %>
</div>
<% end %>
19 changes: 19 additions & 0 deletions app/views/hyrax/admin/appearances/_default_fonts_form.html.erb
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
<%# OVERRIDE: Use custom default values for fonts rather than default from Hyku %>
<%= simple_form_for @form, url: admin_appearance_path do |f| %>
<div class="panel-body defaultable-fonts">
<% df = @form.default_values %>
<% font = f.object.body_font %>
<%= f.input :body_font, label: 'Select Body Font', required: false, input_html: { class: 'font-fields', data: { default_value: df['body_font'] } } %>
<%= link_to 'Restore Default', '#font', class: 'btn btn-default restore-default-font', data: { default_target: 'body_font' } %>
<%= f.input :headline_font, label: 'Select Header Font', required: false, input_html: { class: 'font-fields', data: { default_value: df['headline_font'] } } %>
<%= link_to 'Restore Default', '#font', class: 'btn btn-default restore-default-font', data: { default_target: 'headline_font' } %>

</div>
<div class="panel-footer">
<%= link_to 'Restore All Defaults', '#font', class: 'btn btn-default restore-all-default-fonts' %>
<%= f.submit class: 'btn btn-primary pull-right' %>
</div>
<% end %>
File renamed without changes.
File renamed without changes.
15 changes: 0 additions & 15 deletions app/views/layouts/hyku_knapsack/application.html.erb

This file was deleted.

File renamed without changes.
File renamed without changes.
12 changes: 9 additions & 3 deletions app/views/shared/_appearance_styles.html.erb
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,14 @@ body.public-facing h2,
body.public-facing h3,
body.public-facing h4,
body.public-facing h5,
body.public-facing h6 { font-family: <%= appearance.font_headline_family %>}
body.public-facing h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 { font-family: <%= appearance.font_headline_family %>
}
/* LINK COLORS */
body.public-facing a { color: <%= appearance.link_color %>; }
Expand Down Expand Up @@ -68,7 +75,7 @@ body.public-facing .btn-primary {
border-color: <%= appearance.primary_button_border_color %>;
}
body.public-facing .btn-primary:focus,
body.public-facing .btn-primary.focus {
.public-facing .btn-primary.focus {
background-color: <%= appearance.primary_button_focus_background_color %>;
border-color: <%= appearance.primary_button_focus_border_color %>;
}
Expand Down Expand Up @@ -148,7 +155,6 @@ body.public-facing .panel-default > .panel-heading {
body.public-facing .panel-default { border-color: <%= appearance.facet_panel_border_color %>; }
body.public-facing .panel-heading.collapse-toggle .panel-title:after { color: <%= appearance.facet_panel_text_color %>; }
/* CUSTOM ADVENTIST DIGITAL LIBRARY OVERRIDE COLOR FOR HEADER & FOOTER */
.public-facing #masthead.navbar.navbar-inverse.navbar-static-top {
background: linear-gradient(<%= appearance.custom_adl_header_footer_color %>, #ffffff, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0));
Expand Down
2 changes: 1 addition & 1 deletion hyrax-webapp
4 changes: 2 additions & 2 deletions lib/tasks/assets.rake
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,8 @@ namespace :hyku_knapsack do
Dir.glob(File.join(HykuKnapsack::Engine.root, 'public', '**')).each do |asset|
# skip directories
next unless File.file?(asset)
dest_file = Rails.root.join('public', File.basename(asset))
FileUtils.copy_file source_file, dest_file, true
dest_file = File.join(Rails.root, 'public', File.basename(asset))
FileUtils.copy_file asset, dest_file, true
end
end
end

0 comments on commit c352e63

Please sign in to comment.