feat: add about text

Author: byandrev

index.html

@@ -129,9 +129,92 @@ <h1 class="select-none">Automata Simulation</h1>
       </div>
     </div>
 
-    <div class="container mx-auto my-10">
-      <h2 class="text-xl">How work?</h2>
-    </div>
+    <main class="leading-7">
+      <div class="container mx-auto my-10">
+        <h2 class="text-2xl font-bold mb-2">About</h2>
+
+        <p>
+          This open-source software provides users with the ability to create,
+          modify, and simulate automata efficiently and effectively. Through an
+          intuitive interface, users can define states, transitions, and
+          conditions, allowing them to visualize how an automaton responds to
+          different inputs or scenarios.
+        </p>
+
+        <p class="font-bold underline">
+          At the moment, it only works with DFA (Deterministic Finite Automata).
+        </p>
+      </div>
+
+      <div class="container mx-auto my-10">
+        <h2 class="text-2xl font-bold mb-2">Collaborate</h2>
+
+        <p class="mb-4">
+          Thank you for considering contributing to our project! We welcome
+          contributions from the community, whether it's for fixing existing
+          issues, adding new features, or improving the documentation. Here's
+          how you can contribute:
+        </p>
+
+        <p class="mb-4">
+          If you find an issue or have a feature request, please first check our
+          "Issues" section to make sure it hasn't been reported before. If it's
+          a new issue, you can open a new issue and provide a detailed
+          description.
+        </p>
+
+        <p class="mb-4">
+          If you want to contribute with code, follow these steps:
+        </p>
+
+        <ol class="list-decimal ml-6 mb-4">
+          <li>
+            Fork this repository and clone your copy to your local machine.
+          </li>
+          <li>
+            Create a new branch for your contribution: git branch branch-name.
+          </li>
+          <li>Make the necessary changes to the code.</li>
+          <li>Ensure your changes follow our code style guidelines.</li>
+          <li>
+            Commit your changes: git commit -m 'Description of the changes'.
+          </li>
+          <li>
+            Push your changes to your remote repository: git push origin
+            branch-name.
+          </li>
+          <li>
+            Open a pull request on our main repository, describing the changes
+            made and providing any additional context.
+          </li>
+        </ol>
+
+        <p>
+          If you have any questions or need further information, feel free to
+          contact us via
+          <a
+            class="underline text-blue-500"
+            href="https://twitter.com/byandrev"
+            target="_blank"
+            >twitter</a
+          >.
+        </p>
+      </div>
+    </main>
+
+    <footer class="container mx-auto flex justify-between border-t-2 py-8">
+      <p>Automata Simulation</p>
+
+      <p>
+        Development by
+        <a
+          target="_blank"
+          class="text-blue-500 underline"
+          href="https://byandrev-blog.vercel.app"
+          >Andres Parra</a
+        >
+      </p>
+    </footer>
 
     <div
       class="modal micromodal-slide"