New settings page

customize.dist/src/less/cryptpad.less

@@ -27,6 +27,11 @@ html.cp, .cp body {
 // override bootstrap colors
 .btn-primary {
     background-color: @cp-blue;
+    &:hover {
+        color: #fff;
+        background-color: #025aa5;
+        border-color: #01549b;
+    }
 }
 
 body {
@@ -567,10 +572,12 @@ noscript {
 
 /* Pin limit */
 .limit-container {
+    display: inline-flex;
+    flex-flow: column-reverse;
+    width: 100%;
+    margin-top: 20px;
     .cryptpad-limit-bar {
         display: inline-block;
-        height: 26px;
-        width: 200px;
         max-width: 40vw;
         margin: 3px;
         box-sizing: border-box;
@@ -578,8 +585,10 @@ noscript {
         background: white;
         position: relative;
         text-align: center;
-        line-height: 24px;
         vertical-align: middle;
+        width: ~"calc(100% - 6px)";
+        height: 25px;
+        line-height: 25px;
         .usage {
             height: 100%;
             display: inline-block;
@@ -607,7 +616,11 @@ noscript {
         }
     }
     .upgrade {
-        margin-left: 10px;
+        padding: 0;
+        line-height: 25px;
+        height: 25px;
+        margin: 0 3px;
+        border-radius: 0;
     }
 }