« get me outta code hell

content, client, css: quick description expand/collapse - hsmusic-wiki - HSMusic - static wiki software cataloguing collaborative creation
about summary refs log tree commit diff
path: root/src/static/css/site.css
diff options
context:
space:
mode:
author(quasar) nebula <qznebula@protonmail.com>2024-06-13 11:54:50 -0300
committer(quasar) nebula <qznebula@protonmail.com>2024-06-18 22:56:11 -0300
commit194e6e9f6cb837c57f8317abe3394714ca8faa32 (patch)
tree3dc7941c273a498aa11e49de79b10f48558190ee /src/static/css/site.css
parent8d175b6dddd3502e379e79cdaa348ee725398a8e (diff)
content, client, css: quick description expand/collapse
Diffstat (limited to 'src/static/css/site.css')
-rw-r--r--src/static/css/site.css45
1 files changed, 44 insertions, 1 deletions
diff --git a/src/static/css/site.css b/src/static/css/site.css
index e297993c..173c7910 100644
--- a/src/static/css/site.css
+++ b/src/static/css/site.css
@@ -1258,10 +1258,53 @@ ul.quick-info li:not(:last-child)::after {
   font-weight: 800;
 }
 
-.carousel-container + .quick-info {
+.carousel-container + .quick-info,
+.carousel-container + .quick-description {
   margin-top: 25px;
 }
 
+.quick-description {
+  margin-left: 8%;
+  margin-right: 8%;
+  padding-left: 4%;
+  padding-right: 4%;
+  padding-top: 0.25em;
+  padding-bottom: 0.5em;
+  border-left: 1px solid var(--dim-color);
+  border-right: 1px solid var(--dim-color);
+  line-height: 1.25em;
+}
+
+.quick-description p {
+  text-align: center;
+}
+
+.quick-description .description-content.long hr ~ p {
+  text-align: left;
+}
+
+.quick-description > .description-content :first-child {
+  margin-top: 0;
+}
+
+.quick-description > .quick-description-actions,
+.quick-description.has-content-only .description-content :last-child {
+  margin-bottom: 0;
+}
+
+.quick-description:not(.collapsed) .description-content.short,
+.quick-description:not(.collapsed) .quick-description-actions.when-collapsed,
+.quick-description:not(.expanded) .description-content.long,
+.quick-description:not(.expanded) .quick-description-actions.when-expanded {
+  display: none;
+}
+
+.quick-description .quick-description-actions .expand-link,
+.quick-description .quick-description-actions .collapse-link {
+  text-decoration: underline;
+  text-decoration-style: dotted;
+}
+
 #intro-menu {
   margin: 24px 0;
   padding: 10px;