gaiety/gaiety-life
1
0
Fork 0
Code Activity

Moar tailwinds

Browse source
This commit is contained in:
Ava Gaiety Wroten 2022-01-08 23:34:59 -06:00
parent a757568769
commit 06850a655f
5 changed files with 129 additions and 156 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

128
_includes/indexlayout.njk
View file

@ -20,118 +20,16 @@
</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="relative bg-slate-700 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="absolute inset-0">
<div class="bg-white h-1/3 sm:h-2/3"></div> <div class="bg-slate-900 h-1/5 sm:h-2/5"></div>
</div> </div>
<div class="relative max-w-7xl mx-auto"> <div class="relative max-w-7xl mx-auto">
<div class="text-center"> <div class="prose lg:prose-xl prose-invert m-auto 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>
<div class="mt-12 max-w-lg mx-auto grid gap-5 lg:grid-cols-3 lg:max-w-none"> <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"> {%- for post in posts -%}
<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">
&middot;
</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">
&middot;
</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 flex-col rounded-lg shadow-lg overflow-hidden">
<div class="flex-shrink-0"> <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=""> <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="">
@ -144,9 +42,9 @@
</a> </a>
</p> </p>
<a href="#" class="block mt-2"> <a href="#" class="block mt-2">
<p class="text-xl font-semibold text-gray-900"> <h3 class="text-xl font-semibold text-gray-900">
Improve your customer experience {{ post.data.title }}
</p> </h3>
<p class="mt-3 text-base text-gray-500"> <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. 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> </p>
@ -180,15 +78,9 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
</div>
{%- for post in posts -%}
<a href="{{ post.url }}">
{{ post.data.title }}
</a>
{%- endfor -%} {%- endfor -%}
</div>
</div>
</div>
</body> </body>
</html> </html>

4
content/index.md
View file

@ -3,7 +3,9 @@ eleventyExcludeFromCollections: true
layout: indexlayout layout: indexlayout
title: Gaiety's Life title: Gaiety's Life
--- ---
## (She/Her) Programming, art, design, and other queer things.
# Gaiety's Life
## __(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.
Dog by night who pretends to be a programmer. Dog by night who pretends to be a programmer.

76
package-lock.json generated
View file

