About Page (First draft) (#23)

input-output-hk · Nov 1, 2023 · 741101c · 741101c
1 parent c9530a3
commit 741101c
Show file tree

Hide file tree

Showing 2 changed files with 52 additions and 6 deletions.
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
@@ -29,10 +29,12 @@ export const Footer : React.FC<FooterProps>  = () => {
           <div className="linksList_iXQi">
             <h2 className="linksHeading_xaI4">Resources</h2>
             <div className="linkItem_uyV6">
-              <a href="https://iohk.io/" target="_blank" rel="noopener noreferrer">Input Output Global</a></div>
-            <div className="linkItem_uyV6"><a href="https://cardano.org/" target="_blank" rel="noopener noreferrer">Cardano.org</a></div>
-            <div className="linkItem_uyV6"><a href="https://www.essentialcardano.io/" target="_blank" rel="noopener noreferrer">Essential Cardano</a></div>
-            <div className="linkItem_uyV6"><a href="https://www.youtube.com/channel/UCX9j__vYOJu00iqBrCzecVw" target="_blank" rel="noopener noreferrer">IOG Academy</a></div></div>
+              <a href="https://marlowe.iohk.io/" target="_blank" rel="noopener noreferrer">Official Website</a></div>
+            <div className="linkItem_uyV6"><a href="https://cardano.org/" target="_blank" rel="noopener noreferrer">Documentation</a></div>
+            <div className="linkItem_uyV6"><a href="https://play.marlowe.iohk.io/" target="_blank" rel="noopener noreferrer">Playground</a></div>
+            <div className="linkItem_uyV6">
+              <a href="https://marlowe.iohk.io/blog" 
+                target="_blank" rel="noopener noreferrer">Blog</a></div></div>
           <div className="linksList_iXQi"><h2 className="linksHeading_xaI4">Support</h2>
             <div className="linkItem_uyV6"><a href="https://iohk.zendesk.com/hc/en-us/requests/new" target="_blank" rel="noopener noreferrer">IOG tech support</a></div></div>
           <div className="linksList_iXQi"><h2 className="linksHeading_xaI4">Legal</h2>

diff --git a/src/components/vesting/About.tsx b/src/components/vesting/About.tsx
@@ -96,8 +96,52 @@ const About: React.FC<AboutProps> = ({setAndShowToast}) => {
           | <button className="btn btn-link" onClick={() => navigate("/claimer")}>Claimer's View</button> 
           <hr></hr>
         </div>  
-      <div className="my-5">
-        This prototype  
+      <div style={{fontFamily:"inter"}}>
+        <h3>Overview</h3>
+        <p>This Prototype is a Cardano/Marlowe DApp allowing you to create <b>₳ Token Plans</b> over Cardano. 
+           <b>₳ Token Plans</b> are created by a "<b>Token Provider</b>". The Provider will deposit a given ₳ amount with a time-based scheme 
+           defining how to release these ₳ over time to a "<b>Claimer</b>". In the context of this prototype, we have combined these 2 
+           participants' views to simplify the use case demonstration (see menu above...).</p>
+
+        <p>The intent here is not to provide you services over Cardano, but to demonstrate Marlowe Technology Capabalities with a concrete 
+           and fully open source use case. We vividly recommend you to look behind the scenes of this deployed instance : 
+           (see )</p>
+          <ul>
+          <li> <a href="https://github.com/input-output-hk/marlowe-vesting/" target="_blank" rel="noopener noreferrer">
+                Token Plan Github Repository</a> 
+               : The React Application Codebase.
+          </li>
+          <li> <a href="https://github.com/input-output-hk/marlowe-ts-sdk/blob/main/packages/language/examples/src/vesting.ts" target="_blank" rel="noopener noreferrer">
+                Vesting Contract Implementation</a>
+          </li>
+          <li> <a href="https://input-output-hk.github.io/marlowe-ts-sdk/modules/_marlowe_io_language_examples.vesting.html" target="_blank" rel="noopener noreferrer">
+                Vesting Contract Documentation </a> 
+          </li>
+          </ul>
+        <p>This <b>Token Plan Prototype</b> is built using mainstream Web Technologies & Frameworks (Typescript & React) on top of the 
+           Marlowe Web DApp Stack :</p> 
+        <ul>
+          <li> <a href="https://github.com/input-output-hk/marlowe-ts-sdk/" target="_blank" rel="noopener noreferrer">
+                Marlowe TypeScript SDK (TS-SDK)
+               </a>
+               : a suite of TypeScript/JavaScript libraries for developing Web-Dapp in the Cardano Blockchain using Marlowe Technologies.
+          </li>
+          <li> <a href="https://docs.marlowe.iohk.io/docs/developer-tools/runtime/marlowe-runtime" target="_blank" rel="noopener noreferrer">
+                Marlowe Runtime
+               </a> : Application backend for managing Marlowe contracts on the Cardano blockchain. It provides easy-to-use, higher-level APIs and complete backend services that enable developers to build and deploy enterprise and Web3 DApp solutions using Marlowe, but without having to assemble the “plumbing” that manually orchestrates a backend workflow for a Marlowe-based application.</li>
+        </ul>
+        <h3>Roadmap</h3>
+        <p>The current version is a full end to end Marlowe Contract Example Integrated within a Wed Dapp. 
+        It's is a first iteration and is limited at the moment to 3 periods per Vesting Contract.</p> 
+        <p>E.g : If a Provider wants to create a Token Plan with an "Annualy" Frequency and an Amount of 30 ₳. 
+              They will only be able to create 3 periods (3 years) of 10₳ with this 1st Iteration.</p>
+        <p>The 2nd iteration will allow you create an infinite number of periods... 
+           The missing Marlowe feature to be provided at this DApp level is called <b>Long Live Running Contract</b> or <b>Contract Merkelization</b>.
+           The capabilities are already availaible in the Runtime but not fully yet available in the marlowe ts-sdk.</p>
+        <p> 
+          Enjoy and Stay tuned for our next releases !
+        </p>
+
       </div>
       <Footer />
     </div>