converted ouatminimal theme css to scss

src/web/themes/custom/ouatminimal_theme/css/ouatminimal.css

@@ -3,10 +3,12 @@
   background-color: #434343;
   padding: 0.5rem 0 0;
 }
+
 .adminimal .page-title,
 .adminimal .heading-a {
   font-size: 1.5em;
 }
+
 .toolbar-tray a {
   padding: 0.5em 1.3333em;
 }
@@ -17,14 +19,12 @@
 }
 
 /* END trying to get more vertical space for the boussole */
-
-
-.adminimal input.form-autocomplete, .adminimal input.form-text, .adminimal input.form-tel, .adminimal input.form-email, .adminimal input.form-url, .adminimal input.form-search, .adminimal input.form-number, .adminimal input.form-color, .adminimal input.form-file, .adminimal input.form-date, .adminimal input.form-time, .adminimal textarea.form-textarea{
+.adminimal input.form-autocomplete, .adminimal input.form-text, .adminimal input.form-tel, .adminimal input.form-email, .adminimal input.form-url, .adminimal input.form-search, .adminimal input.form-number, .adminimal input.form-color, .adminimal input.form-file, .adminimal input.form-date, .adminimal input.form-time, .adminimal textarea.form-textarea {
   background-color: #fff;
   border-radius: 3px;
 }
 
-.adminimal select{
+.adminimal select {
   background-color: #fff;
   border-radius: 3px;
 }
@@ -34,30 +34,36 @@
   border-radius: 5px;
   padding: 0.3em 0.5em;
 }
+
 .adminimal .button,
 .adminimal .image-button {
   margin-right: 0.5em;
   margin-left: 0.5em;
 }
+
 .adminimal .button:first-child,
 .adminimal .image-button:first-child {
   margin-right: 0;
   margin-left: 0;
 }
 
-.js td .dropbutton-multiple{
+.js td .dropbutton-multiple {
   border-radius: 3px;
 }
-.views-exposed-form{
+
+.views-exposed-form {
   font-size: 0.9em;
 }
-.views-exposed-form input[type="text"]{
-  max-width:10em;
+
+.views-exposed-form input[type=text] {
+  max-width: 10em;
 }
-.views-exposed-form input[type="text"].form-autocomplete{
-  max-width:14em;
+
+.views-exposed-form input[type=text].form-autocomplete {
+  max-width: 14em;
 }
-.views-exposed-form select.form-select{
+
+.views-exposed-form select.form-select {
   min-height: 0;
   padding: 0.2em 0.4em 0.2em 0.5em;
 }
@@ -65,44 +71,36 @@
 /**
  * Node add/edit form layout
  */
-
 /* Narrow screens */
 .layout-region {
   box-sizing: border-box;
 }
 
 /* Wide screens */
-@media
-  screen and (min-width: 780px),
-  (orientation: landscape) and (min-device-height: 780px) {
-  
-  .layout-region-node-center{
+@media screen and (min-width: 780px), (orientation: landscape) and (min-device-height: 780px) {
+  .layout-region-node-center {
     display: flex;
     flex-direction: row;
     gap: 1em;
   }
-
-  [dir="rtl"] .layout-region-node-center{
+  [dir=rtl] .layout-region-node-center {
     display: flex;
     flex-direction: row-reverse;
   }
-
   .layout-region-node-main {
     /* reset */
     float: none;
     box-sizing: border-box;
     width: auto;
-    padding-right:0; /* LTR */
+    padding-right: 0; /* LTR */
     /* custom */
     flex: 1 0 auto;
   }
-
-  [dir="rtl"] .layout-region-node-main{
+  [dir=rtl] .layout-region-node-main {
     float: none;
     padding-right: 0;
     padding-left: 0;
   }
-
   .layout-region-node-secondary {
     /* reset */
     float: none; /* LTR */
@@ -110,11 +108,9 @@
     /* custom */
     flex: 0 0 25em;
   }
-
-  [dir="rtl"] .layout-region-node-secondary {
+  [dir=rtl] .layout-region-node-secondary {
     float: none;
   }
-
   /* @todo File an issue to add a standard class to all text-like inputs */
   .layout-region-node-secondary .form-autocomplete,
   .layout-region-node-secondary .form-text,
@@ -130,16 +126,14 @@
     max-width: 100%;
   }
 }
-
 /**
  * The vertical toolbar mode gets triggered for narrow screens, which throws off
  * the intent of media queries written for the viewport width. When the vertical
  * toolbar is on, we need to suppress layout for the original media width + the
  * toolbar width (240px). In this case, 240px + 780px.
  */
-@media
-  screen and (max-width: 1020px) {
-  .toolbar-vertical.toolbar-tray-open .layout-region-node-center{
+@media screen and (max-width: 1020px) {
+  .toolbar-vertical.toolbar-tray-open .layout-region-node-center {
     display: block;
   }
   .toolbar-vertical.toolbar-tray-open .layout-region-node-main,
@@ -150,237 +144,168 @@
     padding-right: 0;
   }
 }
-
-
 /* BOUSSOLE FORM */
-
-#node-concernement-edit-form{}
-
-#node-concernement-edit-form .layout-region-node-secondary{
+#node-concernement-edit-form .layout-region-node-secondary {
   position: fixed;
   background-color: #fff;
-  bottom:0; left:2.5em;
-  width:200px;
-}
-#node-concernement-edit-form .layout-region-node-secondary >*{
+  bottom: 0;
+  left: 2.5em;
+  width: 200px;
+  /*  #edit-actions a.button--danger{
+    margin-top: 2em;
+  } */
+}
+#node-concernement-edit-form .layout-region-node-secondary > * {
   font-size: 0.765em;
 }
-
-#node-concernement-edit-form .layout-region-node-secondary #edit-actions{
+#node-concernement-edit-form .layout-region-node-secondary #edit-actions {
   display: flex;
   flex-direction: column;
   gap: 1em;
 }
 #node-concernement-edit-form .layout-region-node-secondary #edit-actions input,
-#node-concernement-edit-form .layout-region-node-secondary #edit-actions a{
+#node-concernement-edit-form .layout-region-node-secondary #edit-actions a {
   font-size: 1em;
   margin: 0;
 }
-/* #node-concernement-edit-form .layout-region-node-secondary #edit-actions a.button--danger{
-  margin-top: 2em;
-} */
-
-#node-concernement-edit-form .vertical-tabs__menu{
+#node-concernement-edit-form .vertical-tabs__menu {
   /* width: auto; */
-  max-width:200px;
+  max-width: 200px;
 }
-#node-concernement-edit-form .vertical-tabs__panes{
+#node-concernement-edit-form .vertical-tabs__panes {
   margin-left: 200px;
 }
-
-
 #node-concernement-edit-form .field--name-title label,
 #node-concernement-edit-form .field--name-field-description label,
 #node-concernement-edit-form .field--name-field-caillou label,
-#node-concernement-form .field--name-title label,
-#node-concernement-form .field--name-field-description label,
-#node-concernement-form .field--name-field-caillou label{
+#node-concernement-edit-form #node-concernement-form .field--name-title label,
+#node-concernement-edit-form #node-concernement-form .field--name-field-description label,
+#node-concernement-edit-form #node-concernement-form .field--name-field-caillou label {
   display: none;
 }
-
-#node-concernement-edit-form .field--name-title>.form-item>div,
-#node-concernement-edit-form .field--name-field-description>.form-item>div,
-#node-concernement-edit-form .field--name-field-caillou>.form-item>div,
-#node-concernement-form .field--name-title>.form-item>div,
-#node-concernement-form .field--name-field-description>.form-item>div,
-#node-concernement-form .field--name-field-caillou>.form-item>div{
+#node-concernement-edit-form .field--name-title > .form-item > div,
+#node-concernement-edit-form .field--name-field-description > .form-item > div,
+#node-concernement-edit-form .field--name-field-caillou > .form-item > div,
+#node-concernement-edit-form #node-concernement-form .field--name-title > .form-item > div,
+#node-concernement-edit-form #node-concernement-form .field--name-field-description > .form-item > div,
+#node-concernement-edit-form #node-concernement-form .field--name-field-caillou > .form-item > div {
   font-weight: 600;
 }
-
-#node-concernement-edit-form .ief-entity-operations input[type="submit"].ief-submit-remove{
+#node-concernement-edit-form .ief-entity-operations input[type=submit].ief-submit-remove {
   display: none;
 }
 
-#boussole-layout{
+#boussole-layout {
   display: flex;
   flex-direction: row;
   gap: 1em;
 }
