add features and change docs link to wiki

src/components/FeatureSection/FeatureSection.vue

@@ -1,25 +1,24 @@
 <template>
     <div class="cont">
-        <FeatureCard title="Interactive" img="https://cdn.discordapp.com/attachments/1181143637178982483/1187109070835023962/b.mp4">
+        <FeatureCard title="Interactive" img="https://i.imgur.com/ksY8cBr.mp4">
             Run different part of code in an arbitary order, watch data in real-time, and easily track the active node
         </FeatureCard>
 
         <FeatureCard title="Dynamic" img="https://i.imgur.com/DFvavhw.png" reverse>
             Modify the running graph on the fly for instant changes in its behavior, including adjusting parameters, adding or removing nodes from a workflow, and terminating a loop
         </FeatureCard>
 
-        <FeatureCard title="Extendable" img="https://media.discordapp.net/attachments/1181143637178982483/1187115414967300127/image.png?ex=6595b662&is=65834162&hm=7c88484004d12fa93c1528ae1e1689a16062c5af9235e380db0184d49aeb506f&=&format=webp&quality=lossless&width=1440&height=524">
+        <FeatureCard title="Extendable" img="https://i.imgur.com/0QoOn0L.png">
             Create custom nodes from Python libraries of any domain, such as deep learning, robotics, or music synthesis
         </FeatureCard>
 
-        <FeatureCard title="Collaborative" img="https://i.imgur.com/rm3MOlg.png" reverse>
+        <FeatureCard title="Collaborative" img="https://i.imgur.com/CwkREu8.png" reverse>
             With Grapycal’s extension system, nodes for various domains can be shared and mixed to form powerful tools or artworks
             <br>
             Btw, real-time collab is supported
         </FeatureCard>
     </div>
 </template>
-
 <style scoped>
 .cont {
     padding: 60px 0px;

src/components/FooterSection.vue

@@ -3,7 +3,7 @@
         <div class="center">
             <p>
                 © 2024 Grapycal team |
-                <a href="https://github.com/Grapycal/Grapycal">GitHub</a> | <a href="https://docs.grapycal.org">Documentation</a> |
+                <a href="https://github.com/Grapycal/Grapycal">GitHub</a> | <a href="https://wiki.grapycal.org">Documentation/Wiki</a> |
                 <a href="https://www.facebook.com/groups/1504742843657956">Facebook</a> | <a href="https://discord.com/invite/adNQcS42CT">Discord</a>
             </p>
             <p>

src/components/MainSections/MainSection.vue

@@ -22,8 +22,8 @@
                 <h2>Documentation
                 </h2>
                     <ul>
-                        <li><a href="https://docs.grapycal.org/getting_started/installation.html">Getting Started</a></li>
-                        <li><a href="https://docs.grapycal.org/contribution_guide/contribution.html">Contributing</a></li>
+                        <li><a href="https://wiki.grapycal.org/index.php?title=Installation">Getting Started</a></li>
+                        <li><a href="https://wiki.grapycal.org/index.php?title=Contribution">Contributing</a></li>
                     </ul>
             </SubSection>
 
@@ -35,12 +35,10 @@
                 </p>
                 <h2>What you can do</h2>
                 <ul class="list-disc list-inside ml-4">
-                            <li class="mb-2">Add features or fix bugs to the <a href="https://docs.grapycal.org/contribution_guide/project_overview.html#backend"
-                                    >backend</a>.</li>
-                            <li class="mb-2">Add features or fix bugs to the <a href="https://docs.grapycal.org/contribution_guide/project_overview.html#frontend"
-                                    >frontend</a>.</li>
+                            <li class="mb-2">Add features or fix bugs to the backend.</li>
+                            <li class="mb-2">Add features or fix bugs to the frontend.</li>
                             <li class="mb-2">Create a new extension for any domain you like (such as image processing or music
-                                synthesis) by following <a href="https://docs.grapycal.org/contribution_guide/../getting_started/extension.html"
+                                synthesis) by following <a href="https://wiki.grapycal.org/index.php?title=Extension"
                                     >tutorial</a>.</li>
                             <li class="mb-2">Improve current extensions by adding new nodes or fixing bugs. Existing extensions are in
                                 the extensions folder of the <a href="https://github.com/Grapycal/Grapycal"
