diff --git a/components/03_Organisms/_organisms.scss b/components/03_Organisms/_organisms.scss index 45a92ab..cf62ca3 100644 --- a/components/03_Organisms/_organisms.scss +++ b/components/03_Organisms/_organisms.scss @@ -3,4 +3,5 @@ @import 'placeList/placeList'; @import 'linkList/linkList'; @import 'footer/footer'; -@import 'form/form'; \ No newline at end of file +@import 'form/form'; +@import 'imageGrid/imageGrid'; \ No newline at end of file diff --git a/components/03_Organisms/imageGrid/_imageGrid.scss b/components/03_Organisms/imageGrid/_imageGrid.scss new file mode 100644 index 0000000..af448a1 --- /dev/null +++ b/components/03_Organisms/imageGrid/_imageGrid.scss @@ -0,0 +1,42 @@ +.LP-ImageGrid{ + + .LP-ImageGrid__List{ + list-style-type: none; + display: grid; + grid-template-columns: repeat(auto-fit, 300px); + align-content: space-around; + justify-content: center; + margin: 0px; + padding: 0px; + } + + .LP-ImageGrid__Item{ + margin-top:10px; + } + + .LP-Link{ + overflow: hidden; + } + + .LP-Image { + box-shadow: 0 0 5px $-grey; + height: 200px; + width: 290px; + object-fit: cover; + } +} + +@media(max-width: $-viewport-small){ + .LP-ImageGrid{ + .LP-ImageGrid__List{ + grid-template-columns: 1fr; + + .LP-Image{ + box-shadow: 0 0 5px $-grey; + height: auto; + width: 100%; + object-fit: cover; + } + } + } +} diff --git a/components/03_Organisms/imageGrid/imageGrid.config.json b/components/03_Organisms/imageGrid/imageGrid.config.json new file mode 100644 index 0000000..4264502 --- /dev/null +++ b/components/03_Organisms/imageGrid/imageGrid.config.json @@ -0,0 +1,11 @@ +{ + "context": { + "images": [ + "/images/Bildschirmfoto_von_2020-07-13_11-03-07.png", + "/images/photo_2020-05-02_18-11-21.jpg", + "/images/Bildschirmfoto_von_2020-07-13_20-15-00.png", + "/images/photo_2020-05-02_18-11-21.jpg", + "/images/Bildschirmfoto_von_2020-07-13_11-03-07.png" + ] + } +} \ No newline at end of file diff --git a/components/03_Organisms/imageGrid/imageGrid.hbs b/components/03_Organisms/imageGrid/imageGrid.hbs new file mode 100644 index 0000000..85acd6e --- /dev/null +++ b/components/03_Organisms/imageGrid/imageGrid.hbs @@ -0,0 +1,11 @@ +
+
+ +
+
\ No newline at end of file