Merge pull request #836 from ucam-cl-dtg/feature/temporary-chemistry-book-navigation, see issue #837

Feature/temporary chemistry book navigation

Author: jsharkey13

app/css/app.css

@@ -21,6 +21,11 @@
                     </div>
                 </div>
                 <div class='padded-right-float text-right'>
+                    <a class='ru-desktop-nav-item' ui-sref='chemistry'>
+                        <div id="chemistry-tab-desktop" class='ru-desktop-nav-item-inner' ng-class="{active: $state.includes('chemistry')}">
+                            <span class="multiline">Isaac Chemistry</span>
+                        </div>
+                    </a>
                     <a class='ru-desktop-nav-item' ui-sref='gameBoards({filter: true})'>
                         <div id="questions-tab-desktop" class='ru-desktop-nav-item-inner' ng-class="{active: $state.includes('gameBoards') || $state.includes('question')}">
                             <span>Questions</span>
@@ -78,6 +83,11 @@
                                 data-interchange="[/assets/isaac-logo.png, (small)], [/assets/isaac-logo@2x.png, (small_retina)]" src='/assets/isaac-logo.png'></a>
                 <div ng-if="segueEnvironment=='DEV'" class="ru-mobile-logo-dev">Non-Prod x({{user.givenName}} {{user.familyName}})</div>
                 <div class="ru-mobile-nav-container">
+                  <a class='ru-mobile-nav-item' ui-sref='chemistry'>
+                    <div ng-class="{'ru-mobile-nav-item-inner': true, active: $state.includes('chemistry')}">
+                      <span class="multiline">Isaac Chemistry</span>
+                    </div>
+                  </a>
                   <a class='ru-mobile-nav-item' ui-sref='gameBoards'>
                       <div ng-class="{'ru-mobile-nav-item-inner': true, active: $state.includes('gameBoards') || $state.includes('question')}">
                           <span>Questions</span>

app/css/app.css.map

@@ -64,6 +64,12 @@ $ru_nav_size : 7em;
     font-style: italic;
     font-weight: 300;
     color: #333333;
+
+    &.multiline {
+        display: -ms-inline-flexbox;
+        display: inline-flex;
+        top: 2.5em;
+    }
 }
 .ru-desktop-nav-item-inner:hover
 {
@@ -276,6 +282,12 @@ $ru_nav_size : 7em;
     position: relative;
     font-size: 1.0em;
     display: inline-block;
+
+    &.multiline {
+        display: -ms-inline-flexbox;
+        display: inline-flex;
+        top: 2.5em;
+    }
 }
 
 .ru-search-bg {