@@ -56,9 +54,9 @@
 
                 <h2>To start contributing</h2>
                 <ol>
-                    <li>Please <a href="https://docs.grapycal.org/contribution_guide/../getting_started/installation.html#install-from-source">install Grapycal from source</a>.</li>
+                    <li>Please <a href="hhttps://wiki.grapycal.org/index.php?title=Installation#Install%20from%20source">install Grapycal from source</a>.</li>
                     <li>Play around with Grapycal and feel how Grapycal helps you as a user. Find out what you like and what you don't like. If you feel something is missing, you can add it and create a <a href="https://github.com/Grapycal/Grapycal/pulls">pull request</a> or <a href="https://github.com/Grapycal/Grapycal/issues">open an issue</a>.</li>
-                    <li>Refer to the <a href="https://docs.grapycal.org/contribution_guide/project_overview.html">project overview</a> to understand the project structure.</li>
+                    <li>Refer to the <a href="https://wiki.grapycal.org/index.php?title=Application_Overview">project overview</a> to understand the project structure.</li>
                     <li>If you don't know where to start, visit the <a href="https://github.com/orgs/Grapycal/projects/2/views/1">Project Board</a>.
                          Find a topic that interests you and assign yourself to it. If you have a new idea, you can also create a new topic.</li>
                 </ol>

src/components/MainSections/UseCaseSection/UseCaseCard.vue

@@ -22,7 +22,6 @@
                   {{ props.title  }}
                 </DialogTitle>
                 <DialogDescription class="DialogDescription">
-                  Make changes to your profile here. Click save when you're done.
                 </DialogDescription>
                 <img class="img" :src="props.img" alt="feature image">
                 <slot></slot>
@@ -62,7 +61,7 @@ import {
 const props = defineProps({
     img: {
         type: String,
-        default: "https://i.imgur.com/npw0hVR.png"
+        default: "https://i.imgur.com/npw0hVR.png",
     },
     title: {
         type: String,
@@ -112,7 +111,7 @@ h1{
     flex: 1 1 500px;
     min-height: 0px;
     border-radius: 3px;
-    height: 160px;
+    height: 500px;
     object-fit: cover;
 
     position: relative;
@@ -145,7 +144,7 @@ input {
   left: 50%;
   transform: translate(-50%, -50%);
   width: 90vw;
-  max-width: 450px;
+  max-width: 800px;
   max-height: 85vh;
   padding: 25px;
   animation: contentShow 150ms cubic-bezier(0.16, 1, 0.3, 1);

src/components/MainSections/UseCaseSection/UseCaseSection.vue

@@ -27,24 +27,25 @@ const props = defineProps({
         default: () => [
             {
                 id: 1,
-                img: "https://i.imgur.com/npw0hVR.png",
+                img: "https://i.imgur.com/egHMKy5.png",
                 content: "Deep Learning very good ouo",
                 title: "Deep Learning"
             },
             {
                 id: 2,
-                img: "https://i.imgur.com/npw0hVR.png",
-                content: "Cont3qgent",
+                title: "Fractal",
+                img: "https://i.imgur.com/McUod9U.png",
+                content: "",
             },
             {
                 id: 3,
-                img: "https://i.imgur.com/npw0hVR.png",
-                content: "Content",
+                img: "https://i.imgur.com/ZaKkvlb.png",
+                title: "Image Processing",
             },
             {
                 id: 3,
-                img: "https://i.imgur.com/ZG9VEOD.png",
-                content: "Content",
+                img: "https://i.imgur.com/89zVRqf.png",
+                title: "Physics Simulation",
             }
         ]
     }