Style fixes and Fixes #91

QutEcoacoustics · Feb 7, 2014 · 3736c2c · 3736c2c
1 parent 2c50436
commit 3736c2c
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 16 deletions.
diff --git a/src/app/listen/_listen.scss b/src/app/listen/_listen.scss
@@ -15,11 +15,23 @@
   line-height: 1.0;
   margin-top: -10px;
   margin-bottom: 10px;
+
+
+}
+
+#recordingDetails {
+  &>p>span {
+    white-space: nowrap;
+  }
 }
 
-#navigator input[type="range"] {
-  width: 300px;
-  height: 1em;
+#navigator  {
+
+
+  & input[type="range"] {
+    width: 300px;
+    height: 1em;
+  }
 
 }
 

diff --git a/src/app/listen/listen.tpl.html b/src/app/listen/listen.tpl.html
@@ -22,26 +22,28 @@ <h1 id="chunkInfo" class="row">
             </span>
 
 </h1>
-<div class="row">
-    <span class="col-md-3" class="hint absolute-time hint--top">{{absoluteDateChunkStart() | moment:"format":"dddd, MMMM Do YYYY, HH:mm:ss ZZ"}}</span>
-</div>
-<div class="row">
-    <span class="col-md-6">
-        Recording start: <span class="hint absolute-time hint--top">{{model.audioRecording.recordedDate | moment:"format":"YY-MMM-DD, HH:mm:ss ZZ"}}</span>.
-        Duration: <span class="hint duration hint--top">{{model.audioRecording.durationSeconds | formatTimeSpan}} </span>.
-
-    </span>
+<div id="recordingDetails" class="row">
+    <p class="col-md-12">
+        <span  class="hint absolute-time hint--top">{{absoluteDateChunkStart() | moment:"format":"dddd, MMMM Do YYYY, HH:mm:ss ZZ"}}</span>.
+        <span >
+            Recording start: <span class="hint absolute-time hint--top">{{model.audioRecording.recordedDate | moment:"format":"YYYY-MMM-DD, HH:mm:ss ZZ"}}</span>,
+        </span>
+        <span>
+            duration: <span class="hint duration hint--top">{{model.audioRecording.durationSeconds | formatTimeSpan}} </span>.
+
+        </span>
+    </p>
 </div>
 <div id="navigator" class="row">
-            <span class="col-md-4">
+            <p class="col-md-12">
                 Jump to minute:
                 <input ng-class="{'hide-thumb' : jumpToHide}" type="range" min="0" max="{{jumpToMax}}"
                        ng-slider="jumpToMinute" step="1">
                 <span>{{jumpToMinuteAbsolute()}}</span>
-                <button class="btn btn-default" ng-click="jumpTo()">Go</button>
-            </span>
+                <button class="btn btn-default btn-xs" ng-click="jumpTo()">Go</button>
+            </p>
 </div>
-
+<br/>
 <baw-annotation-viewer class="clearfix" model="model"></baw-annotation-viewer>
 
 <div id="chunkTimeStamps" class="clear-pseudo center-block">