blog

commit b99614db390162c8403b55c15cbbde1252d216bb
parent 8ddb40a31494bc504d9a5c0bbe68f08d2625339d
Author: Shimmy Xu <shimmy.xu@shimmy1996.com>
Date:   Mon,  2 Dec 2019 13:26:59 -0500

Add CSS for isso

Diffstat:
M
layouts/partials/comment.html
 | 
2
+-
M
layouts/partials/css/custom.css
 | 
2
++
A
layouts/partials/css/isso.css
 | 
86
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

3 files changed, 89 insertions(+), 1 deletion(-)
diff --git a/layouts/partials/comment.html b/layouts/partials/comment.html
@@ -1,7 +1,7 @@
 <script
   async
   data-isso="/isso/"
-  data-isso-css="true"
+  data-isso-css="false"
   data-isso-lang={{ .Site.Language }}
   data-isso-reply-to-self="false"
   data-isso-require-author="true"
diff --git a/layouts/partials/css/custom.css b/layouts/partials/css/custom.css
@@ -6,3 +6,5 @@ a:focus, a:hover {
     background: var(--accent-color);
     color: var(--background-color);
 }
+
+{{ partial "css/isso.css" . }}
diff --git a/layouts/partials/css/isso.css b/layouts/partials/css/isso.css
@@ -0,0 +1,86 @@
+#isso-thread {
+    border-top: 1px solid;
+}
+#isso-thread > .isso-feedlink {
+    float: right;
+    padding-left: 1em;
+}
+#isso-thread .textarea {
+    background-color: var(--alt-background-color);
+    min-height: 58px;
+}
+#isso-root .isso-comment {
+    padding-top: 0.95em;
+    margin: 0.95em auto;
+}
+#isso-root .preview .isso-comment {
+    padding-top: 0;
+    margin: 0;
+}
+#isso-root .isso-comment:not(:first-of-type),
+.isso-follow-up .isso-comment {
+    border-top: 1px solid;
+}
+.isso-comment > div.avatar {
+    display: block;
+    float: left;
+    width: 3em;
+    margin: 3px 15px 0 0;
+}
+.isso-comment > div.avatar > svg {
+    max-width: 48px;
+    max-height: 48px;
+}
+.isso-comment > div.text-wrapper {
+    display: block;
+}
+.isso-comment .isso-follow-up {
+    padding-left: calc(7% + 20px);
+}
+.isso-comment > div.text-wrapper > .isso-comment-header, .isso-comment > div.text-wrapper > .isso-comment-footer {
+    font-size: 0.95em;
+}
+.isso-comment > div.text-wrapper > .isso-comment-header .spacer {
+    padding: 0 6px;
+}
+.isso-comment > div.text-wrapper > .isso-comment-header .note {
+    float: right;
+}
+.isso-comment > div.text-wrapper > .textarea-wrapper .textarea,
+.isso-comment > div.text-wrapper > .textarea-wrapper .preview {
+    margin-top: 0.2em;
+}
+.isso-comment > div.text-wrapper > div.text p {
+    margin-top: 0.2em;
+}
+.isso-comment > div.text-wrapper > div.text p:last-child {
+    margin-bottom: 0.2em;
+}
+.isso-feedlink,
+.isso-comment > div.text-wrapper > .isso-comment-footer a {
+    text-decoration: none;
+}
+.isso-comment > div.text-wrapper > .isso-comment-footer > a {
+    position: relative;
+    top: .2em;
+}
+.isso-comment > div.text-wrapper > .isso-comment-footer > a + a {
+    margin-left: 1em;
+}
+.isso-comment .isso-postbox {
+    margin-top: 0.8em;
+}
+.isso-comment.isso-no-votes span.votes {
+    display: none;
+}
+.isso-postbox > .form-wrapper .textarea,
+.isso-postbox > .form-wrapper .preview {
+    padding: 5px;
+}
+.isso-postbox > .form-wrapper > .auth-section .input-wrapper input {
+    color: var(--text-color);
+    background-color: var(--alt-background-color);
+    padding: 5px;
+    border: 0;
+    border-radius: 0;
+}