mobile scaling

Author: mathematicalmichael

custom.css

@@ -6,6 +6,7 @@
   --slide-pad-top: 5.2rem;
   --slide-pad-left: 4rem;
   --slide-pad-right: 0.75rem;
+  --walkthrough-code-height: min(54vh, calc(100vh - 17rem));
 }
 
 .reveal {
@@ -224,8 +225,8 @@
 
 .reveal .slides section.code-walkthrough pre code {
   display: block;
-  height: min(80vh, calc(100vh - 11.5rem));
-  max-height: min(80vh, calc(100vh - 11.5rem));
+  height: var(--walkthrough-code-height);
+  max-height: var(--walkthrough-code-height);
   overflow: auto;
   box-sizing: border-box;
   padding-bottom: 0.9em;
@@ -237,6 +238,13 @@
   line-height: 1.34;
 }
 
+@media (max-width: 768px) {
+  :root {
+    --slide-pad-top: 3.2rem;
+    --walkthrough-code-height: min(46vh, calc(100vh - 11rem));
+  }
+}
+
 .reveal .slides section.code-walkthrough pre code::-webkit-scrollbar {
   width: 10px;
   height: 10px;