better cartouch css

src/assets/main.scss

@@ -224,7 +224,7 @@ div.loading{
       box-sizing: border-box;
       width:$cartouch_width_full;
       height: 100%;
-      padding: 2rem 2rem 1rem;
+      padding: 1rem 1rem 1rem;
       overflow-y: auto;
       overflow-x: hidden;
       //
@@ -263,7 +263,7 @@ div.loading{
       // layout
       >header{
         flex: 0 0 auto;
-        padding: 0 0 1em 0;
+        // padding: 0 0 1em 0;
       }
       >main{
         flex: 1 1 auto;
@@ -305,7 +305,7 @@ div.loading{
           // display: flex;
           // flex-direction: column;
           // justify-content: flex-end;
-          padding-bottom: 0.5em;
+          // padding-bottom: 0.5em;
           label, h3{
             // height: 70px;
             box-sizing: border-box;
@@ -325,15 +325,22 @@ div.loading{
               font-weight: bold;
             }
           }
-          // span.menacemaintient{
-          //   display: block;
-          //   font-weight: 100;
-          //   font-size: 0.882em;
-          //   padding: 1em 0;
-          // }
+          
+          section.entite-params{
+            padding:0.5em 0;
+            display: flex;
+            flex-direction: row;
+            gap:0.5em;
+            align-items: center;
+            >section.editable{
+              // margin: 0.3em;
+              flex: 1 0 auto;
+            }
+          }
 
         }
         div.concernement-cartouche-icons{
+          margin-bottom: 1em;
           h2{
             font-weight: 400;
             font-size: 1.512em;
@@ -341,6 +348,7 @@ div.loading{
             //   font-weight: 100;
             // }
             padding-bottom: 0.5em;
+            margin-top: 0;
             overflow: hidden;
             display: -webkit-box;
             -webkit-box-orient: vertical;
@@ -379,12 +387,22 @@ div.loading{
           transition: max-height 0.5s ease-in-out,padding 0.5s ease-in-out;
           max-height: 100px;
           overflow: hidden;
-          &.hidden{
+          // &.hidden{
+          //   max-height: 0;
+          //   padding-bottom: 0;
+          // }
+        }
+      }
+      &.entity-opened{
+        >header{
+          div.concernement-cartouche-icons{
+            label{
               max-height: 0;
               padding-bottom: 0;
             }
           }
         }
+      }
 
       >main{
         overflow-y: auto;
@@ -699,7 +717,7 @@ div.loading{
       span.date{
         @include font_questions();
         display: block;
-        padding: 0 0 1em 0;
+        padding: 0 0 0.3em 0;
       }
       ul, li{
         padding:0; margin:0;
@@ -1065,7 +1083,7 @@ div.dp__main{
   border-radius: 5px;
   $p:0.3em;
   padding:$p;
-  margin:0.5em 0 0 -$p;
+  margin:0 0 0 -$p;
   box-sizing: border-box;
   transition: all 0.2s ease-in-out;
   box-shadow: 2px 2px 4px #bbb;

src/components/ConcernementMapItem.vue

@@ -2625,7 +2625,7 @@ export default {
           if (group_to_hit) {
             let result = group_to_hit.hitTest(event.point);
             console.log('click result', result);
-            if (result) {
+            if (result && result.item.item_id && (result.item.name != "label_click_zone" || this.detailsZoomValue > 2)) {
               switch (this.map_mode) {
                 case "terraindevie":
                 case "superposition":

src/components/contents/TerrainDeVie.vue

@@ -594,9 +594,9 @@ export default {
           </div>
         </section>
 
+        <section class="entite-params" v-if="entite && entite.can_update">
           <!-- active -->
           <CheckboxEditable
-          v-if="entite && entite.can_update"
             :checked="this.parag_entite.active"
             label="Active" 
             :data="{
@@ -608,7 +608,6 @@ export default {
 
           <!-- agissante -->
           <CheckboxEditable
-          v-if="entite && entite.can_update"
             :checked="entite.agissante"
             label="Entité action" 
             :data="{
@@ -618,8 +617,8 @@ export default {
               field: 'field_entite_agissante'}"
               v-on:updated="reloadConcernementEntites(cid)"/>
 
+          <!-- confidentialité -->
           <SelectEditable
-          v-if="entite && entite.can_update"
             label="Confidentialité"
             :value="entite.confidentialite"
             :options="{
@@ -632,6 +631,7 @@ export default {
               nid: this.entite.id,
               field: 'field_confidentialite'}"
               v-on:updated="reloadConcernementEntites(cid)"/>
+        </section>
 
 
       </div>

src/components/layout/CartoucheLayout.vue

@@ -25,18 +25,18 @@ export default {
   },
   mounted () {
     // console.log('cartouche layout mounted', this);
-    this.$refs.cartouche_main.addEventListener('scroll', (event) => {
+    // this.$refs.cartouche_main.addEventListener('scroll', (event) => {
     //   console.log('main is scrolling', event);
-      let $main = event.target;
-      let scrolled = $main.scrollTop > 0;
-      this.$emit('main_scrolled', scrolled);
-      // TODO how to make this failsafe limit responsive ? 
-      if(scrolled && $main.scrollHeight > 900){
-        this.headerreduced = true;
-      } else {
-        this.headerreduced = false;
-      }
-    })
+    //   let $main = event.target;
+    //   let scrolled = $main.scrollTop > 0;
+    //   this.$emit('main_scrolled', scrolled);
+    //   // TODO how to make this failsafe limit responsive ? 
+    //   if(scrolled && $main.scrollHeight > 900){
+    //     this.headerreduced = true;
+    //   } else {
+    //     this.headerreduced = false;
+    //   }
+    // })
   },
   computed: {
     ...mapState(ConcernementsStore,['concernementsByID', 'opened_concernement', 'ct_concernement']),
@@ -74,8 +74,8 @@ export default {
 <template>
   <header ref="cartouche_header">
     <div class="concernement-cartouche-icons">
-      <label :class="{ hidden: headerreduced }">{{ ct_concernement.title.description }}</label>
-      
+      <label class="concernement-label">{{ ct_concernement.title.description }}</label>
+      <!-- :class="{ hidden: headerreduced }" -->
       <ContentEditable 
         tag="h2"
         :value="concernement.title" 

src/views/Concernement.vue

@@ -230,7 +230,7 @@ export default {
 </script>
 
 <template>
-  <section v-if="opened_concernement" class="concernement">
+  <section v-if="opened_concernement" class="concernement" :class="{ 'entity-opened': main_cid_eid.eid }">
     <TerrainDeVie v-if="map_mode === 'terraindevie' || map_mode === 'action' || map_mode === 'superposition' || map_mode === 'proximite'" :cid="main_cid_eid.cid" :eid="main_cid_eid.eid"/>
     <PuissanceAgir v-if="map_mode === 'puissancedagir'" :cid="cid"/>
     <Doleancer v-if="map_mode === 'doleancer'" :cid="cid"/>