diff --git a/README.md b/README.md
index 0b667a4..2bcf214 100644
--- a/README.md
+++ b/README.md
@@ -1,5 +1,26 @@
+<h1><u>Subsonics 2.2.7</u></h1>
+<p>Sortie le : 04/05/2022</p>
+<h2 style="font-size: 18px;">Ajouts & Fixes :</h2>
+<ul>
+   
+    <li><strong>[CHANGE]</strong> : Volume : Possibilité d'aller à 200%</li>
+
+</ul>
+<hr>
+
+<h1><u>Subsonics 2.2.6</u></h1>
+<p>Sortie le : 04/05/2022</p>
+<h2 style="font-size: 18px;">Ajouts & Fixes :</h2>
+<ul>
+   
+    <li><strong>[CHANGE]</strong> : Modification de certains textes</li>
+    <li><strong>[CHANGE]</strong> : Modification des tailles et du positionnement des éléments </li>
+</ul>
+<hr>
+
+
 <h1><u>Subsonics 2.2.5</u></h1>
-<p>Sortie le : 03/05/2022</p>
+<p>Sortie le : 04/05/2022</p>
 <h2 style="font-size: 18px;">Ajouts & Fixes :</h2>
 <ul>
    
diff --git a/infoupdate.html b/infoupdate.html
index 2bcf214..c9e8692 100644
--- a/infoupdate.html
+++ b/infoupdate.html
@@ -1,3 +1,15 @@
+<h1><u>Subsonics 2.2.8</u></h1>
+<p>Sortie le : 05/05/2022</p>
+<h2 style="font-size: 18px;">Ajouts & Fixes :</h2>
+<ul>
+   
+    <li><strong>[CHANGE]</strong> : Modification des tailles et du positionnement des éléments </li>
+    <li><strong>[CHANGE]</strong> : Modification des couleurs pour préparer au rework graphique. </li>
+    <li><strong>[FIX]</strong> : Volume : Se reset après déconnexion</li>
+
+</ul>
+<hr>
+
 <h1><u>Subsonics 2.2.7</u></h1>
 <p>Sortie le : 04/05/2022</p>
 <h2 style="font-size: 18px;">Ajouts & Fixes :</h2>
diff --git a/package.json b/package.json
index ec4a8d4..deaa090 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "subsonics-manager",
-  "version": "2.2.7",
+  "version": "2.2.8",
   "description": "Manager for subsonics",
   "main": "main.js",
   "scripts": {
diff --git a/templates/app/app.css b/templates/app/app.css
index 4a2e92c..265751b 100644
--- a/templates/app/app.css
+++ b/templates/app/app.css
@@ -11,7 +11,7 @@
     padding: 5%;
     color: white;
     border-radius: 15px;
-    background-color: rgb(38, 37, 37);
+    background-color: #36374c;
     font-size: 12px;
     justify-content: space-between;
     align-items: center;
@@ -25,7 +25,7 @@
     display: flex;
     color: white;
     border-radius: 15px;
-    background-color: rgb(38, 37, 37);
+    background-color: #36374c;
     font-size: 12px;
     justify-content: space-between;
     align-items: center;
@@ -72,7 +72,7 @@
     padding: 5%;
     color: white;
     border-radius: 15px;
-    background-color: rgb(38, 37, 37);
+    background-color: #36374c;
     font-size: 12px;
     justify-content: space-between;
     align-items: center;
@@ -226,9 +226,9 @@
 .online-light {
 
     border-radius: 15%;
-    background-color: rgb(55, 255, 37);
+    background-color: #7a258d;
     padding: 2%;
-    color: black;
+    color: white;
     display: flex;
     align-items: center;
     vertical-align: center;
@@ -253,8 +253,8 @@
 .showPicture {
 
     margin-bottom: 10px;
-    width: 120px;
-    height: 90px;
+    width: 140px;
+    height: 110px;
 }
 
 
@@ -283,7 +283,8 @@
 }
 .bbar {
     width: 100%;
-    padding: 10%;
+    padding: 2%;
+    padding-top: 10%;
     display: flex;
     display: flex;
     text-align: center;
@@ -461,7 +462,7 @@ input[type=range] {
     padding: 5%;
     color: white;
     border-radius: 15px;
-    background-color: rgb(61, 61, 61);
+    background-color: #464862;
     font-size: 12px;
     justify-content: space-between;
     align-items: center;
diff --git a/templates/app/app.js b/templates/app/app.js
index 9432e67..8ebfac5 100644
--- a/templates/app/app.js
+++ b/templates/app/app.js
@@ -601,6 +601,9 @@ ipc.on("actualize", (ev, data) => {
 
     } else {
 
+        volCursor.disabled = true
+        volCursor.classList.add("grised")
+        volCursor.value = 0
         volPct.innerHTML = "0%"
     }
 
diff --git a/templates/common/common.css b/templates/common/common.css
index 8f68d94..064ebb9 100644
--- a/templates/common/common.css
+++ b/templates/common/common.css
@@ -3,7 +3,7 @@
 
 body {
 
-    background-color: #171717 !important;
+    background-color: #302144 !important;
     font-family: 'Open Sans', sans-serif !important; 
     
 }
diff --git a/templates/login/login.css b/templates/login/login.css
index 7f37fd8..82f1206 100644
--- a/templates/login/login.css
+++ b/templates/login/login.css
@@ -33,11 +33,11 @@
     text-align: center;
     display: flex;
     flex-direction: column;
-    background-color: rgb(38, 37, 37);
+    background-color: #36374c;
     padding: 10%;
     color: white;
     border-radius: 15px;
-    box-shadow: 2px 2px 5px rgb(38, 37, 37) ;
+    box-shadow: 2px 2px 5px #36374c ;
     -webkit-user-select: none;
     user-select: none;
    
diff --git a/templates/update/update.css b/templates/update/update.css
index 35ee830..65b5a71 100644
--- a/templates/update/update.css
+++ b/templates/update/update.css
@@ -11,11 +11,11 @@
     text-align: center;
     display: flex;
     flex-direction: column;
-    background-color: rgb(38, 37, 37);
+    background-color: #36374c;
     padding: 10%;
     color: white;
     border-radius: 15px;
-    box-shadow: 2px 2px 5px rgb(38, 37, 37) ;
+    box-shadow: 2px 2px 5px #36374c ;
     -webkit-user-select: none;
     user-select: none;
     align-items: center