fix map nav responsive #2221

src/assets/main.scss

@@ -124,12 +124,36 @@ body{
             align-items: center;
             
           }
+        }
+      }
       
+    }
     @media screen and (max-width: 1300px) {
+      ul{
+        gap: 0.5em;
+        li{
+          margin:0;
+          a{
             span.label{
               display: none;
             }
-            
+            span.icon {
+              width:2em;
+              height:2em;
+              border-radius: 1em;
+            }
+          }
+        }
+      }
+    }
+    @media screen and (max-width: 880px) {
+      ul{
+        flex-flow: column;
+        width:fit-content;
+        margin: 0;
+        li{
+          a{
+            span.icon{}
           }
         }
       }

src/stores/search.js

@@ -15,7 +15,7 @@ import ResultsEntiteFields from '@api/gql/results_entite.fragment.gql'
 export const SearchStore = defineStore({
   id: 'search',
   state: () => ({
-    keys: [],
+    phrase: null,
     contentTypeFilter: 'concernements',
     results: null,
     loaded_results: null
@@ -24,10 +24,10 @@ export const SearchStore = defineStore({
     
   },
   actions: {
-    setKeys (value) {
-      console.log('setKeys', value);
+    setSearchValue (value) {
+      console.log('setSearchValue', value);
       if (value) {
-        this.keys = value.split(' ');
+        this.phrase = value;
       }
     },
     setContentType (v) {
@@ -37,7 +37,7 @@ export const SearchStore = defineStore({
       console.log('search store loadResults', this.keys);
       // this.keys = keys;
       const params = {
-        keys: this.keys.join(', '),
+        phrase: this.phrase,
         content_type: this.contentTypeFilter
       }
       const q = qs.stringify(params)

src/views/Search.vue

@@ -16,7 +16,7 @@ export default {
     }
   },
   computed: {
-    ...mapState(SearchStore,['keys', 'contentTypeFilter', 'results', 'loaded_results']),
+    ...mapState(SearchStore,['phrase', 'contentTypeFilter', 'results', 'loaded_results']),
     ...mapState(ConcernementsStore,['map_mode', 'opened_concernement']),
     // value(){
     //   return this.keys
@@ -24,13 +24,13 @@ export default {
   },
   created () {
     console.log("search created");
-    this.value = this.keys.join(' ');
+    this.value = this.phrase;
     this.content_type = this.contentTypeFilter;
   },
   watch: {
     value: {
       handler (n,o){
-        this.setKeys(n);
+        this.setSearchValue(n);
       },
       deep: true
     },
@@ -42,7 +42,7 @@ export default {
     },
   },
   methods: {
-    ...mapActions(SearchStore,['setKeys','setContentType','newSearch']),
+    ...mapActions(SearchStore,['setSearchValue','setContentType','newSearch']),
     ...mapActions(ConcernementsStore,['openCloseConcernements']),
     onSubmitSearch (event) {
       console.log("onSubmitSearch", event, this.value);