X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=app%2FResources%2Fstatic%2Fthemes%2Fmaterial%2Fcss%2Farticle.scss;h=27ff52214d521620f735c2bb7b85a306f8e2d134;hb=2a0eec07a5630401a9ceb7add65604f79238f10c;hp=7d0bdac76b957b280fcc1b750b1ea31aa5feb0df;hpb=64f81bc31699ed239e4becec1cfa7ebc0bef2b5a;p=github%2Fwallabag%2Fwallabag.git

diff --git a/app/Resources/static/themes/material/css/article.scss b/app/Resources/static/themes/material/css/article.scss
index 7d0bdac7..27ff5221 100644
--- a/app/Resources/static/themes/material/css/article.scss
+++ b/app/Resources/static/themes/material/css/article.scss
@@ -103,42 +103,54 @@
 
   aside {
     .tools {
-      font-size: 0.8em;
       display: flex;
       flex-flow: row wrap;
-      margin: 0 auto;
 
-      li {
-        display: inline-flex;
-        vertical-align: middle;
-      }
+      .stats {
+        font-size: 0.8em;
+        margin: 8px 15px 5px;
+
+        li {
+          display: inline-flex;
+          vertical-align: middle;
+          margin: 0 5px;
+        }
 
-      a {
-        color: #000;
-        text-decoration: none;
+        a {
+          color: #000;
+          text-decoration: none;
+        }
       }
-    }
 
-    #list {
-      float: right;
-      margin: 0 15px 10px;
+      .tags {
+        float: right;
+        margin: 5px 15px 10px;
+      }
     }
 
     .chip {
       background-color: $blueAccentColor;
       padding: 0 15px 0 10px;
       margin: auto 2px;
+      border-radius: 6px;
 
       a,
       i {
         color: #fff;
       }
+
+      i.material-icons {
+        float: right;
+        font-size: 20px;
+        line-height: 32px;
+        padding-left: 8px;
+      }
     }
   }
 }
 
 .reader-mode {
-  width: 95px !important;
+  width: 70px !important;
   transition: width 0.2s ease;
 
   .collapsible-body {
@@ -150,17 +162,21 @@
     opacity: 0;
     transition: opacity 0.2s ease;
   }
-}
 
-.reader-mode:hover {
-  width: 240px !important;
+  &:hover {
+    width: 260px !important;
 
-  .collapsible-body {
-    height: auto;
-  }
+    .collapsible-body {
+      height: auto;
 
-  span {
-    opacity: 1;
+      li a i.material-icons {
+        margin: auto 5px auto -8px;
+      }
+    }
+
+    span {
+      opacity: 1;
+    }
   }
 }