@ -10,6 +10,7 @@
"license": "The Unlicense", "license": "The Unlicense",
"devDependencies": { "devDependencies": {
"@11ty/eleventy": "^1.0.0", "@11ty/eleventy": "^1.0.0",
"@tailwindcss/typography": "^0.5.0",
"concurrently": "^7.0.0", "concurrently": "^7.0.0",
"tailwindcss": "^3.0.12" "tailwindcss": "^3.0.12"
} }
@ -212,6 +213,21 @@
"node": ">=8" "node": ">=8"
} }
}, },
"node_modules/@tailwindcss/typography": {
"version": "0.5.0",
"resolved": "https://registry.npmjs.org/@tailwindcss/typography/-/typography-0.5.0.tgz",
"integrity": "sha512-1p/3C6C+JJziS/ghtG8ACYalbA2SyLJY27Pm33cVTlAoY6VQ7zfm2H64cPxUMBkVIlWXTtWHhZcZJPobMRmQAA==",
"dev": true,
"dependencies": {
"lodash.castarray": "^4.4.0",
"lodash.isplainobject": "^4.0.6",
"lodash.merge": "^4.6.2",
"lodash.uniq": "^4.5.0"
},
"peerDependencies": {
"tailwindcss": ">=3.0.0 || >= 3.0.0-alpha.1 || insiders"
}
},
"node_modules/@types/minimatch": { "node_modules/@types/minimatch": {
"version": "3.0.5", "version": "3.0.5",
"resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-3.0.5.tgz", "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-3.0.5.tgz",
@ -2510,6 +2526,12 @@
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==", "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
"dev": true "dev": true
}, },
"node_modules/lodash.castarray": {
"version": "4.4.0",
"resolved": "https://registry.npmjs.org/lodash.castarray/-/lodash.castarray-4.4.0.tgz",
"integrity": "sha1-wCUTUV4wna3dTCTGDP3c9ZdtkRU=",
"dev": true
},
"node_modules/lodash.deburr": { "node_modules/lodash.deburr": {
"version": "4.1.0", "version": "4.1.0",
"resolved": "https://registry.npmjs.org/lodash.deburr/-/lodash.deburr-4.1.0.tgz", "resolved": "https://registry.npmjs.org/lodash.deburr/-/lodash.deburr-4.1.0.tgz",
@ -2522,6 +2544,24 @@
"integrity": "sha1-+4m2WpqAKBgz8LdHizpRBPiY67M=", "integrity": "sha1-+4m2WpqAKBgz8LdHizpRBPiY67M=",
"dev": true "dev": true
}, },
"node_modules/lodash.isplainobject": {
"version": "4.0.6",
"resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
"integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs=",
"dev": true
},
"node_modules/lodash.merge": {
"version": "4.6.2",
"resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
"integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==",
"dev": true
},
"node_modules/lodash.uniq": {
"version": "4.5.0",
"resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz",
"integrity": "sha1-0CJTc662Uq3BvILklFM5qEJ1R3M=",
"dev": true
},
"node_modules/lru-cache": { "node_modules/lru-cache": {
"version": "4.1.5", "version": "4.1.5",
"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.5.tgz", "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.5.tgz",
@ -4755,6 +4795,18 @@
} }
} }
}, },
"@tailwindcss/typography": {
"version": "0.5.0",
"resolved": "https://registry.npmjs.org/@tailwindcss/typography/-/typography-0.5.0.tgz",
"integrity": "sha512-1p/3C6C+JJziS/ghtG8ACYalbA2SyLJY27Pm33cVTlAoY6VQ7zfm2H64cPxUMBkVIlWXTtWHhZcZJPobMRmQAA==",
"dev": true,
"requires": {
"lodash.castarray": "^4.4.0",
"lodash.isplainobject": "^4.0.6",
"lodash.merge": "^4.6.2",
"lodash.uniq": "^4.5.0"
}
},
"@types/minimatch": { "@types/minimatch": {
"version": "3.0.5", "version": "3.0.5",
"resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-3.0.5.tgz", "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-3.0.5.tgz",
@ -6550,6 +6602,12 @@
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==", "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
"dev": true "dev": true
}, },
"lodash.castarray": {
"version": "4.4.0",
"resolved": "https://registry.npmjs.org/lodash.castarray/-/lodash.castarray-4.4.0.tgz",
"integrity": "sha1-wCUTUV4wna3dTCTGDP3c9ZdtkRU=",
"dev": true
},
"lodash.deburr": { "lodash.deburr": {
"version": "4.1.0", "version": "4.1.0",
"resolved": "https://registry.npmjs.org/lodash.deburr/-/lodash.deburr-4.1.0.tgz", "resolved": "https://registry.npmjs.org/lodash.deburr/-/lodash.deburr-4.1.0.tgz",
@ -6562,6 +6620,24 @@
"integrity": "sha1-+4m2WpqAKBgz8LdHizpRBPiY67M=", "integrity": "sha1-+4m2WpqAKBgz8LdHizpRBPiY67M=",
"dev": true "dev": true
}, },
"lodash.isplainobject": {
"version": "4.0.6",
"resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
"integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs=",
"dev": true
},
"lodash.merge": {
"version": "4.6.2",
"resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
"integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==",
"dev": true
},
"lodash.uniq": {
"version": "4.5.0",
"resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz",
"integrity": "sha1-0CJTc662Uq3BvILklFM5qEJ1R3M=",
"dev": true
},
"lru-cache": { "lru-cache": {
"version": "4.1.5", "version": "4.1.5",
"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.5.tgz", "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.5.tgz",

1
package.json
View file

@ -27,6 +27,7 @@
"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",
"@tailwindcss/typography": "^0.5.0",
"concurrently": "^7.0.0", "concurrently": "^7.0.0",
"tailwindcss": "^3.0.12" "tailwindcss": "^3.0.12"
} }

4
tailwind.config.js
View file

@ -3,5 +3,7 @@ module.exports = {
theme: { theme: {
extend: {}, extend: {},
}, },
plugins: [], plugins: [
require('@tailwindcss/typography'),
],
} }