Steelman table hidden behind a toggle button

1 files changed, 39 insertions, 0 deletions

diff --git a/project/assets/css/steelman.css b/project/assets/css/steelman.css
index 5b6b5c9..d0f2c2a 100644
--- a/project/assets/css/steelman.css
+++ b/project/assets/css/steelman.css
@@ -1,5 +1,44 @@
 
 
+section.accordian {
+    margin: 1em 2em 2em 2em;
+}
+
+
+.accordian > input[name="collapse"] {
+    display: none;
+}
+
+
+.accordian .hidden_content {
+    overflow: hidden;
+    height: 0;
+}
+
+
+.accordian label {
+    color: #ffffff;
+    cursor: pointer;
+    font-weight: normal;
+    padding: 0.5em;
+    background: #808080;
+}
+
+
+.accordian label:hover,
+.accordian label:focus {
+    color: #ffffff;
+    background: #000000;
+}
+
+
+.accordian > input[name="collapse"]:checked ~ .hidden_content {
+    height: auto;
+}
+
+
+
+
 table {
     margin: 2em auto 2em auto;
     max-width: 60em;