From 06181628272f0690f7238cb76d3c357126a305b5 Mon Sep 17 00:00:00 2001
From: Mohamed Salem <Eng_freelance@outlook.com>
Date: Sun, 12 Nov 2023 05:18:29 +0200
Subject: [PATCH] Update .gitattributes for line endings

---
 .gitattributes          |  18 ++++++
 .gitignore              |  64 ++++++++++++++++++++-
 .vscode/tasks.json      |  48 ++++++++++++----
 src/components/Main.vue | 120 ----------------------------------------
 src/main.js             |  20 ++++++-
 5 files changed, 134 insertions(+), 136 deletions(-)
 create mode 100644 .gitattributes
 delete mode 100644 src/components/Main.vue

diff --git a/.gitattributes b/.gitattributes
new file mode 100644
index 00000000..514628aa
--- /dev/null
+++ b/.gitattributes
@@ -0,0 +1,18 @@
+# Ensure consistent line endings for text files
+* text=auto
+
+# Exclude binary files and directories from line ending conversion
+*.png binary
+*.jpg binary
+*.ico binary
+*.svg binary
+*.woff binary
+*.woff2 binary
+*.pdf binary
+*.mp4 binary
+*.mp3 binary
+
+# Exclude files generated by Vue CLI (compiled output)
+/dist/* binary
+/node_modules/* binary
+/public/* binary
diff --git a/.gitignore b/.gitignore
index 3c3629e6..ac59a198 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1 +1,63 @@
-node_modules
+# Ignore Node.js modules
+node_modules/
+
+# Ignore built files
+/dist/
+/dist/*
+
+# Ignore configuration files
+.env.local
+.env.development
+.env.production
+.env.test
+
+# Ignore logs and other runtime data
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.pnp.*
+test-result.xml
+coverage
+.puppeteer
+.jest
+/.idea
+.eslintcache
+.DS_Store
+.cache/
+.vuepress/dist
+
+# Ignore Vue.js specific files
+/.vscode
+/nuxt
+/nuxt.js
+/nuxt.config.js
+!nuxt.config.js
+/package-lock.json
+/yarn.lock
+
+# Ignore generated files
+output
+output/
+*.exe
+
+# Ignore editor specific files
+.idea
+*.iml
+
+# Ignore OS generated files
+.DS_Store
+Thumbs.db
+ehthumbs.db
+desktop.ini
+$RECYCLE.BIN/
+/System Volume Information/
+RECYCLER/
+RECYCLED/
+RECYCLE.BIN/
+RECYCLED/
+$RECYCLE.BIN/
+$RECYCLED/
+
+# Ignore custom ignore files
+.ignore
+IGNORE
diff --git a/.vscode/tasks.json b/.vscode/tasks.json
index 37fb6fd2..9d874d3b 100644
--- a/.vscode/tasks.json
+++ b/.vscode/tasks.json
@@ -1,13 +1,37 @@
 {
-	"version": "2.0.0",
-	"tasks": [
-		{
-			"type": "npm",
-			"script": "build",
-			"group": "build",
-			"problemMatcher": [],
-			"label": "npm: build",
-			"detail": "vue-cli-service build"
-		}
-	]
-}
\ No newline at end of file
+  "version": "2.0.0",
+  "tasks": [
+    {
+      "type": "npm",
+      "script": "introit",
+      "group": "build",
+      "problemMatcher": [],
+      "label": "npm: introit",
+      "detail": "Run the Intro-It project (build, lint, and serve)"
+    },
+    {
+      "type": "npm",
+      "script": "build",
+      "group": "build",
+      "problemMatcher": [],
+      "label": "npm: build",
+      "detail": "vue-cli-service build"
+    },
+    {
+      "type": "npm",
+      "script": "lint",
+      "group": "none",
+      "problemMatcher": [],
+      "label": "npm: lint",
+      "detail": "vue-cli-service lint"
+    },
+    {
+      "type": "npm",
+      "script": "serve",
+      "group": "none",
+      "problemMatcher": [],
+      "label": "npm: serve",
+      "detail": "vue-cli-service serve"
+    }
+  ]
+}
diff --git a/src/components/Main.vue b/src/components/Main.vue
deleted file mode 100644
index 54fcd071..00000000
--- a/src/components/Main.vue
+++ /dev/null
@@ -1,120 +0,0 @@
-<template>
-  <div class="main">
-    <div id="demo">
-      <div id="demo1">
-        <h1 id="demo2">
-          <br />
-        </h1>
-      </div>
-    </div>
-    <VueParticle domId="demo" :config="particleConfig" />
-  </div>
-</template>
-
-<script>
-import VueParticle from "vue-particlejs";
-export default {
-  name: "Main",
-  props: {
-    msg: String,
-  },
-  components: {
-    VueParticle,
-  },
-  data() {
-    return {
-      particleConfig: {
-        particles: {
-          number: { value: 150, density: { enable: true, value_area: 800 } },
-          color: { value: "#000000" },
-          shape: {
-            type: "circle",
-            stroke: { width: 0, color: "#000000" },
-            polygon: { nb_sides: 5 },
-            image: { src: "img/github.svg", width: 100, height: 100 },
-          },
-          opacity: {
-            value: 0.5,
-            random: false,
-            anim: { enable: false, speed: 1, opacity_min: 0.1, sync: false },
-          },
-          size: {
-            value: 5,
-            random: true,
-            anim: { enable: false, speed: 40, size_min: 0.1, sync: false },
-          },
-          line_linked: {
-            enable: true,
-            distance: 150,
-            color: "#555555",
-            opacity: 0.4,
-            width: 3,
-          },
-          move: {
-            enable: true,
-            speed: 6,
-            direction: "none",
-            random: false,
-            straight: false,
-            out_mode: "out",
-            bounce: false,
-            attract: { enable: false, rotateX: 600, rotateY: 1200 },
-          },
-        },
-        interactivity: {
-          detect_on: "canvas",
-          events: {
-            onhover: { enable: false, mode: "repulse" },
-            onclick: { enable: false, mode: "push" },
-            resize: true,
-          },
-          modes: {
-            grab: { distance: 400, line_linked: { opacity: 1 } },
-            bubble: {
-              distance: 400,
-              size: 40,
-              duration: 2,
-              opacity: 8,
-              speed: 3,
-            },
-            repulse: { distance: 200, duration: 0.4 },
-            push: { particles_nb: 4 },
-            remove: { particles_nb: 2 },
-          },
-        },
-        retina_detect: true,
-      },
-    };
-  },
-};
-</script>
-
-<!-- Add "scoped" attribute to limit CSS to this component only -->
-<style scoped>
-#demo {
-  width: 100%;
-  height: 20vh;
-  background: url("") white;
-}
-#demo1 {
-  width: 100%;
-  height: 0%;
-  display: flex;
-  align-items: left;
-  justify-content: left;
-  color: black;
-  font-size: 1.5em;
-}
-#demo2 {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-  text-align: center;
-}
-#demo1 h1 {
-  position: relative;
-  left: 1em;
-  top: 0.75em;
-}
-</style>
diff --git a/src/main.js b/src/main.js
index 8f6c9e96..8194c440 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,6 +1,20 @@
+/*
+ * Intro-It Project - Create a GitHub Profile Readme Intro
+ *
+ * Intro-It is a project designed to craft compelling intros for your GitHub profile readme.md.
+ * It aims to provide an engaging and interactive introduction to make your profile stand out.
+ *
+ * Project Repository: https://github.com/Coder2Mo/Intro-It
+ *
+ * Author: Mohamed Salem
+ * Email: Eng_freelance@outlook.com
+ * Copyright (C) 2023 Mohamed Salem. All rights reserved.
+ * Licensed under the MIT License.
+ */
+
 import Vue from "vue";
 import App from "./App.vue";
-import MakeIt from "introit";
+import TypeIt from "typeit";
 
 Vue.config.productionTip = false;
 
@@ -8,8 +22,8 @@ new Vue({
   render: (h) => h(App)
 }).$mount("#app");
 
-// Initialize IntroIt for a professional Intro Writter effect
-new MakeIt("#demo2", {
+// Initialize TypeIt for a professional Intro Writer effect
+new TypeIt("#inner-demo-2", {
   speed: 100,
   lifelike: true,
   cursor: true,