Add workshop types done without attachment files

3 files changed, 86 insertions, 57 deletions

diff --git a/workshop_app/templates/workshop_app/add_workshop_type.html b/workshop_app/templates/workshop_app/add_workshop_type.html
new file mode 100644
index 0000000..ed28b03
--- /dev/null
+++ b/workshop_app/templates/workshop_app/add_workshop_type.html
@@ -0,0 +1,50 @@
+{% extends 'workshop_app/base.html' %}
+
+{% block title %}
+    Add new Workshop type
+{% endblock %}
+
+{% block content %}
+    <div class="container">
+        <h2 class="text-center m-2">New Workshop Type</h2>
+        <br>
+        <form method="post">
+            <div class="row my-3">
+                <div class="col-3 font-weight-bold">Workshop Name :</div>
+                <div class="col text-left">
+                    <div class="row"><div class="col">{{ form.name }}</div></div>
+                    <div class="row m-1 text-danger"><div class="col">{{ form.name.errors }}</div></div>
+                </div>
+
+            </div>
+            <div class="row my-3">
+                <div class="col-3 font-weight-bold">Duration :</div>
+                <div class="col text-left">
+                    <div class="row"><div class="col">{{ form.duration }}</div></div>
+                    <div class="row m-1 text-muted"><div class="col">{{ form.duration.help_text }}</div></div>
+                    <div class="row m-1 text-danger"><div class="col">{{ form.duration.errors }}</div></div>
+                </div>
+            </div>
+            <div class="row my-3">
+                <div class="col-3 font-weight-bold">Description :</div>
+                <div class="col text-left">
+                    <div class="row"><div class="col">{{ form.description }}</div></div>
+                    <div class="row m-1 text-danger"><div class="col">{{ form.description.errors }}</div></div>
+                </div>
+            </div>
+            <div class="row my-3">
+                <div class="col-3 font-weight-bold">Terms and Conditions :</div>
+                <div class="col text-left">
+                    <div class="row"><div class="col">{{ form.terms_and_conditions }}</div></div>
+                    <div class="row m-1 text-danger"><div class="col">{{ form.terms_and_conditions.errors }}</div></div>
+                </div>
+            </div>
+
+            <div class="row my-3">
+                <div class="col-12">
+                    <button type="submit" class="btn btn-md btn-primary float-right m-3">Create</button>
+                </div>
+            </div>
+        </form>
+    </div>
+{% endblock %}
\ No newline at end of file
diff --git a/workshop_app/templates/workshop_app/workshop_type_details.html b/workshop_app/templates/workshop_app/workshop_type_details.html
index b8d6559..298d976 100644
--- a/workshop_app/templates/workshop_app/workshop_type_details.html
+++ b/workshop_app/templates/workshop_app/workshop_type_details.html
@@ -1,23 +1,40 @@
-
 {% extends 'workshop_app/base.html' %}
 
 {% block title %}
-	View Workshop details
+    View Workshop details
 {% endblock %}
 
 
 {% block extra %}
 
-	<!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> -->
+    <!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> -->
 
-  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
-  <script src="{{URL_ROOT}}/static/workshop_app/js/bootstrap-3.3.7.min.js"></script>
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
+    <script src="{{ URL_ROOT }}/static/workshop_app/js/bootstrap-3.3.7.min.js"></script>
 {% endblock %}
 
 {% block content %}
-	<div class="container">
-	{{ workshop_type.description | safe }}
-	</div>
+    <div class="container">
+        <h2 class="text-center m-3">Workshop Details</h2>
+        <table class="table table-hover">
+            <tr class="d-flex">
+                <th class="col-3">Workshop Name :</th>
+                <td class="col">{{ workshop_type.name }}</td>
+            </tr>
+            <tr class="d-flex">
+                <th class="col-3">Duration :</th>
+                <td class="col">{{ workshop_type.duration }}</td>
+            </tr>
+            <tr class="d-flex">
+                <th class="col-3">Description :</th>
+                <td class="col">{{ workshop_type.description }}</td>
+            </tr>
+            <tr class="d-flex">
+                <th class="col-3">Terms and Conditions :</th>
+                <td class="col">{{ workshop_type.terms_and_conditions }}</td>
+            </tr>
+        </table>
+    </div>
 
 {% endblock %}
 
diff --git a/workshop_app/templates/workshop_app/workshop_type_list.html b/workshop_app/templates/workshop_app/workshop_type_list.html
index 0531864..a3d9c6e 100644
--- a/workshop_app/templates/workshop_app/workshop_type_list.html
+++ b/workshop_app/templates/workshop_app/workshop_type_list.html
@@ -4,55 +4,16 @@
 	View List of available Workshops
 {% endblock %}
 
-{% block extra %}
-
-	<!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> -->
-	    <style>
-	    /* The Modal (background) */
-	    .modal {
-		display: none; /* Hidden by default */
-		position: fixed; /* Stay in place */
-		z-index: 1; /* Sit on top */
-		padding-top: 100px; /* Location of the box */
-		left: 0;
-		top: 0;
-		width: 100%; /* Full width */
-		height: 100%; /* Full height */
-		overflow: auto; /* Enable scroll if needed */
-		background-color: rgb(0,0,0); /* Fallback color */
-		background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
-	    }
-
-	    /* Modal Content */
-	    .modal-content {
-		background-color: #fefefe;
-		margin: auto;
-		padding: 20px;
-		border: 1px solid #888;
-		width: 80%;
-	    }
-
-	    /* The Close Button */
-	    .close {
-		color: #aaaaaa;
-		float: right;
-		font-size: 28px;
-		font-weight: bold;
-	    }
-	    .close:hover,
-	    .close:focus {
-		color: #000;
-		text-decoration: none;
-		cursor: pointer;
-	    }
-	    </style>
-
-  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
- <script src="{{URL_ROOT}}/static/workshop_app/js/bootstrap-3.3.7.min.js"></script>
- {% endblock %}
-
 {% block content %}
-
+    <div class="container">
+    <h2 class="text-center">Workshop Types</h2>
+    <br>
+    {% if request.user.profile.position == 'instructor' %}
+        <a href="{% url 'add_workshop_type' %}">
+        <button class="btn btn-md btn-primary float-right mb-3 mx-4">Add Workshop Type</button>
+        </a>
+        <br>
+    {% endif %}
 	<div class="container">
 		<table class="table table-hover">
 		  <thead>
@@ -60,6 +21,7 @@
 		      <th>id</th>
 		      <th>Workshop Name</th>
 		      <th>Workshop Duration</th>
+		      <th>Action</th>
 		    </tr>
 		  </thead>
 
@@ -119,5 +81,5 @@
 		</nav>
 		</div>
 	</div>
-
+</div>
 {% endblock %}