From f08072133c2fa2c1ce9aa05272d13a57070f693a Mon Sep 17 00:00:00 2001
From: Cris <hainberg@technikum-wien.at>
Date: Thu, 25 May 2023 12:15:24 +0200
Subject: [PATCH] Fixed: Suchcontainer nicht mehr verschoben

Groesse und Alignment an Suchfeld gebunden.
---
 public/css/components/searchbar.css         | 8 ++++++--
 public/js/components/searchbar/searchbar.js | 7 ++-----
 2 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/public/css/components/searchbar.css b/public/css/components/searchbar.css
index cecda1ff6..2bbaf9d67 100644
--- a/public/css/components/searchbar.css
+++ b/public/css/components/searchbar.css
@@ -15,13 +15,17 @@
     position: absolute; 
     z-index: 9998; 
     background-color: #fff; 
-    border: 2px solid #666;
+    border: 1px solid lightgrey;
     padding: 1rem;
     overflow-y: auto;
+    top: 100%;
+    width: 100%;
+    left: 0;
+    right: 0;
 }
 
 .searchbar_result {
-    border-bottom: 1px solid #666;
+    border-bottom: 1px solid lightgrey;
     margin-bottom: 1rem;
 }
 
diff --git a/public/js/components/searchbar/searchbar.js b/public/js/components/searchbar/searchbar.js
index 7c0993e8a..c46f87839 100644
--- a/public/js/components/searchbar/searchbar.js
+++ b/public/js/components/searchbar/searchbar.js
@@ -27,7 +27,7 @@ export default {
       organisationunit: organisationunit
     },
     template: `
-          <form ref="searchform" class="d-flex me-3" action="javascript:void(0);" 
+          <form ref="searchform" class="d-flex me-3 position-relative" action="javascript:void(0);" 
             @focusin="this.searchfocusin" @focusout="this.searchfocusout">
             <div class="input-group me-2 bg-white">
                 <input ref="searchbox" @keyup="this.search" @focus="this.showsearchresult" 
@@ -78,10 +78,7 @@ export default {
         calcSearchResultExtent: function() {
             var rect = this.$refs.searchbox.getBoundingClientRect();
             //console.log(window.innerWidth + ' ' + window.innerHeight + ' ' + JSON.stringify(rect));
-            this.$refs.result.style.top = Math.floor(rect.bottom + 3) + 'px';
-            this.$refs.result.style.right = Math.floor(window.innerWidth - rect.right) + 'px';
-            this.$refs.result.style.width = Math.floor(window.innerWidth * 0.75) + 'px';
-            this.$refs.result.style.height = Math.floor(window.innerHeight * 0.75) + 'px';
+             this.$refs.result.style.height = Math.floor(window.innerHeight * 0.80) + 'px';
         },
         search: function() {
             if( this.searchtimer !== null ) {