catppuccin and animations
This commit is contained in:
		
							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 markdownItClass = require('@toycode/markdown-it-class'); | ||||||
| 
 | 
 | ||||||
| const markdownClassMapping = { | const markdownClassMapping = { | ||||||
|   // h1: ['hide'],
 |   h1: ['text-6xl', 'mt-6', 'text-pink'], | ||||||
|   h2: ['text-3xl', 'mt-6'], |   h2: ['text-3xl', 'mt-6', 'text-text'], | ||||||
|   h3: ['text-2xl', 'mt-4'], |   h3: ['text-2xl', 'mt-4', 'text-text'], | ||||||
|   h4: ['text-xl', 'mt-2'], |   h4: ['text-xl', 'mt-2', 'text-text'], | ||||||
|   h5: ['text-lg', 'mt-2'], |   h5: ['text-lg', 'mt-2', 'text-text'], | ||||||
|   h6: ['font-bold', 'mt-2'], |   h6: ['font-bold', 'mt-2', 'text-text'], | ||||||
|   blockquote: ['border-l-4', 'border-slate-900', 'px-4'], |   blockquote: ['border-l-2', 'border-lavender', 'px-4', 'pt-4', 'pb-px', 'my-8', 'bg-base'], | ||||||
|   a: [ |   a: [ | ||||||
|     'text-slate-200', 'underline', |     'text-blue', 'underline', | ||||||
|     'hover:text-white', 'hover:bg-rose-950', 'hover:outline', 'hover:outline-width-1', 'hover:outline-rose-950', |     'visited:text-lavender', | ||||||
|     'active:text-white', 'active:bg-rose-900', 'active:outline', 'active:outline-width-1', 'active:outline-rose-900', |     'hover:no-underline', 'hover:text-sky', 'hover:outline', 'hover:outline-width-1', 'hover:outline-sky', | ||||||
|     'focus:text-white', 'focus:bg-rose-900', 'focus:outline', 'focus:outline-width-1', 'focus:outline-rose-900' |     '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'], |   img: ['max-w-full', 'rounded-lg', 'max-h-600px'], | ||||||
|   ul: ['list-disc', 'ml-4'], |   ul: ['list-disc', 'ml-4'], | ||||||
| }; | }; | ||||||
|  |  | ||||||
|  | @ -16,7 +16,7 @@ | ||||||
|     "url": "/community/" |     "url": "/community/" | ||||||
|   }, |   }, | ||||||
|   { |   { | ||||||
|     "title": "About | Uses", |     "title": "About", | ||||||
|     "url": "/uses/" |     "url": "/uses/" | ||||||
|   } |   } | ||||||
| ] | ] | ||||||
|  |  | ||||||
|  | @ -6,7 +6,7 @@ | ||||||
|   {% set pagetitle = page.fileSlug %} |   {% set pagetitle = page.fileSlug %} | ||||||
| {% endif %} | {% endif %} | ||||||
| 
 | 
 | ||||||
| <html> | <html class="latte dark:mocha"> | ||||||
| <head> | <head> | ||||||
|   <title>Portfolio - {{ pagetitle | capitalize }}</title> |   <title>Portfolio - {{ pagetitle | capitalize }}</title> | ||||||
|   <meta charset="UTF-8"> |   <meta charset="UTF-8"> | ||||||
|  | @ -24,13 +24,17 @@ | ||||||
|   <link rel="manifest" href="/img/site/favicons/site.webmanifest"> |   <link rel="manifest" href="/img/site/favicons/site.webmanifest"> | ||||||
| </head> | </head> | ||||||
| 
 | 
 | ||||||
| <body class="bg-slate-950" style="background-image: url('/img/site/stars.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-slate-900/50 bg-contain bg-left bg-no-repeat justify-end flex h-80" style="background-image: url('/img/site/falling.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"> |     <nav class="inline-flex flex-col relative my-auto"> | ||||||
|       {%- for navItem in navigation -%} |       {%- for navItem in navigation -%} | ||||||
|         <a |         <a | ||||||
|           href="{{navItem.url}}" |           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 %} |           {% if page.url == navItem.url %}aria-current="page"{% endif %} | ||||||
|         > |         > | ||||||
|           {{navItem.title}} |           {{navItem.title}} | ||||||
|  |  | ||||||
|  | @ -1,12 +1,12 @@ | ||||||
| {% include "base-header.html" %} | {% include "base-header.html" %} | ||||||
| 
 | 
 | ||||||
