edit: ajout script generatif avec collection test + pleins de petits réglages

v1-com-officielle/src/titleComponents/ColorBtn.vue

@@ -7,7 +7,7 @@
       <CloseIcon name="cyber" class="icon" :class="{checkedIcon: isChecked}"/>
       <label class="switch">
         <input type="checkbox" @click="toggleTheme">
-        <span class="slider round"></span>
+        <span class="slider" data-tooltip="thème"></span>
       </label>
       <CloseIcon name="solar" class="icon" :class="{checkedIcon: !isChecked}"/>
     </div>
@@ -29,15 +29,21 @@
 
   #colorBtnContainer{
     position:absolute;
-    right: -16.1px;
-    top: 161px;
-    height: 117px;
-    width: 77px;
+    right: 7.77px;
+    top: 144px;
+    height: 144px;
+    width: 44px;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: space-around;
     z-index: 0;
+    background-color: var(--back-color);
+    border-color: var(--main-color);
+    color: var(--back-color);
+    border-radius: 25px;
+    border-style: solid;
+    border-width: thin;
   }
 
   .checkedIcon{
@@ -102,8 +108,10 @@
   @media(min-width:1300px){
     #colorBtnContainer{
       right: unset;
-      left: -3.33px;
-      top: 333px;
+      left: 4.44px;
+      width: 50px;
+      height: 161px;
+      top: 38%;
     }
   }
 </style>