From fe9626826144dfbf0b43e4f6c5f60aefc1814681 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Corentin=20S=C3=A9chet?= <csechet@entrouvert.com>
Date: Mon, 9 May 2022 09:49:02 +0200
Subject: [PATCH] scss: add vertical margin to autocomplete element (#64967)

---
 static/includes/_forms.scss |  7 +++++
 static/includes/_utils.scss | 52 +++++++++++++++++++++++++++++++++++++
 2 files changed, 59 insertions(+)

diff --git a/static/includes/_forms.scss b/static/includes/_forms.scss
index 402e4df0..05fce88a 100644
--- a/static/includes/_forms.scss
+++ b/static/includes/_forms.scss
@@ -445,6 +445,13 @@ span.select2-container {
 	}
 	span.select2-selection--multiple {
 		min-height: 0;
+		padding-top: calc(#{extract-top($widget-padding)} - 0.2rem);
+		padding-bottom: calc(#{extract-bottom($widget-padding)} - 0.2rem);
+
+		.select2-selection__choice, .select2-search {
+			margin: 0.2rem 0.5rem 0.2rem 0;
+        }
+
 		.select2-selection__rendered {
 			display: block;
 		}
diff --git a/static/includes/_utils.scss b/static/includes/_utils.scss
index 6749b943..d49e9c7d 100644
--- a/static/includes/_utils.scss
+++ b/static/includes/_utils.scss
@@ -34,6 +34,58 @@ $black: #000000 !default;
 	@return 0;
 }
 
+@function extract-top($spacing){
+	@return nth($spacing, 1);
+}
+
+@function extract-right($spacing){
+	@if (length($spacing) == 1) {
+		@return nth($spacing, 1);
+	}
+
+	@if (length($spacing) == 2) {
+		@return nth($spacing, 2);
+	}
+
+	@if (length($spacing) == 4) {
+		@return nth($spacing, 2);
+	}
+
+	@error "Invalid spacing #{spacing}";
+}
+
+@function extract-bottom($spacing){
+	@if (length($spacing) == 1) {
+		@return nth($spacing, 1);
+	}
+
+	@if (length($spacing) == 2) {
+		@return nth($spacing, 1);
+	}
+
+	@if (length($spacing) == 4) {
+		@return nth($spacing, 3);
+	}
+
+	@error "Invalid spacing #{spacing}";
+}
+
+@function extract-left($spacing){
+	@if (length($spacing) == 1) {
+		@return nth($spacing, 1);
+	}
+
+	@if (length($spacing) == 2) {
+		@return nth($spacing, 2);
+	}
+
+	@if (length($spacing) == 4) {
+		@return nth($spacing, 4);
+	}
+
+	@error "Invalid spacing #{spacing}";
+}
+
 // Check if value is a number > 0;
 @function is-positive-number($value) {
 	@return type-of($value) == 'number' and $value > 0;
-- 
2.35.1