Fixing ImageGrid and Lightbox

components/03_Organisms/_organisms.scss

@@ -4,6 +4,6 @@
 @import 'linkList/linkList';
 @import 'footer/footer';
 @import 'form/form';
-//@import 'imageGrid/imageGrid';
+@import 'imageGrid/imageGrid';
 //@import 'osmMap/osmMap';
 //@import 'userProfile/userProfile';

components/03_Organisms/imageGrid/_imageGrid.scss

@@ -1,11 +1,25 @@
-.LP-ImageGrid{
-	@include RV-FlexGrid(290px, 200px);
-	@include RV-ElementList;
-	@include RV-Spacing__Inner--small;
+@use "sass:math";
 
+.LP-ImageGrid{
+
+	&__Container {
+		@include RV-Grid;
+		@include RV-Grid--fixedSize;
+		--fixedSize: var(--itemWidth);
+		--itemWidth: 290px;
+		--itemHeight: 200px;
+		list-style-type: none;
+		--gap: #{$-spacing-small};
+	}
+	
     &__Item {
 		position: relative;
-		@include RV-ContentCrop;
+		
+		.LP-Image {
+			height: 100%;
+			width: 100%;
+			object-fit: cover;
+		}
 
 		&--add {
 			.LP-Link {
@@ -50,8 +64,8 @@
 			height: #{$-spacing-small * 2};
 			width: #{$-spacing-small * 2};
 			position:relative;
-			left: #{($-spacing-large - $-spacing-small) / 3.2};
-			top: #{($-spacing-large - $-spacing-small) / 3.2};
+			left: #{math.div($-spacing-large - $-spacing-small, 3.2)};
+			top: #{math.div($-spacing-large - $-spacing-small, 3.2)};
 		}
 	}
 	
@@ -91,9 +105,10 @@
 			pointer-events: initial;
 		}
 	}
-	
+
 	&__FullSizeImage {
 		grid-area: picture;
+		justify-self: center;
 	}
 	
 	&__Previous{

components/03_Organisms/imageGrid/imageGrid.hbs

@@ -4,7 +4,7 @@
         {{#each images}}
         <li class="LP-ImageGrid__Item">
             <a href="#{{this.current_id}}" class="LP-Link">
-                <img  class="LP-Image" src="{{this}}">
+                <img  class="LP-Image" src="{{this.url}}">
             </a>
             <span class="LP-ImageGrid__DeleteItem" title="Bild löschen">
                 <a href="#" class="LP-Link">