feat(citizenScience): background and styling for citizen science abou…

…t page
QutEcoacoustics · Aug 9, 2018 · 79257c8 · 79257c8
1 parent bc8c1cb
commit 79257c8
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 4 deletions.
diff --git a/src/app/citizenScience/_citizenScience.scss b/src/app/citizenScience/_citizenScience.scss
@@ -1,3 +1,18 @@
+.dark-background {
+  color: white;
+  background: rgba(0,0,0,0.9);
+
+  form {
+    color: #0a0a0a;
+  }
+
+
+}
+
+.about-content {
+  padding: 20px;
+}
+
 
 .citizen-science {
 

diff --git a/src/app/citizenScience/bristlebird/about.tpl.html b/src/app/citizenScience/bristlebird/about.tpl.html
@@ -4,10 +4,10 @@
 
 
      <div class="cs-main-container">
-        <div class="main wrapper clearfix">
+        <div class="main wrapper clearfix dark-background about-content">
 
 
-            <h2>Welcome to the Ipswich State School Ecoacoustics Citizen Science Project</h2>
+            <h2>Welcome to the Eastern Bristlebird Citizen Science Project</h2>
 
             <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sollicitudin blandit ante, blandit
                 cursus urna tempus nec. Suspendisse non mi ex. Phasellus rhoncus convallis auctor. Nam leo quam,

diff --git a/src/app/citizenScience/bristlebird/bristlebird.js b/src/app/citizenScience/bristlebird/bristlebird.js
@@ -1,13 +1,17 @@
 class BristlebirdAboutController {
     constructor($scope,
-                $location) {
+                $location,
+                backgroundImage,
+                paths) {
 
         $scope.citizenScientistName = "";
 
         $scope.getStarted = function () {
             localStorage.setItem("citizenScientistName", $scope.citizenScientistName);
             $location.path("/citsci/bristlebird/listen");
         };
+
+        backgroundImage.currentBackground = paths.site.assets.backgrounds.citizenScience + "1.jpg";
     }
 }
 
@@ -125,7 +129,7 @@ class BristlebirdController {
             function (item, oldVal) {
                 if (item) {
                     self.showAudio(item.audioRecordingId, item.startTimeSeconds, item.endTimeSeconds);
-                    // for now, we cycle through backgrounds arbitrarily, based on the id of the sample number
+                    // for now, we cycle through backgrounds arbitrarily, based on the id of the sample
                     // todo: store background images as part of the dataset or cs project
                     var backgroundPath = self.backgroundPaths[parseInt(item.id) % (self.backgroundPaths.length - 1)];
                     backgroundImage.currentBackground = backgroundPath;
@@ -191,5 +195,7 @@ angular
         [
             "$scope",
             "$location",
+            "backgroundImage",
+            "conf.paths",
             BristlebirdAboutController
         ]);