max page width

observablehq · May 4, 2024 · ed5b6eb · ed5b6eb
1 parent 164a120
commit ed5b6eb
Showing 1 changed file with 6 additions and 1 deletion.
diff --git a/src/style/layout.css b/src/style/layout.css
@@ -2,6 +2,11 @@
   --theme-caret: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='M5 7L8.125 9.5L11.25 7' stroke='black' stroke-width='1.5' stroke-linecap='round' fill='none'/%3E%3C/svg%3E");
   --theme-toggle: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m10.5,11 2.5-3-2.5-3 M6,8h7' fill='none' stroke='black' stroke-width='2'/%3E%3Crect x='2' y='2' fill='currentColor' height='12' rx='0.5' width='2'/%3E%3C/svg%3E");
   --theme-magnifier: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath stroke='currentColor' stroke-width='2' fill='none' d='M15,15L10.5,10.5a3,3 0 1,0 -6 -6a3,3 0 1,0 6 6'%3E%3C/path%3E%3C/svg%3E");
+  --max-page-width: 2000px;
+}
+
+body {
+  max-width: var(--max-page-width);
 }
 
 #observablehq-main,
@@ -236,7 +241,7 @@
   font: 400 14px var(--sans-serif);
   z-index: 1;
   top: 0;
-  right: 0;
+  right: calc(max(0px, 100vw - var(--max-page-width)));
   bottom: 0;
   overflow-y: auto;
 }