aboutsummaryrefslogtreecommitdiff
path: root/guestbook/comments.css
diff options
context:
space:
mode:
authorHannah Isopod <me@bathynomus.xyz>2025-06-11 03:25:00 -0600
committerHannah Isopod <me@bathynomus.xyz>2025-06-11 03:25:00 -0600
commitb3bb0b898d3178963fefb9c0b16a00a76cf2a034 (patch)
treeeec6da7a21790183b15f31283fe3b8bcaabfaa4d /guestbook/comments.css
parent5023bdef46281034c0476bc4201342a0a4cc2ae7 (diff)
total guestbook overhaul + new blog post + etc
- Added /about/pronouns/ in leiu of something like a pronouns.cc profile - New blog post about my new and improved AI opinions - Moved Stop Using Chromium to an actual blog post page - Blog posts now have previous and next buttons - New /blog/ background - Moved status.cafe widget from /blog/ to landing page - Total overhaul of guestbook: - Merged guestbook and blog comment section code - Beefed up bot protection - Added a word filter - Added a property to entries to facilitate holding comments for review and approving or denying them manually (The interface for this is somewhere else) - IP address from which a post originates is now tracked in order to IP ban malicious actors - Various new buttons - Updated /greenhouse/ - The site is now a member of the No AI Webring - a couple minor CSS fixes
Diffstat (limited to 'guestbook/comments.css')
-rw-r--r--guestbook/comments.css136
1 files changed, 136 insertions, 0 deletions
diff --git a/guestbook/comments.css b/guestbook/comments.css
new file mode 100644
index 0000000..031320f
--- /dev/null
+++ b/guestbook/comments.css
@@ -0,0 +1,136 @@
+table {
+ border-collapse: collapse;
+ table-layout: fixed;
+}
+td {
+ padding: 0.3rem;
+}
+
+form > table {
+ width: 100%;
+ margin: auto;
+ margin-bottom: 1.5rem;
+}
+
+article {
+ width: 100%;
+ margin: 2rem auto;
+ display: grid;
+ gap: 1rem;
+ grid-template-areas:
+ 'gb-name gb-date gb-index'
+ 'gb-cool gb-cool gb-cool'
+ 'gb-found gb-found gb-found'
+ 'gb-message gb-message gb-message'
+ 'gb-reply gb-reply gb-reply';
+}
+article :is(h1,h2,h3,h4,h5,h6) {
+ border: none;
+ padding-left: initial;
+}
+
+input, textarea {
+ border: none;
+ font-family: var(--stdfont);
+}
+input[type="text"], input[type="email"], textarea {
+ width: 100%;
+ background: none;
+ border-bottom: 2px solid #444444;
+ color: gainsboro;
+ padding: 0.35rem;
+ box-sizing: border-box;
+ font-size: .9em;
+}
+input[type="submit"], input[type="reset"] {
+ padding: 0.35rem 0.5rem;
+ box-shadow: 2px 2px 6px black;
+ margin: 0.3rem;
+ display: inline-block;
+}
+input[type="submit"]:active, input[type="reset"]:active {
+ transform: translate(1px, 1px); box-shadow: 0 0 2px black;
+}
+input[type="submit"]:hover, input[type="reset"]:hover {
+ cursor: pointer;
+}
+.error {
+ color: red;
+ font-size: 0.85em;
+}
+.success {
+ color: lime;
+ font-size: 0.85em;
+}
+.warning {
+ color: yellow;
+ font-size: 0.85em;
+}
+.reply {
+ padding: calc(var(--stdpadding) * 1.5);
+ margin: 0;
+ margin-bottom: initial;
+ border-left: var(--stdaccentborder);
+ background-color: var(--blockbg);
+ margin-bottom: var(--stdpadding);
+}
+.reply > :last-child {
+ margin-bottom: 0;
+}
+.message {
+ padding-top: 1.5rem;
+}
+.gb-date {
+ text-align: center;
+}
+.gb-index {
+ text-align: right;
+}
+.gb-cool {
+ word-break: break-all;
+}
+.gb-name, .gb-date, .gb-index {
+ min-width: calc((var(--bodywidth) / 3) - (var(--stdpadding) * 2))
+}
+@media only screen and (hover: none) {
+ form td:first-child {
+ text-align: left;
+ }
+ form td:nth-child(2) {
+ padding-left: 0;
+ padding-right: 0;
+ }
+ input[type="text"], input[type="email"], textarea {
+ background: none;
+ border: 2px solid #00000033;
+ border-bottom: 2px solid #888888;
+ }
+ article {
+ margin: 2rem auto;
+ }
+ @media (max-width: 43rem) {
+ article {
+ grid-template-areas:
+ 'gb-name gb-name gb-index'
+ 'gb-date gb-date gb-date'
+ 'gb-cool gb-cool gb-cool'
+ 'gb-found gb-found gb-found'
+ 'gb-message gb-message gb-message'
+ 'gb-reply gb-reply gb-reply';
+ }
+ }
+}
+@media (prefers-contrast: more) {
+ input[type="text"], input[type="email"], textarea {
+ outline: 1px solid white;
+ color: white;
+ }
+ input:focus, textarea:focus {
+ outline: 3px solid white;
+ }
+ input[type="submit"] {
+ background: none;
+ color: white;
+ outline: 1px solid white;
+ }
+} \ No newline at end of file