[U] update office hour page style

timer/templates/index.html

@@ -1,23 +1,27 @@
 {% extends 'base.html' %}
 {% block content %}
 <title>Office Hour</title>
-<div>
-  <h2>office hour ends at: </h2>
-  <h1>{{ today_oh.get_ends_at_str }}</h1>
-</div>
-
-<form method="POST">
+<p></p>
+<form method="POST" class="form-inline mb-2">
   {% csrf_token %}
   {% for f in form %}
-  <div class="form-group " >
+  <div class="form-group" >
     {% if f.name == 'begins_at' %}
-    <label>
-      {{ f.name }}
+    <label style='color:#67b3ff'>
+      开工时间系
     </label>
+  </div>
+  <div class="form-group mx-sm-3 mb-2" >
     <input type="" name={{ f.name }} class="form-control">
     {% endif %}
   </div>
   {% endfor %}
-  <button type="submit" class="btn btn-primary">Submit</button>
+  <button type="submit" class="btn btn-primary mb-2">Submit</button>
 </form>
+
+<div>
+  <h2 style='color:#67b3ff'>今日 <b style='color:#ff6767'>{{ today_oh.get_ends_at_str }}</b> 收工！</h2>
+  
+</div>
+
 {% endblock content %}