From: Hypolite Petovan <hypolite@mrpetovan.com>
Date: Tue, 13 Dec 2022 02:56:23 +0000 (-0500)
Subject: Normalize padding in image grid
X-Git-Url: https://git.mxchange.org/?a=commitdiff_plain;h=2fa9d49632129129615d8c9afea30ec5885809bb;p=friendica.git

Normalize padding in image grid

- Remove outside padding, vertical and horizontal
- Remove artificial padding with <br> in content/image.tpl
---

diff --git a/view/global.css b/view/global.css
index 81a1ba2095..d327da0c2c 100644
--- a/view/global.css
+++ b/view/global.css
@@ -687,25 +687,22 @@ audio {
 .imagegrid-row {
 	display: -ms-flexbox; /* IE10 */
 	display: flex;
-	-ms-flex-wrap: wrap; /* IE10 */
-	flex-wrap: wrap;
-	padding: 0 4px;
-	box-sizing: border-box;
+	margin-top: 1em;
+	column-gap: 5px;
 }
 
-/* Create four equal columns that sits next to each other */
 .imagegrid-column {
 	-ms-flex: 50%; /* IE10 */
 	flex: 50%;
-	max-width: 50%;
-	padding: 0 4px;
-	box-sizing: border-box;
+	display: -ms-flexbox; /* IE10 */
+	display: flex;
+	flex-direction: column;
+	row-gap: 5px;
 }
 
 .imagegrid-column img {
-	margin-top: 8px;
-	vertical-align: middle;
-	width: 100%;
+	-ms-flex: 50%; /* IE10 */
+	flex: 50%;
 }
 /**
  * Image grid settings END
diff --git a/view/templates/content/image.tpl b/view/templates/content/image.tpl
index 2885d869fb..92a37915ff 100644
--- a/view/templates/content/image.tpl
+++ b/view/templates/content/image.tpl
@@ -3,4 +3,3 @@
 {{else}}
 <img src="{{$image.src}}" alt="{{$image.attachment.description}}" title="{{$image.attachment.description}}">
 {{/if}}
-<br>