WIP Tailwind
This commit is contained in:
Ava Gaiety Wroten
parent
7366698c97
commit
a757568769
7 changed files with 1650 additions and 10 deletions
|
|
@ -16,9 +16,174 @@
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>{{ title }}</title>
|
<title>{{ title }}</title>
|
||||||
|
<link rel="stylesheet" href="/main.css" />
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
|
<div class="relative bg-gray-50 pt-16 pb-20 px-4 sm:px-6 lg:pt-24 lg:pb-28 lg:px-8">
|
||||||
|
<div class="absolute inset-0">
|
||||||
|
<div class="bg-white h-1/3 sm:h-2/3"></div>
|
||||||
|
</div>
|
||||||
|
<div class="relative max-w-7xl mx-auto">
|
||||||
|
<div class="text-center">
|
||||||
|
<h2 class="text-3xl tracking-tight font-extrabold text-gray-900 sm:text-4xl">
|
||||||
|
{{ title }}
|
||||||
|
</h2>
|
||||||
|
<p class="mt-3 max-w-2xl mx-auto text-xl text-gray-500 sm:mt-4">
|
||||||
{{ content | safe }}
|
{{ content | safe }}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="mt-12 max-w-lg mx-auto grid gap-5 lg:grid-cols-3 lg:max-w-none">
|
||||||
|
<div class="flex flex-col rounded-lg shadow-lg overflow-hidden">
|
||||||
|
<div class="flex-shrink-0">
|
||||||
|
<img class="h-48 w-full object-cover" src="https://images.unsplash.com/photo-1496128858413-b36217c2ce36?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1679&q=80" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="flex-1 bg-white p-6 flex flex-col justify-between">
|
||||||
|
<div class="flex-1">
|
||||||
|
<p class="text-sm font-medium text-indigo-600">
|
||||||
|
<a href="#" class="hover:underline">
|
||||||
|
Article
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<a href="#" class="block mt-2">
|
||||||
|
<p class="text-xl font-semibold text-gray-900">
|
||||||
|
Boost your conversion rate
|
||||||
|
</p>
|
||||||
|
<p class="mt-3 text-base text-gray-500">
|
||||||
|
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto accusantium praesentium eius, ut atque fuga culpa, similique sequi cum eos quis dolorum.
|
||||||
|
</p>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="mt-6 flex items-center">
|
||||||
|
<div class="flex-shrink-0">
|
||||||
|
<a href="#">
|
||||||
|
<span class="sr-only">Roel Aufderehar</span>
|
||||||
|
<img class="h-10 w-10 rounded-full" src="https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80" alt="">
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="ml-3">
|
||||||
|
<p class="text-sm font-medium text-gray-900">
|
||||||
|
<a href="#" class="hover:underline">
|
||||||
|
Roel Aufderehar
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<div class="flex space-x-1 text-sm text-gray-500">
|
||||||
|
<time datetime="2020-03-16">
|
||||||
|
Mar 16, 2020
|
||||||
|
</time>
|
||||||
|
<span aria-hidden="true">
|
||||||
|
·
|
||||||
|
</span>
|
||||||
|
<span>
|
||||||
|
6 min read
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex flex-col rounded-lg shadow-lg overflow-hidden">
|
||||||
|
<div class="flex-shrink-0">
|
||||||
|
<img class="h-48 w-full object-cover" src="https://images.unsplash.com/photo-1547586696-ea22b4d4235d?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1679&q=80" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="flex-1 bg-white p-6 flex flex-col justify-between">
|
||||||
|
<div class="flex-1">
|
||||||
|
<p class="text-sm font-medium text-indigo-600">
|
||||||
|
<a href="#" class="hover:underline">
|
||||||
|
Video
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<a href="#" class="block mt-2">
|
||||||
|
<p class="text-xl font-semibold text-gray-900">
|
||||||
|
How to use search engine optimization to drive sales
|
||||||
|
</p>
|
||||||
|
<p class="mt-3 text-base text-gray-500">
|
||||||
|
Lorem ipsum dolor sit amet consectetur adipisicing elit. Velit facilis asperiores porro quaerat doloribus, eveniet dolore. Adipisci tempora aut inventore optio animi., tempore temporibus quo laudantium.
|
||||||
|
</p>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="mt-6 flex items-center">
|
||||||
|
<div class="flex-shrink-0">
|
||||||
|
<a href="#">
|
||||||
|
<span class="sr-only">Brenna Goyette</span>
|
||||||
|
<img class="h-10 w-10 rounded-full" src="https://images.unsplash.com/photo-1550525811-e5869dd03032?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80" alt="">
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="ml-3">
|
||||||
|
<p class="text-sm font-medium text-gray-900">
|
||||||
|
<a href="#" class="hover:underline">
|
||||||
|
Brenna Goyette
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<div class="flex space-x-1 text-sm text-gray-500">
|
||||||
|
<time datetime="2020-03-10">
|
||||||
|
Mar 10, 2020
|
||||||
|
</time>
|
||||||
|
<span aria-hidden="true">
|
||||||
|
·
|
||||||
|
</span>
|
||||||
|
<span>
|
||||||
|
4 min read
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex flex-col rounded-lg shadow-lg overflow-hidden">
|
||||||
|
<div class="flex-shrink-0">
|
||||||
|
<img class="h-48 w-full object-cover" src="https://images.unsplash.com/photo-1492724441997-5dc865305da7?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1679&q=80" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="flex-1 bg-white p-6 flex flex-col justify-between">
|
||||||
|
<div class="flex-1">
|
||||||
|
<p class="text-sm font-medium text-indigo-600">
|
||||||
|
<a href="#" class="hover:underline">
|
||||||
|
Case Study
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<a href="#" class="block mt-2">
|
||||||
|
<p class="text-xl font-semibold text-gray-900">
|
||||||
|
Improve your customer experience
|
||||||
|
</p>
|
||||||
|
<p class="mt-3 text-base text-gray-500">
|
||||||
|
Lorem ipsum dolor sit amet consectetur adipisicing elit. Sint harum rerum voluptatem quo recusandae magni placeat saepe molestiae, sed excepturi cumque corporis perferendis hic.
|
||||||
|
</p>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="mt-6 flex items-center">
|
||||||
|
<div class="flex-shrink-0">
|
||||||
|
<a href="#">
|
||||||
|
<span class="sr-only">Daniela Metz</span>
|
||||||
|
<img class="h-10 w-10 rounded-full" src="https://images.unsplash.com/photo-1487412720507-e7ab37603c6f?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80" alt="">
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="ml-3">
|
||||||
|
<p class="text-sm font-medium text-gray-900">
|
||||||
|
<a href="#" class="hover:underline">
|
||||||
|
Daniela Metz
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<div class="flex space-x-1 text-sm text-gray-500">
|
||||||
|
<time datetime="2020-02-12">
|
||||||
|
Feb 12, 2020
|
||||||
|
</time>
|
||||||
|
<span aria-hidden="true">
|
||||||
|
·
|
||||||
|
</span>
|
||||||
|
<span>
|
||||||
|
11 min read
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
{%- for post in posts -%}
|
{%- for post in posts -%}
|
||||||
<a href="{{ post.url }}">
|
<a href="{{ post.url }}">
|
||||||
|
|
|
||||||
6
content/.obsidian/workspace
vendored
6
content/.obsidian/workspace
vendored
|
|
@ -9,7 +9,7 @@
|
||||||
"state": {
|
"state": {
|
||||||
"type": "markdown",
|
"type": "markdown",
|
||||||
"state": {
|
"state": {
|
||||||
"file": "posts/austin-givecamp-2019.md",
|
"file": "index.md",
|
||||||
"mode": "source",
|
"mode": "source",
|
||||||
"source": false
|
"source": false
|
||||||
}
|
}
|
||||||
|
|
@ -69,7 +69,7 @@
|
||||||
"state": {
|
"state": {
|
||||||
"type": "backlink",
|
"type": "backlink",
|
||||||
"state": {
|
"state": {
|
||||||
"file": "posts/austin-givecamp-2019.md",
|
"file": "index.md",
|
||||||
"collapseAll": false,
|
"collapseAll": false,
|
||||||
"extraContext": false,
|
"extraContext": false,
|
||||||
"sortOrder": "alphabetical",
|
"sortOrder": "alphabetical",
|
||||||
|
|
@ -89,10 +89,10 @@
|
||||||
},
|
},
|
||||||
"active": "a8e90712c1fef449",
|
"active": "a8e90712c1fef449",
|
||||||
"lastOpenFiles": [
|
"lastOpenFiles": [
|
||||||
|
"index.md",
|
||||||
"posts/austin-givecamp-2019.md",
|
"posts/austin-givecamp-2019.md",
|
||||||
"posts/allovue.md",
|
"posts/allovue.md",
|
||||||
"posts/a_modern_terminal_workflow_3.md",
|
"posts/a_modern_terminal_workflow_3.md",
|
||||||
"index.md",
|
|
||||||
"posts/deving_on_linux_is_fun.md",
|
"posts/deving_on_linux_is_fun.md",
|
||||||
"posts/coming-out-again-nb.md",
|
"posts/coming-out-again-nb.md",
|
||||||
"posts/code2college-volunteering.md",
|
"posts/code2college-volunteering.md",
|
||||||
|
|
|
||||||
|
|
@ -3,8 +3,6 @@ eleventyExcludeFromCollections: true
|
||||||
layout: indexlayout
|
layout: indexlayout
|
||||||
title: Gaiety's Life
|
title: Gaiety's Life
|
||||||
---
|
---
|
||||||
|
|
||||||
# Gaiety's Life
|
|
||||||
## (She/Her) Programming, art, design, and other queer things.
|
## (She/Her) Programming, art, design, and other queer things.
|
||||||
|
|
||||||
Web Engineer by day who pretends to be a dog.
|
Web Engineer by day who pretends to be a dog.
|
||||||
|
|
|
||||||
1462
package-lock.json
generated
1462
package-lock.json
generated
File diff suppressed because it is too large
Load diff
13
package.json
13
package.json
|
|
@ -4,8 +4,13 @@
|
||||||
"description": "Gaiety's Blog",
|
"description": "Gaiety's Blog",
|
||||||
"main": "index.js",
|
"main": "index.js",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"build": "eleventy",
|
"build:styles": "tailwindcss -i ./styles/main.css -o ./_site/main.css",
|
||||||
"start": "eleventy --serve"
|
"build:site": "eleventy",
|
||||||
|
"build": "npm run build:site & npm run build:styles",
|
||||||
|
"serve:styles": "npm run build:styles -- --watch",
|
||||||
|
"serve:site": "npm run build:site -- --serve",
|
||||||
|
"serve": "concurrently \"npm run serve:site\" \"npm run serve:styles\"",
|
||||||
|
"start": "npm run serve"
|
||||||
},
|
},
|
||||||
"repository": {
|
"repository": {
|
||||||
"type": "git",
|
"type": "git",
|
||||||
|
|
@ -21,6 +26,8 @@
|
||||||
},
|
},
|
||||||
"homepage": "https://gitlab.com/gaiety/gaiety-life#readme",
|
"homepage": "https://gitlab.com/gaiety/gaiety-life#readme",
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@11ty/eleventy": "^1.0.0"
|
"@11ty/eleventy": "^1.0.0",
|
||||||
|
"concurrently": "^7.0.0",
|
||||||
|
"tailwindcss": "^3.0.12"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
3
styles/main.css
Normal file
3
styles/main.css
Normal file
|
|
@ -0,0 +1,3 @@
|
||||||
|
@tailwind base;
|
||||||
|
@tailwind components;
|
||||||
|
@tailwind utilities;
|
||||||
7
tailwind.config.js
Normal file
7
tailwind.config.js
Normal file
|
|
@ -0,0 +1,7 @@
|
||||||
|
module.exports = {
|
||||||
|
content: ["./_site/**/*.{html,js}"],
|
||||||
|
theme: {
|
||||||
|
extend: {},
|
||||||
|
},
|
||||||
|
plugins: [],
|
||||||
|
}
|
||||||
Loading…
Add table
Reference in a new issue