From acae38b69763f0674aceaf066934adbd0a28d1c9 Mon Sep 17 00:00:00 2001
From: "A. Bryant" <W.Sword.09@hotmail.com>
Date: Sat, 26 Aug 2023 23:51:37 -0600
Subject: [PATCH] slider added

---
 src/app/page.tsx              | 10 +++++----
 src/components/Terminal.tsx   | 26 ++++++++++++++++++++--
 src/components/Typewriter.tsx | 29 -------------------------
 src/css/page.module.css       | 41 ++++++++++++++++++++++++++++-------
 src/css/terminal.module.css   |  2 +-
 5 files changed, 64 insertions(+), 44 deletions(-)
 delete mode 100644 src/components/Typewriter.tsx

diff --git a/src/app/page.tsx b/src/app/page.tsx
index eaa0204..7d1b7b0 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -2,9 +2,9 @@
 import React, {useState} from 'react';
 import styles from '../css/page.module.css';
 import  Terminal  from '@/components/Terminal';
-import Typewriter from '@/components/Typewriter';
 import Model from '@/components/Model';
 import CrtSwitch from '@/components/CrtSwitch';
+import { dotFont } from '../fonts/fonts'
 import LanguageSwitch from '@/components/LanguageSwitch';
 import { useLanguageContext } from './context/language';
 import Image from 'next/image';
