/admin page can now create more than one question & has style changes

app/static/style.css

@@ -19,11 +19,11 @@
 
 	--colour-error: "#E2725B";
 
-	--size-xs: 10px;
-	--size-s: 16px;
-	--size-m: 26px;
-	--size-l: 42px;
-	--size-xl: 68px;
+	--size-xs: 5px;
+	--size-s: 8px;
+	--size-m: 16px;
+	--size-l: 24px;
+	--size-xl: 36px;
 
 	font-family: Helvetica Arial sans-serif;
 	font-size: var(--font-size);
@@ -54,12 +54,22 @@
 	width: 100%;
 	justify-content: space-between;
 }
+.flex-row {
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+}
 
 
 .surface {
 	padding: var(--size-l);
 	border-radius: var(--size-s);
 	background-color: var(--colour-05);
+	display: flex;
+	flex-direction: column;
+}
+.surface > *:not(:last-child) {
+	margin-bottom: var(--size-l);
 }
 
 .card {
@@ -68,7 +78,47 @@
 	background-color: var(--colour-50);
 }
 
-
+form > div {
+	width: 100%;
+	display: flex;
+	flex-direction: column;
+	align-items: start;	
+}
+form > div:not(:last-child) {
+	margin-bottom: var(--size-m);
+}
+input[type="text"] {
+	width: 100%;
+	padding: var(--size-xs);
+	border-radius: var(--size-xs) var(--size-xs) 0 0;
+	background-color: var(--colour-05);
+	border: none;
+	border-bottom: 2px solid var(--colour-80);
+	margin-top: var(--size-xs);
+	font-size: 1rem;
+}
+input[type="checkbox"]{
+	margin-left: var(--size-m);
+	width: var(--size-l);
+    height: var(--size-l);
+    appearance: none;
+	border-radius: var(--size-xs);
+    border: 2px solid var(--colour-80);
+	background-color: var(--colour-05);
+	cursor: pointer;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+}
+input[type="checkbox"]:checked {
+	background-color: var(--colour-80);
+}
+input[type="checkbox"]:checked::before {
+    content: '\2713'; /* Unicode checkmark character */
+    display: block;
+    color: var(--colour-05); 
+	font-size: var(--size-m);
+}
 
 button {
 	border: inherit;
@@ -83,7 +133,7 @@ button {
 	border-radius: var(--size-xs);
 	background-color: var(--colour-80);
 	color: var(--colour-20);
-	width: calc(3 * var(--size-xl));
+	width: calc(5 * var(--size-xl));
 	text-align: center;
 	cursor: pointer;
 	justify-self: start;

app/templates/atoms/survey_card.html

@@ -7,4 +7,5 @@ <h3>
 	{% if show_edit %}
 	{{ render_partial("atoms/button.html", text="Edit", to="/admin/surveys/" + survey.uid.__str__()) }}
 	{% endif %}
+  </div>
 </div>

app/templates/create_survey.html

@@ -3,16 +3,47 @@
 {% block content %}
 <h3>New Survey</h3>
 
-<form hx-post="/surveys/new" hx-swap="true">
+<script>
+  var nextQuestionIndex = 1;
+  const addQuestion = () => {
+    // Create a new div element
+    var newQuestionDiv = document.createElement('div');
+
+    // Set the HTML content for the new div
+    newQuestionDiv.innerHTML = `
+      <label>Question #${nextQuestionIndex + 1}:</label>
+      <input type="text" name="question-${nextQuestionIndex}">
+    `;
+
+    // Get the form element by its ID
+    var form = document.getElementById('survey-creation-form');
+
+    // Insert the new div as the second-to-last element in the form
+    // (before the last submit button)
+    form.insertBefore(newQuestionDiv, form.lastElementChild);
+
+    // Increment the next question index
+    nextQuestionIndex++;
+  }
+</script>
+
+<form hx-post="/surveys/new" hx-swap="true" id='survey-creation-form'>
   <div>
-    <label>Survey Title</label>
-    <input name="name">
+    <label>Survey Title:</label>
+    <input type="text" name="name">
   </div>
-  <div>
-    <label>Publish?</label>
+  <div class="flex-row">
+    <label>Publish:</label>
     <input type="checkbox" name="is_open">
   </div>
-  <button class="button">Submit</button>
+  <div>
+    <label>Question #1:</label>
+    <input type="text" name="question-0">
+  </div>
+  <div class="button-row">
+	<button class="button" type="submit">Submit</button>
+	<button class="button" type="button" onclick="addQuestion()">Add Question</button>
+  </div>
 </form>
 
 {% endblock %}

app/templates/molecules/survey_submitted.html

@@ -7,5 +7,5 @@
 	  UID: {{survey_uid}}
 	</small>
   </p>
-  {{ render_partial("atoms/button.html", text="View Survey", to="/survey/" + survey_uid) }}
+  {{ render_partial("atoms/button.html", text="View Survey", to="/surveys/" + survey_uid) }}
 </div>

app/utils.py

@@ -66,8 +66,8 @@ def validate_survey_data(data: Any) -> str | None:
     if not isinstance(data.get("is_open", ""), str):
         return f"'is_open' field was {type(data.get('is_open'))}, expected str or None."
 
-    if not (data.get("is_open") is None or data.get("is_open", "").lower() == "true"):
-        return f"'is_open' field was {data.get('is_open')}, expected 'true' or missing."
+    if not (data.get("is_open") is None or data.get("is_open", "").lower() == "on"):
+        return f"'is_open' field was {data.get('is_open')}, expected 'on' or missing."
 
     if not isinstance(data.get("name"), str):
         return f"'name' field was a {type(data['name'])}, expected string."

tests/integration/test_application.py

@@ -26,7 +26,7 @@ class TestMutationEndpoints:
             "/surveys/new",
             {
                 "name": "test mutable endpoints 1",
-                "is_open": True,
+                "is_open": "on",
                 "questions": [],
             },
             "/surveys",
@@ -36,7 +36,7 @@ class TestMutationEndpoints:
             "/surveys/new",
             {
                 "name": "test mutable endpoints 2",
-                "is_open": True,
+                "is_open": "on",
                 "question-0": "What's my name again?",
                 "question-1": "What's you name again?",
                 "question-2": "Why are we here again?",
@@ -71,7 +71,7 @@ class TestDataPersistency:
         (
             "post",
             "/surveys/new",
-            {"name": "test", "is_open": True, "question-0": "Hello there!"},
+            {"name": "test", "is_open": "on", "question-0": "Hello there!"},
             "/surveys",
         ),
     ]
@@ -83,7 +83,7 @@ def create_new_data_service(database_file: Path) -> DataService:
     @staticmethod
     def create_survey_in_database(database_file: Path) -> None:
         data_service = TestDataPersistency.create_new_data_service(database_file)
-        survey = Survey(name="Test Survey", is_open=True)
+        survey = Survey(name="Test Survey", is_open="on")
         data_service.insert_survey(survey)
 
     def test_different_data_services_interact_with_the_same_database(

tests/unit/test_routes.py

@@ -165,7 +165,7 @@ class TestCreateSurveyEndpoint:
         (
             {
                 "name": "test survey - open",
-                "is_open": True,
+                "is_open": "on",
                 "question-0": "What's my name again?",
                 "question-1": "What's your name again?",
             },
@@ -196,7 +196,7 @@ class TestCreateSurveyEndpoint:
         (
             {
                 "name": "test survey - with questions",
-                "is_open": True,
+                "is_open": "on",
                 "question-0": "How are you today?",
                 "question-1": "What day is it?",
             },
@@ -266,23 +266,23 @@ def test_post_requests_can_return_html(
                 "/surveys/new",
                 {
                     "name": "Malformed questions.",
-                    "is_open": True,
+                    "is_open": "on",
                     "questions": "questions should have a name of question-X",
                 },
             ),
             (
                 "/surveys/new",
                 {
                     "name": "Malformed questions.",
-                    "is_open": True,
+                    "is_open": "on",
                     "question-1": "key should be question-X, starting at x=0",
                 },
             ),
             (
                 "/surveys/new",
                 {
                     "name": "Malformed questions.",
-                    "is_open": True,
+                    "is_open": "on",
                     "question-0": "key should be question-X, starting at x=0",
                     "question-2": "questions should have an incrementing index.",
                 },

tests/unit/test_utils.py

@@ -9,7 +9,7 @@
     (
         {
             "name": "Survey Name",
-            "is_open": "True",
+            "is_open": "on",
             "question-0": "What's my name again?",
         },
         {
@@ -36,7 +36,7 @@ def test_validate_survey_data_returns_no_errors_on_correct_data(data: Any):
         "Should be a dict",
         {
             "name": "Survey Name",
-            "is_open": "True",
+            "is_open": "on",
             "question-1": "What's my name again?",  # questions should be 0 indexed.
         },
         {
@@ -46,13 +46,13 @@ def test_validate_survey_data_returns_no_errors_on_correct_data(data: Any):
         },
         {
             "name": "Survey Name",
-            "is_open": "True",
+            "is_open": "on",
             "question-0": "What's my name again?",
             "question-3": "What's my name again?",
         },  # question should have incrementing indices
         {
             "name": [],  # Name should be a string
-            "is_open": "True",
+            "is_open": "on",
             "question-0": "What's my name again?",
         },
         {