Abstract Out Inline CSS for Account Views

Change-Id: I2da02fa7865b618c583d15cca9ef256c62f19286
Signed-off-by: Sawyer Bergeron <sawyerbergeron@gmail.com>

5 files changed, 22 insertions, 18 deletions

diff --git a/src/templates/account/booking_list.html b/src/templates/account/booking_list.html
index ef4df3a..4cd1408 100644
--- a/src/templates/account/booking_list.html
+++ b/src/templates/account/booking_list.html
@@ -17,7 +17,7 @@ function edit_booking(pk){
 </script>
 <h2>Bookings I Own</h2>
     {% for booking in bookings %}
-        <div style="border:2px;border-style:solid;border-color:grey;margin:5px">
+        <div class="detail_card">
             <ul>
             <li>id: {{booking.id}}</li>
             <li>lab: {{booking.resource.template.lab.lab_user.username}}</li>
@@ -26,15 +26,15 @@ function edit_booking(pk){
             <li>end: {{booking.end}}</li>
             <li>purpose: {{booking.purpose}}</li>
             </ul>
-            <div style="display:inline;margin:3px;padding:3px">
-                <button onclick="edit_booking({{booking.id}});">Edit</button>
-                <button onclick="location.href='/booking/detail/{{booking.id}}/';">Details</button>
+            <div class="detail_btn_group">
+                <button class="btn" onclick="edit_booking({{booking.id}});">Edit</button>
+                <button class="btn" onclick="location.href='/booking/detail/{{booking.id}}/';">Details</button>
             </div>
         </div>
     {% endfor %}
 <h2>Bookings I Collaborate On</h2>
     {% for booking in collab_bookings %}
-        <div style="border:2px;border-style:solid;border-color:grey;margin:5px">
+        <div class="detail_card">
             <ul>
             <li>id: {{booking.id}}</li>
             <li>lab: {{booking.lab}}</li>
@@ -43,9 +43,9 @@ function edit_booking(pk){
             <li>end: {{booking.end}}</li>
             <li>purpose: {{booking.purpose}}</li>
             </ul>
-            <div style="display:inline;margin:3px;padding:3px">
-                <button disabled=true onclick="edit_booking({{booking.id}});">Edit</button>
-                <button onclick="location.href='/booking/detail/{{booking.id}}/';">Details</button>
+            <div class="detail_btn_group">
+                <button class="btn" disabled=true onclick="edit_booking({{booking.id}});">Edit</button>
+                <button class="btn" onclick="location.href='/booking/detail/{{booking.id}}/';">Details</button>
             </div>
         </div>
     {% endfor %}
diff --git a/src/templates/account/configuration_list.html b/src/templates/account/configuration_list.html
index ee61e97..f4b174b 100644
--- a/src/templates/account/configuration_list.html
+++ b/src/templates/account/configuration_list.html
@@ -16,13 +16,15 @@ function edit_configuration(pk){
 }
 </script>
     {% for config in configurations %}
-        <div style="border:2px;border-style:solid;border-color:grey;margin:5px">
+        <div class="detail_card">
             <ul>
                 <li>id: {{config.id}}</li>
                 <li>name: {{config.name}}</li>
                 <li>description: {{config.description}}</li>
             </ul>
-            <button onclick="edit_configuration({{config.id}});">Edit</button>
+            <div class="detail_btn_group">
+                <button class="btn" onclick="edit_configuration({{config.id}});">Edit</button>
+            </div>
         </div>
     {% endfor %}
 {% endblock %}
diff --git a/src/templates/account/details.html b/src/templates/account/details.html
index 5641064..740dce6 100644
--- a/src/templates/account/details.html
+++ b/src/templates/account/details.html
@@ -2,8 +2,8 @@
 {% load staticfiles %}
 {% block content %}
 <h1>Account Details</h1>
-<button onclick="location.href = '{% url 'account:my-resources' %}'">My Resources</button>
-<button onclick="location.href = '{% url 'account:my-bookings' %}'">My Bookings</button>
-<button onclick="location.href = '{% url 'account:my-configurations' %}'">My Configurations</button>
-<button onclick="location.href = '{% url 'account:my-images' %}'">My Snapshots</button>
+<button class="btn" onclick="location.href = '{% url 'account:my-resources' %}'">My Resources</button>
+<button class="btn" onclick="location.href = '{% url 'account:my-bookings' %}'">My Bookings</button>
+<button class="btn" onclick="location.href = '{% url 'account:my-configurations' %}'">My Configurations</button>
+<button class="btn" onclick="location.href = '{% url 'account:my-images' %}'">My Snapshots</button>
 {% endblock content %}
diff --git a/src/templates/account/image_list.html b/src/templates/account/image_list.html
index fb436df..72ea1f5 100644
--- a/src/templates/account/image_list.html
+++ b/src/templates/account/image_list.html
@@ -2,7 +2,7 @@
 {% block content %}
 <h2>Images I Own</h2>
     {% for image in images %}
-        <div style="border:2px;border-style:solid;border-color:grey;margin:5px">
+        <div class="detail_card">
             <ul>
             <li>id: {{image.id}}</li>
             <li>lab: {{image.from_lab.name}}</li>
@@ -14,7 +14,7 @@
     {% endfor %}
 <h2>Public Images</h2>
     {% for image in public_images %}
-        <div style="border:2px;border-style:solid;border-color:grey;margin:5px">
+        <div class="detail_card">
             <ul>
             <li>id: {{image.id}}</li>
             <li>lab: {{image.from_lab.name}}</li>
diff --git a/src/templates/account/resource_list.html b/src/templates/account/resource_list.html
index 482a000..e70cca7 100644
--- a/src/templates/account/resource_list.html
+++ b/src/templates/account/resource_list.html
@@ -16,13 +16,15 @@ function edit_resource(pk){
 }
 </script>
     {% for resource in resources %}
-        <div style="border:2px;border-style:solid;border-color:grey;margin:5px">
+        <div class="detail_card">
             <ul>
                 <li>id: {{resource.id}}</li>
                 <li>name: {{resource.name}}</li>
                 <li>description: {{resource.description}}</li>
             </ul>
-            <button onclick="edit_resource({{resource.id}});">Edit</button>
+            <div class="detail_btn_group">
+                <button class="btn" onclick="edit_resource({{resource.id}});">Edit</button>
+            </div>
         </div>
     {% endfor %}
 {% endblock %}