Bootstrap v5 Migration, Style Cleanups, Formular-Umgestaltung, Layout-Verbesserungen (schließt #222)

assets/js/script.js

@@ -42,7 +42,7 @@
   });
 
   //Hero Slider
-  $('.hero-slider-items').slick({
+  $('.hero-slider').slick({
     autoplay: true,
     autoplaySpeed: 5000,
     pauseOnFocus: false,

assets/scss/_common.scss

@@ -122,14 +122,6 @@ a h4 {
   }
 }
 
-.outline-0 {
-  outline: 0 !important;
-}
-
-.d-unset {
-  display: unset !important;
-}
-
 .bg-primary {
   background: $primary-color !important;
 }
@@ -170,60 +162,6 @@ a h4 {
   font-family: $secondary-font;
 }
 
-.mb-10 {
-  margin-bottom: 10px !important;
-}
-
-.mb-20 {
-  margin-bottom: 20px !important;
-}
-
-.mb-30 {
-  margin-bottom: 30px !important;
-}
-
-.mb-40 {
-  margin-bottom: 40px !important;
-}
-
-.mb-50 {
-  margin-bottom: 50px !important;
-}
-
-.mb-60 {
-  margin-bottom: 60px !important;
-}
-
-.mb-70 {
-  margin-bottom: 70px !important;
-}
-
-.mb-80 {
-  margin-bottom: 80px !important;
-}
-
-.mb-90 {
-  margin-bottom: 90px !important;
-}
-
-.mb-100 {
-  margin-bottom: 100px !important;
-}
-
-.pl-150 {
-  padding-left: 150px;
-}
-
-.zindex-1 {
-  z-index: 1;
-}
-
-.overflow-md-hidden {
-  @include desktop {
-    overflow: hidden;
-  }
-}
-
 .vertical-align-middle {
   vertical-align: middle;
 }
@@ -464,101 +402,4 @@ details[open] summary {
 
 .fb-tile-icon {
   font-size: 96px;
-}
-
-.img-slider{
-  position: relative;
-  margin: 10px;
-  width: 95%;
-  height: 500px;
-  background: #1D212B;
-}
-
-.img-slider .is-slide{
-  z-index: 1;
-  position: absolute;
-  width: 100%;
-  clip-path: circle(0% at 0 50%);
-}
-
-.img-slider .is-slide.active{
-  clip-path: circle(150% at 0 50%);
-  transition: 2s;
-  transition-property: clip-path;
-}
-
-.img-slider .is-slide img{
-  z-index: 1;
-  width: 100%;
-  border-radius: 5px;
-}
-
-.img-slider .is-navigation{
-  z-index: 2;
-  position: absolute;
-  display: flex;
-  bottom: 20px;
-  left: 50%;
-  border-radius: 10px;
-  transform: translateX(-50%);
-  background-color: #1a1a37;
-}
-
-.img-slider .is-navigation .is-btn{
-  background: rgba(255, 255, 255, 0.5);
-  width: 12px;
-  height: 12px;
-  margin: 10px;
-  border-radius: 50%;
-  cursor: pointer;
-}
-
-.img-slider .is-navigation .is-btn.active{
-  background: #2696E9;
-  box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
-}
-
-@media (max-width: 820px){
-  .img-slider{
-    width: 600px;
-    height: 375px;
-  }
-
-  .img-slider .is-navigation{
-    bottom: 25px;
-  }
-
-  .img-slider .is-navigation .is-btn{
-    width: 10px;
-    height: 10px;
-    margin: 8px;
-  }
-}
-
-@media (max-width: 620px){
-  .img-slider{
-    width: 400px;
-    height: 250px;
-  }
-
-  .img-slider .is-navigation{
-    bottom: 15px;
-  }
-
-  .img-slider .is-navigation .is-btn{
-    width: 8px;
-    height: 8px;
-    margin: 6px;
-  }
-}
-
-@media (max-width: 420px){
-  .img-slider{
-    width: 320px;
-    height: 200px;
-  }
-
-  .img-slider .is-navigation{
-    bottom: 10px;
-  }
-}
+}

assets/scss/templates/_homepage.scss

@@ -1,4 +1,3 @@
-/* banner feature */
 .feature-icon {
   font-size: 60px;
   color: $secondary-color;
@@ -41,18 +40,6 @@
   }
 }
 
-/* /banner feature */
-
-/* course */
-.card-btn {
-  font-size: 12px;
-  padding: 5px 10px;
-}
-
-.flex-basis-33 {
-  flex-basis: 33.3333%;
-}
-
 .hover-shadow {
   transition: .3s ease;
 
@@ -61,9 +48,6 @@
   }
 }
 
-/* /course */
-
-/* success story */
 .success-video {
   min-height: 300px;
 
@@ -138,57 +122,6 @@
   }
 }
 
-/* /success story */
-
-/* events */
-.card-date {
-  position: absolute;
-  background: $primary-color;
-  font-family: $secondary-font;
-  text-align: center;
-  padding: 10px;
-  color: $white;
-  top: 0;
-  left: 0;
-  text-transform: uppercase;
-
-  span {
-    font-size: 40px;
-  }
-}
-
-/* /events */
-
-/* footer */
-.input-wrapper {
-  position: relative;
-
-  button {
-    position: absolute;
-    right: 25px;
-    top: 50%;
-    transform: translateY(-50%);
-  }
-}
-
-.form-control {
-  height: 60px;
-  background: $white;
-  border-radius: 0;
-  padding-left: 25px;
-
-  &:focus {
-    border-color: $primary-color;
-    box-shadow: none;
-  }
-}
-
-.newsletter-block {
-  .form-control {
-    height: 90px;
-  }
-}
-
 .bg-footer {
   background-color: #182b45;
 }
@@ -202,5 +135,3 @@
   border-color: #494a43 !important;
   padding-top: 75px;
 }
-
-/* /footer */