-
-#boussole-layout>.form-item[data-drupal-selector="edit-field-entite"]{
-  flex:0 0 50em;
+#boussole-layout > .form-item[data-drupal-selector=edit-field-entite] {
+  flex: 0 0 50em;
   max-height: calc(100vh - 150px);
   overflow-y: auto;
-
-}
-#boussole-layout .boussole-wrapper{
-  flex:1 1 auto;
-  min-width: 800px;
 }
-
-/* drupal form optimisation */
-#boussole-layout .form-item[data-drupal-selector="edit-field-entite"] table.field-multiple-table>tbody>tr{
+#boussole-layout > .form-item[data-drupal-selector=edit-field-entite] table.field-multiple-table > tbody > tr {
   border: none;
 }
-/* #boussole-layout .form-item[data-drupal-selector="edit-field-entite"] table.field-multiple-table>tbody>tr>td.field-multiple-drag{
-  
-} */
-#boussole-layout .form-item[data-drupal-selector="edit-field-entite"] table.field-multiple-table>tbody>tr>td:not(.field-multiple-drag)>div{
-  padding:0.5em;
+#boussole-layout > .form-item[data-drupal-selector=edit-field-entite] table.field-multiple-table > tbody > tr > td:not(.field-multiple-drag) > div {
+  padding: 0.5em;
   border: 1px solid #bbb;
   border-radius: 5px;
   transition: all 2s ease-in-out;
 }
