css: Change comment buttons more harmoniously

yona-projects · Sep 24, 2017 · 5205daa · 5205daa
1 parent 523abbb
commit 5205daa
Showing 1 changed file with 20 additions and 0 deletions.
diff --git a/app/assets/stylesheets/less/_page.less b/app/assets/stylesheets/less/_page.less
@@ -2884,6 +2884,11 @@ label.inline-list {
                     .rotate(45deg);
                 }
 
+                &:hover {
+                    .meta-info .act-row {
+                        opacity: 1;
+                    }
+                }
                 .meta-info {
                     height:22px;
                     padding:5px 15px;
@@ -2894,13 +2899,21 @@ label.inline-list {
                     .yobicon-comment {vertical-align: middle;}
 
                     .act-row {
+                        transition: opacity fadeIn 1s;
+                        opacity: .3;
+                        overflow: hidden;
                         i {
                             font-size: 20px;
                             line-height: 20px;
                             color: #000;
                             .opacity(20);
 
                             &.yobicon-edit-2 { margin-top:2px; }
+                            &.yobicon-hearts {
+                                &:hover {
+                                    color: #f68c52
+                                }
+                            }
                             &:hover {
                                 color:@yobi-link;
                                 .opacity(100);
@@ -3254,6 +3267,13 @@ div.markdown-preview {
     margin:20px 0;
     overflow:auto;
     padding-right: 15px;
+    button {
+        i.yobicon-hearts {
+            &:hover {
+                color: #f68c52;
+            }
+        }
+    }
     button.icon {
         line-height: 30px;
         font-size: 22px;