Provide an opportunity for including conference-specific CSS

There is currently no top-level selector for views that is conference-specific,
so all conferences on one OSEM instance end up sharing all the same CSS.

In order to allow individual conferences to have unique CSS, a class for the
current conference is applied to the <body> tag, and an scss template provided with
an example of conference-specific CSS.
This commit is contained in:
James Mason 2018-10-23 19:14:31 -07:00
parent 8b12b1662d
commit 1241d21f93
5 changed files with 30 additions and 5 deletions

View file

@ -207,7 +207,7 @@ linters:
- "app/views/layouts/_messages.html.haml"
- "app/views/layouts/_navigation.html.haml"
- "app/views/layouts/_user_menu.html.haml"
- "app/views/layouts/application.html.haml"
- "app/views/layouts/application.haml"
- "app/views/organizations/index.html.haml"
- "app/views/payments/_payment.html.haml"
- "app/views/payments/new.html.haml"
@ -446,7 +446,7 @@ linters:
- "app/views/layouts/_messages.html.haml"
- "app/views/layouts/_navigation.html.haml"
- "app/views/layouts/_user_menu.html.haml"
- "app/views/layouts/application.html.haml"
- "app/views/layouts/application.haml"
- "app/views/organizations/index.html.haml"
- "app/views/payments/_payment.html.haml"
- "app/views/proposals/_form.html.haml"
@ -553,7 +553,7 @@ linters:
- "app/views/layouts/_admin_sidebar_index.html.haml"
- "app/views/layouts/_messages.html.haml"
- "app/views/layouts/_navigation.html.haml"
- "app/views/layouts/application.html.haml"
- "app/views/layouts/application.haml"
- "app/views/payments/_payment.html.haml"
- "app/views/proposals/_form.html.haml"
- "app/views/proposals/_tooltip.html.haml"
@ -603,7 +603,7 @@ linters:
- "app/views/layouts/_admin.html.haml"
- "app/views/layouts/_navigation.html.haml"
- "app/views/layouts/_user_menu.html.haml"
- "app/views/layouts/application.html.haml"
- "app/views/layouts/application.haml"
- "app/views/proposals/_encouragement_text.html.haml"
- "app/views/proposals/new.html.haml"
- "app/views/proposals/registrations.html.haml"

View file

@ -20,4 +20,5 @@
*= require selectize.bootstrap3
*= require mastodon
*= require bootstrap-select
*= require conferences
*/

View file

@ -0,0 +1,13 @@
/* Apply CSS to views of a specific conference by encapsulating the style in
* a body tag classed for the conference's short title.
* See the example here for 'osemdemo'.
* NOTE: when overriding existing CSS, it may be necessary to use !important to
* bypass CSS specificity rules.
*/
body.conference-osemdemo {
// style here only applies when working with the 'osemdemo' conference.
#header {
background-color: #b58e73 !important;
}
}

View file

@ -21,7 +21,7 @@
= javascript_include_tag "//cdn.transifex.com/live.js"
= yield(:head)
%body
%body{ class: ("conference-#{@conference.short_title}" if @conference) }
= render 'layouts/navigation', conference: @conference
-# Admin area
- if controller.class.name.split("::").first=="Admin"

View file

@ -0,0 +1,11 @@
require 'spec_helper'
describe 'layouts/application.haml' do
let(:conference) { create(:conference) }
it 'assigns a class to the body identifying the current conference' do
assign(:conference, conference)
render
expect(rendered).to have_selector("body.conference-#{conference.short_title}")
end
end