-#boussole-layout .form-item[data-drupal-selector="edit-field-entite"] table.field-multiple-table>tbody>tr>td:not(.field-multiple-drag)>div.entite-over{
-  border-color: #f00;
+#boussole-layout > .form-item[data-drupal-selector=edit-field-entite] table.field-multiple-table > tbody > tr > td:not(.field-multiple-drag) > div.entite-over {
+  border-color: #01ffe2;
   transition: all 0.2s ease-in-out;
 }
-
-#boussole-layout .form-item[data-drupal-selector="edit-field-entite"] table.field-multiple-table>tbody>tr>td:not(.field-multiple-drag) > div .horizontal-tabs-panes>details>.seven-details__wrapper{
-  padding:0;
+#boussole-layout > .form-item[data-drupal-selector=edit-field-entite] table.field-multiple-table > tbody > tr > td:not(.field-multiple-drag) > div .horizontal-tabs-panes > details > .seven-details__wrapper {
+  padding: 0;
 }
-#boussole-layout .form-item[data-drupal-selector="edit-field-entite"] .field--type-entity-reference.field--name-field-entite.field--widget-inline-entity-form-complex>div>fieldset{
+#boussole-layout > .form-item[data-drupal-selector=edit-field-entite] .field--type-entity-reference.field--name-field-entite.field--widget-inline-entity-form-complex > div > fieldset {
   border: none;
-  margin:0;
-  padding:0;
+  margin: 0;
+  padding: 0;
 }
-#boussole-layout .form-item[data-drupal-selector="edit-field-entite"] .field--type-entity-reference.field--name-field-entite.field--widget-inline-entity-form-complex>div>fieldset>legend{
-  display:none;
+#boussole-layout > .form-item[data-drupal-selector=edit-field-entite] .field--type-entity-reference.field--name-field-entite.field--widget-inline-entity-form-complex > div > fieldset > legend {
+  display: none;
 }
-#boussole-layout .form-item[data-drupal-selector="edit-field-entite"] .field--type-entity-reference.field--name-field-entite.field--widget-inline-entity-form-complex>div>fieldset>.fieldset-wrapper>table>thead{
-  display:none;
+#boussole-layout > .form-item[data-drupal-selector=edit-field-entite] .field--type-entity-reference.field--name-field-entite.field--widget-inline-entity-form-complex > div > fieldset .fieldset-wrapper > table > thead {
+  display: none;
 }
-#boussole-layout .form-item[data-drupal-selector="edit-field-entite"] .field--type-entity-reference.field--name-field-entite.field--widget-inline-entity-form-complex>div>fieldset>.fieldset-wrapper>table>tbody>tr{
-  border:none;
+#boussole-layout > .form-item[data-drupal-selector=edit-field-entite] .field--type-entity-reference.field--name-field-entite.field--widget-inline-entity-form-complex > div > fieldset .fieldset-wrapper > table > tbody > tr {
+  border: none;
 }
-
-#boussole-layout .form-item[data-drupal-selector="edit-field-entite"] input[type="text"]{
+#boussole-layout > .form-item[data-drupal-selector=edit-field-entite] input[type=text] {
   max-width: 60%;
 }
-
-#boussole-layout .form-item[data-drupal-selector="edit-field-entite"] td.field-multiple-drag {
+#boussole-layout > .form-item[data-drupal-selector=edit-field-entite] td.field-multiple-drag {
   min-width: 0;
   width: 25px;
 }