@@ -21,11 +21,11 @@ function Home() {
   let title:string
   if(language == 'English')
   {
-      title = 'Front-End Developer'
+      title = 'DUST AND ECHOES'
   }
   else if(language == 'Spanish')
   {
-      title = 'Desarrollador Front-End'
+      title = 'POLVO Y ECOS'
   }
   else
   {
@@ -36,7 +36,9 @@ function Home() {
     <main className={text}>
       <Image src="/scanlines.jpg" width={500} height={500} className={scanlines} alt="image" />
       <span className={scanner}></span>
-      <Typewriter text={title}/>
+      <section className={styles.header}>
+            <h1 style={dotFont.style}>{title}</h1>
+      </section>
       <div className={styles.grid}>
             <Terminal/>
             <aside className={styles.aside}>
diff --git a/src/components/Terminal.tsx b/src/components/Terminal.tsx
index b487b75..c6a7a98 100644
--- a/src/components/Terminal.tsx
+++ b/src/components/Terminal.tsx
@@ -113,7 +113,7 @@ const Terminal = () => {
     else if(language == 'Spanish')
     {
         banner = [
-            "      _/_/    _/_/_/      _/    _/      _/    _/    _/    _/_/_/_/",
+/*             "      _/_/    _/_/_/      _/    _/      _/    _/    _/    _/_/_/_/",
             "   _/    _/  _/    _/  _/_/  _/  _/  _/_/  _/_/  _/  _/  _/       ",
             "  _/_/_/_/  _/_/_/      _/  _/  _/    _/    _/  _/  _/  _/_/_/    ",
             " _/    _/  _/    _/    _/  _/  _/    _/    _/  _/  _/  _/         ",
@@ -130,7 +130,29 @@ const Terminal = () => {
             "| [][] [___][][][][][][][][][][][__] [__][][]  |     =^..^= github       </>   codepen",
             "|          [_][______________][_]              |     (°‿°) reddit      ,(u°)> twitter",
             "|______________________________________________|",
-            "",
+            "", */
+       "     .                                            .                             ",
+       "     *   .                  .              .        .   *          .            ",
+       "  .         .                     .       .           .      .        .         ",
+       "        o                             .                   .                     ",
+       "         .              .                  .           .                        ",
+       "          0     .                                                               ",
+       "                 .          .                 ,                ,    ,           ",
+       " .          \\          .                         .                             ",
+       "      .      \\   ,                                                             ",
+       "   .          o     .                 .                   .            .        ",
+       "     .         \\                 ,             .                .              ",
+       "               #\\##\\#      .                              .        .          ",
+       "             #  #O##\\###                .                        .             ",
+       "   .        #*#  #\\##\\###                       .                     ,       ",
+       "        .   ##*#  #\\##\\##               .                     .               ",
+       "      .      ##*#  #o##\\#         .                             ,       .      ",
+       "          .     *#  #\\#     .                    .             .          ,    ",
+       "                      \\          .                         .                   ",
+       "____^/\\___^--____/\\____O______________/\\/\\---/\\___________---______________",
+       "   /\\^   ^  ^    ^                  ^^ ^  '\\ ^          ^       ---           ",
+       "         --           -            --  -      -         ---  __       ^         ",
+       "   --  __                      ___--  ^  ^                         --  __       ",
             "Teclea \"help\" para ver los comandos disponibles\n\n"       
         ]
     
diff --git a/src/components/Typewriter.tsx b/src/components/Typewriter.tsx
deleted file mode 100644
index a527ac4..0000000
--- a/src/components/Typewriter.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import React, {useState, useEffect, useRef} from 'react';
-import { dotFont } from '../fonts/fonts'
-
-const Typewriter = ({ text }: { text:string }) => {
-    const index = useRef(0);
-    const [currentText, setCurrentText] = useState('');
-
-    useEffect(() => {
-        index.current = 0;
-        setCurrentText('');
-    }, [text]);
-    
-    useEffect(() => {
-        if (index.current < text.length) 
-        {
-            const nextChar: string = text.charAt(index.current);
-            const timer = setTimeout(() => {
-              setCurrentText(val => val + nextChar);
-              index.current++;
-            }, 80);
-      
-            return () => clearTimeout(timer);
-        }
-    }, [currentText, text]);
-
-    return <h1 style={dotFont.style} >&gt;{currentText}</h1>
-};
-
-export default Typewriter;
\ No newline at end of file
diff --git a/src/css/page.module.css b/src/css/page.module.css
index fc8472c..82d6731 100644
--- a/src/css/page.module.css
+++ b/src/css/page.module.css
@@ -2,22 +2,42 @@
 {
   display: flex;
   flex-direction: column;
+  justify-content: center;
   height: 100vh;
   color: white;
   padding: 30px;
 }
 
+.header
+{
+  margin: 0 0 25px 0;
+  border: 1px solid rgb(255,255,255);
+  overflow-x: hidden;
+  display: flex;
+  align-items: center;
+}
+
 .main h1
 {
   font-size: 10vh; 
-  margin: 0 0 2% 0
+  animation: slider 10s infinite linear;
+  display:inline-block; 
 }
 
+@keyframes slider
+{
+  0%{
+    transform: translateX(-100%);
+  }
+
+  100%{
+    transform: translateX(100vw);
+  }
+}
 .bright{ text-shadow: 1px 1px 2px white, 0 0 1em white, 0 0 0.8em white; }
 .bright input { text-shadow: 1px 1px 2px white, 0 0 1em white, 0 0 0.8em white; }
 .bright h1{
   font-size: 10vh; 
-  margin: 0 0 2% 0
 }
 
 .grid
@@ -41,7 +61,7 @@
 {
   display: flex;
   flex-direction: row;
-  border: 3px solid rgb(255, 255, 255);
+  border: 1px solid rgb(255, 255, 255);
   height: 40%;
   animation: right 1s ease;
 }
@@ -54,7 +74,7 @@
 
 .bars
 {
-  border: 3px solid rgb(255, 255, 255);
+  border: 1px solid rgb(255, 255, 255);
   height: 40%;
   animation: right 1.5s ease;
   background: repeating-linear-gradient(90deg, #ffffff 0, #ffffff 3%, transparent 0, transparent 50%), repeating-linear-gradient(180deg, #ffffff 0, #ffffff 3%, transparent 0, transparent 50%);
@@ -65,7 +85,7 @@
 
 .crtSwitch
 {
-  border: 3px solid rgb(255, 255, 255);
+  border: 1px solid rgb(255, 255, 255);
   height: 20%;
   display: flex;
   justify-content: center;
@@ -157,10 +177,13 @@
   {
     height: 100%;
   }
+  .header
+  {
+    height: 18vh;
+  }
   .main h1 
   {
     font-size: 7vh;
-    height: 18vh;
   }
 }
 
@@ -175,12 +198,14 @@
       width: 100%;
       height: 150%;
   }
+  .header
+  {
+    height: 12vh;
+  }
   .main h1 
   {
     font-size: 5vh;
     text-align: center;
-    margin: 0 0 7% 0;
-    height: 12vh;
   }
   
   .canvas
diff --git a/src/css/terminal.module.css b/src/css/terminal.module.css
index b60ee58..fca79ad 100644
--- a/src/css/terminal.module.css
+++ b/src/css/terminal.module.css
@@ -6,7 +6,7 @@
     overflow-X:hidden;
     color: white;
     font-size: 3vh;
-    border: 3px solid rgb(255, 255, 255);
+    border: 1px solid rgb(255, 255, 255);
 }
 
 .terminal__history