From 4991dd276b9b324aa8d3ead1e07e2c130821f39d Mon Sep 17 00:00:00 2001
From: reverend <reverend@reverend2048.de>
Date: Thu, 7 Jan 2021 00:17:01 +0100
Subject: [PATCH] Using overlaybutton for 'delete' function

---
 .../05_Components/imageGrid/_imageGrid.styl   |  6 ++++
 .../05_Components/imageGrid/imageGrid.hbs     | 28 ++++++++++++++++---
 2 files changed, 30 insertions(+), 4 deletions(-)

diff --git a/components/05_Components/imageGrid/_imageGrid.styl b/components/05_Components/imageGrid/_imageGrid.styl
index 4b33cf6..7afe6cc 100644
--- a/components/05_Components/imageGrid/_imageGrid.styl
+++ b/components/05_Components/imageGrid/_imageGrid.styl
@@ -8,6 +8,12 @@ RV-ImageGrid()
 	&__Item
 		RV-ContentCrop()
 		RV-ContentCrop--center()
+		RV-OverlayButton__Item()
+		
+	&__Button
+		RV-OverlayButton__Button()
+		RV-OverlayButton__Button--topRight()
+		RV-OverlayButton__Button--medium()
 
 .RV-ImageGrid
 	RV-ImageGrid()
\ No newline at end of file
diff --git a/components/05_Components/imageGrid/imageGrid.hbs b/components/05_Components/imageGrid/imageGrid.hbs
index 7d4e664..a151b2d 100644
--- a/components/05_Components/imageGrid/imageGrid.hbs
+++ b/components/05_Components/imageGrid/imageGrid.hbs
@@ -1,8 +1,28 @@
 <div class="RV-ImageGrid">
     <ul class="RV-ImageGrid__Container">
-        <li class="RV-ImageGrid__Item"><div class="RV-Image"><img src="{{path '/images/hasi01.png'}}" alt=""></div></li>
-        <li class="RV-ImageGrid__Item"><div class="RV-Image"><img src="{{path '/images/hasi02.jpeg'}}" alt=""></div></li>
-        <li class="RV-ImageGrid__Item"><div class="RV-Image"><img src="{{path '/images/hasi03.jpeg'}}" alt=""></div></li>
-        <li class="RV-ImageGrid__Item"><div class="RV-Image"><img src="{{path '/images/hasi04.png'}}" alt=""></div></li>
+        <li class="RV-ImageGrid__Item">
+			<a href="#" class="RV-ImageGrid__Button RV-ImageGrid__Button--circle">&#215;</a>
+			<div class="RV-Image">
+				<img src="{{path '/images/hasi01.png'}}" alt="">
+			</div>
+		</li>
+        <li class="RV-ImageGrid__Item">
+			<a href="#" class="RV-ImageGrid__Button RV-ImageGrid__Button--circle">&#215;</a>
+			<div class="RV-Image">
+				<img src="{{path '/images/hasi02.jpeg'}}" alt="">
+			</div>
+		</li>
+        <li class="RV-ImageGrid__Item">
+			<a href="#" class="RV-ImageGrid__Button RV-ImageGrid__Button--circle">&#215;</a>
+			<div class="RV-Image">
+				<img src="{{path '/images/hasi03.jpeg'}}" alt="">
+			</div>
+		</li>
+        <li class="RV-ImageGrid__Item">
+			<a href="#" class="RV-ImageGrid__Button RV-ImageGrid__Button--circle">&#215;</a>
+			<div class="RV-Image">
+				<img src="{{path '/images/hasi04.png'}}" alt="">
+			</div>
+		</li>
     </ul>
 </div>
\ No newline at end of file