on master help sign in
css: sidebared pages use auto-width for images
1ade30aMatilde Park
components/PageWithIndex.js+1−1
@@ -28,7 +28,7 @@ export default function PageWithIndex({ post, markdown, search }) {
28 <h1>{post.title}</h1>
28 <h1>{post.title}</h1>
29 </Section>
29 </Section>
30 <Section narrow>
30 <Section narrow>
31− <div className="flex">
31+ <div className="flex sidebar">
32 <article
32 <article
33 className={markdownStyles["markdown"] + " pr-0 lg:pr-16"}
33 className={markdownStyles["markdown"] + " pr-0 lg:pr-16"}
34 dangerouslySetInnerHTML={{ __html: decode(markdown) }}
34 dangerouslySetInnerHTML={{ __html: decode(markdown) }}
pages/community/[[...slug]].js+1−1
@@ -67,7 +67,7 @@ export default function UsingLayout({ posts, data, params, search, markdown }) {
67 <title>{data.title} • Community • urbit.org</title>
67 <title>{data.title} • Community • urbit.org</title>
68 {Meta(data)}
68 {Meta(data)}
69 </Head>
69 </Head>
70− <div className="flex w-screen h-screen min-h-screen w-screen">
70+ <div className="flex w-screen h-screen min-h-screen w-screen sidebar">
71 <Sidebar search={search}>
71 <Sidebar search={search}>
72 {childPages("/community", posts.pages)}
72 {childPages("/community", posts.pages)}
73 </Sidebar>
73 </Sidebar>
pages/docs/[[...slug]].js+1−1
@@ -126,7 +126,7 @@ export default function DocsLayout({
126 <title>{data.title} • Documentation • urbit.org</title>
126 <title>{data.title} • Documentation • urbit.org</title>
127 {Meta(data)}
127 {Meta(data)}
128 </Head>
128 </Head>
129− <div className="flex w-screen h-screen min-h-screen w-screen">
129+ <div className="flex w-screen h-screen min-h-screen w-screen sidebar">
130 <Sidebar search={search}>
130 <Sidebar search={search}>
131 <ul>
131 <ul>
132 <li>
132 <li>
pages/getting-started/[[...slug]].js+1−2
@@ -75,7 +75,7 @@ export default function UsingLayout({ posts, data, params, search, markdown }) {
75 <title>{data.title} • Getting Started • urbit.org</title>
75 <title>{data.title} • Getting Started • urbit.org</title>
76 {Meta(data)}
76 {Meta(data)}
77 </Head>
77 </Head>
78− <div className="flex w-screen h-screen min-h-screen w-screen">
78+ <div className="flex w-screen h-screen min-h-screen w-screen sidebar">
79 <Sidebar search={search}>
79 <Sidebar search={search}>
80 <ul>
80 <ul>
81 <li>
81 <li>
@@ -93,7 +93,6 @@ export default function UsingLayout({ posts, data, params, search, markdown }) {
93 title={data.title}
93 title={data.title}
94 search={search}
94 search={search}
95 section={"Getting Started"}
95 section={"Getting Started"}
96− narrow
97 >
96 >
98 <div className={markdownStyles["markdown"]}>
97 <div className={markdownStyles["markdown"]}>
99 <article
98 <article
pages/understanding-urbit/[[...slug]].js+1−2
@@ -72,7 +72,7 @@ export default function UnderstandingLayout({
72 <title>{data.title} • Understanding Urbit • urbit.org</title>
72 <title>{data.title} • Understanding Urbit • urbit.org</title>
73 {Meta(data)}
73 {Meta(data)}
74 </Head>
74 </Head>
75− <div className="flex w-screen h-screen min-h-screen w-screen">
75+ <div className="flex w-screen h-screen min-h-screen w-screen sidebar">
76 <Sidebar search={search}>
76 <Sidebar search={search}>
77 {childPages("/understanding-urbit", posts.pages)}
77 {childPages("/understanding-urbit", posts.pages)}
78 </Sidebar>
78 </Sidebar>
@@ -81,7 +81,6 @@ export default function UnderstandingLayout({
81 title={data.title}
81 title={data.title}
82 search={search}
82 search={search}
83 section={"Understanding Urbit"}
83 section={"Understanding Urbit"}
84− narrow
85 >
84 >
86 <div className={markdownStyles["markdown"]}>
85 <div className={markdownStyles["markdown"]}>
87 <article
86 <article
pages/using/[[...slug]].js+1−1
@@ -104,7 +104,7 @@ export default function UsingLayout({ posts, data, params, search, markdown }) {
104 <title>{data.title} • Operator's Manual • urbit.org</title>
104 <title>{data.title} • Operator's Manual • urbit.org</title>
105 {Meta(data)}
105 {Meta(data)}
106 </Head>
106 </Head>
107− <div className="flex w-screen h-screen min-h-screen w-screen">
107+ <div className="flex w-screen h-screen min-h-screen w-screen sidebar">
108 <Sidebar search={search}>
108 <Sidebar search={search}>
109 {childPages("/using", posts.children)}
109 {childPages("/using", posts.children)}
110 </Sidebar>
110 </Sidebar>
styles/globals.css+9
@@ -193,3 +193,12 @@ a:hover {
193 top: 0.4rem;
193 top: 0.4rem;
194 @apply bg-green;
194 @apply bg-green;
195}
195}
196+
197+.sidebar figure,
198+.sidebar img {
199+ width: auto !important;
200+ margin: 0 auto !important;
201+ left: 0 !important;
202+ display: block !important;
203+ position: static !important;
204+}