-
-#boussole-layout .form-item[data-drupal-selector="edit-field-entite"] .field--type-image thead,
-#boussole-layout .form-item[data-drupal-selector="edit-field-entite"] .field--type-file thead{
-  display: none;
-}
-
-#boussole-layout .form-item[data-drupal-selector="edit-field-entite"] div.field--type-image div.form-managed-file ,
-#boussole-layout .form-item[data-drupal-selector="edit-field-entite"] div.field--type-file div.form-managed-file{
-  width:420px;
-}
-
-#boussole-layout .form-item[data-drupal-selector="edit-field-entite"] div.field--type-image div.form-managed-file input[type="text"],
-#boussole-layout .form-item[data-drupal-selector="edit-field-entite"] div.field--type-file div.form-managed-file input[type="text"]{
-  width:90%;
-}
-
-/* #boussole-layout .form-item[data-drupal-selector="edit-field-entite"] .field--type-image a.tabledrag-handle{
-  float: none;
-}
-#boussole-layout .form-item[data-drupal-selector="edit-field-entite"] .field--type-image .image-widget{
-  float: none;
-}
-#boussole-layout .form-item[data-drupal-selector="edit-field-entite"] .field--type-image .image-widget .image-preview{
-  float: none;
-}
-#boussole-layout .form-item[data-drupal-selector="edit-field-entite"] .field--type-image .image-widget .image-widget-data{
-  float: none;
-} */
-
-
-/* #boussole-layout .form-item[data-drupal-selector="edit-field-entite"] table.field-entite-values > tbody > tr > td > div > div.form-wrapper table{
-  max-width: 100%;
-} */
-
-div.field--name-field-actuel-future.form-wrapper,
-div.field--name-field-prise.form-wrapper,
-div.field--name-field-menace-maintien-degres.form-wrapper{
+#boussole-layout > .form-item[data-drupal-selector=edit-field-entite] div.field--type-image thead,
+#boussole-layout > .form-item[data-drupal-selector=edit-field-entite] div.field--type-file thead {
   display: none;
 }
-/* .field--name-field-actuel-future > fieldset legend{
-  display:none;
-}
-.field--name-field-actuel-future > fieldset > .fieldset-wrapper > .form-radios{
-  display: flex; flex-direction: row; gap: 1em;
+#boussole-layout > .form-item[data-drupal-selector=edit-field-entite] div.field--type-image .form-managed-file,
+#boussole-layout > .form-item[data-drupal-selector=edit-field-entite] div.field--type-file .form-managed-file {
+  width: 420px;
 }
-
-.field--name-field-prise > .form-item,
-.field--name-field-menace-maintien-degres > .form-item{
-  display:flex;
-  flex-direction: row;
-  gap:1em;
+#boussole-layout > .form-item[data-drupal-selector=edit-field-entite] div.field--type-image .form-managed-file input[type=text],
+#boussole-layout > .form-item[data-drupal-selector=edit-field-entite] div.field--type-file .form-managed-file input[type=text] {
+  width: 90%;
 }
-
-.field--name-field-prise > .form-item > label,
-.field--name-field-menace-maintien-degres > .form-item > label{
-  flex:0 0 auto; 
-  width:9em;
-}
-.field--name-field-prise > .form-item > input,
-.field--name-field-menace-maintien-degres > .form-item > input{
-  width:7em;
-  flex:0 1 auto; 
-}
-.field--name-field-prise > .form-item > .description,
-.field--name-field-menace-maintien-degres > .form-item > .description{
-  flex:0 1 auto; 
-} */
-
-div.field--name-field-action.form-wrapper label,
-div.field--name-field-menace-maintien label{
-  display: none;
-}
-
-#boussole-layout .form-item[data-drupal-selector="edit-field-entite"] .button{
+#boussole-layout > .form-item[data-drupal-selector=edit-field-entite] .button {
   font-size: 0.9em;
 }
-
-/* boussole */
-#boussole-layout .boussole-wrapper .boussole{
+#boussole-layout .boussole-wrapper {
+  flex: 1 1 auto;
+  min-width: 800px;
+  /* boussole */
+}
+#boussole-layout .boussole-wrapper .boussole {
   background-image: url(../images/boussole.svg);
   background-clip: padding-box;
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center;
-  aspect-ratio: 1 / 1;
+  aspect-ratio: 1/1;
   /* width:100%; */
   max-height: calc(100vh - 150px);
   position: relative;
   padding: 8%;
 }
-#boussole-layout .boussole-wrapper .boussole .entity{
+#boussole-layout .boussole-wrapper .boussole .entity {
   position: absolute;
-  width:10px; height:10px;
+  width: 10px;
+  height: 10px;
   border-radius: 5px;
   background-color: black;
   transform: translate(-5px, -5px);
