-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
1 lines (1 loc) · 37.3 KB
/
index.html
1
<!DOCTYPE html><html class=motion-safe:scroll-smooth lang=en><head><meta charset=UTF-8><meta content="width=device-width,initial-scale=1" name=viewport><meta content="Astro v1.6.3" name=generator><!-- Icons --><link href=/favicon.svg rel=icon type=image/svg+xml><link href=/apple-touch-icon.png rel=apple-touch-icon sizes=180x180><link href=/favicon-32x32.png rel=icon sizes=32x32 type=image/png><link href=/favicon-16x16.png rel=icon sizes=16x16 type=image/png><link href=/site.webmanifest rel=manifest><link href=/safari-pinned-tab.svg rel=mask-icon color=#f57e7e><meta content=#00aba9 name=msapplication-TileColor><meta content=/mstile-144x144.png name=msapplication-TileImage><meta content=#ffffff name=theme-color><!-- SEO entries start --><title>Web-o-Reviews - Akshay Ghate</title><meta content="Akshay Ghate's Portfolio and future blog." name=description><link href=https://weboreviews.com/ rel=canonical><meta content="index, follow" name=robots><meta content=Web-o-Reviews property=og:title><meta content=website property=og:type><meta content=/og-image.png property=og:image><meta content=image/png property=og:image:type><meta content=1200 property=og:image:width><meta content=630 property=og:image:height><meta content=https://weboreviews.com/ property=og:url><meta content="Akshay Ghate's Portfolio and future blog." property=og:description><meta content=summary_large_image name=twitter:card><meta content=@akshayg name=twitter:site><meta content=Web-o-Reviews name=twitter:title><meta content="Akshay Ghate's Portfolio and future blog." name=twitter:description><meta content=/og-image.png name=twitter:image><meta content=@akshayg name=twitter:creator><!-- SEO entries end --><script>function attachEvent(e,t,c){const o=document.querySelectorAll(e);o&&o.length&&o.forEach((e=>{e.addEventListener(t,(()=>c(e)),!1)}))}localStorage.theme||(localStorage.theme="light"),"dark"===localStorage.theme||!("theme"in localStorage)&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.classList.add("dark"):document.documentElement.classList.remove("dark"),window.onload=function(){attachEvent("[toggle-menu]","click",(function(e){e.classList.toggle("expanded"),document.body.classList.toggle("overflow-hidden"),document.getElementById("menu")?.classList.toggle("hidden")})),attachEvent("[toggle-color-scheme]","click",(function(){document.documentElement.classList.toggle("dark"),localStorage.theme=document.documentElement.classList.contains("dark")?"dark":"light"})),"dark"===localStorage.theme||!("theme"in localStorage)&&window.matchMedia("(prefers-color-scheme: dark)").matches?(document.getElementById("check").checked=!0,document.getElementById("check2").checked=!0):(document.getElementById("check").checked=!1,document.getElementById("check2").checked=!1)},window.onpageshow=function(){const e=document.querySelector("[toggle-menu]");e&&e.classList.remove("expanded"),document.body.classList.remove("overflow-hidden"),document.getElementById("menu")?.classList.add("hidden")}</script><link href=/assets/404.829e7563.css rel=stylesheet /><link href=/assets/contact.b169e3c7.css rel=stylesheet /><script src=/page.5a6f3db5.js type=module></script></head><body class="dark:bg-dark-900 bg-gray-100 font-body text-f-base text-gray-700"><div class="absolute inset-0 2xl:h-[960px] bg-center bg-hero-img bg-no-repeat dark:bg-dark-900 dark:bg-hero-img-dark h-[700px] lg:h-[720px] md:h-[600px]"><div class="absolute inset-0 bg-bottom bg-grid-gray-900/[0.05] border-b border-gray-100/5" style="mask-image:linear-gradient(to bottom,transparent,black);-webkit-mask-image:linear-gradient(to bottom,transparent,black)"></div></div><header class="md:flex hidden justify-between max-w-7xl mx-auto px-8 py-8 relative xl:px-10 z-10"><div class=items-center><a class="focus:ring-slate-700/50 block focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-transparent" href=/ tabindex=0><img alt=Web-o-Reviews src=/assets/logo.e3f94983.svg height=45 width=80></a></div><nav class="items-center flex space-x-4"><a class="dark:text-white focus:outline-none dark:hover:text-geraldine-400 focus:border-b-4 focus:border-geraldine-400 font-display hover:duration-200 hover:ease-in-out hover:text-geraldine-600 hover:transition-all text-dark-500 text-f-base border-b-4 border-geraldine-500" href=/ rel=prefetch tabindex=0>Home </a><a class="dark:text-white focus:outline-none dark:hover:text-geraldine-400 focus:border-b-4 focus:border-geraldine-400 font-display hover:duration-200 hover:ease-in-out hover:text-geraldine-600 hover:transition-all text-dark-500 text-f-base" href=/about/ rel=prefetch tabindex=0>About </a><a class="dark:text-white focus:outline-none dark:hover:text-geraldine-400 focus:border-b-4 focus:border-geraldine-400 font-display hover:duration-200 hover:ease-in-out hover:text-geraldine-600 hover:transition-all text-dark-500 text-f-base" href=/design/ rel=prefetch tabindex=0>Design </a><a class="dark:text-white focus:outline-none dark:hover:text-geraldine-400 focus:border-b-4 focus:border-geraldine-400 font-display hover:duration-200 hover:ease-in-out hover:text-geraldine-600 hover:transition-all text-dark-500 text-f-base" href=/work/ rel=prefetch tabindex=0>Work </a><a class="dark:text-white focus:outline-none dark:hover:text-geraldine-400 focus:border-b-4 focus:border-geraldine-400 font-display hover:duration-200 hover:ease-in-out hover:text-geraldine-600 hover:transition-all text-dark-500 text-f-base" href=/contact/ rel=prefetch tabindex=0>Contact</a><div class="items-center inline-flex space-x-1"><svg class="dark:text-white text-dark-500" viewBox="0 0 24 24" astro-icon=bx:sun height=32 width=32><path d="M6.993 12c0 2.761 2.246 5.007 5.007 5.007s5.007-2.246 5.007-5.007S14.761 6.993 12 6.993 6.993 9.239 6.993 12zM12 8.993c1.658 0 3.007 1.349 3.007 3.007S13.658 15.007 12 15.007 8.993 13.658 8.993 12 10.342 8.993 12 8.993zM10.998 19h2v3h-2zm0-17h2v3h-2zm-9 9h3v2h-3zm17 0h3v2h-3zM4.219 18.363l2.12-2.122 1.415 1.414-2.12 2.122zM16.24 6.344l2.122-2.122 1.414 1.414-2.122 2.122zM6.342 7.759 4.22 5.637l1.415-1.414 2.12 2.122zm13.434 10.605-1.414 1.414-2.122-2.122 1.414-1.414z" fill=currentColor /></svg> <label class="h-6 bg-geraldine-500 cursor-pointer relative rounded-full w-12" for=check><input class="peer sr-only" id=check title="Dark Mode Toggle" toggle-color-scheme type=checkbox tabindex=0> <span class="bg-white absolute duration-500 h-4/6 left-1 peer-checked:bg-dark-600 peer-checked:left-7 rounded-full shadow-lg top-1 transition-all w-1/3"></span></label> <svg class="dark:text-white text-dark-500" viewBox="0 0 24 24" astro-icon=bx:moon height=32 width=32><path d="M20.742 13.045a8.088 8.088 0 0 1-2.077.271c-2.135 0-4.14-.83-5.646-2.336a8.025 8.025 0 0 1-2.064-7.723A1 1 0 0 0 9.73 2.034a10.014 10.014 0 0 0-4.489 2.582c-3.898 3.898-3.898 10.243 0 14.143a9.937 9.937 0 0 0 7.072 2.93 9.93 9.93 0 0 0 7.07-2.929 10.007 10.007 0 0 0 2.583-4.491 1.001 1.001 0 0 0-1.224-1.224zm-2.772 4.301a7.947 7.947 0 0 1-5.656 2.343 7.953 7.953 0 0 1-5.658-2.344c-3.118-3.119-3.118-8.195 0-11.314a7.923 7.923 0 0 1 2.06-1.483 10.027 10.027 0 0 0 2.89 7.848 9.972 9.972 0 0 0 7.848 2.891 8.036 8.036 0 0 1-1.484 2.059z" fill=currentColor /></svg></div></nav></header><header class="dark:bg-dark-900 bg-gray-100 block fixed md:hidden shadow-md top-0 w-screen z-30"><nav><div class="sm:px-6 mx-auto px-4"><div class="items-center flex h-24 justify-between"><div class="items-center flex"><div class=pl-4><a class=block href=/ ><img alt=Web-o-Reviews src=/assets/logo.e3f94983.svg height=45 width=80></a></div></div><div class="items-center flex content-end"><div class="items-center flex"><div class="items-center flex space-x-4"><svg class="dark:text-white h-6 text-dark-700 w-6" viewBox="0 0 24 24" astro-icon=icon-sun><g fill=none stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=2><circle cx=12 cy=12 r=4 /><path d="M3 12h1m8-9v1m8 8h1m-9 8v1M5.6 5.6l.7.7m12.1-.7-.7.7m0 11.4.7.7m-12.1-.7-.7.7"/></g></svg> <label class="h-6 bg-geraldine-500 cursor-pointer relative rounded-full w-12" for=check2><input class="peer sr-only" id=check2 title="Dark Mode Toggle" toggle-color-scheme type=checkbox> <span class="bg-white absolute duration-500 h-4/6 left-1 peer-checked:bg-dark-600 peer-checked:left-7 rounded-full shadow-lg top-1 transition-all w-1/3"></span></label> <svg class="dark:text-white h-6 text-dark-700 w-6" viewBox="0 0 24 24" astro-icon=icon-moon><path d="M12 3h.393a7.5 7.5 0 0 0 7.92 12.446A9 9 0 1 1 12 2.992z" fill=none stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=2 /></svg></div><button class="items-center focus:outline-none inline-flex dark:focus:ring-gray-700 dark:hover:bg-gray-800 dark:text-gray-400 focus:ring-4 focus:ring-gray-200 hover:bg-gray-100 ml-12 rounded-lg text-gray-700 text-sm transition" aria-label="Toggle Menu" toggle-menu type=button><svg class="dark:text-white h-8 w-8" viewBox="0 0 24 24" astro-icon=icon-menu preserveAspectRatio="xMidYMid meet" xmlns=http://www.w3.org/2000/svg><path d="M4 6h16M4 12h16M4 18h16" fill=none stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=2></path></svg></button><div class=""><div class="bg-white dark:bg-dark-500 fixed h-auto hidden mr-4 mt-10 py-0 right-0 rounded-lg w-48 z-20" id=menu><a class="dark:text-white focus:outline-none dark:hover:text-geraldine-400 block border-b-2 border-gray-200 dark:border-dark-300 focus:ring-2 focus:ring-geraldine-500 font-semibold hover:text-geraldine-500 px-6 py-4 uppercase dark:text-teal-500 text-teal-500" href=/ rel=prefetch><svg class="h-6 w-6 mr-2 inline-block mb-1" viewBox="0 0 24 24" astro-icon=bx:home><path d="M3 13h1v7c0 1.103.897 2 2 2h12c1.103 0 2-.897 2-2v-7h1a1 1 0 0 0 .707-1.707l-9-9a.999.999 0 0 0-1.414 0l-9 9A1 1 0 0 0 3 13zm7 7v-5h4v5h-4zm2-15.586 6 6V15l.001 5H16v-5c0-1.103-.897-2-2-2h-4c-1.103 0-2 .897-2 2v5H6v-9.586l6-6z" fill=currentColor /></svg> Home </a><a class="dark:text-white focus:outline-none dark:hover:text-geraldine-400 block border-b-2 border-gray-200 dark:border-dark-300 focus:ring-2 focus:ring-geraldine-500 font-semibold hover:text-geraldine-500 px-6 py-4 uppercase" href=/about/ rel=prefetch><svg class="h-6 w-6 mr-2 inline-block mb-1" viewBox="0 0 24 24" astro-icon=bx:user><path d="M12 2a5 5 0 1 0 5 5 5 5 0 0 0-5-5zm0 8a3 3 0 1 1 3-3 3 3 0 0 1-3 3zm9 11v-1a7 7 0 0 0-7-7h-4a7 7 0 0 0-7 7v1h2v-1a5 5 0 0 1 5-5h4a5 5 0 0 1 5 5v1z" fill=currentColor /></svg> About </a><a class="dark:text-white focus:outline-none dark:hover:text-geraldine-400 block border-b-2 border-gray-200 dark:border-dark-300 focus:ring-2 focus:ring-geraldine-500 font-semibold hover:text-geraldine-500 px-6 py-4 uppercase" href=/design/ rel=prefetch><svg class="h-6 w-6 mr-2 inline-block mb-1" viewBox="0 0 24 24" astro-icon=bx:palette><path d="M13.4 2.096a10.08 10.08 0 0 0-8.937 3.331A10.054 10.054 0 0 0 2.096 13.4c.53 3.894 3.458 7.207 7.285 8.246a9.982 9.982 0 0 0 2.618.354l.142-.001a3.001 3.001 0 0 0 2.516-1.426 2.989 2.989 0 0 0 .153-2.879l-.199-.416a1.919 1.919 0 0 1 .094-1.912 2.004 2.004 0 0 1 2.576-.755l.412.197c.412.198.85.299 1.301.299A3.022 3.022 0 0 0 22 12.14a9.935 9.935 0 0 0-.353-2.76c-1.04-3.826-4.353-6.754-8.247-7.284zm5.158 10.909-.412-.197c-1.828-.878-4.07-.198-5.135 1.494-.738 1.176-.813 2.576-.204 3.842l.199.416a.983.983 0 0 1-.051.961.992.992 0 0 1-.844.479h-.112a8.061 8.061 0 0 1-2.095-.283c-3.063-.831-5.403-3.479-5.826-6.586-.321-2.355.352-4.623 1.893-6.389a8.002 8.002 0 0 1 7.16-2.664c3.107.423 5.755 2.764 6.586 5.826.198.73.293 1.474.282 2.207-.012.807-.845 1.183-1.441.894z" fill=currentColor /><circle cx=7.5 cy=14.5 r=1.5 fill=currentColor /><circle cx=7.5 cy=10.5 r=1.5 fill=currentColor /><circle cx=10.5 cy=7.5 r=1.5 fill=currentColor /><circle cx=14.5 cy=7.5 r=1.5 fill=currentColor /></svg>Design </a><a class="dark:text-white focus:outline-none dark:hover:text-geraldine-400 block border-b-2 border-gray-200 dark:border-dark-300 focus:ring-2 focus:ring-geraldine-500 font-semibold hover:text-geraldine-500 px-6 py-4 uppercase" href=/work/ rel=prefetch><svg class="h-6 w-6 mr-2 inline-block mb-1" viewBox="0 0 24 24" astro-icon=bx:briefcase><path d="M20 6h-3V4c0-1.103-.897-2-2-2H9c-1.103 0-2 .897-2 2v2H4c-1.103 0-2 .897-2 2v11c0 1.103.897 2 2 2h16c1.103 0 2-.897 2-2V8c0-1.103-.897-2-2-2zm-5-2v2H9V4h6zM8 8h12v3H4V8h4zM4 19v-6h6v2h4v-2h6l.001 6H4z" fill=currentColor /></svg> Work </a><a class="dark:text-white focus:outline-none dark:hover:text-geraldine-400 block border-b-2 border-gray-200 dark:border-dark-300 focus:ring-2 focus:ring-geraldine-500 font-semibold hover:text-geraldine-500 px-6 py-4 uppercase" href=/archive/ rel=prefetch><svg class="h-6 w-6 mr-2 inline-block mb-1" viewBox="0 0 24 24" astro-icon=bx:box><path d="M20 3H4a2 2 0 0 0-2 2v2a2 2 0 0 0 1 1.72V19a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V8.72A2 2 0 0 0 22 7V5a2 2 0 0 0-2-2zM4 5h16v2H4zm1 14V9h14v10z" fill=currentColor /><path d="M8 11h8v2H8z" fill=currentColor /></svg> Archive </a><a class="dark:text-white focus:outline-none dark:hover:text-geraldine-400 block border-b-2 border-gray-200 dark:border-dark-300 focus:ring-2 focus:ring-geraldine-500 font-semibold hover:text-geraldine-500 px-6 py-4 uppercase" href=/license/ rel=prefetch><svg class="h-6 w-6 mr-2 inline-block mb-1" viewBox="0 0 24 24" astro-icon=bx:credit-card-front><path d="M20 4H4c-1.103 0-2 .897-2 2v12c0 1.103.897 2 2 2h16c1.103 0 2-.897 2-2V6c0-1.103-.897-2-2-2zM4 18V6h16l.001 12H4z" fill=currentColor /><path d="M6.5 11h3a.5.5 0 0 0 .5-.5v-2a.5.5 0 0 0-.5-.5h-3a.5.5 0 0 0-.5.5v2a.5.5 0 0 0 .5.5zM6 14h6v2.001H6zm7 0h5v2.001h-5z" fill=currentColor /></svg> License </a><a class="dark:text-white focus:outline-none dark:hover:text-geraldine-400 block border-b-2 border-gray-200 dark:border-dark-300 focus:ring-2 focus:ring-geraldine-500 font-semibold hover:text-geraldine-500 px-6 py-4 uppercase" href=/contact/ rel=prefetch><svg class="h-6 w-6 mr-2 inline-block mb-1" viewBox="0 0 24 24" astro-icon=bx:envelope><path d="M20 4H4c-1.103 0-2 .897-2 2v12c0 1.103.897 2 2 2h16c1.103 0 2-.897 2-2V6c0-1.103-.897-2-2-2zm0 2v.511l-8 6.223-8-6.222V6h16zM4 18V9.044l7.386 5.745a.994.994 0 0 0 1.228 0L20 9.044 20.002 18H4z" fill=currentColor /></svg> Contact</a></div></div></div></div></div></div></nav></header><section class="relative z-10" id=hero><div class="2xl:py-60 container lg:py-40 md:py-32 mx-auto py-24"><div class="items-center grid place-items-center gap-12 grid-cols-1 md:grid-cols-2"><div class="items-center grid place-items-center"><h1 class="text-white text-center font-bold font-display leading-relaxed md:mt-0 mt-28 text-f-2xl">Web-o-Reviews</h1><h2 class="font-semibold text-f-lg leading-snug mt-2 text-center text-white">Engaging, purposeful, and creative.</h2><div class=mt-8><a class="items-center flex content-center dark:text-dark-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-transparent focus:ring-slate-500/50 font-semibold hover:duration-150 hover:ease hover:transition-all px-6 py-3 rounded-md shadow-md text-f-sm text-white bg-geraldine-700 dark:bg-geraldine-400 dark:hover:bg-geraldine-500 hover:bg-geraldine-600" href=/work/ rel=prefetch tabindex=0><svg class="h-6 w-6 mr-2 fill-current" viewBox="0 0 24 24" astro-icon=icon-work aria-label=layout fill=none stroke=currentColor><path d="M4 5a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V5zm0 8a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v6a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-6zm12 0a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v6a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1v-6z" stroke-linecap=round stroke-linejoin=round stroke-width=2 /></svg> Web Design</a></div></div><div><img alt="Welcome to Web-o-Reviews!" src=/assets/home.c70dc1ea.svg class="2xl:w-[700px] dark:brightness-75 dark:contrast-125 dark:filter h-auto lg:w-[525px] w-[350px]"></div></div></div></section><main class="dark:text-white container dark:bg-dark-900 lg:py-24 max-w-7xl mx-auto px-8 py-6" id=content-wrapper><div class="grid leading-relaxed place-items-center space-y-24"><div class=max-w-prose><h3 class="font-display font-bold text-center mx-3 text-f-xl my-5">What I do</h3><p class="first-letter:font-semibold first-letter:text-f-lg first-letter:text-geraldine-500">I offer web design services to businesses and individuals. I see that my service fits within your budget and/or time constraints. Once my web design services are complete, I will also provide you with ongoing web support for your new site. Especially as your business grows and your online information and website's written content changes.</p></div><div><div class="items-center flex justify-center dark:ring-offset-gray-800 h-16 p-3 ring-2 ring-offset-4 rounded-full w-16 z-10 relative bg-rose-600 dark:bg-rose-400 dark:ring-rose-400 ml-4 ring-rose-600"><svg class="text-white dark:text-gray-800 h-12 w-12" viewBox="0 0 24 24" astro-icon=bx:code-alt><path d="m7.375 16.781 1.25-1.562L4.601 12l4.024-3.219-1.25-1.562-5 4a1 1 0 0 0 0 1.562l5 4zm9.25-9.562-1.25 1.562L19.399 12l-4.024 3.219 1.25 1.562 5-4a1 1 0 0 0 0-1.562l-5-4zm-1.649-4.003-4 18-1.953-.434 4-18z" fill=currentColor /></svg></div><div class="border px-4 -mt-8 bg-white border-gray-200 dark:bg-dark-500 dark:border-dark-600 md:p-8 py-8 rounded-md shadow-md"><div class="font-semibold text-f-lg py-4">Web Developement</div><p>HTML / CSS, Javascript Animation, Responsive website, Support and Maintenance.</p></div></div><div><h3 class="font-display font-bold text-center mx-3 text-f-xl mb-14 mt-5">My Process</h3><ul class="grid grid-cols-1 gap-24 lg:grid-cols-3 place-items-stretch sm:gap-x-6 sm:gap-y-12 sm:grid-cols-2"><li class="border bg-white border-gray-200 dark:bg-dark-500 dark:border-dark-600 rounded-md shadow-md lg:px-8 px-6 py-4 animate-pop"><div class="items-center flex justify-center dark:ring-offset-gray-800 h-16 p-3 ring-2 ring-offset-4 rounded-full w-16 z-10 -mt-12 mx-auto bg-blue-600 dark:bg-blue-400 dark:ring-blue-400 ring-blue-600"><svg class="text-white dark:text-gray-800 h-12 w-12" viewBox="0 0 24 24" astro-icon=bx:comment-dots><path d="M20 2H4c-1.103 0-2 .897-2 2v18l5.333-4H20c1.103 0 2-.897 2-2V4c0-1.103-.897-2-2-2zm0 14H6.667L4 18V4h16v12z" fill=currentColor /><circle cx=15 cy=10 r=2 fill=currentColor /><circle cx=9 cy=10 r=2 fill=currentColor /></svg></div><h4 class="font-semibold border-b-2 my-4 text-f-lg border-blue-600 dark:border-blue-400">1. Discuss</h4><p>To define the goals. What objective does the website need to accomplish? What problem does it solve?.</p><p class="font-semibold uppercase my-2 text-f-sm">Key Process:</p><div class="flex flex-wrap justify-start p-1"><div class="dark:text-white bg-gray-200 border dark:bg-dark-300 dark:border-geraldine-600 m-1 px-4 py-1 rounded-2xl text-f-xs text-gray-700">Brainstorming</div><div class="dark:text-white bg-gray-200 border dark:bg-dark-300 dark:border-geraldine-600 m-1 px-4 py-1 rounded-2xl text-f-xs text-gray-700">Define a Problem</div><div class="dark:text-white bg-gray-200 border dark:bg-dark-300 dark:border-geraldine-600 m-1 px-4 py-1 rounded-2xl text-f-xs text-gray-700">Primary Aim</div><div class="dark:text-white bg-gray-200 border dark:bg-dark-300 dark:border-geraldine-600 m-1 px-4 py-1 rounded-2xl text-f-xs text-gray-700">Analysis</div></div></li><li class="border bg-white border-gray-200 dark:bg-dark-500 dark:border-dark-600 rounded-md shadow-md lg:px-8 px-6 py-4 reveal"><div class="items-center flex justify-center dark:ring-offset-gray-800 h-16 p-3 ring-2 ring-offset-4 rounded-full w-16 z-10 -mt-12 mx-auto bg-purple-600 dark:bg-purple-400 dark:ring-purple-400 ring-purple-600"><svg class="text-white dark:text-gray-800 h-12 w-12" viewBox="0 0 24 24" astro-icon=bx:food-menu><path d="M3 2h2v20H3zm7 4h7v2h-7zm0 4h7v2h-7z" fill=currentColor /><path d="M19 2H6v20h13c1.103 0 2-.897 2-2V4c0-1.103-.897-2-2-2zm0 18H8V4h11v16z" fill=currentColor /></svg></div><h4 class="font-semibold border-b-2 my-4 text-f-lg border-purple-600 dark:border-purple-400">2. Planning</h4><p>To decide the technical aspects of the project, such as a selection of the tech stack to build the website, content strategy planning.</p><p class="font-semibold uppercase my-2 text-f-sm">Key Process:</p><div class="flex flex-wrap justify-start p-1"><div class="dark:text-white bg-gray-200 border dark:bg-dark-300 dark:border-geraldine-600 m-1 px-4 py-1 rounded-2xl text-f-xs text-gray-700">Content Developement Strategy</div><div class="dark:text-white bg-gray-200 border dark:bg-dark-300 dark:border-geraldine-600 m-1 px-4 py-1 rounded-2xl text-f-xs text-gray-700">SEO Strategy</div><div class="dark:text-white bg-gray-200 border dark:bg-dark-300 dark:border-geraldine-600 m-1 px-4 py-1 rounded-2xl text-f-xs text-gray-700">Technology stacks</div></div></li><li class="border bg-white border-gray-200 dark:bg-dark-500 dark:border-dark-600 rounded-md shadow-md lg:px-8 px-6 py-4 reveal"><div class="items-center flex justify-center dark:ring-offset-gray-800 h-16 p-3 ring-2 ring-offset-4 rounded-full w-16 z-10 -mt-12 mx-auto relative bg-fuchsia-600 dark:bg-fuchsia-400 dark:ring-fuchsia-400 ring-fuchsia-600"><svg class="text-white dark:text-gray-800 h-12 w-12" viewBox="0 0 24 24" astro-icon=bx:palette><path d="M13.4 2.096a10.08 10.08 0 0 0-8.937 3.331A10.054 10.054 0 0 0 2.096 13.4c.53 3.894 3.458 7.207 7.285 8.246a9.982 9.982 0 0 0 2.618.354l.142-.001a3.001 3.001 0 0 0 2.516-1.426 2.989 2.989 0 0 0 .153-2.879l-.199-.416a1.919 1.919 0 0 1 .094-1.912 2.004 2.004 0 0 1 2.576-.755l.412.197c.412.198.85.299 1.301.299A3.022 3.022 0 0 0 22 12.14a9.935 9.935 0 0 0-.353-2.76c-1.04-3.826-4.353-6.754-8.247-7.284zm5.158 10.909-.412-.197c-1.828-.878-4.07-.198-5.135 1.494-.738 1.176-.813 2.576-.204 3.842l.199.416a.983.983 0 0 1-.051.961.992.992 0 0 1-.844.479h-.112a8.061 8.061 0 0 1-2.095-.283c-3.063-.831-5.403-3.479-5.826-6.586-.321-2.355.352-4.623 1.893-6.389a8.002 8.002 0 0 1 7.16-2.664c3.107.423 5.755 2.764 6.586 5.826.198.73.293 1.474.282 2.207-.012.807-.845 1.183-1.441.894z" fill=currentColor /><circle cx=7.5 cy=14.5 r=1.5 fill=currentColor /><circle cx=7.5 cy=10.5 r=1.5 fill=currentColor /><circle cx=10.5 cy=7.5 r=1.5 fill=currentColor /><circle cx=14.5 cy=7.5 r=1.5 fill=currentColor /></svg></div><h4 class="font-semibold border-b-2 my-4 text-f-lg border-fuchsia-600 dark:border-fuchsia-400">3. Designing</h4><p>To design color scheme, logo design and other interactive design elements to be incorporated on the website and figuring out the structure.</p><p class="font-semibold uppercase my-2 text-f-sm">Key Process:</p><div class="flex flex-wrap justify-start p-1"><div class="dark:text-white bg-gray-200 border dark:bg-dark-300 dark:border-geraldine-600 m-1 px-4 py-1 rounded-2xl text-f-xs text-gray-700">Prototyping</div><div class="dark:text-white bg-gray-200 border dark:bg-dark-300 dark:border-geraldine-600 m-1 px-4 py-1 rounded-2xl text-f-xs text-gray-700">Designing</div><div class="dark:text-white bg-gray-200 border dark:bg-dark-300 dark:border-geraldine-600 m-1 px-4 py-1 rounded-2xl text-f-xs text-gray-700">Developement</div></div></li><li class="border bg-white border-gray-200 dark:bg-dark-500 dark:border-dark-600 rounded-md shadow-md lg:px-8 px-6 py-4 reveal2"><div class="items-center flex justify-center dark:ring-offset-gray-800 h-16 p-3 ring-2 ring-offset-4 rounded-full w-16 z-10 -mt-12 mx-auto relative bg-yellow-600 dark:bg-yellow-400 dark:ring-yellow-400 ring-yellow-600"><svg class="text-white dark:text-gray-800 h-12 w-12" viewBox="0 0 24 24" astro-icon=bx:bxs-flask><path d="M15 9.783V4h1V2H8v2h1v5.783l-4.268 9.389a1.992 1.992 0 0 0 .14 1.911A1.99 1.99 0 0 0 6.553 22h10.895a1.99 1.99 0 0 0 1.681-.917c.37-.574.423-1.289.14-1.911L15 9.783zm-4.09.631c.06-.13.09-.271.09-.414V4h2v6c0 .143.03.284.09.414L15.177 15H8.825l2.085-4.586z" fill=currentColor /></svg></div><h4 class="font-semibold border-b-2 my-4 text-f-lg border-yellow-600 dark:border-yellow-400">4. Testing</h4><p>Website testing consists of a number of different tests, including functionality, usability, interface, compatibility etc.</p><p class="font-semibold uppercase my-2 text-f-sm">Key Process:</p><div class="flex flex-wrap justify-start p-1"><div class="dark:text-white bg-gray-200 border dark:bg-dark-300 dark:border-geraldine-600 m-1 px-4 py-1 rounded-2xl text-f-xs text-gray-700">Testing</div><div class="dark:text-white bg-gray-200 border dark:bg-dark-300 dark:border-geraldine-600 m-1 px-4 py-1 rounded-2xl text-f-xs text-gray-700">Compatibility</div></div></li><li class="border bg-white border-gray-200 dark:bg-dark-500 dark:border-dark-600 rounded-md shadow-md lg:px-8 px-6 py-4 sm:col-span-2"><div class="items-center flex justify-center dark:ring-offset-gray-800 h-16 p-3 ring-2 ring-offset-4 rounded-full w-16 z-10 -mt-12 mx-auto relative bg-green-600 dark:bg-green-400 dark:ring-green-400 ring-green-600"><svg class="text-white dark:text-gray-800 h-12 w-12" viewBox="0 0 24 24" astro-icon=bx:rocket><path d="M20.92 2.38A15.72 15.72 0 0 0 17.5 2a8.26 8.26 0 0 0-6 2.06Q9.89 5.67 8.31 7.27c-1.21-.13-4.08-.2-6 1.74a1 1 0 0 0 0 1.41l11.3 11.32a1 1 0 0 0 1.41 0c1.95-2 1.89-4.82 1.77-6l3.21-3.2c3.19-3.19 1.74-9.18 1.68-9.43a1 1 0 0 0-.76-.73zm-2.36 8.75L15 14.67a1 1 0 0 0-.27.9 6.81 6.81 0 0 1-.54 3.94L4.52 9.82a6.67 6.67 0 0 1 4-.5A1 1 0 0 0 9.39 9s1.4-1.45 3.51-3.56A6.61 6.61 0 0 1 17.5 4a14.51 14.51 0 0 1 2.33.2c.24 1.43.62 5.04-1.27 6.93z" fill=currentColor /><circle cx=15.73 cy=8.3 r=2 fill=currentColor /><path d="M5 16c-2 1-2 5-2 5a7.81 7.81 0 0 0 5-2z" fill=currentColor /></svg></div><h4 class="font-semibold border-b-2 my-4 text-f-lg border-green-600 dark:border-green-400">5. Launching and Maintenance</h4><p>Launching of the website involves transferring it from my local server to a live server. Launch isn't the end of development journey. The Maintenance phase is what follows and is critical for the website to be successfully up and running.</p><p class="font-semibold uppercase my-2 text-f-sm">Key Process:</p><div class="flex flex-wrap justify-start p-1"><div class="dark:text-white bg-gray-200 border dark:bg-dark-300 dark:border-geraldine-600 m-1 px-4 py-1 rounded-2xl text-f-xs text-gray-700">Testing</div><div class="dark:text-white bg-gray-200 border dark:bg-dark-300 dark:border-geraldine-600 m-1 px-4 py-1 rounded-2xl text-f-xs text-gray-700">Maintenance</div></div></li></ul></div></div></main><footer class="text-white bg-dark-800 dark:bg-dark-800 divide-dark-50 divide-y-2 h-auto mt-12 py-12"><div class="items-center flex justify-center mx-auto flex-col max-w-6xl md:flex-row md:justify-around md:space-x-8 md:space-y-0 my-12 space-y-8"><div class="font-display font-bold text-f-xl">Interested in Collaboration?</div><a class="items-center flex content-center dark:text-dark-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-transparent focus:ring-slate-500/50 font-semibold hover:duration-150 hover:ease hover:transition-all px-6 py-3 rounded-md shadow-md text-f-sm text-white bg-green-700 dark:bg-green-400 dark:hover:bg-green-500 hover:bg-green-600 relative" href=/contact/ rel=prefetch tabindex=0><span class="flex -mr-1 -mt-1 absolute h-3 right-0 top-0 w-3"><span class="absolute rounded-full animate-ping bg-green-400 h-full inline-flex opacity-75 w-full"></span> <span class="bg-green-300 dark:bg-red-600 h-3 inline-flex relative rounded-full w-3"></span> </span>Let's Talk</a></div><div class="items-center flex mx-auto flex-col max-w-6xl md:flex-row justify-around lg:px-8 mb-12 md:items-end md:px-6 pt-12"><div class="flex flex-row"><div class=w-40><span class="flex justify-center font-semibold uppercase">Information</span><div class="items-center grid divide-dark-50 divide-x-2 grid-cols-6 group leading-relaxed mt-4"><div class="col-span-2 ml-5"><svg class="h-6 w-6 duration-200 ease-out group-hover:text-geraldine-600 text-teal-500 transition-colors" viewBox="0 0 24 24" astro-icon=bx:credit-card-front><path d="M20 4H4c-1.103 0-2 .897-2 2v12c0 1.103.897 2 2 2h16c1.103 0 2-.897 2-2V6c0-1.103-.897-2-2-2zM4 18V6h16l.001 12H4z" fill=currentColor /><path d="M6.5 11h3a.5.5 0 0 0 .5-.5v-2a.5.5 0 0 0-.5-.5h-3a.5.5 0 0 0-.5.5v2a.5.5 0 0 0 .5.5zM6 14h6v2.001H6zm7 0h5v2.001h-5z" fill=currentColor /></svg></div><div class=col-span-4><a class="dark:text-white focus:outline-none focus:ring-2 dark:group-hover:text-geraldine-600 focus:ring-offset-2 focus:ring-offset-dark-800 focus:ring-slate-200/50 group-hover:text-geraldine-600 hover:duration-200 hover:ease-out hover:transition-all mx-4 text-gray-300" href=/license/ tabindex=0>License</a></div></div><div class="items-center grid divide-dark-50 divide-x-2 grid-cols-6 group leading-relaxed"><div class="col-span-2 ml-5"><svg class="h-6 w-6 duration-200 ease-out group-hover:text-geraldine-600 text-teal-500 transition-colors" viewBox="0 0 24 24" astro-icon=bx:box><path d="M20 3H4a2 2 0 0 0-2 2v2a2 2 0 0 0 1 1.72V19a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V8.72A2 2 0 0 0 22 7V5a2 2 0 0 0-2-2zM4 5h16v2H4zm1 14V9h14v10z" fill=currentColor /><path d="M8 11h8v2H8z" fill=currentColor /></svg></div><div class=col-span-4><a class="dark:text-white focus:outline-none focus:ring-2 dark:group-hover:text-geraldine-600 focus:ring-offset-2 focus:ring-offset-dark-800 focus:ring-slate-200/50 group-hover:text-geraldine-600 hover:duration-200 hover:ease-out hover:transition-all mx-4 text-gray-300" href=/archive/ tabindex=0>Archive</a></div></div></div><div class=w-40><span class="flex justify-center font-semibold uppercase text-center">Find me on</span><div class="items-center grid divide-dark-50 divide-x-2 grid-cols-6 group leading-relaxed mt-4"><div class="col-span-2 ml-5"><svg class="h-6 w-6 duration-200 ease-out group-hover:text-geraldine-600 text-teal-500 transition-colors" viewBox="0 0 24 24" astro-icon=uil:github-alt><path d="M10.07 20.503a1 1 0 0 0-1.18-.983c-1.31.24-2.963.276-3.402-.958a5.708 5.708 0 0 0-1.837-2.415 1.2 1.2 0 0 1-.167-.11 1 1 0 0 0-.93-.645h-.005a1 1 0 0 0-1 .995c-.004.815.81 1.338 1.141 1.514a4.44 4.44 0 0 1 .924 1.36c.365 1.023 1.423 2.576 4.466 2.376l.003.098.004.268a1 1 0 0 0 2 0l-.005-.318c-.005-.19-.012-.464-.012-1.182ZM20.737 5.377a5.39 5.39 0 0 0 .09-.42 6.278 6.278 0 0 0-.408-3.293 1.002 1.002 0 0 0-.615-.58c-.356-.12-1.67-.357-4.184 1.25a13.87 13.87 0 0 0-6.354 0C6.762.75 5.455.966 5.102 1.079a.997.997 0 0 0-.631.584 6.3 6.3 0 0 0-.404 3.357c.025.127.051.246.079.354a6.27 6.27 0 0 0-1.256 3.83 8.422 8.422 0 0 0 .043.921c.334 4.603 3.334 5.984 5.424 6.459a4.591 4.591 0 0 0-.118.4 1 1 0 0 0 1.942.479 1.678 1.678 0 0 1 .468-.878 1 1 0 0 0-.546-1.745c-3.454-.395-4.954-1.802-5.18-4.899a6.61 6.61 0 0 1-.033-.738 4.258 4.258 0 0 1 .92-2.713 3.022 3.022 0 0 1 .195-.231 1 1 0 0 0 .188-1.025 3.388 3.388 0 0 1-.155-.555 4.094 4.094 0 0 1 .079-1.616 7.543 7.543 0 0 1 2.415 1.18 1.009 1.009 0 0 0 .827.133 11.777 11.777 0 0 1 6.173.001 1.005 1.005 0 0 0 .83-.138 7.572 7.572 0 0 1 2.406-1.19 4.04 4.04 0 0 1 .087 1.578 3.205 3.205 0 0 1-.169.607 1 1 0 0 0 .188 1.025c.078.087.155.18.224.268A4.122 4.122 0 0 1 20 9.203a7.039 7.039 0 0 1-.038.777c-.22 3.056-1.725 4.464-5.195 4.86a1 1 0 0 0-.546 1.746 1.63 1.63 0 0 1 .466.908 3.06 3.06 0 0 1 .093.82v2.333c-.01.648-.01 1.133-.01 1.356a1 1 0 1 0 2 0c0-.217 0-.692.01-1.34v-2.35a4.881 4.881 0 0 0-.155-1.311 4.256 4.256 0 0 0-.116-.416 6.513 6.513 0 0 0 5.445-6.424A8.697 8.697 0 0 0 22 9.203a6.13 6.13 0 0 0-1.263-3.826Z" fill=currentColor /></svg></div><div class=col-span-4><a class="dark:text-white focus:outline-none focus:ring-2 dark:group-hover:text-geraldine-600 focus:ring-offset-2 focus:ring-offset-dark-800 focus:ring-slate-200/50 group-hover:text-geraldine-600 hover:duration-200 hover:ease-out hover:transition-all mx-4 text-gray-300 inline-flex items-center" href=https://github.com/akyag rel=noopener tabindex=0 target=_blank>GitHub <svg class="h-4 ml-1 w-4" viewBox="0 0 24 24" astro-icon=bx:link-external><path d="m13 3 3.293 3.293-7 7 1.414 1.414 7-7L21 11V3z" fill=currentColor /><path d="M19 19H5V5h7l-2-2H5c-1.103 0-2 .897-2 2v14c0 1.103.897 2 2 2h14c1.103 0 2-.897 2-2v-5l-2-2v7z" fill=currentColor /></svg></a></div></div><div class="items-center grid divide-dark-50 divide-x-2 grid-cols-6 group leading-relaxed"><div class="col-span-2 ml-5"><svg class="h-6 w-6 duration-200 ease-out group-hover:text-geraldine-600 text-teal-500 transition-colors" viewBox="0 0 256 256" astro-icon=ph:linkedin-logo><path d="M100 80a12 12 0 1 1-12-12 12 12 0 0 1 12 12Zm128-36v168a16 16 0 0 1-16 16H44a16 16 0 0 1-16-16V44a16 16 0 0 1 16-16h168a16 16 0 0 1 16 16Zm-16 168V44H44v168ZM88 104a8 8 0 0 0-8 8v64a8 8 0 0 0 16 0v-64a8 8 0 0 0-8-8Zm60 0a36 36 0 0 0-20.2 6.2A8 8 0 0 0 112 112v64a8 8 0 0 0 16 0v-36a20 20 0 0 1 40 0v36a8 8 0 0 0 16 0v-36a36 36 0 0 0-36-36Z" fill=currentColor /></svg></div><div class=col-span-4><a class="dark:text-white focus:outline-none focus:ring-2 dark:group-hover:text-geraldine-600 focus:ring-offset-2 focus:ring-offset-dark-800 focus:ring-slate-200/50 group-hover:text-geraldine-600 hover:duration-200 hover:ease-out hover:transition-all mx-4 text-gray-300 inline-flex items-center" href=https://www.linkedin.com/in/akshayghate/ rel=noopener tabindex=0 target=_blank>LinkedIn <svg class="h-4 ml-1 w-4" viewBox="0 0 24 24" astro-icon=bx:link-external><path d="m13 3 3.293 3.293-7 7 1.414 1.414 7-7L21 11V3z" fill=currentColor /><path d="M19 19H5V5h7l-2-2H5c-1.103 0-2 .897-2 2v14c0 1.103.897 2 2 2h14c1.103 0 2-.897 2-2v-5l-2-2v7z" fill=currentColor /></svg></a></div></div><div class="items-center grid divide-dark-50 divide-x-2 grid-cols-6 group leading-relaxed"><div class="col-span-2 ml-5"><svg class="h-6 w-6 duration-200 ease-out group-hover:text-geraldine-600 text-teal-500 transition-colors" viewBox="0 0 15 15" astro-icon=radix-icons:twitter-logo><path d="M7.233 4.696c0-1.727 1.4-3.127 3.127-3.127 1.014 0 1.823.479 2.365 1.175a5.246 5.246 0 0 0 1.626-.629 2.634 2.634 0 0 1-1.148 1.45l.002.003a5.26 5.26 0 0 0 1.5-.413l-.001.002c-.337.505-.76.95-1.248 1.313.026.177.04.354.04.53 0 3.687-2.809 7.975-7.975 7.975a7.93 7.93 0 0 1-4.296-1.26.5.5 0 0 1-.108-.748.45.45 0 0 1 .438-.215c.916.108 1.83-.004 2.637-.356a3.086 3.086 0 0 1-1.69-1.876.45.45 0 0 1 .103-.448 3.07 3.07 0 0 1-1.045-2.31v-.034a.45.45 0 0 1 .365-.442 3.068 3.068 0 0 1-.344-1.416c0-.468.003-1.058.332-1.59a.45.45 0 0 1 .323-.208.5.5 0 0 1 .538.161 6.964 6.964 0 0 0 4.46 2.507v-.044Zm-1.712 7.279a6.936 6.936 0 0 1-2.249-.373 5.318 5.318 0 0 0 2.39-1.042.45.45 0 0 0-.27-.804 2.174 2.174 0 0 1-1.714-.888c.19-.015.376-.048.556-.096a.45.45 0 0 0-.028-.876 2.18 2.18 0 0 1-1.644-1.474c.2.048.409.077.623.084a.45.45 0 0 0 .265-.824 2.177 2.177 0 0 1-.97-1.812c0-.168.003-.317.013-.453a7.95 7.95 0 0 0 5.282 2.376.5.5 0 0 0 .513-.61 2.127 2.127 0 0 1 2.071-2.614c1.234 0 2.136 1.143 2.136 2.432 0 3.256-2.476 6.974-6.975 6.974Z" fill=currentColor fill-rule=evenodd clip-rule=evenodd /></svg></div><div class=col-span-4><a class="dark:text-white focus:outline-none focus:ring-2 dark:group-hover:text-geraldine-600 focus:ring-offset-2 focus:ring-offset-dark-800 focus:ring-slate-200/50 group-hover:text-geraldine-600 hover:duration-200 hover:ease-out hover:transition-all mx-4 text-gray-300 inline-flex items-center" href=https://twitter.com/akshayg rel=noopener tabindex=0 target=_blank>Twitter <svg class="h-4 ml-1 w-4" viewBox="0 0 24 24" astro-icon=bx:link-external><path d="m13 3 3.293 3.293-7 7 1.414 1.414 7-7L21 11V3z" fill=currentColor /><path d="M19 19H5V5h7l-2-2H5c-1.103 0-2 .897-2 2v14c0 1.103.897 2 2 2h14c1.103 0 2-.897 2-2v-5l-2-2v7z" fill=currentColor /></svg></a></div></div></div></div><div class="items-center flex mt-8 flex-col"><div><a class="hover:scale-105 block focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-dark-800 focus:ring-slate-200/50 hover:duration-200 hover:ease-out hover:transition-all" href=/ tabindex=0><img alt=Web-o-Reviews src=/assets/logo-white.e72029cc.svg height=32 width=250></a></div><div class="items-center flex justify-center flex-col divide-dark-50 divide-y-2 gap-2 grid-cols-1 lg:divide-x-2 lg:divide-y-0 lg:flex-row max-w-4xl mt-4"><div><svg class="inline-block -mt-1 h-5 mr-1 w-5" viewBox="0 0 24 24" astro-icon=bx:copyright><path d="M12 22c5.421 0 10-4.579 10-10S17.421 2 12 2 2 6.579 2 12s4.579 10 10 10zm0-18c4.337 0 8 3.663 8 8s-3.663 8-8 8-8-3.663-8-8 3.663-8 8-8z" fill=currentColor /><path d="M12 17c.901 0 2.581-.168 3.707-1.292l-1.414-1.416C13.85 14.735 12.992 15 12 15c-1.626 0-3-1.374-3-3s1.374-3 3-3c.993 0 1.851.265 2.293.707l1.414-1.414C14.582 7.168 12.901 7 12 7c-2.757 0-5 2.243-5 5s2.243 5 5 5z" fill=currentColor /></svg> 2009 - 2022 - Built using <a class="focus:ring-2 focus:ring-slate-200/50 focus:ring-offset-2 focus:ring-offset-dark-800 focus:outline-none" href=https://astro.build rel=noopener tabindex=0 target=_blank><img alt="Astro Dark Logo" src=/assets/astro-dark.b30889f7.svg class="h-6 inline-block mx-2 w-16"></a></div><div class="lg:pt-0 pl-2 pt-2">Designed with <svg class="inline-block text-red-600" viewBox="0 0 24 24" astro-icon=fe:heart height=32 width=32><path d="M12 20c-2.205-.48-9-4.24-9-11a5 5 0 0 1 9-3 5 5 0 0 1 9 3c0 6.76-6.795 10.52-9 11Z" fill=currentColor fill-rule=evenodd /></svg> by Akshay Ghate.</div></div><button class="fixed block back-to-top bottom-10 duration-500 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-transparent focus:ring-slate-500 opacity-0 right-10 rounded-full transition-opacity"><svg class="text-white bg-teal-500 h-10 hover:bg-teal-400 px-2 py-2 rounded-full w-10" viewBox="0 0 24 24" aria-label=back-to-top fill=none stroke=currentColor><path d="M5 15l7-7 7 7" stroke-linecap=round stroke-linejoin=round stroke-width=2></path></svg></button><script>const showOnPx=100,backToTopButton=document.querySelector(".back-to-top"),scrollContainer=()=>document.documentElement||document.body,goToTop=()=>{document.body.scrollIntoView({behavior:"smooth"})};document.addEventListener("scroll",(()=>{console.log("Scroll Height: ",scrollContainer().scrollHeight),console.log("Client Height: ",scrollContainer().clientHeight),scrollContainer().scrollTop>100?backToTopButton.classList.remove("opacity-0"):backToTopButton.classList.add("opacity-0")})),backToTopButton.addEventListener("click",goToTop)</script></div></div></footer></body></html>