From f8e3d6a65a32b798e66df946b33800499438eb7a Mon Sep 17 00:00:00 2001
From: XPoet <i@xpoet.cn>
Date: Wed, 27 Jan 2021 11:32:26 +0800
Subject: [PATCH] style: optimize Twikoo comment plugin style

---
 .../css/layout/_partial/comment/twikoo.styl   | 86 +++++++++++++++++--
 1 file changed, 78 insertions(+), 8 deletions(-)

diff --git a/source/css/layout/_partial/comment/twikoo.styl b/source/css/layout/_partial/comment/twikoo.styl
index ff80949..96e7906 100644
--- a/source/css/layout/_partial/comment/twikoo.styl
+++ b/source/css/layout/_partial/comment/twikoo.styl
@@ -2,20 +2,76 @@
 
   #twikoo {
 
-    .actions {
+    .tk-meta-input {
+      .el-input {
+        .el-input-group__prepend {
+          color: var(--default-text-color);
+        }
 
-      .OwO {
-
-        .OwO-body {
-          color: var(--defauly-color);
-          background-color: var(--background-color);
+        input {
+          color: var(--default-text-color);
         }
       }
     }
 
+
+    .tk-input {
+      textarea {
+        color: var(--default-text-color);
+      }
+    }
+
+
+    .actions {
+
+      .tk-row-actions-start {
+        .tk-action-icon {
+
+          svg {
+            fill: var(--default-text-color);
+          }
+
+          &.OwO {
+
+            .OwO-body {
+              color: var(--default-text-color);
+              background-color: var(--background-color);
+            }
+          }
+
+        }
+      }
+
+      .tk-preview {
+        span {
+          background: var(--second-background-color);
+          color: var(--default-text-color);
+        }
+      }
+
+    }
+
+
+    .tk-preview-container {
+      color: var(--default-text-color);
+    }
+
+    .tk-comments-container {
+      .tk-comments-count {
+        span {
+          color: var(--default-text-color);
+        }
+      }
+    }
+
+
     .tk-main {
+      margin-bottom: 20px;
 
       .tk-meta {
+        .tk-nick {
+          color: var(--default-text-color);
+        }
 
         .tk-tag {
 
@@ -29,11 +85,25 @@
 
         }
 
+
+        .tk-time {
+          time {
+            color: var(--default-text-color);
+          }
+        }
+
+
       }
 
+
+      .tk-content {
+        color: var(--default-text-color);
+      }
+
+      .tk-expand {
+        color: var(--third-text-color);
+      }
     }
-
-
   }