fernando/araozu.dev
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Compare commits

base: fernando:0bc0ef3ba86325da93428667c0c9af8c84cbd187
Branches Tags
fernando:main
..
compare: fernando:18c420b90b1674097f1c2093ca22ae6bb0a1fa24
Branches Tags
fernando:main

No commits in common. "0bc0ef3ba86325da93428667c0c9af8c84cbd187" and "18c420b90b1674097f1c2093ca22ae6bb0a1fa24" have entirely different histories.
0bc0ef3ba8 ... 18c420b90b

14 changed files with 763 additions and 964 deletions
Show Stats Expand all files Collapse all files

22
Jenkinsfile vendored
View File

@ -1,29 +1,25 @@
pipeline {
agent {
docker {
image 'node:22'
}
agent any
environment {
PATH = "/var/lib/jenkins/.nvm/versions/node/v20.9.0/bin:/var/lib/jenkins/bin:${env.PATH}"
}
stages {
stage('Install pnpm') {
steps {
sh 'npm i -g pnpm'
}
}
stage('Install dependencies') {
stage('Install deps') {
steps {
sh 'pnpm i'
}
}
stage('Buid') {
stage('Build') {
environment {
PATH = "${env.WORKSPACE}/node_modules/.bin:${env.PATH}"
}
steps {
sh 'pnpm build'
}
}
stage('Deploy') {
steps {
sh 'rm -rf /var/www/dev.araozu/*'
sh 'mv -f dist/* /var/www/dev.araozu/'
sh 'cp -r ./dist/* /var/www/araozu.dev/'
}
}
}

8
package.json
View File

@ -10,11 +10,11 @@
"astro": "astro"
},
"dependencies": {
"@astrojs/check": "^0.9.4",
"@astrojs/mdx": "^3.1.7",
"@astrojs/tailwind": "^5.1.1",
"@astrojs/check": "^0.5.10",
"@astrojs/mdx": "^3.1.2",
"@astrojs/tailwind": "^5.1.0",
"@types/node": "^22.3.0",
"astro": "^4.15.11",
"astro": "^4.11.5",
"tailwindcss": "^3.4.5",
"typescript": "^5.5.3"
},

1483
pnpm-lock.yaml
View File

File diff suppressed because it is too large Load Diff

6
public/blog.css
View File

@ -1,5 +1,5 @@
:not(pre)>code {
font-family: var(--font-mono);
font-family: "Iosevka Fixed Web", Iosevka, monospace;
border: solid 1px var(--c-border-2);
padding: 0 0.25rem;
border-radius: 0.25rem;
@ -33,7 +33,7 @@ pre.astro-code>code .line::before {
#blog h2 {
font-size: 1.5rem;
font-family: var(--font-display);
font-family: "Iosevka Etoile Web", serif;
font-weight: 900;
margin-top: 3rem;
margin-bottom: 1.5rem;
@ -41,7 +41,7 @@ pre.astro-code>code .line::before {
#blog h3 {
font-size: 1.25rem;
font-family: var(--font-display);
font-family: "Iosevka Etoile Web", serif;
font-weight: 900;
margin-top: 2.25rem;
margin-bottom: 1.5rem;

24
public/global.css
View File

@ -8,6 +8,24 @@
src: url("/Iosevka/Regular.woff2") format("woff2");
}
@font-face {
font-family: 'Iosevka Fixed Web';
font-display: swap;
font-weight: 700;
font-stretch: normal;
font-style: normal;
src: url('/Iosevka/Bold.woff2') format('woff2');
}
@font-face {
font-family: 'Iosevka Etoile Web';
font-display: swap;
font-weight: 900;
font-stretch: normal;
font-style: normal;
src: url('/IosevkaEtoile/Heavy.woff2') format('woff2');
}
/* Iosevka from Xe Iaso: https://xeiaso.net/ https://github.com/Xe/iosevka */
@font-face {
font-family: "Iosevka Iaso";
@ -25,10 +43,6 @@
--c-bg-2: #18181b;
--c-border-1: transparent;
--c-border-2: #606060;
--font-display: "Atkinson Hyperlegible", sans-serif;
--font-body: "Iosevka Iaso", "Iosevka Fixed Web", sans-serif;
--font-mono: "Iosevka Fixed Web", Iosevka, sans-serif;
}
@media (prefers-color-scheme: light) {
@ -48,6 +62,6 @@ html {
}
body {
font-family: var(--font-body);
font-family: "Iosevka Iaso", "Iosevka Fixed Web", sans-serif;
font-optical-sizing: auto;
}

2
src/components/Card.astro
View File

@ -4,7 +4,7 @@ const { title } = Astro.props;
<div
x-data="{open: true}"
class="shadow-lg p-2 bg-c-bg-2 rounded-md max-w-[50rem] border border-zinc-600 dark:border-zinc-900 mb-2"
class="shadow-lg p-2 bg-c-bg-2 rounded-md max-w-[50rem] border border-slate-600 dark:border-transparent mb-2"
>
<h2
class="text-2xl font-bold bg-c-bg-2 py-2 pl-2 cursor-pointer hover:underline sticky top-0 font-etoile"

23
src/components/Navigation.astro
View File

@ -1,10 +1,9 @@
<div class="h-screen">
<nav
class="fixed top-0 left-0 rotate-[-90deg] font-display w-[100vh] translate-y-[100vh] p-2"
class="fixed top-0 left-0 bg-white text-black rotate-[-90deg] font-display
w-[100vh] translate-y-[100vh] px-8 py-2 shadow shadow-zinc-500"
style="transform-origin: 0% 0%;"
>
<div class="shadow hover:shadow-md transition-shadow bg-c-bg-2 py-2 px-4 border border-zinc-600 dark:border-zinc-900 rounded-md">
<a class="font-semibold inline-block text-2xl hover:underline" href="/">
Fernando Araoz
</a>
@ -15,6 +14,22 @@
>
<a class="ml-6 inline-block hover:underline" href="/blog/es">Es Blog</a>
</div>
<svg width="1.5rem" height="1.5rem" class="absolute -bottom-6 right-0">
<filter id='shadow' color-interpolation-filters="sRGB">
<feDropShadow dx="1" dy="1" stdDeviation="2"
flood-opacity="1"
flood-color="#71717a"
/>
</filter>
<g filter="url(#shadow)">
<path d="m 0 0 h 24 v 24 c 0 -12, -12 -24, -24 -24" fill="white" />
</g>
</svg>
<svg width="1.5rem" height="1.5rem" class="absolute -bottom-6 left-0">
<g filter="url(#shadow)">
<path d="m 24 0 h -24 v 24 c 0 -12, 12 -24, 24 -24" fill="white" />
</g>
</svg>
</nav>
</div>

18
src/components/Sidebar.astro
View File

@ -1,12 +1,18 @@
<div class="lg:px-1">
<h1 class="text-xl font-light py-4">
Hi 👋! I'm
<br />
<span class="font-bold text-3xl">Fernando Araoz</span>
</h1>
<div class="text-center">
<div class="inline-block w-28 h-28 lg:w-40 lg:h-40 rounded-full bg-slate-500"></div>
</div>
<h1 class="text-xl font-light py-4">
<span class="font-display font-bold text-3xl">Fernando Araoz</span>
</h1>
<p class="font-display">
Human software engineer based in Peru
<p class="text-center">
I'm a (human) software engineer passionate about web technologies. I
love building things and learning new stuff.
</p>
<div class="text-center py-4">
<a class="inline-block py-2 px-4 rounded bg-blue-600 text-white" href="/blog/en/">Blog (en)</a>
<a class="inline-block py-2 px-4 rounded bg-indigo-600 text-white" href="/blog/es/">Blog (es)</a>
</div>
</div>

32
src/components/index/EsBlogIndex.astro
View File

@ -1,32 +0,0 @@
---
import Card from "../Card.astro"
const allPosts = await Astro.glob("../../pages/blog/en/*.md");
---
<Card title="en blog">
<div class="font-display">
<p>
Things I've thought about, about programming.
</p>
<ul class="py-4">
{
allPosts
.toSorted((x, y) =>
x.frontmatter.pubDate > y.frontmatter.pubDate ? -1 : 1,
)
.map((post) => {
return (
<li class="py-1">
{post.frontmatter.pubDate} -
<a class="underline text-lg" href={post.url}>
{post.frontmatter.title}
</a>
</li>
);
})
}
</ul>
</div>
</Card>

1
src/env.d.ts vendored
View File

@ -1,2 +1 @@
/// <reference path="../.astro/types.d.ts" />
/// <reference types="astro/client" />

29
src/layouts/BlogLayout.astro
View File

@ -15,10 +15,12 @@ lang = lang ?? "en";
<link rel="stylesheet" href="/global.css" />
<link rel="stylesheet" href="/blog.css" />
<title>Blog - Fernando Araoz</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet">
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap"
rel="stylesheet"
/>
<link
rel="stylesheet"
type="text/css"
@ -32,7 +34,7 @@ lang = lang ?? "en";
<div class="py-6">
{
frontmatter?.title && (
<h1 class="font-display font-bold text-center text-4xl py-2">
<h1 class="font-etoile text-center text-4xl py-2">
{frontmatter.title}
</h1>
)
@ -62,15 +64,26 @@ lang = lang ?? "en";
}
</div>
<div
class="text-base shadow-lg p-2 bg-c-bg-2 rounded-md border border-slate-600 dark:border-transparent mb-2"
>
<div class="text-base">
<slot />
</div>
<div class="pt-4 border-t border-c-on-bg">
<h3>Comments/Comentarios</h3>
<section id="isso-thread"
>
<noscript>Javascript needs to be activated to view comments.</noscript>
</section>
</div>
<div class="min-h-40"></div>
</div>
</NavigationLayout>
<script data-isso="https://comments.araozu.dev/"
data-isso-lang={lang}
src="https://comments.araozu.dev/js/embed.min.js"
></script>
</body>
</html>

9
src/layouts/SideProject.astro
View File

@ -22,9 +22,12 @@ const images_str = JSON.stringify(images);
<link rel="stylesheet" href="/global.css" />
<link rel="stylesheet" href="/blog.css" />
<title>Side projects - Fernando Araoz</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet">
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap"
rel="stylesheet"
/>
<link
rel="stylesheet"
type="text/css"

12
src/pages/index.astro
View File

@ -1,7 +1,9 @@
---
import Sidebar from "../components/Sidebar.astro";
import Languages from "../components/index/Languages.astro";
import Learning from "../components/index/Learning.astro";
import Tools from "../components/index/Tools.astro";
import NavigationLayout from "../layouts/NavigationLayout.astro";
import EsBlogIndex from "../components/index/EsBlogIndex.astro";
---
<!doctype html>
@ -12,10 +14,6 @@ import EsBlogIndex from "../components/index/EsBlogIndex.astro";
<meta name="viewport" content="width=device-width" />
<meta name="generator" content={Astro.generator} />
<link rel="stylesheet" href="/global.css" />
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet">
<title>Fernando Araoz</title>
<link
rel="stylesheet"
@ -31,7 +29,9 @@ import EsBlogIndex from "../components/index/EsBlogIndex.astro";
>
<Sidebar />
<div>
<EsBlogIndex />
<Languages />
<Learning />
<Tools />
</div>
</div>
</NavigationLayout>

6
tailwind.config.mjs
View File

@ -9,13 +9,13 @@ export default {
'c-bg-2': 'var(--c-bg-2)',
},
fontFamily: {
"etoile": ["var(--font-display)"],
"display": ["var(--font-display)"],
"etoile": ["'Iosevka Etoile Web'", "serif"],
"display": ["'Outfit'", "sans-serif"],
}
},
},
plugins: [
function({ addComponents }) {
function ({ addComponents }) {
addComponents({
'.container': {
width: '98%',