From: Paul Hänsch <paul@plutz.net>
Date: Thu, 26 Aug 2021 12:16:25 +0000 (+0200)
Subject: improved comment styling
X-Git-Url: https://git.plutz.net/?a=commitdiff_plain;h=df786469a37a075914ef6dd68f3f18b1b341adb9;p=webpoll

improved comment styling
---

diff --git a/widgets.css b/widgets.css
index fd885d1..a93e2a3 100644
--- a/widgets.css
+++ b/widgets.css
@@ -64,15 +64,15 @@ table.calendar td button[name$=_remove] {
   border: .125em solid;
 }
 
-section#comments input#comments_toggle_new,
-section#comments input#comments_toggle_new + label + form {
+#comments input#comments_toggle_new,
+#comments input#comments_toggle_new + label + form {
   display: none;
   text-align: left;
 }
-section#comments input#comments_toggle_new:checked + label + form {
+#comments input#comments_toggle_new:checked + label + form {
   display: block;
 }
-section#comments input#comments_toggle_new + label {
+#comments input#comments_toggle_new + label {
   display: block;
   width: 100%; margin: 0;
   padding: .25em .75em;
@@ -81,27 +81,49 @@ section#comments input#comments_toggle_new + label {
   border: .5pt solid;
   border-radius: 2pt;
 }
-section#comments input#comments_toggle_new:checked + label {
+#comments input#comments_toggle_new:checked + label {
   display: none;
 }
 
-section#comments input[name=username],
-section#comments textarea {
+#comments form label.legend {
+  display: block;
+}
+
+#comments input[name=username],
+#comments textarea {
   width: 100%;
 }
-section#comments textarea {
+#comments textarea {
   min-height: 7em;
   margin: .5em 0;
 }
 
-section#comments .comment {
+#comments .comment {
   text-align: left;
-  padding-left: .5em;
-  border-left: 3pt solid #CCC;
+  margin: .5em 0;
+  padding: 0 .5em .25em .5em;
+  -padding-left: .5em;
+  -border-left: 3pt solid #CCC;
+  box-shadow: #000 .25em .25em .5em;
 }
 
-section#comments div.comment > h3 {
-  background-color: #CCC;
-  margin-left: -.5em;
-  padding-left: .5em;
+#comments .comment > h3 {
+  padding-top: .5em;
+  margin-bottom: 0;
 }
+
+#comments .comment > span {
+  display: inline-block;
+  min-width: 50%;
+  font-size: .875em;
+  color: #666;
+}
+#comments .comment > a.edit {
+  display: block;
+  min-width: 50%;
+  font-size: .875em;
+}
+#comments .comment > div {
+  border-top: .5pt solid;
+}
+