From bd6fc4bb753166847966553f77ff88375f4a964a Mon Sep 17 00:00:00 2001 From: Athish Thayalan Date: Tue, 30 Apr 2024 17:40:18 +0100 Subject: [PATCH] Updates --- assets/{index-C-NX0T0j.js => index-CRAfRp0u.js} | 2 +- index.html | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) rename assets/{index-C-NX0T0j.js => index-CRAfRp0u.js} (99%) diff --git a/assets/index-C-NX0T0j.js b/assets/index-CRAfRp0u.js similarity index 99% rename from assets/index-C-NX0T0j.js rename to assets/index-CRAfRp0u.js index 1097831..7cae294 100644 --- a/assets/index-C-NX0T0j.js +++ b/assets/index-CRAfRp0u.js @@ -63,4 +63,4 @@ Error generating stack: `+i.message+` -webkit-animation: 0; animation: 0; } - `,document.body.appendChild(l)}},e}()),oa=new(function(){function e(){}var t=e.prototype;return t.typeHtmlChars=function(n,r,l){if(l.contentType!=="html")return r;var i=n.substring(r).charAt(0);if(i==="<"||i==="&"){var o;for(o=i==="<"?">":";";n.substring(r+1).charAt(0)!==o&&!(1+ ++r>n.length););r++}return r},t.backSpaceHtmlChars=function(n,r,l){if(l.contentType!=="html")return r;var i=n.substring(r).charAt(0);if(i===">"||i===";"){var o;for(o=i===">"?"<":"&";n.substring(r-1).charAt(0)!==o&&!(--r<0););r--}return r},e}()),xv=function(){function e(n,r){_v.load(this,r,n),this.begin()}var t=e.prototype;return t.toggle=function(){this.pause.status?this.start():this.stop()},t.stop=function(){this.typingComplete||this.pause.status||(this.toggleBlinking(!0),this.pause.status=!0,this.options.onStop(this.arrayPos,this))},t.start=function(){this.typingComplete||this.pause.status&&(this.pause.status=!1,this.pause.typewrite?this.typewrite(this.pause.curString,this.pause.curStrPos):this.backspace(this.pause.curString,this.pause.curStrPos),this.options.onStart(this.arrayPos,this))},t.destroy=function(){this.reset(!1),this.options.onDestroy(this)},t.reset=function(n){n===void 0&&(n=!0),clearInterval(this.timeout),this.replaceText(""),this.cursor&&this.cursor.parentNode&&(this.cursor.parentNode.removeChild(this.cursor),this.cursor=null),this.strPos=0,this.arrayPos=0,this.curLoop=0,n&&(this.insertCursor(),this.options.onReset(this),this.begin())},t.begin=function(){var n=this;this.options.onBegin(this),this.typingComplete=!1,this.shuffleStringsIfNeeded(this),this.insertCursor(),this.bindInputFocusEvents&&this.bindFocusEvents(),this.timeout=setTimeout(function(){n.strPos===0?n.typewrite(n.strings[n.sequence[n.arrayPos]],n.strPos):n.backspace(n.strings[n.sequence[n.arrayPos]],n.strPos)},this.startDelay)},t.typewrite=function(n,r){var l=this;this.fadeOut&&this.el.classList.contains(this.fadeOutClass)&&(this.el.classList.remove(this.fadeOutClass),this.cursor&&this.cursor.classList.remove(this.fadeOutClass));var i=this.humanizer(this.typeSpeed),o=1;this.pause.status!==!0?this.timeout=setTimeout(function(){r=oa.typeHtmlChars(n,r,l);var u=0,s=n.substring(r);if(s.charAt(0)==="^"&&/^\^\d+/.test(s)){var a=1;a+=(s=/\d+/.exec(s)[0]).length,u=parseInt(s),l.temporaryPause=!0,l.options.onTypingPaused(l.arrayPos,l),n=n.substring(0,r)+n.substring(r+a),l.toggleBlinking(!0)}if(s.charAt(0)==="`"){for(;n.substring(r+o).charAt(0)!=="`"&&(o++,!(r+o>n.length)););var h=n.substring(0,r),m=n.substring(h.length+1,r+o),p=n.substring(r+o+1);n=h+m+p,o--}l.timeout=setTimeout(function(){l.toggleBlinking(!1),r>=n.length?l.doneTyping(n,r):l.keepTyping(n,r,o),l.temporaryPause&&(l.temporaryPause=!1,l.options.onTypingResumed(l.arrayPos,l))},u)},i):this.setPauseStatus(n,r,!0)},t.keepTyping=function(n,r,l){r===0&&(this.toggleBlinking(!1),this.options.preStringTyped(this.arrayPos,this));var i=n.substring(0,r+=l);this.replaceText(i),this.typewrite(n,r)},t.doneTyping=function(n,r){var l=this;this.options.onStringTyped(this.arrayPos,this),this.toggleBlinking(!0),this.arrayPos===this.strings.length-1&&(this.complete(),this.loop===!1||this.curLoop===this.loopCount)||(this.timeout=setTimeout(function(){l.backspace(n,r)},this.backDelay))},t.backspace=function(n,r){var l=this;if(this.pause.status!==!0){if(this.fadeOut)return this.initFadeOut();this.toggleBlinking(!1);var i=this.humanizer(this.backSpeed);this.timeout=setTimeout(function(){r=oa.backSpaceHtmlChars(n,r,l);var o=n.substring(0,r);if(l.replaceText(o),l.smartBackspace){var u=l.strings[l.arrayPos+1];l.stopNum=u&&o===u.substring(0,r)?r:0}r>l.stopNum?(r--,l.backspace(n,r)):r<=l.stopNum&&(l.arrayPos++,l.arrayPos===l.strings.length?(l.arrayPos=0,l.options.onLastStringBackspaced(),l.shuffleStringsIfNeeded(),l.begin()):l.typewrite(l.strings[l.sequence[l.arrayPos]],r))},i)}else this.setPauseStatus(n,r,!1)},t.complete=function(){this.options.onComplete(this),this.loop?this.curLoop++:this.typingComplete=!0},t.setPauseStatus=function(n,r,l){this.pause.typewrite=l,this.pause.curString=n,this.pause.curStrPos=r},t.toggleBlinking=function(n){this.cursor&&(this.pause.status||this.cursorBlinking!==n&&(this.cursorBlinking=n,n?this.cursor.classList.add("typed-cursor--blink"):this.cursor.classList.remove("typed-cursor--blink")))},t.humanizer=function(n){return Math.round(Math.random()*n/2)+n},t.shuffleStringsIfNeeded=function(){this.shuffle&&(this.sequence=this.sequence.sort(function(){return Math.random()-.5}))},t.initFadeOut=function(){var n=this;return this.el.className+=" "+this.fadeOutClass,this.cursor&&(this.cursor.className+=" "+this.fadeOutClass),setTimeout(function(){n.arrayPos++,n.replaceText(""),n.strings.length>n.arrayPos?n.typewrite(n.strings[n.sequence[n.arrayPos]],0):(n.typewrite(n.strings[0],0),n.arrayPos=0)},this.fadeOutDelay)},t.replaceText=function(n){this.attr?this.el.setAttribute(this.attr,n):this.isInput?this.el.value=n:this.contentType==="html"?this.el.innerHTML=n:this.el.textContent=n},t.bindFocusEvents=function(){var n=this;this.isInput&&(this.el.addEventListener("focus",function(r){n.stop()}),this.el.addEventListener("blur",function(r){n.el.value&&n.el.value.length!==0||n.start()}))},t.insertCursor=function(){this.showCursor&&(this.cursor||(this.cursor=document.createElement("span"),this.cursor.className="typed-cursor",this.cursor.setAttribute("aria-hidden",!0),this.cursor.innerHTML=this.cursorChar,this.el.parentNode&&this.el.parentNode.insertBefore(this.cursor,this.el.nextSibling)))},e}();const Cv=()=>{const e=Ee.useRef(null);return Ee.useEffect(()=>{if(e.current){const t=new xv(e.current,{strings:["Athish.","coding.","sleeping.","Athish."],typeSpeed:200});return()=>{t.destroy()}}},[]),w.jsxs("div",{className:"h-screen bg-inherit flex pl-6",id:"home",children:[w.jsx("div",{className:"w-full md:w-1/2 flex items-center justify-center",children:w.jsxs("div",{className:"text-left",children:[w.jsxs("h1",{className:"text-4xl md:text-6xl text-white font-bold mb-5 md:mb-10",children:["Hey! I'm ",w.jsx("span",{ref:e})]}),w.jsx("h2",{className:"text-lg md:text-2xl text-sky-200",children:"I'm Athish Thayalan, a First Class, University of Nottingham graduate with a degree in Mathematics and Economics. With the Economics half having a focus on mathematical modelling, statistics, and data analysis, this gave me a taste of coding and has ignited my passion for it. Beyond crunching numbers, I thrive on leveraging them to create innovative tech solutions."})]})}),w.jsx("div",{className:"w-1/2 flex items-center justify-center hidden md:block ml-60",children:w.jsx("img",{src:kv,alt:"Profile",className:"max-h-full bounce"})})]})},Pv=["HTML","CSS","JavaScript","TypeScript","React","Java","Spring","Node.js","Express.js","MongoDB","Tailwind CSS","SQL","Python","TDD","Jest","Cypress"],Tv=()=>w.jsx("div",{className:"flex justify-center mt-40",id:"skills",children:w.jsxs("div",{className:"w-1/2 flex flex-col items-center justify-center",children:[w.jsx("h2",{className:"text-center text-3xl font-bold text-gray-200 mb-10",children:"Technical Skills"}),w.jsx("div",{className:"flex justify-center gap-4 flex-wrap",children:Pv.map((e,t)=>w.jsx("div",{className:"w-1/8 mb-4",children:w.jsxs("span",{className:"flex items-center justify-center inline-block whitespace-nowrap rounded-[0.27rem] bg-primary-100 px-[0.65em] pb-[0.25em] pt-[0.35em] text-center align-baseline text-[1.5em] font-bold leading-none text-black dark:bg-slate-300 dark:text-primary-500 h-10 transition duration-300 ease-in-out rainbow-hover slow-magnify",children:[" ",e]})},t))})]})}),ji=""+new URL("banner-bg-E1XfEa9Y.png",import.meta.url).href,Nv=""+new URL("2048-D0iDPGim.png",import.meta.url).href,Ov=""+new URL("punk-oyScbYcI.png",import.meta.url).href,Lv=""+new URL("calculator-DOidTRw5.png",import.meta.url).href,jv=""+new URL("yelpCamp-3lnY8bxr.png",import.meta.url).href,zv=""+new URL("sortingAlgo-DG0NieCJ.png",import.meta.url).href,Mv=""+new URL("wov-C9vk4DXr.png",import.meta.url).href,Iv=[{id:1,name:"YelpCamp",image:jv,description:"YelpCamp is a full-stack web application built with Node.js, Express, MongoDB, and Bootstrap. It allows users to browse, create, and review campgrounds. Features include user authentication, campground creation, commenting, and rating.",url:"https://yelpcamp-obn9.onrender.com/",repo:"https://github.com/AthishThayalan/yelpcamp"},{id:2,name:"2048 Clone",image:Nv,description:"2048 Clone is a clone of the popular 2048 game. It is built using HTML, CSS, and Typescript. The goal of the game is to combine numbered tiles on a grid to create a tile with the number 2048.",url:"https://athishthayalan.github.io/2048/",repo:"https://github.com/AthishThayalan/2048"},{id:3,name:"Sorting Algorithm Visualiser",image:zv,description:"Sorting Algorithm Visualiser is a web application that visualizes various sorting algorithms such as bubble sort, insertion sort, and quicksort. It helps users understand how these algorithms work by animating the sorting process.",url:"https://athishthayalan.github.io/sorting-algorithm-visualiser/",repo:"https://github.com/AthishThayalan/sorting-algorithm-visualiser"},{id:4,name:"PUNK",image:Ov,description:"PUNK is a web application that utilizes the Punk API to display information about different types of beers. Users can search for beers by name, style, and other criteria. The application provides detailed information about each beer, including ABV (alcohol by volume) and description.",url:"https://example.com/random-project-2",repo:"https://github.com/AthishThayalan/punkapi"},{id:5,name:"Calculator",image:Lv,description:"Calculator is a simple web-based calculator built using HTML, CSS, and JavaScript. It supports basic arithmetic operations such as addition, subtraction, multiplication, and division. Users can perform calculations using both the keyboard and mouse inputs.",url:"https://athishthayalan.github.io/calculator/",repo:"https://github.com/AthishThayalan/calculator"},{id:6,name:"Way of the Viking - Client Project",image:Mv,description:"Way of the Viking is a client project that uses React for the front end and firebase for the backend ",url:"https://wov-client-project.web.app/",repo:"https://github.com/nology-tech/wov-client-project"}],Wf=""+new URL("github-BsLkggKK.png",import.meta.url).href,Rv=({project:e})=>{const{id:t,image:n,name:r,url:l,description:i}=e,[o,u]=Ee.useState(!1),s=()=>{u(!0)},a=()=>{u(!1)};return w.jsxs("div",{className:"relative overflow-hidden rounded-lg bg-cover bg-no-repeat shadow-lg dark:shadow-black/20 bg-[50%]",style:{width:"100%",height:"90%"},onMouseEnter:s,onMouseLeave:a,children:[w.jsx("img",{src:n,alt:r,className:"w-full h-full object-cover"}),w.jsxs("a",{href:l,children:[w.jsx("div",{className:"absolute top-0 right-0 bottom-0 left-0 h-full w-full overflow-hidden bg-fixed bg-[hsla(0,0%,0%,0.3)]",children:o&&w.jsxs("div",{className:"flex h-full items-end justify-start",children:[w.jsx("h5",{className:"m-6 text-lg font-bold text-white",children:r}),w.jsx("p",{className:"m-6 text-sm text-white",children:i})]})}),w.jsx("div",{children:w.jsx("div",{className:"mask absolute top-0 right-0 bottom-0 left-0 h-full w-full overflow-hidden bg-fixed opacity-0 transition duration-300 ease-in-out hover:opacity-100 bg-[hsla(0,0%,99.2%,0.15)]"})})]}),w.jsx("a",{href:e.repo,target:"_blank",rel:"noopener noreferrer",className:"absolute top-0 right-0 m-2 github-icon-container",children:w.jsx("img",{src:Wf,alt:"GitHub",className:"w-8 h-8 github-icon"})})]},t)},Dv=()=>w.jsx("div",{className:"container my-24 mx-auto md:px-6 h-auto bg",id:"projects",children:w.jsxs("section",{className:"mb-32 ",children:[w.jsxs("h2",{className:"mb-12 text-white text-center text-3xl font-bold",children:["Welcome to my",w.jsx("u",{className:"text-gray-200 dark:text-primary-400",children:" Projects!"})]}),w.jsx("div",{className:"grid gap-6 lg:grid-cols-3",children:Iv.map(e=>w.jsx(Rv,{project:e},e.id))})]})}),$v=""+new URL("me-cropped-removebg-preview-Buv3cjnm.png",import.meta.url).href,Fv=""+new URL("linkedin-BPkF7gsN.png",import.meta.url).href,Hv=""+new URL("email-BigMg9aS.png",import.meta.url).href,Uv=()=>w.jsxs("div",{className:"max-w-screen-xl mx-auto h-screen flex items-center justify-center pb-12",children:[" ",w.jsxs("div",{className:"bg-zinc-900 rounded-lg shadow-lg md:flex md:flex-row items-center justify-center text-white h-5/6 p-4",id:"contact",children:[w.jsxs("div",{className:"md:w-1/2 p-4",children:[w.jsx("h2",{className:"text-2xl font-bold mb-4",children:"Let's Connect!"}),w.jsx("p",{className:"text-lg mb-4",children:"Whether you have a project idea, want to collaborate, or just want to say hello, feel free to reach out to me. I'd love to hear from you!"}),w.jsx("p",{className:"text-lg mb-8",children:"You can reach me through any of the following channels:"}),w.jsxs("div",{className:"flex flex-col space-y-4",children:[w.jsxs("a",{href:"mailto:tathish@hotmail.co.uk",className:"flex items-center text-lg text-primary-400 hover:scale-110",children:[w.jsx("img",{src:Hv,alt:"Email",className:"w-6 h-6 mr-2"}),"Email"]}),w.jsxs("a",{href:"https://www.linkedin.com/in/athish-thayalan-1182b81b7/",target:"_blank",rel:"noopener noreferrer",className:"flex items-center text-lg text-primary-400 hover:scale-110",children:[w.jsx("img",{src:Fv,alt:"LinkedIn",className:"w-6 h-6 mr-2"}),"LinkedIn"]}),w.jsxs("a",{href:"https://github.com/AthishThayalan",target:"_blank",rel:"noopener noreferrer",className:"flex items-center text-lg text-primary-400 hover:scale-110",children:[w.jsx("img",{src:Wf,alt:"GitHub",className:"w-6 h-6 mr-2"}),"GitHub"]})]})]}),w.jsx("div",{className:"md:w-1/3 ml-40 mb-20",children:w.jsx("img",{src:$v,alt:"My Image",className:"w-200 rounded-md max-h-full bounce"})})]})]}),Av=""+new URL("me-CTBj4ViG.jpg",import.meta.url).href,Bv=()=>w.jsx("div",{className:"flex justify-center items-center h-screen",children:w.jsxs("div",{className:"bg-zinc-900 flex items-center w-full max-w-7xl mx-auto bg-white rounded-lg shadow-lg overflow-hidden h-4/5",children:[w.jsx("div",{className:"flex-none w-1/3 ml-10",children:w.jsx("img",{src:Av,alt:"My Image",className:"h-auto w-full object-cover rounded-full w-80 h-80"})}),w.jsxs("div",{className:"p-8 flex-1",children:[w.jsx("h2",{className:"text-2xl font-bold mb-4 text-white",children:"About Me"}),w.jsxs("p",{className:"text-white",children:["Aside from logical problem solving, I also believe in the importance of physical fitness. I frequent the gym regularly, pushing my limits and striving for improvement. There's something incredibly satisfying about the feeling of accomplishment after a challenging workout. This has also helped me develop my"," ",w.jsx("strong",{children:"growth mindeset!"}),w.jsx("br",{}),w.jsx("br",{}),"And of course, no day is complete without a steaming hot cup of coffee. Whether it's to kickstart my morning or to fuel an intense coding session, coffee is my constant companion, providing both warmth and inspiration."]})]})]})});function Wv(){return w.jsxs("div",{className:"w-full font-poppins bg-cover bg-center ",style:{backgroundImage:`url(${ji})`},children:[w.jsx(Sv,{}),w.jsxs("div",{className:" bg-cover bg-center",style:{backgroundImage:`url(${ji})`},children:[w.jsx(Cv,{}),w.jsx(Bv,{}),w.jsx(Tv,{})]}),w.jsxs("div",{className:" bg-cover bg-center",style:{backgroundImage:`url(${ji})`},children:[w.jsx(Dv,{}),w.jsx(Uv,{})]})]})}zi.createRoot(document.getElementById("root")).render(w.jsx(od.StrictMode,{children:w.jsx(Wv,{})})); + `,document.body.appendChild(l)}},e}()),oa=new(function(){function e(){}var t=e.prototype;return t.typeHtmlChars=function(n,r,l){if(l.contentType!=="html")return r;var i=n.substring(r).charAt(0);if(i==="<"||i==="&"){var o;for(o=i==="<"?">":";";n.substring(r+1).charAt(0)!==o&&!(1+ ++r>n.length););r++}return r},t.backSpaceHtmlChars=function(n,r,l){if(l.contentType!=="html")return r;var i=n.substring(r).charAt(0);if(i===">"||i===";"){var o;for(o=i===">"?"<":"&";n.substring(r-1).charAt(0)!==o&&!(--r<0););r--}return r},e}()),xv=function(){function e(n,r){_v.load(this,r,n),this.begin()}var t=e.prototype;return t.toggle=function(){this.pause.status?this.start():this.stop()},t.stop=function(){this.typingComplete||this.pause.status||(this.toggleBlinking(!0),this.pause.status=!0,this.options.onStop(this.arrayPos,this))},t.start=function(){this.typingComplete||this.pause.status&&(this.pause.status=!1,this.pause.typewrite?this.typewrite(this.pause.curString,this.pause.curStrPos):this.backspace(this.pause.curString,this.pause.curStrPos),this.options.onStart(this.arrayPos,this))},t.destroy=function(){this.reset(!1),this.options.onDestroy(this)},t.reset=function(n){n===void 0&&(n=!0),clearInterval(this.timeout),this.replaceText(""),this.cursor&&this.cursor.parentNode&&(this.cursor.parentNode.removeChild(this.cursor),this.cursor=null),this.strPos=0,this.arrayPos=0,this.curLoop=0,n&&(this.insertCursor(),this.options.onReset(this),this.begin())},t.begin=function(){var n=this;this.options.onBegin(this),this.typingComplete=!1,this.shuffleStringsIfNeeded(this),this.insertCursor(),this.bindInputFocusEvents&&this.bindFocusEvents(),this.timeout=setTimeout(function(){n.strPos===0?n.typewrite(n.strings[n.sequence[n.arrayPos]],n.strPos):n.backspace(n.strings[n.sequence[n.arrayPos]],n.strPos)},this.startDelay)},t.typewrite=function(n,r){var l=this;this.fadeOut&&this.el.classList.contains(this.fadeOutClass)&&(this.el.classList.remove(this.fadeOutClass),this.cursor&&this.cursor.classList.remove(this.fadeOutClass));var i=this.humanizer(this.typeSpeed),o=1;this.pause.status!==!0?this.timeout=setTimeout(function(){r=oa.typeHtmlChars(n,r,l);var u=0,s=n.substring(r);if(s.charAt(0)==="^"&&/^\^\d+/.test(s)){var a=1;a+=(s=/\d+/.exec(s)[0]).length,u=parseInt(s),l.temporaryPause=!0,l.options.onTypingPaused(l.arrayPos,l),n=n.substring(0,r)+n.substring(r+a),l.toggleBlinking(!0)}if(s.charAt(0)==="`"){for(;n.substring(r+o).charAt(0)!=="`"&&(o++,!(r+o>n.length)););var h=n.substring(0,r),m=n.substring(h.length+1,r+o),p=n.substring(r+o+1);n=h+m+p,o--}l.timeout=setTimeout(function(){l.toggleBlinking(!1),r>=n.length?l.doneTyping(n,r):l.keepTyping(n,r,o),l.temporaryPause&&(l.temporaryPause=!1,l.options.onTypingResumed(l.arrayPos,l))},u)},i):this.setPauseStatus(n,r,!0)},t.keepTyping=function(n,r,l){r===0&&(this.toggleBlinking(!1),this.options.preStringTyped(this.arrayPos,this));var i=n.substring(0,r+=l);this.replaceText(i),this.typewrite(n,r)},t.doneTyping=function(n,r){var l=this;this.options.onStringTyped(this.arrayPos,this),this.toggleBlinking(!0),this.arrayPos===this.strings.length-1&&(this.complete(),this.loop===!1||this.curLoop===this.loopCount)||(this.timeout=setTimeout(function(){l.backspace(n,r)},this.backDelay))},t.backspace=function(n,r){var l=this;if(this.pause.status!==!0){if(this.fadeOut)return this.initFadeOut();this.toggleBlinking(!1);var i=this.humanizer(this.backSpeed);this.timeout=setTimeout(function(){r=oa.backSpaceHtmlChars(n,r,l);var o=n.substring(0,r);if(l.replaceText(o),l.smartBackspace){var u=l.strings[l.arrayPos+1];l.stopNum=u&&o===u.substring(0,r)?r:0}r>l.stopNum?(r--,l.backspace(n,r)):r<=l.stopNum&&(l.arrayPos++,l.arrayPos===l.strings.length?(l.arrayPos=0,l.options.onLastStringBackspaced(),l.shuffleStringsIfNeeded(),l.begin()):l.typewrite(l.strings[l.sequence[l.arrayPos]],r))},i)}else this.setPauseStatus(n,r,!1)},t.complete=function(){this.options.onComplete(this),this.loop?this.curLoop++:this.typingComplete=!0},t.setPauseStatus=function(n,r,l){this.pause.typewrite=l,this.pause.curString=n,this.pause.curStrPos=r},t.toggleBlinking=function(n){this.cursor&&(this.pause.status||this.cursorBlinking!==n&&(this.cursorBlinking=n,n?this.cursor.classList.add("typed-cursor--blink"):this.cursor.classList.remove("typed-cursor--blink")))},t.humanizer=function(n){return Math.round(Math.random()*n/2)+n},t.shuffleStringsIfNeeded=function(){this.shuffle&&(this.sequence=this.sequence.sort(function(){return Math.random()-.5}))},t.initFadeOut=function(){var n=this;return this.el.className+=" "+this.fadeOutClass,this.cursor&&(this.cursor.className+=" "+this.fadeOutClass),setTimeout(function(){n.arrayPos++,n.replaceText(""),n.strings.length>n.arrayPos?n.typewrite(n.strings[n.sequence[n.arrayPos]],0):(n.typewrite(n.strings[0],0),n.arrayPos=0)},this.fadeOutDelay)},t.replaceText=function(n){this.attr?this.el.setAttribute(this.attr,n):this.isInput?this.el.value=n:this.contentType==="html"?this.el.innerHTML=n:this.el.textContent=n},t.bindFocusEvents=function(){var n=this;this.isInput&&(this.el.addEventListener("focus",function(r){n.stop()}),this.el.addEventListener("blur",function(r){n.el.value&&n.el.value.length!==0||n.start()}))},t.insertCursor=function(){this.showCursor&&(this.cursor||(this.cursor=document.createElement("span"),this.cursor.className="typed-cursor",this.cursor.setAttribute("aria-hidden",!0),this.cursor.innerHTML=this.cursorChar,this.el.parentNode&&this.el.parentNode.insertBefore(this.cursor,this.el.nextSibling)))},e}();const Cv=()=>{const e=Ee.useRef(null);return Ee.useEffect(()=>{if(e.current){const t=new xv(e.current,{strings:["Athish.","coding.","sleeping.","Athish."],typeSpeed:200});return()=>{t.destroy()}}},[]),w.jsxs("div",{className:"h-screen bg-inherit flex pl-6",id:"home",children:[w.jsx("div",{className:"w-full md:w-1/2 flex items-center justify-center",children:w.jsxs("div",{className:"text-left",children:[w.jsxs("h1",{className:"text-4xl md:text-6xl text-white font-bold mb-5 md:mb-10",children:["Hey! I'm ",w.jsx("span",{ref:e})]}),w.jsx("h2",{className:"text-lg md:text-2xl text-sky-200",children:"I'm Athish Thayalan, a First Class, University of Nottingham graduate with a degree in Mathematics and Economics. With the Economics half having a focus on mathematical modelling, statistics, and data analysis, this gave me a taste of coding and has ignited my passion for it. Beyond crunching numbers, I thrive on leveraging them to create innovative tech solutions."})]})}),w.jsx("div",{className:"w-1/2 flex items-center justify-center hidden md:block ml-60",children:w.jsx("img",{src:kv,alt:"Profile",className:"max-h-full bounce"})})]})},Pv=["HTML","CSS","JavaScript","TypeScript","React","Java","Spring","Node.js","Express.js","MongoDB","Tailwind CSS","SQL","Python","TDD","Jest","Cypress"],Tv=()=>w.jsx("div",{className:"flex justify-center mt-40",id:"skills",children:w.jsxs("div",{className:"w-1/2 flex flex-col items-center justify-center",children:[w.jsx("h2",{className:"text-center text-3xl font-bold text-gray-200 mb-10",children:"Technical Skills"}),w.jsx("div",{className:"flex justify-center gap-4 flex-wrap",children:Pv.map((e,t)=>w.jsx("div",{className:"w-1/8 mb-4",children:w.jsxs("span",{className:"flex items-center justify-center inline-block whitespace-nowrap rounded-[0.27rem] bg-primary-100 px-[0.65em] pb-[0.25em] pt-[0.35em] text-center align-baseline text-[1.5em] font-bold leading-none text-black dark:bg-slate-300 dark:text-primary-500 h-10 transition duration-300 ease-in-out rainbow-hover slow-magnify",children:[" ",e]})},t))})]})}),ji=""+new URL("banner-bg-E1XfEa9Y.png",import.meta.url).href,Nv=""+new URL("2048-D0iDPGim.png",import.meta.url).href,Ov=""+new URL("punk-oyScbYcI.png",import.meta.url).href,Lv=""+new URL("calculator-DOidTRw5.png",import.meta.url).href,jv=""+new URL("yelpCamp-3lnY8bxr.png",import.meta.url).href,zv=""+new URL("sortingAlgo-DG0NieCJ.png",import.meta.url).href,Mv=""+new URL("wov-C9vk4DXr.png",import.meta.url).href,Iv=[{id:1,name:"YelpCamp",image:jv,description:"YelpCamp is a full-stack web application built with Node.js, Express, MongoDB, and Bootstrap. It allows users to browse, create, and review campgrounds. Features include user authentication, campground creation, commenting, and rating.",url:"https://yelpcamp-obn9.onrender.com/",repo:"https://github.com/AthishThayalan/yelpcamp"},{id:2,name:"2048 Clone",image:Nv,description:"2048 Clone is a clone of the popular 2048 game. It is built using HTML, CSS, and Typescript. The goal of the game is to combine numbered tiles on a grid to create a tile with the number 2048.",url:"https://athishthayalan.github.io/2048/",repo:"https://github.com/AthishThayalan/2048"},{id:3,name:"Sorting Algorithm Visualiser",image:zv,description:"Sorting Algorithm Visualiser is a web application that visualizes various sorting algorithms such as bubble sort, insertion sort, and quicksort. It helps users understand how these algorithms work by animating the sorting process.",url:"https://athishthayalan.github.io/sorting-algorithm-visualiser/",repo:"https://github.com/AthishThayalan/sorting-algorithm-visualiser"},{id:4,name:"PUNK",image:Ov,description:"PUNK is a web application that utilizes the Punk API to display information about different types of beers. Users can search for beers by name, style, and other criteria. The application provides detailed information about each beer, including ABV (alcohol by volume) and description.",url:"https://example.com/random-project-2",repo:"https://github.com/AthishThayalan/punkapi"},{id:5,name:"Calculator",image:Lv,description:"Calculator is a simple web-based calculator built using HTML, CSS, and JavaScript. It supports basic arithmetic operations such as addition, subtraction, multiplication, and division. Users can perform calculations using both the keyboard and mouse inputs.",url:"https://athishthayalan.github.io/calculator/",repo:"https://github.com/AthishThayalan/calculator"},{id:6,name:"Way of the Viking - Client Project",image:Mv,description:"Way of the Viking is a client project that uses React for the front end and firebase for the backend ",url:"https://wov-client-project.web.app/",repo:"https://github.com/nology-tech/wov-client-project"}],Wf=""+new URL("github-BsLkggKK.png",import.meta.url).href,Rv=({project:e})=>{const{id:t,image:n,name:r,url:l,description:i}=e,[o,u]=Ee.useState(!1),s=()=>{u(!0)},a=()=>{u(!1)};return w.jsxs("div",{className:"relative overflow-hidden rounded-lg bg-cover bg-no-repeat shadow-lg dark:shadow-black/20 bg-[50%]",style:{width:"100%",height:"90%"},onMouseEnter:s,onMouseLeave:a,children:[w.jsx("img",{src:n,alt:r,className:"w-full h-full object-cover"}),w.jsxs("a",{href:l,children:[w.jsx("div",{className:"absolute top-0 right-0 bottom-0 left-0 h-full w-full overflow-hidden bg-fixed bg-[hsla(0,0%,0%,0.3)]",children:o&&w.jsxs("div",{className:"flex h-full items-end justify-start",children:[w.jsx("h5",{className:"m-6 text-lg font-bold text-white",children:r}),w.jsx("p",{className:"m-6 text-sm text-white",children:i})]})}),w.jsx("div",{children:w.jsx("div",{className:"mask absolute top-0 right-0 bottom-0 left-0 h-full w-full overflow-hidden bg-fixed opacity-0 transition duration-300 ease-in-out hover:opacity-100 bg-[hsla(0,0%,99.2%,0.15)]"})})]}),w.jsx("a",{href:e.repo,target:"_blank",rel:"noopener noreferrer",className:"absolute top-0 right-0 m-2 github-icon-container",children:w.jsx("img",{src:Wf,alt:"GitHub",className:"w-8 h-8 github-icon"})})]},t)},Dv=()=>w.jsx("div",{className:"container my-24 mx-auto md:px-6 h-auto bg",id:"projects",children:w.jsxs("section",{className:"mb-32 ",children:[w.jsxs("h2",{className:"mb-12 text-white text-center text-3xl font-bold",children:["Welcome to my",w.jsx("u",{className:"text-gray-200 dark:text-primary-400",children:" Projects!"})]}),w.jsx("div",{className:"grid gap-6 lg:grid-cols-3",children:Iv.map(e=>w.jsx(Rv,{project:e},e.id))})]})}),$v=""+new URL("me-cropped-removebg-preview-Buv3cjnm.png",import.meta.url).href,Fv=""+new URL("linkedin-BPkF7gsN.png",import.meta.url).href,Hv=""+new URL("email-BigMg9aS.png",import.meta.url).href,Uv=()=>w.jsxs("div",{className:"max-w-screen-xl mx-auto h-screen flex items-center justify-center pb-12",children:[" ",w.jsxs("div",{className:"bg-zinc-900 rounded-lg shadow-lg md:flex md:flex-row items-center justify-center text-white h-5/6 p-4",id:"contact",children:[w.jsxs("div",{className:"md:w-1/2 p-4",children:[w.jsx("h2",{className:"text-2xl font-bold mb-4",children:"Let's Connect!"}),w.jsx("p",{className:"text-lg mb-4",children:"Whether you have a project idea, want to collaborate, or just want to say hello, feel free to reach out to me. I'd love to hear from you!"}),w.jsx("p",{className:"text-lg mb-8",children:"You can reach me through any of the following channels:"}),w.jsxs("div",{className:"flex flex-col space-y-4",children:[w.jsxs("a",{href:"mailto:tathish@hotmail.co.uk",className:"flex items-center text-lg text-primary-400 hover:scale-110",children:[w.jsx("img",{src:Hv,alt:"Email",className:"w-6 h-6 mr-2"}),"Email"]}),w.jsxs("a",{href:"https://www.linkedin.com/in/athish-thayalan-1182b81b7/",target:"_blank",rel:"noopener noreferrer",className:"flex items-center text-lg text-primary-400 hover:scale-110",children:[w.jsx("img",{src:Fv,alt:"LinkedIn",className:"w-6 h-6 mr-2"}),"LinkedIn"]}),w.jsxs("a",{href:"https://github.com/AthishThayalan",target:"_blank",rel:"noopener noreferrer",className:"flex items-center text-lg text-primary-400 hover:scale-110",children:[w.jsx("img",{src:Wf,alt:"GitHub",className:"w-6 h-6 mr-2"}),"GitHub"]})]})]}),w.jsx("div",{className:"md:w-1/3 ml-40 mb-20 hidden md:block",children:w.jsx("img",{src:$v,alt:"My Image",className:"w-200 rounded-md max-h-full bounce"})})]})]}),Av=""+new URL("me-CTBj4ViG.jpg",import.meta.url).href,Bv=()=>w.jsx("div",{className:"flex justify-center items-center h-screen",children:w.jsxs("div",{className:"bg-zinc-900 flex items-center w-full max-w-7xl mx-auto bg-white rounded-lg shadow-lg overflow-hidden h-4/5",children:[w.jsx("div",{className:"flex-none w-1/3 ml-10 hidden md:block",children:w.jsx("img",{src:Av,alt:"My Image",className:"h-auto w-full object-cover rounded-full w-80 h-80"})}),w.jsxs("div",{className:"p-8 flex-1",children:[w.jsx("h2",{className:"text-2xl font-bold mb-4 text-white",children:"About Me"}),w.jsxs("p",{className:"text-white",children:["Aside from logical problem solving, I also believe in the importance of physical fitness. I frequent the gym regularly, pushing my limits and striving for improvement. There's something incredibly satisfying about the feeling of accomplishment after a challenging workout. This has also helped me develop my"," ",w.jsx("strong",{children:"growth mindeset!"}),w.jsx("br",{}),w.jsx("br",{}),"And of course, no day is complete without a steaming hot cup of coffee. Whether it's to kickstart my morning or to fuel an intense coding session, coffee is my constant companion, providing both warmth and inspiration."]})]})]})});function Wv(){return w.jsxs("div",{className:"w-full font-poppins bg-cover bg-center ",style:{backgroundImage:`url(${ji})`},children:[w.jsx(Sv,{}),w.jsxs("div",{className:" bg-cover bg-center",style:{backgroundImage:`url(${ji})`},children:[w.jsx(Cv,{}),w.jsx(Bv,{}),w.jsx(Tv,{})]}),w.jsxs("div",{className:" bg-cover bg-center",style:{backgroundImage:`url(${ji})`},children:[w.jsx(Dv,{}),w.jsx(Uv,{})]})]})}zi.createRoot(document.getElementById("root")).render(w.jsx(od.StrictMode,{children:w.jsx(Wv,{})})); diff --git a/index.html b/index.html index b5f4c59..73144fc 100644 --- a/index.html +++ b/index.html @@ -9,7 +9,7 @@ /> Portfolio - +