-  cursor:move;
+  cursor: move;
 }
-#boussole-layout .boussole-wrapper .boussole .entity.entite-over{
-  background-color: #f00;
+#boussole-layout .boussole-wrapper .boussole .entity.entite-over {
+  background-color: #01ffe2;
 }
-#boussole-layout .boussole-wrapper .boussole .entity.ajax-new{
+#boussole-layout .boussole-wrapper .boussole .entity.ajax-new {
   background-color: #fff;
   border: 1px solid black;
 }
-#boussole-layout .boussole-wrapper .boussole .entity.ajax-new.entite-over{
-  border: 1px solid red;
+#boussole-layout .boussole-wrapper .boussole .entity.ajax-new.entite-over {
+  border: 1px solid 1ffe2;
+}
+#boussole-layout .boussole-wrapper .boussole .entity.hide {
+  display: none;
 }
 
-#boussole-layout .boussole-wrapper .boussole .entity.hide{
+div.field--name-field-actuel-future.form-wrapper,
+div.field--name-field-prise.form-wrapper,
+div.field--name-field-menace-maintien-degres.form-wrapper {
   display: none;
-}
+}
+
+div.field--name-field-action.form-wrapper label,
+div.field--name-field-menace-maintien label {
+  display: none;
+}
+
+/*# sourceMappingURL=ouatminimal.css.map */

src/web/themes/custom/ouatminimal_theme/package-lock.json

