From a4c957b8ef62bec5e755ea405fa6608c4a41cf36 Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Tue, 19 Oct 2021 16:19:07 +0200
Subject: [PATCH] changed scope with to css variable and removed the search
 label alignment

---
 src/app/search-page/search.component.html             | 2 +-
 src/app/shared/search-form/search-form.component.scss | 2 +-
 src/styles/_custom_variables.scss                     | 2 ++
 src/styles/_variables.scss                            | 2 --
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/app/search-page/search.component.html b/src/app/search-page/search.component.html
index 7825920d16..3489cccdfb 100644
--- a/src/app/search-page/search.component.html
+++ b/src/app/search-page/search.component.html
@@ -52,7 +52,7 @@
                     [searchPlaceholder]="'search.search-form.placeholder' | translate">
     </ds-search-form>
     <div class="row mb-3 mb-md-1">
-        <div class="labels col-sm-9 offset-sm-3">
+        <div class="labels col-sm-9">
             <ds-search-labels *ngIf="searchEnabled" [inPlaceSearch]="inPlaceSearch"></ds-search-labels>
         </div>
     </div>
diff --git a/src/app/shared/search-form/search-form.component.scss b/src/app/shared/search-form/search-form.component.scss
index 1e8f784fc3..cf3a354364 100644
--- a/src/app/shared/search-form/search-form.component.scss
+++ b/src/app/shared/search-form/search-form.component.scss
@@ -5,5 +5,5 @@
 }
 
 .scope-button {
-  max-width: $search-form-scope-max-width;
+  max-width: var(--ds-search-form-scope-max-width);
 }
diff --git a/src/styles/_custom_variables.scss b/src/styles/_custom_variables.scss
index 657737cc58..b5e5cd6f25 100644
--- a/src/styles/_custom_variables.scss
+++ b/src/styles/_custom_variables.scss
@@ -82,4 +82,6 @@
 
   --ds-slider-color: #{$green};
   --ds-slider-handle-width: 18px;
+
+  --ds-search-form-scope-max-width: 150px;
 }
diff --git a/src/styles/_variables.scss b/src/styles/_variables.scss
index 41a8e11334..badc159747 100644
--- a/src/styles/_variables.scss
+++ b/src/styles/_variables.scss
@@ -3,5 +3,3 @@
 
 @import '_bootstrap_variables.scss';
 @import '../../node_modules/bootstrap/scss/variables.scss';
-
-$search-form-scope-max-width: 150px;