feat: improve styles
This commit is contained in:
parent
486129e09d
commit
8d330eff95
1
public/img/logos/archlinux-logo.svg
Normal file
1
public/img/logos/archlinux-logo.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="64" height="64"><path d="M31.994-.006c-2.85 6.985-4.568 11.554-7.74 18.332 1.945 2.062 4.332 4.462 8.2 7.174-4.168-1.715-7-3.437-9.136-5.224-4.06 8.47-10.42 20.538-23.327 43.73C10.145 58.15 18 54.54 25.338 53.16c-.315-1.354-.494-2.818-.48-4.345l.012-.325c.16-6.5 3.542-11.498 7.547-11.158s7.118 5.886 6.957 12.386a18.36 18.36 0 0 1-.409 3.491c7.25 1.418 15.03 5.02 25.037 10.797l-5.42-10.026c-2.65-2.053-5.413-4.726-11.05-7.62 3.875 1.007 6.65 2.168 8.8 3.467-17.1-31.84-18.486-36.07-24.35-49.833z" fill="#1793d1" fill-rule="evenodd"/></svg>
|
||||
|
After Width: | Height: | Size: 588 B |
27
public/img/logos/neovim-mark.svg
Normal file
27
public/img/logos/neovim-mark.svg
Normal file
@ -0,0 +1,27 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg width="602px" height="734px" viewBox="0 0 602 734" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<title>neovim-mark@2x</title>
|
||||
<description>Created with Sketch (http://www.bohemiancoding.com/sketch)</description>
|
||||
<defs>
|
||||
<linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
|
||||
<stop stop-color="#16B0ED" stop-opacity="0.800235524" offset="0%"></stop>
|
||||
<stop stop-color="#0F59B2" stop-opacity="0.83700023" offset="100%"></stop>
|
||||
</linearGradient>
|
||||
<linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
|
||||
<stop stop-color="#7DB643" offset="0%"></stop>
|
||||
<stop stop-color="#367533" offset="100%"></stop>
|
||||
</linearGradient>
|
||||
<linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-3">
|
||||
<stop stop-color="#88C649" stop-opacity="0.8" offset="0%"></stop>
|
||||
<stop stop-color="#439240" stop-opacity="0.84" offset="100%"></stop>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="mark-copy" sketch:type="MSLayerGroup" transform="translate(2.000000, 3.000000)">
|
||||
<path d="M0,155.5704 L155,-1 L154.999997,727 L0,572.237919 L0,155.5704 Z" id="Left---green" fill="url(#linearGradient-1)" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M443.060403,156.982405 L600,-1 L596.818792,727 L442,572.219941 L443.060403,156.982405 Z" id="Right---blue" fill="url(#linearGradient-2)" sketch:type="MSShapeGroup" transform="translate(521.000000, 363.500000) scale(-1, 1) translate(-521.000000, -363.500000) "></path>
|
||||
<path d="M154.986294,0 L558,615.189696 L445.224605,728 L42,114.172017 L154.986294,0 Z" id="Cross---blue" fill="url(#linearGradient-3)" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M155,283.83232 L154.786754,308 L31,124.710606 L42.4619486,113 L155,283.83232 Z" id="Shadow" fill-opacity="0.13" fill="#000000" sketch:type="MSShapeGroup"></path>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.2 KiB |
1
public/img/logos/tmux-logo.svg
Normal file
1
public/img/logos/tmux-logo.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg width="608px" height="160px" version="1.1" viewBox="0 0 608 160" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"> <g fill="none" fill-rule="evenodd"> <g id="vlpa"> <g id="vlpb"> <g id="vlpc" fill="#1BB91F"> <path d="m0 116h160v29c0 8.286-6.722 15-15 15h-130c-8.283 0-15-6.707-15-15v-29zm0 0h160v30h-160v-30z"/> </g> <path id="vlpd" d="m83 70v-70h-6v146h6v-70h77v-6h-77zm-83-54.99c0-8.288 6.722-15.01 15-15.01h130c8.283 0 15 6.725 15 15.01v131h-160v-131z" fill="#3C3C3C"/> </g> <path id="vlpe" d="m241.8 147.8c-10.92 0-19.13-2.867-24.65-8.602s-8.272-14.23-8.272-25.48v-51.78h-19.85v-14.89h19.85v-33.09h16.54v33.09h36.4v14.89h-36.4v51.95c0 6.507 1.599 11.28 4.798 14.31 3.198 3.033 7.389 4.549 12.57 4.549 2.426 0 5.128-0.2757 8.106-0.8272 2.978-0.5514 6.011-1.379 9.099-2.481l3.309 14.56c-3.75 1.323-7.417 2.288-11 2.895-3.584 0.6066-7.086 0.9099-10.5 0.9099zm52.93-1.489h-16.54v-99.26h16.54v16.54s10.06-9.926 14.97-13.23c4.908-3.309 10.67-4.963 17.29-4.963 5.845 0 10.84 1.627 14.97 4.88s7.086 7.693 8.851 13.32c0 0 11.14-9.926 16.21-13.23s11.08-4.963 18.03-4.963c7.72 0 13.9 2.84 18.53 8.52 4.632 5.68 6.948 13.32 6.948 22.91v69.48h-16.54v-66.83c0-6.617-1.268-11.33-3.805-14.14-2.537-2.812-6.176-4.219-10.92-4.219-4.742 0-9.457 1.434-14.14 4.301-4.687 2.868-8.851 6.672-12.49 11.41v69.48h-16.54v-66.83c0-6.617-1.268-11.33-3.805-14.14-2.537-2.812-6.176-4.219-10.92-4.219-4.742 0-9.457 1.434-14.14 4.301-4.687 2.868-8.851 6.672-12.49 11.41v69.48zm144.2-7.61c-5.845-6.176-8.768-14.39-8.768-24.65v-67h16.54v63.69c0 7.058 1.654 12.41 4.963 16.05 3.309 3.64 8.161 5.459 14.56 5.459 5.073 0 10.12-1.461 15.14-4.384s10.01-7.251 14.97-12.99v-67.83h16.54v99.26h-16.54v-16.54s-11.22 9.926-16.46 13.23c-5.239 3.309-11.11 4.963-17.62 4.963-9.705 0-17.48-3.088-23.33-9.264zm149.7 7.61-24.15-37.39-22.66 37.39h-18.36l33.09-49.8-31.93-49.46h18.53l23 35.73 23.33-35.73h18.36l-33.42 48.47 32.76 50.79h-18.53z" fill="#1BB91F"/> </g> </g> </svg>
|
||||
|
After Width: | Height: | Size: 2.0 KiB |
@ -2,4 +2,4 @@
|
||||
var {code} = Astro.props;
|
||||
---
|
||||
|
||||
<div class="whitespace-pre p-2 bg-black text-white rounded-md mb-4 font-mono">{code}</div>
|
||||
<div class="whitespace-pre p-2 bg-black text-white rounded-md mb-4 font-mono overflow-x-scroll">{code}</div>
|
||||
|
||||
@ -1,19 +1,22 @@
|
||||
<div class="h-screen">
|
||||
<div class="md:h-screen">
|
||||
<nav
|
||||
class="fixed top-0 left-0 rotate-[-90deg] font-display w-[100vh] translate-y-[100vh] p-2"
|
||||
class="md:fixed md:top-0 md:left-0 md:rotate-[-90deg] font-display md:w-[100vh] md:translate-y-[100vh] p-2 w-full"
|
||||
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="/">
|
||||
<a class="font-semibold inline-block text-2xl hover:underline mr-6" href="/">
|
||||
Fernando Araoz
|
||||
</a>
|
||||
<a class="ml-6 inline-block hover:underline" href="/side-projects"
|
||||
|
||||
<br class="md:hidden" />
|
||||
|
||||
<a class="mr-6 inline-block hover:underline" href="/side-projects"
|
||||
>Side projects</a
|
||||
>
|
||||
<a class="ml-6 inline-block hover:underline" href="/blog/en">Eng Blog</a
|
||||
<a class="mr-6 inline-block hover:underline" href="/blog/en">Eng Blog</a
|
||||
>
|
||||
<a class="ml-6 inline-block hover:underline" href="/blog/es">Es Blog</a>
|
||||
<a class="mr-6 inline-block hover:underline" href="/blog/es">Es Blog</a>
|
||||
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
@ -1,13 +1,20 @@
|
||||
<div class="lg:px-1">
|
||||
<div class="lg:px-1 pb-8">
|
||||
<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>
|
||||
<p class="font-display font-bold text-3xl text-center">
|
||||
Fernando Araoz
|
||||
</p>
|
||||
</h1>
|
||||
<p class="font-display">
|
||||
Human software engineer based in Peru
|
||||
<p class="font-display text-center">
|
||||
I'm a Human software engineer based in Peru,
|
||||
passionate about webdev, devops and sysadmin
|
||||
stuff.
|
||||
<br />
|
||||
And sometimes I may find inspiration to write for
|
||||
my blog.
|
||||
</p>
|
||||
<hr />
|
||||
<div class="text-center">
|
||||
@ -17,4 +24,25 @@
|
||||
My sideprojects
|
||||
</a>
|
||||
</div>
|
||||
<div class="flex items-center gap-1 justify-center">
|
||||
<span>
|
||||
Proudly written in
|
||||
</span>
|
||||
<a href="https://archlinux.org" target="_blank">
|
||||
<img
|
||||
class={"inline-block h-6 px-1 my-1"}
|
||||
src={`/img/logos/archlinux-logo.svg`}
|
||||
alt="Arch Linux logo"
|
||||
title="Arch btw"
|
||||
/>
|
||||
</a>
|
||||
<a href="https://neovim.io" target="_blank">
|
||||
<img
|
||||
class={"inline-block h-6 px-1 my-1"}
|
||||
src={`/img/logos/neovim-mark.svg`}
|
||||
alt={`Neovim logo`}
|
||||
title={`Neovim btw`}
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -11,7 +11,8 @@ const allPosts = (await Astro.glob("../../pages/blog/en/*.{md,mdx}"))
|
||||
<Card title="en blog">
|
||||
<div class="font-display">
|
||||
<p>
|
||||
Things I've thought about, about programming.
|
||||
Things that come to my mind about
|
||||
software.
|
||||
</p>
|
||||
|
||||
<ul class="py-4">
|
||||
|
||||
@ -28,7 +28,7 @@ lang = lang ?? "en";
|
||||
</head>
|
||||
<body>
|
||||
<NavigationLayout>
|
||||
<div id="blog" class="container mx-auto w-[1000px] max-w-[90vw]" style="font-size: 18px">
|
||||
<div id="blog" class="container mx-auto w-[1000px] md:max-w-[90vw] max-w-[95vw]" style="font-size: 18px">
|
||||
<div class="py-6">
|
||||
{
|
||||
frontmatter?.title && (
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
import Navigation from "../components/Navigation.astro";
|
||||
---
|
||||
|
||||
<div class="grid grid-cols-[4rem_auto]">
|
||||
<div class="md:grid md:grid-cols-[4rem_auto]">
|
||||
<Navigation />
|
||||
<slot />
|
||||
</div>
|
||||
|
||||
@ -23,7 +23,7 @@ import EnBlogIndex from "../components/index/EnBlogIndex.astro";
|
||||
type="text/css"
|
||||
href="https://unpkg.com/@phosphor-icons/web@2.1.1/src/regular/style.css"
|
||||
/>
|
||||
<script src="//unpkg.com/alpinejs" defer></script>
|
||||
<script is:inline src="//unpkg.com/alpinejs" defer></script>
|
||||
</head>
|
||||
<body>
|
||||
<NavigationLayout>
|
||||
|
||||
@ -11,6 +11,7 @@ export default {
|
||||
fontFamily: {
|
||||
"etoile": ["var(--font-display)"],
|
||||
"display": ["var(--font-display)"],
|
||||
"body": ["var(--font-body)"],
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
Loading…
Reference in New Issue
Block a user