kommentare hinzugefügt.

Lyuris1995 · Nov 11, 2023 · bb147db · bb147db
1 parent 6646657
commit bb147db
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 16 deletions.
diff --git a/gamescouter_test/src/index.js b/gamescouter_test/src/index.js
@@ -1,3 +1,5 @@
+
+//Funktion für das Horizontale scrollen
 document.addEventListener('DOMContentLoaded', function () {
  const ele = document.getElementById('game-timeline');
  ele.style.cursor = 'grab';
@@ -11,7 +13,7 @@ document.addEventListener('DOMContentLoaded', function () {
  pos = {
  left: ele.scrollLeft,
  top: ele.scrollTop,
- // Get the current mouse position
+ // aktuelle Mausposition
  x: e.clientX,
  y: e.clientY,
  };
@@ -21,10 +23,10 @@ document.addEventListener('DOMContentLoaded', function () {
  };
 
  const mouseMoveHandler = function (e) {
- // How far the mouse has been moved
+ // Wie weit die Maus bewegt wurde
  const dx = e.clientX - pos.x;
 
- // Scroll the element
+ // Element wird gescrollt
  ele.scrollLeft = pos.left - dx;
  };
 
@@ -36,11 +38,11 @@ document.addEventListener('DOMContentLoaded', function () {
  document.removeEventListener('mouseup', mouseUpHandler);
  };
 
- // Attach the handler
+ // Eventhandler anbinden
  ele.addEventListener('mousedown', mouseDownHandler);
 });
 
-
+//Funktion zum anzeigen des Kartencontents (für Videospielinformationen)
 function toggleCardContent(button) {
 
  const card = button.closest(".card");
@@ -58,6 +60,7 @@ function toggleCardContent(button) {
  }
 };
 
+//Funktion zum anzeigen der Filtermethoden (Genre, Datum, Publisher)
 function toggleFilterMethods() {
  const filterButton = document.getElementById("filter-button");
  const filterList = document.querySelector("#filter-list");
@@ -73,14 +76,17 @@ function toggleFilterMethods() {
  }
 };
 
+//Funktion zum anzeigen der Genre Filter
 function toggleGenreFilter() {
  document.getElementById("genre-filter").classList.toggle("active");
 }
 
+//Funktion zum anzeigen des Datum-Filters
 function toggleDateFilter() {
  document.getElementById("date-filter").classList.toggle("active");
 }
 
+//Funktion zum anzeigen des Publisher-Filters
 function togglePublisherFilter() {
  document.getElementById("publisher-filter").classList.toggle("active");
-}
+}
diff --git a/gamescouter_test/src/style.less b/gamescouter_test/src/style.less
@@ -11,14 +11,15 @@ body, html {
  overflow: hidden;
  font-size: 12px;
 
+//Custom Button
  .custom-btn {
- width: 140px;
- height: 40px;
+ width: 120px;
+ height: 35px;
  color: @BackgroundColor;
  border-radius: 5px;
  padding: 10px 25px;
- font-family: 'Lato', sans-serif;
- font-weight: 500;
+ font-family: @fontFamily;
+ font-weight: 700;
  background: transparent;
  cursor: pointer;
  transition: all 0.3s ease;
@@ -29,7 +30,7 @@ body, html {
  4px 4px 5px 0px rgba(0,0,0,.1);
  outline: none;
  }
- /* 13 */
+
  .btn-13 {
  background-color: @BrandSecondColor;
  background-image: linear-gradient(315deg, #89d8d3 0%, #03c8a8 74%);
@@ -64,7 +65,9 @@ body, html {
  .btn-13:active {
  top: 2px;
  }
+// Custom Button ende
 
+//Navbar
  .navbar {
  background-color: @BackgroundColor !important;
  border-bottom: 4px solid @BrandColor;
@@ -86,6 +89,7 @@ body, html {
  }
  }
 
+//Zeitleiste zum anzeigen der Videospiele
  #game-timeline {
  box-sizing: border-box;
  position: relative;
@@ -183,6 +187,8 @@ body, html {
  width: 140px;
  }
  }
+
+// Filter komponente
  .filter-container {
  padding: 10px;
  height: 20px;
@@ -287,12 +293,11 @@ body, html {
  }
  }
  }
-
- @media screen and (max-height: 700px) {
- margin-top: 50px;
- padding: 0px;
- }
  }
  }
 }
 
+/* @media screen and (max-height: 700px) {
+ margin-top: 50px;
+ padding: 0px;
+} */