less text

demo-verse · Mar 3, 2022 · 01ab8a5 · 01ab8a5 · vercel · Mar 3, 2022
1 parent ce8dca0
commit 01ab8a5
Show file tree

Hide file tree

Showing 10 changed files with 324 additions and 184 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -32,6 +32,7 @@
     "next": "10.0.7",
     "next-seo": "4.20.0",
     "react": "17.0.1",
+    "react-collapsed": "3.3.0",
     "react-dom": "17.0.1",
     "react-favicon": "0.0.26",
     "react-particles-js": "3.4.1",

diff --git a/public/demoverse-logo-horizontal.png b/public/demoverse-logo-horizontal.png
diff --git a/src/components/cases-section/index.tsx b/src/components/cases-section/index.tsx
@@ -73,7 +73,6 @@ const CasesSection = () => (
         <ParticleBg />
       </div>
       <div className={tw(`max-w-7xl mx-4 lg:mx-auto pt-20 lg:pt-40`)}>
-        <h1 className={tw(`text-white text-4xl lg:text-6xl font-bold text-center`)}>World peace, on blockchain</h1>
         <p className={tw(`text-white text-gray-400 text-center text-xl mt-12`)}>
           why blockchain is a well suit for observing and sustaining a world peace?
         </p>

diff --git a/src/components/feature-section/index.tsx b/src/components/feature-section/index.tsx
@@ -17,32 +17,50 @@ const FeatureSection = () => (
           </h1>
           {/* <Quote className={tw(`w-16 md:w-10 left-0 md:-left-2 absolute top-0 pl-4 md:pl-0 text-gray-500`)} /> */}
 
-          <p className={tw(`bg-yellow-400 mt-4 text-xl lg:text-2xl ftracking-tight  text-black mb-8 lg:mb-12`)}>
+          <p className={tw(`bg-yellow-400 mt-4 text-xl lg:text-2xl ftracking-tight  text-black mb-8 lg:mb-10 lg:mt-10 `)}>
             ### start manifest ###
           </p>
           <p className={tw(`mt-10 text-xl lg:text-2xl ftracking-tight text-white`)}>
-            First time in the history, as collective expressions, acknowledgements and assurances of billions, instead
-            of negotiations of hundreds.
+            First time in the history; expressions, acknowledgements and assurances of billions,
+          </p>
+
+          <p className={tw(` text-xl lg:text-2xl ftracking-tight text-white`)}>
+            empowering
+            negotiations of hundreds.
           </p>
 
           <p className={tw(`mt-8 text-xl lg:text-2xl ftracking-tight text-white`)}>
             <span className={tw(`text-blue-400`)}>Peace is something</span> to experience and sustain{' '}
-            <span className="underline">without risk of political opt-outs.</span>
+          </p>
+
+          <p className={tw(` text-xl lg:text-2xl ftracking-tight text-white`)}>
+            <span>without the risk of political opt-outs </span>
           </p>
 
           {/* <div className={tw(`mt:12 lg:mb:8`)}>
             <iframe width="100%" height="600" src="https://www.youtube.com/embed/5r98tT0j1a0" allowFullScreen></iframe>
           </div> */}
 
           <p className={tw(`mt-8 text-xl lg:text-2xl ftracking-tight  text-white`)}>
-            It is a universal and unconditional basic experience and cannot be limited within alliances.
+            It is a universal and unconditional basic experience,
+          </p>
+          <p className={tw(`text-xl lg:text-2xl ftracking-tight  text-white`)}>
+            cannot be limited within alliances, nor become luxury.
           </p>
-          <p className={tw(`mt-4 text-xl lg:text-2xl ftracking-tight  text-white mb-8 lg:mb-12`)}>
-            Shall be discovered within our civilisation scaled as a world peace, with all livings on the earth, from the
-            21st century forwards.
+          <p className={tw(`mt-8 text-xl lg:text-2xl ftracking-tight  text-white`)}>
+            Shall finally be discovered within our civilisation;
+          </p>
+          <p className={tw(`text-xl lg:text-2xl ftracking-tight  text-white mb-8 `)}>
+            scaled as a world peace, with all livings on planet:
+          </p>
+          <p className={tw(`text-xl lg:text-2xl ftracking-tight  text-white mb-8 lg:mb-0 `)}>
+            ~ World Peace ~ 
+          </p>
+          <p className={tw(`text-xl lg:text-2xl ftracking-tight  text-white mb-8 lg:mb-10`)}>
+           from the 21st century forwards {">>"} 
           </p>
 
-          <p className={tw(`bg-yellow-400 mt-4 text-xl lg:text-2xl ftracking-tight  text-black mb-8 lg:mb-12`)}>
+          <p className={tw(`bg-yellow-400 mt-4 text-xl lg:text-2xl ftracking-tight  text-black mb-8 lg:mb-16`)}>
             ### end manifest ###
           </p>
 
@@ -67,54 +85,68 @@ const FeatureSection = () => (
               ></iframe>
             </div>
           </div>
+
+
+
+        <div className='lg:mt-16 lg:mb-16'>
+
+        <div data-upvoty></div>
+
+        </div>
+        <p className={tw(` mb-8 mt-4 text-xl text-4xl lg:text-4xl font-bold tracking-tight  text-white`)}>
+            the revolution will be minted
+          </p>
+
+            {/* <div className={tw(`lg:ml-100`)}>
+
+            <img src="demoverse-logo-horizontal.png" alt="logo" width="24%" height={60} className={tw(`  lg:ml-30 rounded-full bg-black`)} />
+          </div> */}
+
           <p className={tw(`mt-10 lg:mt-16 text-xl lg:text-2xl ftracking-tight text-white`)}>
+          We are imagining blockchain as a public ledger for writing future, from now. 
+          </p>
+          <p className={tw(`mt-2  text-xl lg:text-2xl ftracking-tight text-white`)}>
+          Our efforts will be towards offsetting violence and carbon, concurrently.
+          </p>
+
+          <p className={tw(`mt-4 lg:mt-4 text-xl lg:text-2xl ftracking-tight text-white`)}>
             Here, boosting planetary regeneration with a world-wide disarmament and peace vision.
           </p>
-          <p className={tw(`mt-8 text-xl lg:text-2xl ftracking-tight  text-white`)}>
+          <p className={tw(`mt-4 text-xl lg:mt-6 lg:text-2xl ftracking-tight  text-white`)}>
             <span className="underline"> In fact, as world residents, looking for better user experiences.</span>
           </p>
 
-          <p className={tw(`mt-10 lg:mt-6 text-xl lg:text-2xl ftracking-tight text-white`)}>
+          <p className={tw(`text-xl lg:text-2xl ftracking-tight text-white`)}>
             this will be probably a hybrid systems theory,
           </p>
 
           <p className={tw(`mt-10 lg:mt-6 text-xl lg:text-2xl ftracking-tight text-white`)}>
-            on web2 & web3, concurrently.
-          </p>
-
-
-          <p className={tw(` mb-8 mt-4 text-xl text-4xl lg:text-4xl font-bold tracking-tight  text-white`)}>
-            the revolution will be minted
+            @ web2 & web3
           </p>
+
 
 
-          <div data-upvoty></div>
 
+
 
           {/* <ExpressonOfPeace /> */}
 
         </div>
 
-        <div className={tw(`flex flex-wrap my-12 text-white`)}>
+        {/* <div className={tw(`flex flex-wrap my-12 text-white`)}>
           <div className={tw(`w-full border-b md:w-1/2 md:border-r lg:w-1/3 p-8`)}>
             <div className={tw(`flex items-center mb-6`)}>
-              {/* <div className={tw(`flex ml-4  text-center text-2xl`)}> 
-              <Check width={20} height={20} fill="orange" className={tw(`h-14 w-14 text-indigo-500`)} />
-              
-              Socio-Env Contracts </div> */}
-
+       
               <div className={tw(`flex items-center`)}>
                 <Check width={20} height={20} fill="orange" className={tw(`h-14 w-14 text-indigo-500`)} />
                 <div className={tw(`ml-4  text-center text-2xl`)}>Socio-Env Contracts</div>
               </div>
             </div>
             <p className={tw(`leading-loose text-white-200 text-xl text-center lg:text-xl`)}>
               Read a version of Expression of Peace. Currently version zero exists as EoP #0.
-              {/* second: socio-environmental contracts on demoVerse */}
             </p>
             <p className={tw(`leading-loose text-white-200 text-xl text-center lg:text-xl mt-4`)}>
               Expressions are part of our Decentralised Identities, not for sale.
-              {/* second: socio-environmental contracts on demoVerse */}
             </p>
 
             <div className={tw(`lg:mx-12 mt-4 lg:my-8 text-center font-bolder  text-black lg:text-xl text-xl`)}>
@@ -133,9 +165,7 @@ const FeatureSection = () => (
               </button>
             </div>
           </div>
-          {/* give possibility for conditions */}
-          {/* Including demands, and hopes, denouncing wars and and speaking to people mostly, that are invited to co-imagine peace. */}
-
+      
           <div className={tw(`w-full border-b md:w-1/2 lg:w-1/3 lg:border-r p-8 text-w`)}>
             <div className={tw(`flex items-center mb-6`)}>
               <Check width={20} height={20} fill="red" className={tw(`h-14 w-14 text-indigo-500`)} />
@@ -161,14 +191,7 @@ const FeatureSection = () => (
               </button>
             </div>
 
-            {/* <div className={tw(`lg:mx-12 mt-4 lg:my-8 text-center font-bolder  text-black lg:text-xl text-xl`)}>
-              <button className={tw(`bg-red-600 text-2xl text-white active:bg-pink-600 hover:bg-black hover:text-yellow-400 font-bold lg:text-lg md:text-md px-6 py-3 rounded shadow hover:shadow-lg outline-none focus:outline-none mr-1 mb-1 ease-linear transition-all duration-150 h-16 w-42 rounded-full`)}>
-
-            <a  href="https://gateway.pinata.cloud/ipfs/QmYBM9RpQEV6jbYM3Wf6QsZgoeeAAeKHRo1dmvhGc9xgUs" target="_blank" referrerPolicy="no-referrer">
-             how to c
-          </a>
-              </button>
-            </div> */}
+    
           </div>
 
           <div className={tw(`w-full md:w-1/2 lg:w-1/3 p-8`)}>
@@ -253,27 +276,7 @@ const FeatureSection = () => (
               </a>
             </div>
           </div>
-          {/* <div className={tw(`w-full border-b md:w-1/2 md:border-r lg:w-1/3 lg:border-r-0 p-8`)}>
-            <div className="flex items-center mb-6">
-              <Check width={20} height={20} fill="green" className={tw(`h-14 w-14 text-indigo-500`)} />
-              <div className={tw(`ml-4 text-xl`)}>Acknowledge Each Other</div>
-            </div>
-            <p className={tw(`leading-loose text-gray-800`)}>
-              With $PEACE tokens, Anyone can acknowledge each others' expressions and demands, hence efforts towards
-              achieving the 1st world peace.
-            </p>
-          </div>
-          <div className={tw(`w-full border-b md:w-1/2 md:border-r lg:w-1/3 lg:border-r-0 p-8`)}>
-            <div className="flex items-center mb-6">
-              <Check width={20} height={20} fill="green" className={tw(`h-14 w-14 text-indigo-500`)} />
-              <div className={tw(`ml-4 text-xl`)}>Acknowledge Each Other</div>
-            </div>
-            <p className={tw(`leading-loose text-gray-800`)}>
-              With $PEACE tokens, Anyone can acknowledge each others' expressions and demands, hence efforts towards
-              achieving the 1st world peace.
-            </p>
-          </div> */}
-        </div>
+        </div> */}
       </div>
     </div>
   </section>

diff --git a/src/components/footer/index.tsx b/src/components/footer/index.tsx
@@ -9,10 +9,16 @@ const solutions = [
   { name: 'Creative disruption', link: 'https://en.wikipedia.org/wiki/Creative_disruption' },
 ];
 
+const actions = [
+  { name: 'Expression of Peace', link: 'https://en.wikipedia.org/wiki/Design_thinking' },
+  { name: 'Expression of Demand', link: 'https://en.wikipedia.org/wiki/Game_theory' },
+  { name: 'Acknowledgement of Civil', link: 'https://en.wikipedia.org/wiki/Creative_disruption' },
+];
+
 const resources = [
-  { name: 'Design & Brainstorm', link: 'https://miro.com/app/board/uXjVOX94E5k=/?invite_link_id=47727813201' },
-  { name: 'NFTs', link: 'https://xdai.unique.one/profile/demoverse' },
-  { name: '@xyz', link: 'https://guild.xyz/peacemakers' },
+  { name: 'Imagination', link: 'https://miro.com/app/board/uXjVOX94E5k=/?invite_link_id=47727813201' },
+  { name: 'Art of Peace', link: 'https://xdai.unique.one/profile/demoverse' },
+  { name: 'Peace Guilds', link: 'https://guild.xyz/peacemakers' },
 ];
 
 const contacts = [
@@ -23,7 +29,7 @@ const contacts = [
 
 const Footer = () => {
   return (
-    <footer className={tw(`bg-white border-t border-gray-400 pt-14 pb-16`)}>
+    <footer className={tw(`bg-white border-t border-gray-400 pt-14 pb-8`)}>
       <div className={tw(`flex justify-center w-full flex items-center`)}></div>
       <div className={tw(`max-w-12xl mx-auto text-gray-400 px-8 lg:px-0 flex flex-wrap `)}>
         <div className={tw(`flex w-full `)}>
@@ -49,7 +55,7 @@ const Footer = () => {
 
             <li className={tw(`w-1/2 md:w-1/3 lg:w-1/3`)}>
               <div>
-                <h4 className={tw(`text-gray-900 text-xl lg:text-2xl font-bold mb-1 `)}>Peace Guild</h4>
+                <h4 className={tw(`text-gray-900 text-xl lg:text-2xl font-bold mb-1 `)}>Makerspace</h4>
                 <ul>
                   {resources.map((resource) => (
                     <li
@@ -65,7 +71,8 @@ const Footer = () => {
               </div>
             </li>
 
-            <li className={tw(`w-1/2 md:w-1/3 lg:w-1/3 `)}>
+
+ <li className={tw(`w-1/2 md:w-1/3 lg:w-1/3 `)}>
               <div>
                 <h4 className={tw(`text-gray-900 text-xl lg:text-2xl font-bold mb-1`)}>Solutions</h4>
                 <ul>
@@ -79,9 +86,25 @@ const Footer = () => {
                 </ul>
               </div>
             </li>
-            <li>
+            <li className={tw(`w-1/2 md:w-1/3 lg:w-1/3 `)}>
+              <div>
+                <h4 className={tw(`text-gray-900 text-xl lg:text-2xl font-bold mb-1`)}>Actions</h4>
+                <ul>
+                  {actions.map((action) => (
+                    <li className={tw(`text-gray-800 text-l lg:text-xl font-medium leading-6`)} key={action.name}>
+                      <a href={action.link} target="_blank" referrerPolicy="no-referrer">
+                        {action.name}
+                      </a>
+                    </li>
+                  ))}
+                </ul>
+              </div>
+            </li>
+
+
+            <li >
               <div
-                className={tw(` lg:my-2 text-center font-bolder  text-black lg:text-xl bg-green-500 rounded-full mr-8`)}
+                className={tw(` ml-12 lg:ml-0 lg:mr-12 mt-6 lg:mt-4 lg:my-2 text-center font-bolder  text-black lg:text-xl bg-green-500 rounded-full mr-8`)}
               >
                 <a href="https://en.wikipedia.org/wiki/World_peace" target="_blank" referrerPolicy="no-referrer">
                   {/* <img className={tw(`h-16 w-16`)} src="logo.png" alt="world peace" /> */}
@@ -91,15 +114,16 @@ const Footer = () => {
             </li>
 
             <li>
-              <div className={tw(` lg:my-2  text-center font-bolder  text-black lg:text-xl`)}>
+              <div className={tw(`mt-6 lg:mt-4 lg:my-2  text-center font-bolder  text-black lg:text-xl`)}>
                 <a href="/">
                   {/* <img className={tw(`h-16 w-16`)} src="logo.png" alt="world peace" /> */}
                   <img src="dm.png" alt="logo" width={60} height={60} className={tw(`rounded-full bg-black`)} />
                 </a>
               </div>
             </li>
+
             <li>
-              <div className={tw(`my-4 lg:py-2 lg:ml-20 text-yellow`)}>
+              <div className={tw(`mt-8 lg:ml-60 lg:mt-6 my-4 lg:py-2 lg:ml-12 text-yellow`)}>
                 <iframe
                   width="100%"
                   height="42"