From 46dc958cb7c7427ea5ea7048a837ee75406c299f Mon Sep 17 00:00:00 2001
From: net8floz <net8floz@gmail.com>
Date: Thu, 20 Feb 2020 12:26:20 -0800
Subject: [PATCH] more font and label adjustments for forms

---
 src/styles/styles.scss                | 44 +++++++++++++++++----------
 src/views/Accounts/Register/Step1.vue |  1 +
 src/views/Accounts/Register/Step2.vue |  4 ++-
 src/views/Accounts/Register/index.vue | 26 +++++++++++-----
 4 files changed, 50 insertions(+), 25 deletions(-)

diff --git a/src/styles/styles.scss b/src/styles/styles.scss
index 8f022af..7b88cc4 100644
--- a/src/styles/styles.scss
+++ b/src/styles/styles.scss
@@ -1,20 +1,20 @@
 .cwhq-app {
-  @import "./colors.scss";
-  @import "./application.scss";
-  @import "./quiz-scroll.scss";
-  @import "./quiz-answer.scss";
-  @import "./quiz-need-help.scss";
-  @import "./quiz-bar-rank.scss";
-  @import "./content.scss";
-  @import "./social-pop-over.scss";
-  @import "./casing.scss";
-  @import "./cwhq-bar.scss";
-  @import "./quiz-bar.scss";
-  @import "./leaderboard-bar.scss";
-  @import "./ballot-card.scss";
-  @import "./ballot-modal.scss";
-  @import "./buttons.scss";
-  @import "./mobile-warning.scss";
+  @import './colors.scss';
+  @import './application.scss';
+  @import './quiz-scroll.scss';
+  @import './quiz-answer.scss';
+  @import './quiz-need-help.scss';
+  @import './quiz-bar-rank.scss';
+  @import './content.scss';
+  @import './social-pop-over.scss';
+  @import './casing.scss';
+  @import './cwhq-bar.scss';
+  @import './quiz-bar.scss';
+  @import './leaderboard-bar.scss';
+  @import './ballot-card.scss';
+  @import './ballot-modal.scss';
+  @import './buttons.scss';
+  @import './mobile-warning.scss';
 
   .v-alert {
     font-size: 20px;
@@ -22,6 +22,7 @@
 
   .v-input {
     font-size: 20px;
+    margin-bottom: 12px;
   }
 
   .v-messages {
@@ -35,3 +36,14 @@
     }
   }
 }
+
+.v-form {
+  .v-select__slot {
+    padding-top: 10px;
+  }
+
+  label {
+    font-size: 22px !important;
+    top: -2px;
+  }
+}
diff --git a/src/views/Accounts/Register/Step1.vue b/src/views/Accounts/Register/Step1.vue
index 3ed9daf..dd7cf13 100644
--- a/src/views/Accounts/Register/Step1.vue
+++ b/src/views/Accounts/Register/Step1.vue
@@ -26,6 +26,7 @@
       />
 
       <v-select
+        single-line
         color="input"
         v-bind="fields.heardAboutUs"
         v-model="fields.heardAboutUs.value"
diff --git a/src/views/Accounts/Register/Step2.vue b/src/views/Accounts/Register/Step2.vue
index 0efe1a3..fcda302 100644
--- a/src/views/Accounts/Register/Step2.vue
+++ b/src/views/Accounts/Register/Step2.vue
@@ -27,6 +27,7 @@
         :disabled="isSubmitting"
       />
       <v-select
+        single-line
         v-bind="fields.age"
         v-model="fields.age.value"
         :disabled="isSubmitting"
@@ -92,7 +93,8 @@ export default {
   props: ["fields"],
   computed: {
     needsParentConsent() {
-      return this.fields.age.value === "12 years old or lower";
+      const ageNum = parseInt(this.fields.age.value);
+      return ageNum < 13;
     }
   },
   methods: {
diff --git a/src/views/Accounts/Register/index.vue b/src/views/Accounts/Register/index.vue
index 5c6dc30..4b69ac0 100644
--- a/src/views/Accounts/Register/index.vue
+++ b/src/views/Accounts/Register/index.vue
@@ -208,7 +208,7 @@ export default {
           label: "How did you hear about the Code Challange?",
           type: "select",
           items: [
-            "Choose an option",
+            "How did you hear about the Code Challange?",
             "I'm a CodeWizardsHQ Student",
             "CWHQ newsletter",
             "CWHQ website",
@@ -218,8 +218,12 @@ export default {
             "Your school or PTA",
             "Other"
           ],
-          value: "Choose an option",
-          rules: [v => v !== "Choose an option" || "Please choose an option"]
+          value: "How did you hear about the Code Challange?",
+          rules: [
+            v =>
+              v !== "How did you hear about the Code Challange?" ||
+              "Please choose an option"
+          ]
         },
         heardAboutUsText: {
           label: "Tell us where you heard about the Code Challenge!",
@@ -237,11 +241,15 @@ export default {
           rules: [v => !!v || "Please enter a date of birth"]
         },
         age: {
-          label: "Hold old is the student?",
+          label: "How old is the student?",
           type: "select",
           items: [
-            "Choose an option",
-            "12 years old or lower",
+            "How old is the student?",
+            "8 years old",
+            "9 years old",
+            "10 years old",
+            "11 years old",
+            "12 years old",
             "13 years old",
             "14 years old",
             "15 years old",
@@ -249,8 +257,10 @@ export default {
             "17 years old",
             "18 years old or older"
           ],
-          value: "Choose an option",
-          rules: [v => v !== "Choose an option" || "Please choose an option"]
+          value: "How old is the student?",
+          rules: [
+            v => v !== "How old is the student?" || "Please choose an option"
+          ]
         },
         tos: {
           label: "I agree to the Terms of Use and Privacy Policy",