@@ -0,0 +1,385 @@
+{
+  "name": "sass-compiler",
+  "version": "1.0.0",
+  "lockfileVersion": 2,
+  "requires": true,
+  "packages": {
+    "": {
+      "name": "sass-compiler",
+      "version": "1.0.0",
+      "license": "ISC",
+      "devDependencies": {
+        "sass": "^1.62.1"
+      }
+    },
+    "node_modules/anymatch": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
+      "integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==",
+      "dev": true,
+      "dependencies": {
+        "normalize-path": "^3.0.0",
+        "picomatch": "^2.0.4"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/binary-extensions": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
+      "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==",
+      "dev": true,
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/braces": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz",
+      "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==",
+      "dev": true,
+      "dependencies": {
+        "fill-range": "^7.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/chokidar": {
+      "version": "3.5.3",
+      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz",
+      "integrity": "sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "individual",
+          "url": "https://paulmillr.com/funding/"
+        }
+      ],
+      "dependencies": {
+        "anymatch": "~3.1.2",
+        "braces": "~3.0.2",
+        "glob-parent": "~5.1.2",
+        "is-binary-path": "~2.1.0",
+        "is-glob": "~4.0.1",
+        "normalize-path": "~3.0.0",
+        "readdirp": "~3.6.0"
+      },
+      "engines": {
+        "node": ">= 8.10.0"
+      },
+      "optionalDependencies": {
+        "fsevents": "~2.3.2"
+      }
+    },
+    "node_modules/fill-range": {
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
+      "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==",
+      "dev": true,
+      "dependencies": {
+        "to-regex-range": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/fsevents": {
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
+      "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
+      "dev": true,
+      "hasInstallScript": true,
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
+      }
+    },
+    "node_modules/glob-parent": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
+      "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
+      "dev": true,
+      "dependencies": {
+        "is-glob": "^4.0.1"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
+    "node_modules/immutable": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.0.tgz",
+      "integrity": "sha512-0AOCmOip+xgJwEVTQj1EfiDDOkPmuyllDuTuEX+DDXUgapLAsBIfkg3sxCYyCEA8mQqZrrxPUGjcOQ2JS3WLkg==",
+      "dev": true
+    },
+    "node_modules/is-binary-path": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
+      "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
+      "dev": true,
+      "dependencies": {
+        "binary-extensions": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/is-extglob": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
+      "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==",
+      "dev": true,
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/is-glob": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
+      "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==",
+      "dev": true,
+      "dependencies": {
+        "is-extglob": "^2.1.1"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/is-number": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
+      "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
+      "dev": true,
+      "engines": {
+        "node": ">=0.12.0"
+      }
+    },
+    "node_modules/normalize-path": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
+      "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
+      "dev": true,
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/picomatch": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
+      "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
+      "dev": true,
+      "engines": {
+        "node": ">=8.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
+    "node_modules/readdirp": {
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
+      "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
+      "dev": true,
+      "dependencies": {
+        "picomatch": "^2.2.1"
+      },
+      "engines": {
+        "node": ">=8.10.0"
+      }
+    },
+    "node_modules/sass": {
+      "version": "1.62.1",
+      "resolved": "https://registry.npmjs.org/sass/-/sass-1.62.1.tgz",
+      "integrity": "sha512-NHpxIzN29MXvWiuswfc1W3I0N8SXBd8UR26WntmDlRYf0bSADnwnOjsyMZ3lMezSlArD33Vs3YFhp7dWvL770A==",
+      "dev": true,
+      "dependencies": {
+        "chokidar": ">=3.0.0 <4.0.0",
+        "immutable": "^4.0.0",
+        "source-map-js": ">=0.6.2 <2.0.0"
+      },
+      "bin": {
+        "sass": "sass.js"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/source-map-js": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz",
+      "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==",
+      "dev": true,
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/to-regex-range": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
+      "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
+      "dev": true,
+      "dependencies": {
+        "is-number": "^7.0.0"
+      },
+      "engines": {
+        "node": ">=8.0"
+      }
+    }
+  },
+  "dependencies": {
+    "anymatch": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
+      "integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==",
+      "dev": true,
+      "requires": {
+        "normalize-path": "^3.0.0",
+        "picomatch": "^2.0.4"
+      }
+    },
+    "binary-extensions": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
+      "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==",
+      "dev": true
+    },
+    "braces": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz",
+      "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==",
+      "dev": true,
+      "requires": {
+        "fill-range": "^7.0.1"
+      }
+    },
+    "chokidar": {
+      "version": "3.5.3",
+      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz",
+      "integrity": "sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==",
+      "dev": true,
+      "requires": {
+        "anymatch": "~3.1.2",
+        "braces": "~3.0.2",
+        "fsevents": "~2.3.2",
+        "glob-parent": "~5.1.2",
+        "is-binary-path": "~2.1.0",
+        "is-glob": "~4.0.1",
+        "normalize-path": "~3.0.0",
+        "readdirp": "~3.6.0"
+      }
+    },
+    "fill-range": {
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
+      "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==",
+      "dev": true,
+      "requires": {
+        "to-regex-range": "^5.0.1"
+      }
+    },
+    "fsevents": {
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
+      "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
+      "dev": true,
+      "optional": true
+    },
+    "glob-parent": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
+      "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
+      "dev": true,
+      "requires": {
+        "is-glob": "^4.0.1"
+      }
+    },
+    "immutable": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.0.tgz",
+      "integrity": "sha512-0AOCmOip+xgJwEVTQj1EfiDDOkPmuyllDuTuEX+DDXUgapLAsBIfkg3sxCYyCEA8mQqZrrxPUGjcOQ2JS3WLkg==",
+      "dev": true
+    },
+    "is-binary-path": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
+      "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
+      "dev": true,
+      "requires": {
+        "binary-extensions": "^2.0.0"
+      }
+    },
+    "is-extglob": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
+      "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==",
+      "dev": true
+    },
+    "is-glob": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
+      "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==",
+      "dev": true,
+      "requires": {
+        "is-extglob": "^2.1.1"
+      }
+    },
+    "is-number": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
+      "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
+      "dev": true
+    },
+    "normalize-path": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
+      "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
+      "dev": true
+    },
+    "picomatch": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
+      "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
+      "dev": true
+    },
+    "readdirp": {
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
+      "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
+      "dev": true,
+      "requires": {
+        "picomatch": "^2.2.1"
+      }
+    },
+    "sass": {
+      "version": "1.62.1",
+      "resolved": "https://registry.npmjs.org/sass/-/sass-1.62.1.tgz",
+      "integrity": "sha512-NHpxIzN29MXvWiuswfc1W3I0N8SXBd8UR26WntmDlRYf0bSADnwnOjsyMZ3lMezSlArD33Vs3YFhp7dWvL770A==",
+      "dev": true,
+      "requires": {
+        "chokidar": ">=3.0.0 <4.0.0",
+        "immutable": "^4.0.0",
+        "source-map-js": ">=0.6.2 <2.0.0"
+      }
+    },
+    "source-map-js": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz",
+      "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==",
+      "dev": true
+    },
+    "to-regex-range": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
+      "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
+      "dev": true,
+      "requires": {
+        "is-number": "^7.0.0"
+      }
+    }
+  }
+}

src/web/themes/custom/ouatminimal_theme/package.json

@@ -0,0 +1,15 @@
+{
+  "name": "sass-compiler",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "sass-dev": "sass --watch --update --style=expanded scss/:css/",
+    "sass-prod": "sass --no-source-map --style=compressed scss/:css/"
+  },
+  "author": "",
+  "license": "ISC",
+  "devDependencies": {
+    "sass": "^1.62.1"
+  }
+}

