[enh] Massive cleanup.

portal/assets/css/ynh-style.css

@@ -126,26 +126,6 @@ img {
 .wrapper:after {clear: both;}
 
 
-.col {
-  letter-spacing: -5px; /*fix bug ff PC*/
-}
-
-.col > * {
-  display: inline-block;
-  vertical-align: top;
-  letter-spacing: normal;
-}
-
-.colMarge > * {
-  margin-left: 1%;
-}
-
-.colNomarge > * {
-  margin-left: 0;
-}
-
-
-
 
 /* Logo */
 .logo {
@@ -236,19 +216,6 @@ textarea {
 }
 
 
-.sourcePro {
-  font-family: 'source_sans_proregular';
-}
-
-.sourceProBold {
-  font-family: 'source_sans_probold';
-}
-
-.sourceProBlack {
-  font-family: 'SourceSansPro-Black';
-}
-
-
 /* Icons */
 
 [class^="icon-"]:before, [class*=" icon-"]:before {
@@ -281,16 +248,17 @@ textarea {
 
 .apps { margin: 4% 5%; }
 
-.first-letter:before {
-  content: attr(data-first-letter);
-}
-
 .listing-apps {
   margin: 0;
   padding: 0;
+  letter-spacing: -5px; /*fix bug ff PC*/
+  font-family: 'source_sans_probold';
 }
 
 .listing-apps li {
+  display: inline-block;
+  vertical-align: top;
+  letter-spacing: normal;
   list-style: none;
   margin: 0 0 1em 1em;
   box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.4), 
@@ -366,7 +334,14 @@ textarea {
   margin: -1.2em 0 0 0.2em;
 }
   .listing-apps .first-letter { margin: 0; }
-  .listing-apps span + span { font-size: 0.3em; }
+  .listing-apps .first-letter:before {
+    content: attr(data-first-letter);
+    display: inline-block;
+  }
+  .listing-apps .name {
+    font-family: 'source_sans_proregular';
+    font-size: 0.3em;
+  }
 
 @media screen and (max-width: 450px) {
   .apps {margin: 10% 5%;}
@@ -493,10 +468,15 @@ textarea {
   margin-top: -0.2em;
 }
 
-
+/* User menu */
 .user-menu {
   float: right;
+  margin: 0;
+  padding: 0;
 }
+  .user-menu li {
+    list-style: none;
+  }
   .user-menu a {
     color: #999;
     display: block;

portal/assets/css/ynhpanel.css

@@ -129,14 +129,6 @@ body {/*overflow-y: scroll;*/}
 
 #ynhoverlay li { list-style-type: none; }
 
-#ynhoverlay .col { letter-spacing: -5px; }
-
-#ynhoverlay .col > * {
-  display: inline-block;
-  letter-spacing: normal;
-  vertical-align: top;
-} 
-
 #ynhoverlay img {
   max-width: 100%;
   height: auto;
@@ -144,13 +136,6 @@ body {/*overflow-y: scroll;*/}
 
 #ynhoverlay a { text-decoration: none; }
 
-#ynhoverlay .sourcePro {
-  font-family: 'source_sans_proregular';
-}
-
-#ynhoverlay .sourceProBold {
-  font-family: 'source_sans_probold';
-}
 
 #ynhoverlay .wrapper {
   width: 90%;
@@ -267,16 +252,20 @@ body {/*overflow-y: scroll;*/}
 
 #ynhoverlay .apps { margin: 4% 5%; }
 
-#ynhoverlay .listing-apps { letter-spacing: -5px; }
+#ynhoverlay .listing-apps {
-
+  margin: 0;
-#ynhoverlay .listing-apps .first-letter:before {
+  padding: 0;
-  content: attr(data-first-letter);
+  letter-spacing: -5px;
+  font-family: 'source_sans_probold';
 }
 
 #ynhoverlay .listing-apps li {
   margin: 0 0 1em 1em;
   box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.4), 
               -2px -2px 3px 0 rgba(0, 0, 0, 0.7) inset;
+  display: inline-block;
+  letter-spacing: normal;
+  vertical-align: top;
 }
 
 #ynhoverlay .listing-apps a {
@@ -350,14 +339,21 @@ body {/*overflow-y: scroll;*/}
 #ynhoverlay .listing-apps span {
   display: block;
   margin: -1.2em 0 0 0.2em;
