From b91878963012146ca733c7e2b51fbedc304740e6 Mon Sep 17 00:00:00 2001
From: Sebastian Sebald <sebastian.sebald@gmail.com>
Date: Fri, 16 Feb 2024 11:23:03 +0100
Subject: [PATCH] lgtm

---
 src/App.jsx        | 7 ++++++-
 src/components.jsx | 4 ++--
 src/index.css      | 9 +++++++++
 3 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/src/App.jsx b/src/App.jsx
index 4d2ac27..2b4fd45 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -14,7 +14,7 @@ const App = () => (
     <Slide>
       <Intro />
     </Slide>
-    <Slide maxWidth={700}>
+    <Slide style={{ maxWidth: 700 }}>
       <Frame>
         <MarigoldProvider theme={theme}>
           <Example />
@@ -27,6 +27,11 @@ const App = () => (
     <Slide>
       <Conclusion />
     </Slide>
+    <Slide style={{ textAlign: "center" }}>
+      <a className="cta" href="https://www.marigold-ui.io/concepts/validation">
+        Read the documentation!
+      </a>
+    </Slide>
   </Slide.Container>
 );
 
diff --git a/src/components.jsx b/src/components.jsx
index c9e6336..041da5d 100644
--- a/src/components.jsx
+++ b/src/components.jsx
@@ -23,8 +23,8 @@ export const Frame = ({ children }) => (
   </div>
 );
 
-export const Slide = ({ children, maxWidth }) => (
-  <div className="slide" style={{ maxWidth }}>
+export const Slide = ({ children, style }) => (
+  <div className="slide" style={style}>
     <div style={{ width: "100%" }}>{children} </div>
   </div>
 );
diff --git a/src/index.css b/src/index.css
index b3861ab..ce7ad96 100644
--- a/src/index.css
+++ b/src/index.css
@@ -57,6 +57,15 @@ body {
   text-decoration-thickness: 2px;
 }
 
+.cta {
+  display: inline-block;
+  border-radius: 16px;
+  font-size: 48px;
+  color: #f0f9ff;
+  background: #075985;
+  padding: 8px 48px;
+}
+
 /* CODE HIKE */
 .ch-codegroup {
   box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);