diff --git a/mobile/www/css/index.css b/mobile/www/css/index.css
index c6e1eaa..777d984 100644
--- a/mobile/www/css/index.css
+++ b/mobile/www/css/index.css
@@ -35,4 +35,14 @@
 h1.about, h2.about, h3.about {
     color: #1f3487;
     margin-top: 0px;
+}
+
+.item-media > img {
+    width: 32px;
+    height: 32px;
+    margin-left: -20px;
+}
+
+.item-checkbox > .item-inner {
+    margin-left: -10px !important;
 }
\ No newline at end of file
diff --git a/mobile/www/js/app.js b/mobile/www/js/app.js
index eb3f811..52e6bb7 100644
--- a/mobile/www/js/app.js
+++ b/mobile/www/js/app.js
@@ -16,9 +16,9 @@ var app = new Framework7({
     // App routes
     routes: routes,
 
-    // panel: {
-    //     swipe: "left"
-    // }
+    panel: {
+        swipe: "left"
+    }
 });
 
 // Init/Create main view
diff --git a/mobile/www/js/comparator.js b/mobile/www/js/comparator.js
index 18e996e..01c05a4 100644
--- a/mobile/www/js/comparator.js
+++ b/mobile/www/js/comparator.js
@@ -18,8 +18,9 @@ function configureSmartSelectOfCharacters() {
         const optgroup = "<optgroup id='optgroup-house-" + house.id + "' label='" + house.name + "'>";
         $$("#select-compare").append(optgroup);
     });
+
     characters.forEach(char => {
-        const option = "<option id='" + char.id + "'>" + char.firstName + "</option>";
+        const option = "<option id='" + char.id + "' data-option-image='" + "img/characters/" + char.firstName + ".png" + "'>" + char.firstName + "</option>";
         $$("#optgroup-house-" + char.idHouse).append(option);
     });
 
diff --git a/mobile/www/js/database.js b/mobile/www/js/database.js
index f81401b..8ccc1fa 100644
--- a/mobile/www/js/database.js
+++ b/mobile/www/js/database.js
@@ -7,6 +7,8 @@ const BASE_URL = "http://localhost/";
 let feData = JSON.parse(localStorage.getItem("feData"));
 
 function isOnline() {
+    // Check that navigator.connection is not undefined to avoid error
+    // Necessary when the app run on the browser
     const networkState = (navigator.connection) ? navigator.connection.type : null;
 
     if (networkState != null && networkState != "none") {
diff --git a/mobile/www/js/feclass.js b/mobile/www/js/feclass.js
index 0f79b89..df353ff 100644
--- a/mobile/www/js/feclass.js
+++ b/mobile/www/js/feclass.js
@@ -44,6 +44,7 @@ function getClassGrowthRates(idClass) {
     for (let i = 0; i < NB_STATS; i++) {
         let gr = partialClassGrowthRates.find(x => (x.idStat == i + 1) ? x : null);
         if (gr == null) {
+            // Create a default growth rate to avoid missing stats
             gr = {
                 idClass: idClass,
                 idStat: i + 1,
diff --git a/mobile/www/js/index.js b/mobile/www/js/index.js
index 8a3d0db..021ce26 100644
--- a/mobile/www/js/index.js
+++ b/mobile/www/js/index.js
@@ -4,6 +4,8 @@ Description : Display the content of the home page
  */
 
 const PRIMARY_NODE_NAME = "Fire Emblem Three House";
+// TODO: use color from database
+const DEFAUT_COLORS = ["#434348", "#de736d", "#1f3487", "#dfbe4a", "#9be7c0", "#afaad2"];
 
 function displayCharacters() {
     const housesWithCharacters = [];
@@ -24,7 +26,7 @@ function displayCharacters() {
         Highcharts.Series,
         'afterSetOptions',
         function (e) {
-            var colors = Highcharts.getOptions().colors,
+            var colors = DEFAUT_COLORS,
                 i = 0,
                 nodes = {};
 
@@ -85,6 +87,7 @@ function displayCharacters() {
             data: housesWithCharacters,
             events: {
                 click: function (event) {
+                    // Show the stat page of the character when clicking the node
                     const charFirstName = event.point.name;
                     const char = characters.find(x => x.firstName == charFirstName);
                     if (char != null) {
diff --git a/mobile/www/js/stats.js b/mobile/www/js/stats.js
index b17bafb..567bb07 100644
--- a/mobile/www/js/stats.js
+++ b/mobile/www/js/stats.js
@@ -32,8 +32,8 @@ function displayTableOfGrowthRates(growthRates, callback) {
 }
 
 function createListOfAvailableClasses() {
-    const char = feData.characters.find(x => x.id == actualCharId);
     // Get all available classes for the character
+    const char = feData.characters.find(x => x.id == actualCharId);
     const availableClasses = getAvailableClassesForCharacter(char);
 
     // Create the select of available classes
diff --git a/mobile/www/pages/about.html b/mobile/www/pages/about.html
index 360db46..5ce6f05 100644
--- a/mobile/www/pages/about.html
+++ b/mobile/www/pages/about.html
@@ -14,7 +14,7 @@
         <div class="page-content">
             <div class="block block-strong text-center">
                 <section>
-                    <img class="logo" src="/img/logo.png">
+                    <img class="logo" src="img/logo.png">
                     <h1 class="about">Fire Emblem Charts</h1>
                 </section>
                 <section>
diff --git a/mobile/www/pages/feclass.html b/mobile/www/pages/feclass.html
index 48d36b2..46ff47f 100644
--- a/mobile/www/pages/feclass.html
+++ b/mobile/www/pages/feclass.html
@@ -18,8 +18,8 @@
                 </figure>
                 <div class="block">
                     <p class="segmented segmented-raised segmented-round">
-                        <button id="btn-graph-spider-web" class="button button-round button-active">Spider web</button>
-                        <button id="btn-graph-column-chart" class="button button-round">Column chart</button>
+                        <button id="btn-graph-spider-web" class="button button-round">Spider web</button>
+                        <button id="btn-graph-column-chart" class="button button-round button-active">Column chart</button>
                     </p>
                 </div>
             </div>