| <main class="max-w-7xl mx-auto px-4"> | <main class="max-w-7xl mx-auto p-2"> | ||||||
|   <div class="relative max-w-lg mx-auto divide-y-2 divide-slate-900 lg:max-w-7xl"> |   <div class="relative max-w-lg mx-auto divide-y-2 divide-overlay2 lg:max-w-7xl"> | ||||||
|     <div> |     <div class="p-2 bg-base/75 shadow rounded border-2 border-base border-l-yellow"> | ||||||
|       <h2 class="my-8 text-3xl tracking-tight font-extrabold text-slate-200 sm:text-4xl"> |       <h1 class="text-yellow mt-2 mb-8 text-3xl tracking-tight sm:text-4xl"> | ||||||
|         {{ title }} |         {{ title }} | ||||||
|       </h2> |       </h1> | ||||||
|       <div class="mt-3 text-xl text-slate-500 sm:mt-4"> |       <div class="mt-3"> | ||||||
|         {{ content | safe }} |         {{ content | safe }} | ||||||
|       </div> |       </div> | ||||||
|     </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 | 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). | 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": { |       "devDependencies": { | ||||||
|         "@11ty/eleventy": "^2.0.1", |         "@11ty/eleventy": "^2.0.1", | ||||||
|         "@11ty/eleventy-plugin-syntaxhighlight": "^3.1.3", |         "@11ty/eleventy-plugin-syntaxhighlight": "^3.1.3", | ||||||
|  |         "@catppuccin/tailwindcss": "^0.1.6", | ||||||
|         "autoprefixer": "^10.3.7", |         "autoprefixer": "^10.3.7", | ||||||
|         "cssnano": "^5.0.8", |         "cssnano": "^5.0.8", | ||||||
|         "nunjucks-date": "^1.5.0", |         "nunjucks-date": "^1.5.0", | ||||||
|  | @ -202,6 +203,15 @@ | ||||||
|         "node": ">=6.9.0" |         "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": { |     "node_modules/@iarna/toml": { | ||||||
|       "version": "2.2.5", |       "version": "2.2.5", | ||||||
|       "resolved": "https://registry.npmjs.org/@iarna/toml/-/toml-2.2.5.tgz", |       "resolved": "https://registry.npmjs.org/@iarna/toml/-/toml-2.2.5.tgz", | ||||||
|  | @ -4653,6 +4663,13 @@ | ||||||
|         "to-fast-properties": "^2.0.0" |         "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": { |     "@iarna/toml": { | ||||||
|       "version": "2.2.5", |       "version": "2.2.5", | ||||||
|       "resolved": "https://registry.npmjs.org/@iarna/toml/-/toml-2.2.5.tgz", |       "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": "npx postcss styles.css -o _site/styles.css --watch", | ||||||
|     "start:site": "npx @11ty/eleventy --serve", |     "start:site": "npx @11ty/eleventy --serve", | ||||||
|     "build": "npx @11ty/eleventy", |     "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", |     "test": "echo \"Error: no test specified\" && exit 1", | ||||||
|     "deploy": "docker compose up --build -d" |     "deploy": "docker compose up --build -d" | ||||||
|   }, |   }, | ||||||
|  | @ -24,6 +24,7 @@ | ||||||
|   "devDependencies": { |   "devDependencies": { | ||||||
|     "@11ty/eleventy": "^2.0.1", |     "@11ty/eleventy": "^2.0.1", | ||||||
|     "@11ty/eleventy-plugin-syntaxhighlight": "^3.1.3", |     "@11ty/eleventy-plugin-syntaxhighlight": "^3.1.3", | ||||||
|  |     "@catppuccin/tailwindcss": "^0.1.6", | ||||||
|     "autoprefixer": "^10.3.7", |     "autoprefixer": "^10.3.7", | ||||||
|     "cssnano": "^5.0.8", |     "cssnano": "^5.0.8", | ||||||
|     "nunjucks-date": "^1.5.0", |     "nunjucks-date": "^1.5.0", | ||||||
|  |  | ||||||
|  | @ -1,7 +1,9 @@ | ||||||
| module.exports = { | module.exports = { | ||||||
|   content: ['./_site/**/*.html'], |   content: ['./_site/index.html', './_site/**/*.html', '.eleventy.js'], | ||||||
|   variants: { |   variants: { | ||||||
|     extend: {}, |     extend: {}, | ||||||
|   }, |   }, | ||||||
|   plugins: [], |   plugins: [ | ||||||
|  |     require("@catppuccin/tailwindcss"), | ||||||
|  |   ], | ||||||
| } | } | ||||||
|  |  | ||||||
|  | @ -1,7 +1,7 @@ | ||||||
| --- | --- | ||||||
| layout: content.njk | layout: content.njk | ||||||
| tags: uses | 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 | 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 | date: 2020-01-14 | ||||||
| --- | --- | ||||||
|  |  | ||||||
		Loading…
	
	Add table
		
		Reference in a new issue
	
	 Ava Gaiety W
						Ava Gaiety W