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

@ -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"