Author: Adam Argyle [atom@argyleink.com]
Hash: 2c27d7cf7f19f0b017e23dd14033ee1e882b0898
Timestamp: Mon, 25 Sep 2023 04:11:59 +0000 (1 year ago)

+13 -19 +/-2 browse
gotta figure out mobile
1diff --git a/docsite/index.css b/docsite/index.css
2index bb5d301..b9c7d72 100644
3--- a/docsite/index.css
4+++ b/docsite/index.css
5 @@ -9,7 +9,7 @@
6 @import "./syntax-highlight.css";
7
8 :root {
9- --max-inline-body: calc(100vw - (var(--size-8) * 2));
10+ --max-inline-body: calc(100vw - var(--size-content-1) - (var(--size-8) * 2));
11 --brand-bg-gradient: linear-gradient(to bottom, var(--purple-3), var(--violet-3), var(--indigo-3), var(--cyan-3));
12
13 @media (--md-n-below) {
14 @@ -29,8 +29,8 @@ body {
15 grid-template-columns:
16 var(--size-3)
17 var(--size-content-1)
18- calc(100% - 2 * var(--size-8))
19- var(--size-8)
20+ calc(100% - var(--size-content-1) - (2 * var(--size-3)))
21+ var(--size-3)
22 ;
23
24 & > * {
25 @@ -93,7 +93,7 @@ header {
26 }
27
28 nav {
29- grid-column: 2 / span 2;
30+ grid-column: 2 / -2;
31 display: flex;
32 flex-wrap: wrap;
33 align-items: center;
34 @@ -137,14 +137,17 @@ nav {
35 }
36
37 footer {
38- padding-block: var(--size-12);
39+ padding-block: var(--size-10);
40+ margin-block: var(--size-10);
41+ padding-inline: var(--size-10);
42+ border-radius: var(--radius-2);
43 display: grid;
44- grid-template-columns: minmax(min(100%, var(--size-content-3)), 80%);
45 gap: var(--size-8);
46 justify-content: space-around;
47 border-top-width: var(--border-size-1);
48 border-color: var(--surface-3);
49 background-color: var(--surface-2);
50+ white-space: nowrap;
51
52 & > a {
53 justify-self: center;
54 @@ -152,14 +155,10 @@ footer {
55
56 & dl {
57 display: flex;
58+ flex-wrap: wrap;
59 justify-content: space-around;
60 gap: var(--size-fluid-6);
61
62- @media (--md-n-below) {
63- flex-direction: column;
64- text-align: center;
65- }
66-
67 & > div {
68 display: grid;
69 place-self: start center;
70 @@ -412,8 +411,6 @@ pre[class*="language-"] {
71 z-index: var(--layer-1);
72 top: 0;
73 overflow-y: auto;
74-
75- background-image: linear-gradient(to right, hsl(var(--gray-9-hsl) / 98%) 1ch, 75%, hsl(var(--gray-9-hsl) / 0%));
76 margin-block-start: var(--size-8);
77 padding-block: var(--size-4) var(--size-2);
78 padding-inline: 0;
79 @@ -438,6 +435,7 @@ pre[class*="language-"] {
80
81 & > li {
82 display: inline-flex;
83+ padding-inline-start: 0;
84 }
85 }
86
87 @@ -788,10 +786,6 @@ pre[class*="language-"] {
88 background-image: var(--gradient-18);
89 }
90
91- @media (--md-n-above) {
92- padding-inline: var(--size-fluid-4);
93- }
94-
95 @media (--md-n-below) {
96 & pre {
97 margin-inline: 0 !important;
98 diff --git a/docsite/index.html b/docsite/index.html
99index 6311a40..c31fdf1 100644
100--- a/docsite/index.html
101+++ b/docsite/index.html
102 @@ -557,7 +557,7 @@
103 </div>
104 </section>
105
106- <section class="dogfood place-full block-wrap">
107+ <section class="dogfood block-wrap">
108 <header>
109 <h2>
110 This site
111 @@ -3555,7 +3555,7 @@
112 </div>
113 </section>
114
115- <footer class="place-full">
116+ <footer>
117 <dl>
118 <div>
119 <dt>Getting Started</dt>