From d7295cab29d1b43693e7bf1d34cfb907a4953fc5 Mon Sep 17 00:00:00 2001 From: John Holdun Date: Mon, 14 Nov 2022 15:33:09 -0800 Subject: [PATCH] Support embeds --- public/embed-test.html | 14 ++++++++++++++ public/index.html | 1 - src/App.css | 26 ++++++++++++++++++++------ src/App.js | 28 +++++++++++++++++++++++----- src/Nav.js | 34 +++++++++++++++------------------- src/Section.css | 27 +++++++++++++++++++++++---- src/Section.js | 33 ++++++++++++++++++++++++++++----- src/Source.css | 1 - src/index.css | 16 +++++++++++----- 9 files changed, 134 insertions(+), 46 deletions(-) create mode 100644 public/embed-test.html diff --git a/public/embed-test.html b/public/embed-test.html new file mode 100644 index 0000000..458d613 --- /dev/null +++ b/public/embed-test.html @@ -0,0 +1,14 @@ + + + + embed test + + + + + + diff --git a/public/index.html b/public/index.html index c5a08d8..07f8c14 100644 --- a/public/index.html +++ b/public/index.html @@ -39,6 +39,5 @@
- diff --git a/src/App.css b/src/App.css index f944fcf..9e6c408 100644 --- a/src/App.css +++ b/src/App.css @@ -2,13 +2,27 @@ @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Serif:wght@200;400;700&display=swap'); body { - font-size:1.5em; - line-height:2em; - font-family: 'IBM Plex Sans', sans-serif; - color:#444; + font-size: 1.5em; + line-height: 2em; + font-family: 'IBM Plex Sans', sans-serif; + color: #444; +} + +.App { + padding: 1rem 2rem; +} + +.App--embedded { + background: #fff; + margin: 0 auto; + max-width: 500px; + border: 1px solid #ccc; + border-radius: 1rem; + height: 100%; + overflow-y: hidden; } .expression { - font-weight:bold; - color:#222; + font-weight: bold; + color: #222; } diff --git a/src/App.js b/src/App.js index c1c1076..d22fdc2 100644 --- a/src/App.js +++ b/src/App.js @@ -14,14 +14,32 @@ const textVars = Object.fromEntries( ); function App() { - let { page } = useParams(); - if (!textVars[page]) return ; + const { page } = useParams(); + const embedded = new URLSearchParams(window.location.search).has('embed'); + + if (!textVars[page]) { + return ; + } + const [ast, astState, rawText] = textVars[page]; return ( -
-