Clean code frontend

IvanChiosa · Jan 30, 2024 · 4e616db · 4e616db
1 parent 6bc4e56
commit 4e616db
Show file tree

Hide file tree

Showing 5 changed files with 19 additions and 68 deletions.
diff --git a/frontend/src/App.css b/frontend/src/App.css
@@ -5,12 +5,6 @@
     font-family: 'Quicksand', Arial, Helvetica, sans-serif;
 }
 
-/*html, body {*/
-/*    height: 100%;*/
-/*    margin: 0;*/
-/*    padding: 0;*/
-/*}*/
-
 .App {
     display: flex;
     flex-direction: column;
@@ -19,23 +13,5 @@
     color: white;
 }
 
-/*@media screen and (min-width: 1025px) {*/
-/*    .movie-poster {*/
-/*        height: 300px;*/
-/*    }*/
-
-/*    .movie-detail {*/
-/*        flex-direction: row;*/
-/*        align-items: center;*/
-/*        top: 30px;*/
-/*    }*/
-/*    !*.movie-poster {*!*/
-/*    !*    height: 300px;*!*/
-/*    !*    border: 1px solid gold;*!*/
-/*    !*    border-radius: 10px;*!*/
-/*    !*    overflow: hidden;*!*/
-/*    !*}*!*/
-/*}*/
-
 
 
diff --git a/frontend/src/components/footer/Footer.tsx b/frontend/src/components/footer/Footer.tsx
@@ -4,7 +4,7 @@ import './Footer.css';
 const Footer: React.FC = () => {
     return (
         <footer>
-            <p>Ivan Chiosa Capstone-Projekt 02.02.2024 © 2024 neue fische. Alle Rechte vorbehalten.</p>
+            <p>Ivan Chiosa Capstone-Projekt © 2024 neue fische. Alle Rechte vorbehalten.</p>
         </footer>
     );
 };

diff --git a/frontend/src/components/header/Header.css b/frontend/src/components/header/Header.css
@@ -3,26 +3,25 @@
     margin-bottom: 0;
     height: 50px;
     display: flex;
-    align-items: center; /* Zentriert Elemente vertikal in der Navbar */
-    justify-content: space-between; /* Erzeugt gleichmäßigen Raum zwischen den Hauptelementen */
-    z-index: 1050; /* Stellen Sie sicher, dass dieser Wert höher ist als der des Hintergrundbildes */
+    align-items: center;
+    justify-content: space-between;
+    z-index: 1050;
     position: relative;
 }
 
 .container.fluid {
     padding-top: 0;
     display: flex;
-    flex-wrap: wrap; /* Erlaubt Umbrüche für kleinere Bildschirme */
+    flex-wrap: wrap;
     width: 100%;
 }
 
-/* Stil für das Brand-Element */
 .navbar-brand {
-    flex-grow: 1; /* Erlaubt es dem Brand, Raum zu beanspruchen */
+    flex-grow: 1;
     display: flex;
     align-items: center;
-    color: gold; /* Setzt die Farbe des Brands */
-    text-decoration: none; /* Entfernt Unterstreichung */
+    color: gold;
+    text-decoration: none;
 }
 
 .navbar-row {
@@ -32,32 +31,31 @@
 }
 
 .nav-link {
-    color: white; /* Setzt die Farbe der Links */
-    text-decoration: none; /* Entfernt Unterstreichung */
-    margin-right: 10px; /* Abstand zwischen den Links */
-    border: gold 1px solid; /* Setzt einen Rahmen um die Links */
+    color: white;
+    text-decoration: none;
+    margin-right: 10px;
+    border: gold 1px solid;
 }
 
 .nav-link:hover {
-    color: #9d703b; /* Farbe beim Hover */
+    color: #9d703b;
 }
 
 .movie-app:hover {
-    color: #9d703b; /* Farbe beim Hover */
+    color: #9d703b;
 }
 
-/* Stil für die Buttons */
 .navbar-collapse .ms-auto {
     display: flex;
     align-items: center;
 }
 
 button {
-    transition: 0.6s; /* Sanfter Übergang beim Hover */
+    transition: 0.6s;
 }
 
 button:hover {
-    color: #fff; /* Farbe beim Hover */
+    color: #fff;
     background-color: #17a2b8;
 }
 
@@ -99,10 +97,9 @@ button:hover {
     }
 
     .card-style {
-        margin: 10px; /* Reduzierung der Margin */
+        margin: 10px;
     }
 
-
     .navbar-collapse {
         transform: translateX(-100%);
         transition: transform 0.3s ease-in-out;
@@ -136,11 +133,11 @@ button:hover {
 
 @media screen and (max-width: 1024px) {
     .card-body {
-        font-size: 14px; /* Kleinere Schriftgröße */
+        font-size: 14px;
     }
 
     .btn-bearbeiten-löschen {
-        padding: 5px 10px; /* Kleinere Buttons */
+        padding: 5px 10px;
         font-size: 12px;
     }
 }
diff --git a/frontend/src/components/hero/Hero.css b/frontend/src/components/hero/Hero.css
@@ -1,9 +1,3 @@
-/*.min-height {*/
-/*    min-height: 100vh; !* Sorgt dafür, dass der Hauptinhalt mindestens so hoch wie das Browserfenster ist *!*/
-/*    !*padding-bottom: 0px;*!*/
-/*    !*padding-top: 0px;!* Platz für den Footer am Ende der Seite, passen Sie dies an die tatsächliche Höhe Ihres Footers an *!*!*/
-/*}*/
-
 :root {
     --img: url('https://image.tmdb.org/t/p/w500/kgJ8bX3zDQDM2Idkleis28XSVnu.jpg');
 }
@@ -13,20 +7,6 @@
     background-color: black;
 }
 
-/* Tablets und kleine Desktops */
-/*@media screen and (min-width: 768px) {*/
-/*    .movie-card-container {*/
-/*        height: 200px;*/
-/*    }*/
-/*}*/
-
-/* Große Desktops */
-/*@media screen and (min-width: 1025px) {*/
-/*    .movie-card-container {*/
-/*        height: 630px; !* der ursprünglich festgelegte Wert für große Bildschirme *!*/
-/*    }*/
-/*}*/
-
 .movie-poster {
     height: 300px;
     border: 1px solid gold;
@@ -40,7 +20,6 @@
 }
 
 .movie-card-container {
-    /*height: 100%;*/
     height: 818px;
     background-color: black;
 }

diff --git a/frontend/src/components/movieListDeleteUpdate/MovieList.css b/frontend/src/components/movieListDeleteUpdate/MovieList.css
@@ -7,7 +7,6 @@
 }
 
 .card-style {
-    /*padding: 20px;*/
     margin: 20px
 }