catppuccin and animations
This commit is contained in:
Ava Gaiety W
parent
f79e24da7e
commit
ea176fe288
11 changed files with 54 additions and 28 deletions
26
.eleventy.js
26
.eleventy.js
|
|
@ -5,20 +5,22 @@ const markdownIt = require('markdown-it');
|
|||
const markdownItClass = require('@toycode/markdown-it-class');
|
||||
|
||||
const markdownClassMapping = {
|
||||
// h1: ['hide'],
|
||||
h2: ['text-3xl', 'mt-6'],
|
||||
h3: ['text-2xl', 'mt-4'],
|
||||
h4: ['text-xl', 'mt-2'],
|
||||
h5: ['text-lg', 'mt-2'],
|
||||
h6: ['font-bold', 'mt-2'],
|
||||
blockquote: ['border-l-4', 'border-slate-900', 'px-4'],
|
||||
h1: ['text-6xl', 'mt-6', 'text-pink'],
|
||||
h2: ['text-3xl', 'mt-6', 'text-text'],
|
||||
h3: ['text-2xl', 'mt-4', 'text-text'],
|
||||
h4: ['text-xl', 'mt-2', 'text-text'],
|
||||
h5: ['text-lg', 'mt-2', 'text-text'],
|
||||
h6: ['font-bold', 'mt-2', 'text-text'],
|
||||
blockquote: ['border-l-2', 'border-lavender', 'px-4', 'pt-4', 'pb-px', 'my-8', 'bg-base'],
|
||||
a: [
|
||||
'text-slate-200', 'underline',
|
||||
'hover:text-white', 'hover:bg-rose-950', 'hover:outline', 'hover:outline-width-1', 'hover:outline-rose-950',
|
||||
'active:text-white', 'active:bg-rose-900', 'active:outline', 'active:outline-width-1', 'active:outline-rose-900',
|
||||
'focus:text-white', 'focus:bg-rose-900', 'focus:outline', 'focus:outline-width-1', 'focus:outline-rose-900'
|
||||
'text-blue', 'underline',
|
||||
'visited:text-lavender',
|
||||
'hover:no-underline', 'hover:text-sky', 'hover:outline', 'hover:outline-width-1', 'hover:outline-sky',
|
||||
'active:no-underline', 'active:text-sky', 'active:outline', 'active:outline-width-1', 'active:outline-sky',
|
||||
'focus:no-underline', 'focus:text-sky', 'focus:outline', 'focus:outline-width-1', 'focus:outline-sky'
|
||||
],
|
||||
p: ['mb-2', 'text-slate-400', 'leading-7'],
|
||||
s: ['text-red'],
|
||||
p: ['mb-4', 'text-text', 'leading-7'],
|
||||
img: ['max-w-full', 'rounded-lg', 'max-h-600px'],
|
||||
ul: ['list-disc', 'ml-4'],
|
||||
};
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@
|
|||
"url": "/community/"
|
||||
},
|
||||
{
|
||||
"title": "About | Uses",
|
||||
"title": "About",
|
||||
"url": "/uses/"
|
||||
}
|
||||
]
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
{% set pagetitle = page.fileSlug %}
|
||||
{% endif %}
|
||||
|
||||
<html>
|
||||
<html class="latte dark:mocha">
|
||||
<head>
|
||||
<title>Portfolio - {{ pagetitle | capitalize }}</title>
|
||||
<meta charset="UTF-8">
|
||||
|
|
@ -24,13 +24,17 @@
|
|||
<link rel="manifest" href="/img/site/favicons/site.webmanifest">
|
||||
</head>
|
||||
|
||||
<body class="bg-slate-950" style="background-image: url('/img/site/stars.gif')">
|
||||
<header class="bg-slate-900/50 bg-contain bg-left bg-no-repeat justify-end flex h-80" style="background-image: url('/img/site/falling.gif')">
|
||||
<body class="bg-crust bg-[length:20rem] bg-[url('/img/site/stars-light.gif')] dark:bg-[url('/img/site/stars-dark.gif')]">
|
||||
<header class="
|
||||
bg-base/75 bg-contain bg-left bg-no-repeat
|
||||
bg-[url('/img/site/falling.gif')]
|
||||
border-b-2 border-base justify-end flex h-80 shadow
|
||||
">
|
||||
<nav class="inline-flex flex-col relative my-auto">
|
||||
{%- for navItem in navigation -%}
|
||||
<a
|
||||
href="{{navItem.url}}"
|
||||
class="{% if page.url == navItem.url %} border-rose-700 text-slate-100 {% else %} border-transparent hover:border-rose-950 active:border-rose-950 text-slate-500 hover:text-slate-400 active:text-slate-400 {% endif %} inline-flex items-center pl-1 pr-4 pt-1 border-b-2 text-lg font-medium focus:outline-link"
|
||||
class="transition-colors {% if page.url == navItem.url %} border-rosewater text-rosewater {% else %} hover:border-pink active:border-pink text-subtext1 hover:text-subtext0 active:text-subtext0 border-transparent{% endif %} inline-flex items-center pl-1 pr-4 pt-1 border-b-2 text-lg font-medium focus:outline-link"
|
||||
{% if page.url == navItem.url %}aria-current="page"{% endif %}
|
||||
>
|
||||
{{navItem.title}}
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
{% include "base-header.html" %}
|
||||
|
||||
<main class="max-w-7xl mx-auto px-4">
|
||||
<div class="relative max-w-lg mx-auto divide-y-2 divide-slate-900 lg:max-w-7xl">
|
||||
<div>
|
||||
<h2 class="my-8 text-3xl tracking-tight font-extrabold text-slate-200 sm:text-4xl">
|
||||
<main class="max-w-7xl mx-auto p-2">
|
||||
<div class="relative max-w-lg mx-auto divide-y-2 divide-overlay2 lg:max-w-7xl">
|
||||
<div class="p-2 bg-base/75 shadow rounded border-2 border-base border-l-yellow">
|
||||
<h1 class="text-yellow mt-2 mb-8 text-3xl tracking-tight sm:text-4xl">
|
||||
{{ title }}
|
||||
</h2>
|
||||
<div class="mt-3 text-xl text-slate-500 sm:mt-4">
|
||||
</h1>
|
||||
<div class="mt-3">
|
||||
{{ content | safe }}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 18 KiB After Width: | Height: | Size: 18 KiB |
BIN
img/site/stars-light.gif
Normal file
BIN
img/site/stars-light.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
2
index.md
2
index.md
|
|
@ -5,7 +5,7 @@ description: Portfolio containing work experience, code, volunteering and more!
|
|||
eleventyExcludeFromCollections: true
|
||||
---
|
||||
|
||||
> 🐕 Canine pretending to be a web engineer addicted to design 💻 (_[Fae](https://pronoun.monster/fae/faer/faer/femme/femmeself)/[She](https://pronoun.monster/she/her/her/hers/herself)_)
|
||||
> 🐕 Someone taught a dog how to code and now it's everyone's ~~problem~~ fortune 💻 (_[Fae](https://pronoun.monster/fae/faer/faer/femme/femmeself)/[She](https://pronoun.monster/she/her/her/hers/herself)_)
|
||||
|
||||
My work varies significantly including [open source engineering samples](/repos), to [summaries of projects done during my career](/work), and [conference talks and volunteer work](/community).
|
||||
|
||||
|
|
|
|||
17
package-lock.json
generated
17
package-lock.json
generated
|
|
@ -14,6 +14,7 @@
|
|||
"devDependencies": {
|
||||
"@11ty/eleventy": "^2.0.1",
|
||||
"@11ty/eleventy-plugin-syntaxhighlight": "^3.1.3",
|
||||
"@catppuccin/tailwindcss": "^0.1.6",
|
||||
"autoprefixer": "^10.3.7",
|
||||
"cssnano": "^5.0.8",
|
||||
"nunjucks-date": "^1.5.0",
|
||||
|
|
@ -202,6 +203,15 @@
|
|||
"node": ">=6.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@catppuccin/tailwindcss": {
|
||||
"version": "0.1.6",
|
||||
"resolved": "https://registry.npmjs.org/@catppuccin/tailwindcss/-/tailwindcss-0.1.6.tgz",
|
||||
"integrity": "sha512-V+Y0AwZ5SSyvOVAcDl7Ng30xy+m82OKnEJ+9+kcZZ7lRyXuZrAb2GScdq9XR3v+ggt8qiZ/G4TvaC9cJ88AAXA==",
|
||||
"dev": true,
|
||||
"peerDependencies": {
|
||||
"tailwindcss": ">=3.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@iarna/toml": {
|
||||
"version": "2.2.5",
|
||||
"resolved": "https://registry.npmjs.org/@iarna/toml/-/toml-2.2.5.tgz",
|
||||
|
|
@ -4653,6 +4663,13 @@
|
|||
"to-fast-properties": "^2.0.0"
|
||||
}
|
||||
},
|
||||
"@catppuccin/tailwindcss": {
|
||||
"version": "0.1.6",
|
||||
"resolved": "https://registry.npmjs.org/@catppuccin/tailwindcss/-/tailwindcss-0.1.6.tgz",
|
||||
"integrity": "sha512-V+Y0AwZ5SSyvOVAcDl7Ng30xy+m82OKnEJ+9+kcZZ7lRyXuZrAb2GScdq9XR3v+ggt8qiZ/G4TvaC9cJ88AAXA==",
|
||||
"dev": true,
|
||||
"requires": {}
|
||||
},
|
||||
"@iarna/toml": {
|
||||
"version": "2.2.5",
|
||||
"resolved": "https://registry.npmjs.org/@iarna/toml/-/toml-2.2.5.tgz",
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@
|
|||
"start": "npx postcss styles.css -o _site/styles.css --watch",
|
||||
"start:site": "npx @11ty/eleventy --serve",
|
||||
"build": "npx @11ty/eleventy",
|
||||
"postbuild": "npx postcss styles.css -o _site/styles.css --env production",
|
||||
"postbuild": "npx tailwindcss -i styles.css -o _site/styles.css --env production",
|
||||
"test": "echo \"Error: no test specified\" && exit 1",
|
||||
"deploy": "docker compose up --build -d"
|
||||
},
|
||||
|
|
@ -24,6 +24,7 @@
|
|||
"devDependencies": {
|
||||
"@11ty/eleventy": "^2.0.1",
|
||||
"@11ty/eleventy-plugin-syntaxhighlight": "^3.1.3",
|
||||
"@catppuccin/tailwindcss": "^0.1.6",
|
||||
"autoprefixer": "^10.3.7",
|
||||
"cssnano": "^5.0.8",
|
||||
"nunjucks-date": "^1.5.0",
|
||||
|
|
|
|||
|
|
@ -1,7 +1,9 @@
|
|||
module.exports = {
|
||||
content: ['./_site/**/*.html'],
|
||||
content: ['./_site/index.html', './_site/**/*.html', '.eleventy.js'],
|
||||
variants: {
|
||||
extend: {},
|
||||
},
|
||||
plugins: [],
|
||||
plugins: [
|
||||
require("@catppuccin/tailwindcss"),
|
||||
],
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
---
|
||||
layout: content.njk
|
||||
tags: uses
|
||||
title: About | Uses
|
||||
title: About
|
||||
description: 🐕 Canine pretending to be a web engineer addicted to design 💻 <a href="https://pronoun.monster/fae/faer/faer/femme/femmeself">Fae</a>/She
|
||||
date: 2020-01-14
|
||||
---
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue