css and styling updates

shiftypanda · Feb 6, 2018 · 5a7a950 · 5a7a950
1 parent d02a68a
commit 5a7a950
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 7 deletions.
diff --git a/sleep/static/templates/css/sleep.css b/sleep/static/templates/css/sleep.css
@@ -1,4 +1,4 @@
-.base-header {
+.page-header {
 
   margin-top: 0;
   padding: 20px 20px 20px 40px;
@@ -60,3 +60,15 @@ body {
 .comment {
   margin: 20px 0px 20px 20px;
 }
+
+.sleep-detail {
+  font-family: sans-serif;
+  padding: 20px 10px 20px 10px;
+
+}
+
+.sleep-detail .result {
+  align-items: flex-end;
+  padding-left: 30px;
+
+}
diff --git a/sleep/templates/sleep/base.html b/sleep/templates/sleep/base.html
@@ -9,7 +9,7 @@
     <link rel="stylesheet" href="{% static 'templates/css/sleep.css' %}">
   </head>
   <body>
-    <div class"base-header">
+    <div class="page-header">
       <!-- TODO: Nav menu here for authenticated users -->
       <!-- TODO: Nav menu here for anonymous users / login redirect -->
 

diff --git a/sleep/templates/sleep/detail.html b/sleep/templates/sleep/detail.html
@@ -1,21 +1,31 @@
 {% extends 'sleep/base.html' %}
   {% block content %}
 
-  <h1 class="sleep-detail">{{ sleep.sleep_date|date:'d-m-Y'}}</h1>
+  <h1 >{{ sleep.sleep_date|date:'d-m-Y'}}</h1>
 {% if error_message %}<p><strong>{{ error_message }}</strong></p>{% endif %}
       <div class="sleep">
         <p class="date">Sleep date: {{ sleep.sleep_date|date:'d-m-Y'}}</p>
         <div class="sleep-detail">
           <table>
           <tr>
-            <td>Time started preparing for bed: {{ sleep.time_start_preparing_for_sleep|date:'H:i e'}}</tr>
+            <td>Time started preparing for bed:
+
+              <td class="result">{{ sleep.time_start_preparing_for_sleep|date:'H:i e'}}</tr>
+
           <tr>
-            <td>Time went to bed: {{ sleep.time_went_into_bed|date:'H:i e' }}</tr>
+            <td>Time went to bed:
+
+              <td class="result">{{ sleep.time_went_into_bed|date:'H:i e' }}</tr>
+
           <tr>
-            <td>Time went to sleep: {{ sleep.time_went_to_sleep|date:'H:i e'}}</tr>
+            <td>Time went to sleep:
+
+              <td class="result">{{ sleep.time_went_to_sleep|date:'H:i e'}}</tr>
+
           <div class="sleep-divider"></div>
           <tr>
-            <td>Time woke in the morning: {{ sleep.time_woke_in_morning|date:'H:i e'}}</tr>
+            <td>Time woke in the morning:
+              <td class="result">{{ sleep.time_woke_in_morning|date:'H:i e'}}</tr>
         </table>
       </div>
       </div>