apply thd theme

src/assets/app.js

-import '../../node_modules/bootstrap/dist/js/bootstrap'

src/assets/app.scss

@@ -5,19 +5,21 @@
 @import "../../node_modules/bootstrap-scss/functions"; 
 // @import "bootstrap/variables"; 
 @import "../../node_modules/bootstrap-scss/variables";
-// $theme-colors: map-remove($theme-colors, "primary", "danger"); 
+// $theme-colors: map-remove($theme-colors, "primary", "danger");
+@import "../../node_modules/bootstrap-scss/mixins" ;
 // Then add additional custom code here
 
 $thdblue: #1a4273; 
 $thddarkgrey: #6f6f6e; 
 $thdgrey: #a8a8a8; 
 $thdlightgrey: #dadada; 
-$green: rgb(91, 227, 0); // for tests
+$thddonaublue: #009fe3; // for tests
 
 $theme-colors: ( 
-    "primary": $thdblue, 
+    "primary": $thdblue,
+    "success":  $thddonaublue,
     "danger": rgb(231, 61, 85)
-    );
+);
 
 //$body-bg: $green;
 

src/components/navbar.vue

@@ -102,7 +102,7 @@
   background-color: rgba(0, 0, 0, 0.6);
 }
 /* if the windows is small the navbar will not be fixed top any more */
-@media (max-width: 991.98px) {
+@media (max-width: 1000 px) {
   .fixed-top {
     position: relative !important;
   }

src/views/SickForm.vue

 <template>
   <form
-    class="container mb-3 mt-3 p-2 border border-info rounded"
+    class="container mb-3 mt-3 p-2 border border-success rounded needs-validation"
     @submit.prevent="OnSubmit"
     enctype="multipart/form-data"
   >
   <div class="row">
   <div class="col-md-8">
     <!--1. name-->
-    <div class="form-row">
+    <div class="form-row" >
       <div class="form-group col-md-5 col-sm-12 col-sm-12">
-        <label for="fname">Vorname</label>
+        <label for="fname" class="form-label">Vorname</label>
         <input
           type="text"
           class="form-control"
@@ -17,6 +17,7 @@
           v-model="patientStudent.ForeName"
           required
         />
+        <div class="valid-feedback">sieht gut aus!</div>
       </div>
       <div class="form-group col-md-5 col-sm-12">
         <label for="lname">Nachname</label>