+}    
+#ynhoverlay .listing-apps .first-letter:before {
+  content: attr(data-first-letter);
+  display: inline-block;
 }
   #ynhoverlay .listing-apps .first-letter { margin: 0; }
-  #ynhoverlay .listing-apps span + span { font-size: 0.3em; }
+  #ynhoverlay .listing-apps .name {
+    font-family: 'source_sans_proregular';
+    font-size: 0.3em;
+  }
 
 @media screen and (max-width: 470px) {
   #ynhoverlay .apps {margin: 10% 5% 20% 5%;}
   #ynhoverlay .listing-apps a {font-size: 3em;}
-  #ynhoverlay .listing-apps span + span { font-size: 0.32em; }
+  #ynhoverlay .listing-apps .name { font-size: 0.32em; }
   #ynhoverlay .listing-apps a:hover,
   #ynhoverlay .listing-apps a:focus {left: -5px;top: -5px;}
   #ynhoverlay .listing-apps a:hover:before,
@@ -726,7 +722,7 @@ body {/*overflow-y: scroll;*/}
    ========================================================================== */
 
 @media screen and (max-width: 500px) {
-  #ynhoverlay .listing-apps span + span { font-size: 0.33em; }
+  #ynhoverlay .listing-apps .name { font-size: 0.33em; }
 
   #ynhoverlay .user-menu { float: none; }
   #ynhoverlay .user-menu a { padding: 0 1em; }

portal/assets/js/ynhpanel.js

@@ -181,9 +181,9 @@ domReady(function(){
     // Add application links
     var links = [];
     Array.prototype.forEach.call(response.app, function(app, n){
-      links.push('<li><a class="'+colors[n%colors.length]+' disableAjax" href="//'+app.url+'"><span class="first-letter" data-first-letter="'+ app.name.substr(0,2) +'"></span><span class="sourcePro">'+app.name+'</span></a></li>');
+      links.push('<li><a class="'+colors[n%colors.length]+' disableAjax" href="//'+app.url+'"><span class="first-letter" data-first-letter="'+ app.name.substr(0,2) +'"></span><span class="name">'+app.name+'</span></a></li>');
     });
-    overlay.innerHTML += '<div id="yuno-apps" class="wrapper apps"><ul class="ul-reset listing-apps col colNomarge sourceProBold">'+ links.join("\n") +'</ul></div>';
+    overlay.innerHTML += '<div id="yuno-apps" class="wrapper apps"><ul class="listing-apps">'+ links.join("\n") +'</ul></div>';
 
     // Add footer links
     overlay.innerHTML += '<div id="yuno-footer" class="wrapper footer"><nav>' + "\n" +

portal/edit.html

@@ -1,5 +1,5 @@
 <div class="wrapper user">
-  <ul class="ul-reset user-menu">
+  <ul class="user-menu">
     <li><a class="icon icon-connexion" href="?action=logout">{{t_logout}}</a></li>
   </ul>
 
@@ -16,12 +16,12 @@
     <div class="form-section">
       <div class="form-group">
         <label for="uid" class="control-label">{{t_username}}</label>
-        <input id="uid" type="text" name="uid" class="form-control form-text" value="{{uid}}" disabled required>
+        <input type="text" id="uid" name="uid" class="form-text" value="{{uid}}" disabled required>
       </div>
       <div class="form-group">
         <label for="givenName" class="control-label">{{t_fullname}}</label>
-        <input type="text" id="givenName" name="givenName" class="form-control form-text" value="{{givenName}}" placeholder="{{t_firstname}}" required>
+        <input type="text" id="givenName" name="givenName" class="form-text" value="{{givenName}}" placeholder="{{t_firstname}}" required>
-        <input type="text" name="sn" class="form-control form-text" value="{{sn}}" placeholder="{{t_lastname}}" required>
+        <input type="text" name="sn" class="form-text" value="{{sn}}" placeholder="{{t_lastname}}" required>
       </div>
     </div>
 
@@ -29,11 +29,11 @@
       <div class="form-group" id="form-add-mail-alias">
         <label for="mail" class="control-label">{{t_mail_addresses}}</label>
         <a class="help-link" href="#">?</a>
-        <input type="email" name="mail" class="form-control form-text" value="{{mail}}" placeholder="{{t_new_mail}}" required>
+        <input type="email" name="mail" class="form-text" value="{{mail}}" placeholder="{{t_new_mail}}" required>
         {{#mailalias}}
-        <input type="email" name="mailalias[]" class="form-control form-text" value="{{.}}">
+        <input type="email" name="mailalias[]" class="form-text" value="{{.}}">
         {{/mailalias}}
-        <input id="mail" type="email" name="mailalias[]" class="form-control mailalias-input form-text" placeholder="{{t_new_mail}}">
+        <input id="mail" type="email" name="mailalias[]" class="mailalias-input form-text" placeholder="{{t_new_mail}}">
         <a class="btn link-btn" id="add-mailalias">{{t_add_mail}}</a>
       </div>
 
@@ -41,9 +41,9 @@
         <label for="mailforward" class="control-label">{{t_mail_forward}}</label>
         <a class="help-link" href="#">?</a>
         {{#maildrop}}
-        <input type="email" name="maildrop[]" class="form-control form-text" value="{{.}}">
+        <input type="email" name="maildrop[]" class="form-text" value="{{.}}">
         {{/maildrop}}
-        <input id="mailforward" type="email" name="maildrop[]" class="form-control maildrop-input form-text" placeholder="{{t_new_forward}}">
+        <input id="mailforward" type="email" name="maildrop[]" class="maildrop-input form-text" placeholder="{{t_new_forward}}">
         <a class="btn link-btn" id="add-maildrop">{{t_add_forward}}</a>
       </div>
     </div>

portal/info.html

@@ -1,5 +1,5 @@
 <div class="wrapper user">
-  <ul class="ul-reset user-menu">
+  <ul class="user-menu">
     <li><a class="icon icon-connexion" href="?action=logout">{{t_logout}}</a></li>
   </ul>
 
@@ -12,9 +12,9 @@
 </div>
 
 <div id="apps" class="wrapper apps">
-  <ul class="ul-reset listing-apps col colNomarge sourceProBold">
+  <ul class="listing-apps">
   {{#app}}
-  <li><a href="https://{{url}}"><span class="first-letter"></span><span class="sourcePro">{{name}}</span></a></li>
+  <li><a href="https://{{url}}"><span class="first-letter"></span><span class="name">{{name}}</span></a></li>
   {{/app}}
   </ul>
 </div>

portal/login.html

@@ -2,11 +2,11 @@
 <form class="login-form" name="input" action="" method="post">
   <div class="form-group">
     <label class="icon icon-user" for="user"><span class="element-invisible">{{t_username}}</span></label>
-    <input id="user" type="text" name="user" placeholder="{{t_username}}" class="form-control form-text" required>
+    <input id="user" type="text" name="user" placeholder="{{t_username}}" class="form-text" required>
   </div>
   <div class="form-group">
     <label class="icon icon-lock" for="password"><span class="element-invisible">{{t_password}}</span></label>
-    <input id="password" type="password" name="password" placeholder="{{t_password}}" class="form-control form-text" required>
+    <input id="password" type="password" name="password" placeholder="{{t_password}}" class="form-text" required>
   </div>
   <input type="submit" value="{{t_login}}" class="btn classic-btn large-btn">
 </form>

portal/password.html

@@ -1,5 +1,5 @@
 <div class="wrapper user">
-  <ul class="ul-reset user-menu">
+  <ul class="user-menu">
     <li><a class="icon icon-connexion" href="?action=logout">{{t_logout}}</a></li>
   </ul>
   <a class="user-container user-container-password" href="info.html">
@@ -15,14 +15,14 @@
     <div class="form-section">
       <div class="form-group">
         <label for="currentpassword">{{t_current_password}}</label>
-        <input type="password" class="form-control form-text" id="currentpassword" name="currentpassword" placeholder="•••••" required>
+        <input type="password" class="form-text" id="currentpassword" name="currentpassword" placeholder="•••••" required>
       </div>
     </div>
     <div class="form-section">
       <div class="form-group">
         <label for="newpassword">{{t_new_password}}</label>
-        <input type="password" class="form-control form-text" id="newpassword" name="newpassword" placeholder="•••••" required>
+        <input type="password" class="form-text" id="newpassword" name="newpassword" placeholder="•••••" required>
-        <input type="password" class="form-control form-text" id="confirm" name="confirm" placeholder="{{t_confirm}}" required>
+        <input type="password" class="form-text" id="confirm" name="confirm" placeholder="{{t_confirm}}" required>
       </div>
       <div class="btn-group">
         <a href="info.html" class="btn large-btn btn-default">{{t_cancel}}</a>