better label positioning for responsive

neo4j-documentation · Aug 2, 2024 · 415b48f · 415b48f
1 parent e6b1710
commit 415b48f
Showing 1 changed file with 30 additions and 8 deletions.
diff --git a/src/css/cheat-sheet.css b/src/css/cheat-sheet.css
@@ -338,6 +338,10 @@ body.cheat-sheet .sect1 {
   flex-wrap: wrap;
 }
 
+body.cheat-sheet .sect1 > .sectionbody {
+  margin-top: 0.75rem;
+}
+
 body.cheat-sheet .sect2 {
   display: flex;
   flex-direction: row;
@@ -402,7 +406,7 @@ body.cheat-sheet .exampleblock > .content > div {
 
 body.cheat-sheet .exampleblock > .content > div.labels {
   flex: 0 0 100%;
-  justify-content: flex-start;
+  justify-content: flex-end;
   padding-bottom: 0;
   padding-top: 0;
   gap: 0.25rem;
@@ -500,6 +504,10 @@ body.cheat-sheet span.label.hidden,
     padding: 0;
   }
 
+  body.cheat-sheet .article h3:not(.discrete) {
+    flex: auto;
+  }
+
   body.cheat-sheet .toc-menu-placeholder ul {
     display: flex;
     flex-wrap: wrap;
@@ -536,26 +544,37 @@ body.cheat-sheet span.label.hidden,
     margin: 0 0.5rem;
   } */
 
+  body.cheat-sheet .sect1 > .page-labels {
+    justify-content: flex-start;
+    margin: 0 0 0 0.5rem;
+  }
+
   body.cheat-sheet .sect2 {
-    background: none;
+    /* background: none; */
     padding: 0;
+    border: 1px solid rgba(var(--colors-neutral-30));
+  }
+
+  body.cheat-sheet .sect2 > div.exampleblock:first-of-type {
+    border: none;
   }
 
   body.cheat-sheet h3:not(.discrete) {
     background: rgba(var(--colors-neutral-20));
-    margin: 0 0.5rem 0 0.5rem;
+    /* margin: 0 0.5rem 0 0.5rem; */
+    padding: 1rem;
     flex-grow: 1;
-    border: 1px solid rgba(var(--colors-neutral-30));
+    /* border: 1px solid rgba(var(--colors-neutral-30)); */
     /* border-right: none; */
   }
 
   body.cheat-sheet .sect2 > div {
     flex: 0 0 80%;
     flex-grow: 1;
-    padding: 0.5rem;
+    /* padding: 0.5rem; */
     margin: 0 0.5rem;
-    background-color: rgba(var(--colors-neutral-20));
-    border: 1px solid rgba(var(--colors-neutral-70));
+    /* background-color: rgba(var(--colors-neutral-20)); */
+    /* border: 1px solid rgba(var(--colors-neutral-70)); */
     border-radius: 0;
   }
 
@@ -574,8 +593,11 @@ body.cheat-sheet span.label.hidden,
   }
 
   body.cheat-sheet .sect2 > div.page-labels {
+    background: rgba(var(--colors-neutral-20));
     border-left: none;
-    margin-left: -0.5rem;
+    margin-left: 0;
+    padding: 1rem;
+    flex-grow: 1;
   }
 
   body.cheat-sheet .sect2 > div.listingblock {