src/web/themes/custom/ouatminimal_theme/scss/ouatminimal.scss

@@ -0,0 +1,361 @@
+/* trying to get more vertical space for the boussole */
+.adminimal .content-header {
+  background-color: #434343;
+  padding: 0.5rem 0 0;
+}
+.adminimal .page-title,
+.adminimal .heading-a {
+  font-size: 1.5em;
+}
+.toolbar-tray a {
+  padding: 0.5em 1.3333em;
+}
+
+.is-horizontal .tabs.primary a {
+  padding: 0 2em 0 2em;
+  background-image: none;
+}
+
+/* END trying to get more vertical space for the boussole */
+
+
+.adminimal input.form-autocomplete, .adminimal input.form-text, .adminimal input.form-tel, .adminimal input.form-email, .adminimal input.form-url, .adminimal input.form-search, .adminimal input.form-number, .adminimal input.form-color, .adminimal input.form-file, .adminimal input.form-date, .adminimal input.form-time, .adminimal textarea.form-textarea{
+  background-color: #fff;
+  border-radius: 3px;
+}
+
+.adminimal select{
+  background-color: #fff;
+  border-radius: 3px;
+}
+
+.adminimal .button {
+  /* background-color: #2196F3; */
+  border-radius: 5px;
+  padding: 0.3em 0.5em;
+}
+.adminimal .button,
+.adminimal .image-button {
+  margin-right: 0.5em;
+  margin-left: 0.5em;
+}
+.adminimal .button:first-child,
+.adminimal .image-button:first-child {
+  margin-right: 0;
+  margin-left: 0;
+}
+
+.js td .dropbutton-multiple{
+  border-radius: 3px;
+}
+.views-exposed-form{
+  font-size: 0.9em;
+}
+.views-exposed-form input[type="text"]{
+  max-width:10em;
+}
+.views-exposed-form input[type="text"].form-autocomplete{
+  max-width:14em;
+}
+.views-exposed-form select.form-select{
+  min-height: 0;
+  padding: 0.2em 0.4em 0.2em 0.5em;
+}
+
+/**
+ * Node add/edit form layout
+ */
+
+/* Narrow screens */
+.layout-region {
+  box-sizing: border-box;
+}
+
+/* Wide screens */
+@media
+  screen and (min-width: 780px),
+  (orientation: landscape) and (min-device-height: 780px) {
+  
+  .layout-region-node-center{
+    display: flex;
+    flex-direction: row;
+    gap: 1em;
+  }
+
+  [dir="rtl"] .layout-region-node-center{
+    display: flex;
+    flex-direction: row-reverse;
+  }
+
+  .layout-region-node-main {
+    /* reset */
+    float: none;
+    box-sizing: border-box;
+    width: auto;
+    padding-right:0; /* LTR */
+    /* custom */
+    flex: 1 0 auto;
+  }
+
+  [dir="rtl"] .layout-region-node-main{
+    float: none;
+    padding-right: 0;
+    padding-left: 0;
+  }
+
+  .layout-region-node-secondary {
+    /* reset */
+    float: none; /* LTR */
+    width: auto;
+    /* custom */
+    flex: 0 0 25em;
+  }
+
+  [dir="rtl"] .layout-region-node-secondary {
+    float: none;
+  }
+
+  /* @todo File an issue to add a standard class to all text-like inputs */
+  .layout-region-node-secondary .form-autocomplete,
+  .layout-region-node-secondary .form-text,
+  .layout-region-node-secondary .form-tel,
+  .layout-region-node-secondary .form-email,
+  .layout-region-node-secondary .form-url,
+  .layout-region-node-secondary .form-search,
+  .layout-region-node-secondary .form-number,
+  .layout-region-node-secondary .form-color,
+  .layout-region-node-secondary textarea {
+    box-sizing: border-box;
+    width: 100%;
+    max-width: 100%;
+  }
+}
+
+/**
+ * The vertical toolbar mode gets triggered for narrow screens, which throws off
+ * the intent of media queries written for the viewport width. When the vertical
+ * toolbar is on, we need to suppress layout for the original media width + the
+ * toolbar width (240px). In this case, 240px + 780px.
+ */
+@media
+  screen and (max-width: 1020px) {
+  .toolbar-vertical.toolbar-tray-open .layout-region-node-center{
+    display: block;
+  }
+  .toolbar-vertical.toolbar-tray-open .layout-region-node-main,
+  .toolbar-vertical.toolbar-tray-open .layout-region-node-footer,
+  .toolbar-vertical.toolbar-tray-open .layout-region-node-secondary {
+    float: none;
+    width: auto;
+    padding-right: 0;
+  }
+}
+
+
+/* BOUSSOLE FORM */
+#node-concernement-edit-form{
+  .layout-region-node-secondary{
+    position: fixed;
+    background-color: #fff;
+    bottom:0; left:2.5em;
+    width:200px;
+
+    >*{
+      font-size: 0.765em;
+    }
+    #edit-actions{
+      display: flex;
+      flex-direction: column;
+      gap: 1em;
+    }
+    #edit-actions input,
+    #edit-actions a{
+      font-size: 1em;
+      margin: 0;
+    }
+    /*  #edit-actions a.button--danger{
+      margin-top: 2em;
+    } */
+    
+  }
+
+  .vertical-tabs__menu{
+    /* width: auto; */
+    max-width:200px;
+  }
+  .vertical-tabs__panes{
+    margin-left: 200px;
+  }
+
+  &,
+  #node-concernement-form{
+    .field--name-title label,
+    .field--name-field-description label,
+    .field--name-field-caillou label{
+      display: none;
+    }
+    .field--name-title>.form-item>div,
+    .field--name-field-description>.form-item>div,
+    .field--name-field-caillou>.form-item>div{
+      font-weight: 600;
+    }
+    
+  }
+
+  .ief-entity-operations input[type="submit"].ief-submit-remove{
+    display: none;
+  }
+}
+
+
+
+
+#boussole-layout{
+  display: flex;
+  flex-direction: row;
+  gap: 1em;
+
+  >.form-item[data-drupal-selector="edit-field-entite"]{
+    flex:0 0 50em;
+    max-height: calc(100vh - 150px);
+    overflow-y: auto;
+    
+    table.field-multiple-table>tbody>tr{
+      border: none;
+    
+      >td:not(.field-multiple-drag)>div{
+        padding:0.5em;
+        border: 1px solid #bbb;
+        border-radius: 5px;
+        transition: all 2s ease-in-out;
+        
+        &.entite-over{
+          border-color: #01ffe2;
+          transition: all 0.2s ease-in-out;
+        }
+
+        .horizontal-tabs-panes>details>.seven-details__wrapper{
+          padding:0;
+        }
+      }
+    }
+    .field--type-entity-reference.field--name-field-entite.field--widget-inline-entity-form-complex>div>fieldset{
+      border: none;
+      margin:0;
+      padding:0;
+      
+      >legend{
+        display:none;
+      }
+      
+      .fieldset-wrapper>table{
+        >thead{
+          display:none;
+        }
+        >tbody>tr{
+          border:none;
+        }
+      }
+    
+    }
+    
+    input[type="text"]{
+      max-width: 60%;
+    }
+    
+    td.field-multiple-drag {
+      min-width: 0;
+      width: 25px;
+    }
+    
+    div.field--type-image,
+    div.field--type-file{
+      thead{
+        display: none;
+      }
+      
+      .form-managed-file{
+        width:420px;
+        input[type="text"]{
+          width:90%;
+        }
+      }
+
+    }
+   
+    .button{
+      font-size: 0.9em;
+    }
+
+
+
+
+
+
+
+
+
+
+
+
+  }
+  .boussole-wrapper{
+    flex:1 1 auto;
+    min-width: 800px;
+  
+    /* boussole */
+    .boussole{
+      background-image: url(../images/boussole.svg);
+      background-clip: padding-box;
+      background-size: contain;
+      background-repeat: no-repeat;
+      background-position: center;
+      aspect-ratio: 1 / 1;
+      /* width:100%; */
+      max-height: calc(100vh - 150px);
+      position: relative;
+      padding: 8%;
+      
+      .entity{
+        position: absolute;
+        width:10px; height:10px;
+        border-radius: 5px;
+        background-color: black;
+        transform: translate(-5px, -5px);
+        cursor:move;
+        
+        &.entite-over{
+          background-color: #01ffe2;
+        }
+        &.ajax-new{
+          background-color: #fff;
+          border: 1px solid black;
+        }
+        &.ajax-new.entite-over{
+          border: 1px solid 01ffe2;
+        }
+      
+        &.hide{
+          display: none;
+        }
+      }
+    }
+    
+  
+  }
+
+
+}
+
+
+div.field--name-field-actuel-future.form-wrapper,
+div.field--name-field-prise.form-wrapper,
+div.field--name-field-menace-maintien-degres.form-wrapper{
+  display: none;
+}
+
+div.field--name-field-action.form-wrapper label,
+div.field--name-field-menace-maintien label{
+  display: none;
+}
+