-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
42 changed files
with
518 additions
and
906 deletions.
There are no files selected for viewing
Binary file not shown.
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,19 @@ | ||
--- | ||
interface Props { | ||
ncols?: number | ||
nrows?: number | ||
animated?: boolean | ||
delay?: number | ||
title: string | ||
otherStyles?: string | ||
} | ||
const { props }: { props: Props } = Astro | ||
--- | ||
|
||
<article | ||
data-animated={props.animated} | ||
class=`bg-slate-300/70 dark:bg-slate-900/95 rounded-sm flex items-center justify-center font-bold dark:text-slate-300 font-rubik-doodle w-full h-full flex-col text-base py-3 px-2 relative data-[animated]:animate-blurred-fade-in data-[animated]:animate-delay-${(props.delay ?? 0) * 100} ${props?.otherStyles}` | ||
> | ||
<slot /> | ||
</article> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,23 @@ | ||
--- | ||
interface Props { | ||
ncols?: number | ||
nrows?: number | ||
animated?: boolean | ||
delay?: number | ||
title: string | ||
href: string | ||
otherStyles?: string | ||
} | ||
const { props }: { props: Props } = Astro | ||
const { href, title } = props | ||
--- | ||
|
||
<a | ||
href={href} | ||
title={title} | ||
data-animated={props.animated} | ||
class=`bg-slate-300/70 dark:bg-slate-900/95 rounded-sm flex items-center justify-center font-bold dark:text-slate-300 font-rubik-doodle w-full h-full text-base py-3 px-2 relative hover:border-2 hover:border-amber-500/60 [&_p]:text-amber-950 [&_p]:dark:text-amber-300 data-[animated]:animate-blurred-fade-in ${props?.otherStyles}` | ||
> | ||
<slot /> | ||
</a> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,118 @@ | ||
--- | ||
interface Props { | ||
lang?: string | ||
} | ||
const { lang = 'en' } = Astro.props | ||
--- | ||
|
||
<script defer is:inline define:vars={{ lang }}> | ||
// Theme switch | ||
function setTheme() { | ||
const darkIcon = document.getElementById('theme-toggle-dark-icon') | ||
const lightIcon = document.getElementById('theme-toggle-light-icon') | ||
|
||
// Cambia los iconos dentro del botón en función de la configuración anterior | ||
if ( | ||
localStorage.getItem('color-theme') === 'dark' || | ||
!('color-theme' in localStorage) | ||
) { | ||
lightIcon.classList.remove('hidden') | ||
// en caso que se haya configurado previamente | ||
document.documentElement.classList.add('dark') | ||
// remover la clase light si está presente | ||
document.documentElement.classList.remove('light') | ||
} else { | ||
darkIcon.classList.remove('hidden') | ||
// en caso que se haya configurado previamente | ||
document.documentElement.classList.add('light') | ||
// remover la clase dark si está presente | ||
document.documentElement.classList.remove('dark') | ||
} | ||
|
||
const themeToggleBtn = document.getElementById('theme-toggle') | ||
|
||
themeToggleBtn.addEventListener('click', () => { | ||
darkIcon.classList.toggle('hidden') | ||
lightIcon.classList.toggle('hidden') | ||
|
||
// se comprueba si se ha configurado previamente | ||
if (localStorage.getItem('color-theme')) { | ||
if (localStorage.getItem('color-theme') === 'light') { | ||
document.documentElement.classList.add('dark') | ||
// remover la clase light si está presente | ||
document.documentElement.classList.remove('light') | ||
localStorage.setItem('color-theme', 'dark') | ||
} else { | ||
document.documentElement.classList.remove('dark') | ||
// remover la clase dark si está presente | ||
localStorage.setItem('color-theme', 'light') | ||
} | ||
|
||
// se comprueba si el sistema operativo tiene configurado el tema oscuro | ||
} else if (document.documentElement.classList.contains('dark')) { | ||
document.documentElement.classList.remove('dark') | ||
document.documentElement.classList.add('light') | ||
localStorage.setItem('color-theme', 'light') | ||
} else { | ||
document.documentElement.classList.add('dark') | ||
document.documentElement.classList.remove('light') | ||
localStorage.setItem('color-theme', 'dark') | ||
} | ||
}) | ||
} | ||
|
||
setTheme() | ||
document.addEventListener('astro:after-preparation', setTheme) | ||
document.addEventListener('astro:after-swap', setTheme) | ||
|
||
// Home & Random Place buttons | ||
const setHomeRandomButton = () => { | ||
const homeButton = document.getElementById('home-button') | ||
const randomPlaceButton = document.getElementById('random-place-button') | ||
|
||
// Show home button only if not in home | ||
// Otherwise show random place button | ||
if ( | ||
window.location.pathname === '/' || | ||
window.location.pathname === '/es' | ||
) { | ||
homeButton.classList.add('hidden') | ||
randomPlaceButton.classList.remove('hidden') | ||
} else { | ||
homeButton.classList.remove('hidden') | ||
randomPlaceButton.classList.add('hidden') | ||
} | ||
|
||
// Add click event to home button | ||
homeButton.addEventListener('click', () => { | ||
// window.location.href = '/' | ||
lang === 'es' | ||
? (window.location.href = '/es') | ||
: (window.location.href = '/') | ||
}) | ||
|
||
randomPlaceButton.addEventListener('click', () => { | ||
const places = ['/blog', '/tech-stack', '/featured'] | ||
window.location.href = places[Math.floor(Math.random() * places.length)] | ||
}) | ||
} | ||
|
||
setHomeRandomButton() | ||
document.addEventListener('astro:after-preparation', setHomeRandomButton) | ||
document.addEventListener('astro:after-swap', setHomeRandomButton) | ||
</script> | ||
|
||
<script> | ||
import { toast } from 'wc-toast' | ||
const copyMailButton = document.getElementById('copyMailButton') | ||
copyMailButton?.addEventListener('click', () => { | ||
navigator.clipboard.writeText('[email protected]') | ||
toast('email shipped into your clipboard 📬', { | ||
duration: 2000, | ||
theme: { | ||
type: 'light' | ||
} | ||
}) | ||
}) | ||
</script> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,34 @@ | ||
--- | ||
interface Props { | ||
svg: string | ||
hex?: string | ||
href?: string | ||
title?: string | ||
} | ||
const { svg, hex = '#000', href = '', title = 'Generic Icon' } = Astro.props | ||
--- | ||
|
||
{ | ||
href ? ( | ||
<a | ||
href={href} | ||
target='_blank' | ||
rel='noopener noreferrer' | ||
class='hover:scale-110' | ||
title={title} | ||
> | ||
<svg | ||
class='w-6 h-6 xl:w-8 xl:h-8 inline-flex fill-slate-950 dark:fill-emerald-300 drop-shadow-black drop-shadow-2xl' | ||
set:html={svg} | ||
fill={hex} | ||
/> | ||
</a> | ||
) : ( | ||
<svg | ||
class='w-6 h-6 xl:w-8 xl:h-8 inline-flex fill-slate-950 dark:fill-emerald-300' | ||
set:html={svg} | ||
fill={hex} | ||
/> | ||
) | ||
} |
Oops, something went wrong.