disable DTLPanel button and fix various styling issues

src/assets/css/src/2.blocks.button.css

@@ -30,10 +30,15 @@
 
 .btn[disabled] {
   cursor: not-allowed;
-  background: var(--color-black-10);
+  --btn-background: var(--color-black-10);
   --btn-color: var(--color-black-20) !important;
   --icon-color: var(--color-black-20) !important;
 }
+.btn--white[disabled] {
+  --btn-background: var(--color-white);
+  --btn-color: var(--color-grey-700) !important;
+  opacity: .5;
+}
 
 .btn.active,
 .btn[aria-pressed="true"],

src/assets/css/src/2.blocks.design-to-light.css

@@ -147,7 +147,7 @@
   top: 2rem;
   bottom: 5.5rem;
   color: var(--color-white);
-  z-index: 9999;
+  z-index: 999;
   overflow: hidden;
 }
 #dtl-panel.with-dialog {
@@ -198,7 +198,7 @@
   height: calc(100% - 3.5rem);
 }
 #dtl-panel [role="tablist"] + section {
-  height: calc(100% - 6.25rem);
+  height: calc(100% - 6rem);
 }
 
 #dtl-panel h3 {

src/assets/css/src/2.blocks.dialog.css

@@ -262,12 +262,6 @@
 #optimization-request-dialog [data-pc-name="pcclosebutton"] {
   display: none;
 }
-#project-request-dialog form,
-#optimization-request-dialog form {
-  max-width: var(--dialog-max-w);
-  height: calc(var(--dialog-max-h) - var(--dialog-header-h));
-  background: none;
-}
 #project-request-dialog #project-dtl {
   position: relative;
   padding-left: var(--space-64);

src/components/design-to-light/DTLPanel.vue

@@ -163,6 +163,7 @@
       </div>
       <footer v-if="proposals.length === 1" class="p-16">
         <button
+          disabled
           class="btn btn--white w-full"
           @click="handleOptimizationButtonClick"
         >

src/components/design-to-light/OptimizationRequestDialog.vue

@@ -8,7 +8,6 @@
     header="Demander un rendez-vous"
     class="dialog"
     :closeOnEscape="true"
-    style="z-index: 9999"
   >
     <template #header>
       <h2 class="font-serif text-lg">Demander un rendez-vous</h2>
@@ -19,7 +18,7 @@
 
     <form
       @submit.prevent="handleSubmit"
-      class="w-full p-16 flex flex-col"
+      class="w-full h-full p-16 flex flex-col"
       style="--row-gap: 1rem"
     >
       <label for="projects" class="sr-only">Projet</label>
@@ -109,11 +108,3 @@ async function handleSubmit() {
   isOpen.value = false;
 }
 </script>
-
-<style scoped>
-form {
-  position: fixed;
-  background-color: #fff;
-  z-index: 999;
-}
-</style>