Initial commit
This commit is contained in:
Stef Coetzee
commit
83aedce745
15
.gitignore
vendored
Normal file
15
.gitignore
vendored
Normal file
@ -0,0 +1,15 @@
|
|||||||
|
# Jekyll
|
||||||
|
_site/
|
||||||
|
*-cache/
|
||||||
|
.jekyll-metadata
|
||||||
|
|
||||||
|
# Ruby
|
||||||
|
.bundle/
|
||||||
|
.byebug_history
|
||||||
|
.ruby-gemset
|
||||||
|
.ruby-version
|
||||||
|
*.gem
|
||||||
|
Gemfile.lock
|
||||||
|
|
||||||
|
# JavaScript
|
||||||
|
node_modules
|
||||||
8
Gemfile
Normal file
8
Gemfile
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
source "https://rubygems.org"
|
||||||
|
|
||||||
|
gem "jekyll", "~> 4"
|
||||||
|
gem "webrick", "~> 1.7"
|
||||||
|
|
||||||
|
group :jekyll_plugins do
|
||||||
|
gem "jekyll-postcss"
|
||||||
|
end
|
||||||
43
README.md
Normal file
43
README.md
Normal file
@ -0,0 +1,43 @@
|
|||||||
|
# Jekyll with Tailwind CSS
|
||||||
|
|
||||||
|
You want to run `jekyll new your-site --blank` and add
|
||||||
|
[Tailwind CSS](tailwindcss.com), right?
|
||||||
|
Don’t.
|
||||||
|
Fork this repo instead.
|
||||||
|
|
||||||
|
## Getting Started
|
||||||
|
|
||||||
|
```bash
|
||||||
|
git clone git@github.com:stefcoetzee/jekyll-tailwind your-site
|
||||||
|
cd your-site
|
||||||
|
bin/setup
|
||||||
|
```
|
||||||
|
|
||||||
|
## Usage
|
||||||
|
|
||||||
|
### Development
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Build for development.
|
||||||
|
bin/build-dev
|
||||||
|
|
||||||
|
# Start a server at http://localhost:4000.
|
||||||
|
bin/start
|
||||||
|
```
|
||||||
|
|
||||||
|
### Production
|
||||||
|
|
||||||
|
Delete `.site` and it’s contents to see the production build output.
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Build for production.
|
||||||
|
bin/build-prod
|
||||||
|
```
|
||||||
|
|
||||||
|
## Credit
|
||||||
|
|
||||||
|
Thanks to [@joemasilotti](https://github.com/joemasilotti) for sharing his build
|
||||||
|
scripts [here](https://github.com/joemasilotti/masilotti.com/tree/main/bin).
|
||||||
|
Thanks to [@shafy](https://github.com/shafy) for sharing the two config-file approach [here](https://canolcer.com/post/jekyll-and-tailwind/).
|
||||||
|
|
||||||
|
Say hi [@stef_coetzee](https://twitter.com/stef_Coetze)!
|
||||||
20
_config.yml
Normal file
20
_config.yml
Normal file
@ -0,0 +1,20 @@
|
|||||||
|
url: "" # the base hostname & protocol for your site, e.g. http://example.com
|
||||||
|
baseurl: "" # the subpath of your site, e.g. /blog
|
||||||
|
title: "Jekyll with a Tailwind" # the name of your site, e.g. ACME Corp.
|
||||||
|
|
||||||
|
plugins:
|
||||||
|
- jekyll-postcss
|
||||||
|
|
||||||
|
exclude:
|
||||||
|
- .gitignore
|
||||||
|
- bin
|
||||||
|
- node_modules
|
||||||
|
- package-lock.json
|
||||||
|
- postcss.config.js
|
||||||
|
- README.md
|
||||||
|
- assets/css/tailwind.scss
|
||||||
|
|
||||||
|
# files Jekyll should not delete from .site
|
||||||
|
keep_files:
|
||||||
|
- assets/css/tailwind.css
|
||||||
|
- assets/css/tailwind.css.map
|
||||||
2
_config_tailwind.yml
Normal file
2
_config_tailwind.yml
Normal file
@ -0,0 +1,2 @@
|
|||||||
|
include:
|
||||||
|
- assets/css/tailwind.scss
|
||||||
13
_layouts/default.html
Normal file
13
_layouts/default.html
Normal file
@ -0,0 +1,13 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="{{ site.lang | default: "en-US" }}">
|
||||||
|
<head>
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>{{ page.title }} - {{ site.title }}</title>
|
||||||
|
<link rel="stylesheet" href="{{ "/assets/css/tailwind.css" | relative_url }}">
|
||||||
|
<link rel="stylesheet" href="{{ "/assets/css/main.css" | relative_url }}">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
{{ content }}
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
9
_sass/main.scss
Normal file
9
_sass/main.scss
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
$backgroundColor: #ffffff;
|
||||||
|
$bodyColor: #000000;
|
||||||
|
$bodyFont: -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
|
||||||
|
|
||||||
|
body {
|
||||||
|
background: $backgroundColor;
|
||||||
|
color: $bodyColor;
|
||||||
|
font-family: $bodyFont;
|
||||||
|
}
|
||||||
2
assets/css/main.scss
Normal file
2
assets/css/main.scss
Normal file
@ -0,0 +1,2 @@
|
|||||||
|
---
|
||||||
|
---
|
||||||
6
assets/css/tailwind.scss
Normal file
6
assets/css/tailwind.scss
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
---
|
||||||
|
---
|
||||||
|
|
||||||
|
@import "tailwindcss/base";
|
||||||
|
@import "tailwindcss/components";
|
||||||
|
@import "tailwindcss/utilities";
|
||||||
3
bin/build-dev
Executable file
3
bin/build-dev
Executable file
@ -0,0 +1,3 @@
|
|||||||
|
#!/bin/sh
|
||||||
|
|
||||||
|
bundle exec jekyll build --profile --config _config.yml,_config_tailwind.yml
|
||||||
3
bin/build-prod
Executable file
3
bin/build-prod
Executable file
@ -0,0 +1,3 @@
|
|||||||
|
#!/bin/sh
|
||||||
|
|
||||||
|
JEKYLL_ENV=production bundle exec jekyll build --profile --config _config.yml,_config_tailwind.yml
|
||||||
9
bin/setup
Executable file
9
bin/setup
Executable file
@ -0,0 +1,9 @@
|
|||||||
|
#! /usr/bin/env bash
|
||||||
|
|
||||||
|
set -e
|
||||||
|
|
||||||
|
echo "==> Running \`bundle install\`"
|
||||||
|
bundle install
|
||||||
|
|
||||||
|
echo "==> Running \`npm install\`"
|
||||||
|
npm install
|
||||||
3
bin/start
Executable file
3
bin/start
Executable file
@ -0,0 +1,3 @@
|
|||||||
|
#!/bin/sh
|
||||||
|
|
||||||
|
bundle exec jekyll serve --livereload
|
||||||
23
index.html
Normal file
23
index.html
Normal file
@ -0,0 +1,23 @@
|
|||||||
|
---
|
||||||
|
layout: default
|
||||||
|
title: "It's alive!"
|
||||||
|
---
|
||||||
|
|
||||||
|
<div class="h-screen flex items-center justify-center">
|
||||||
|
<div class="w-1/3 text-gray-700">
|
||||||
|
<div class="flex justify-start">
|
||||||
|
<div class="text-5xl pr-2 font-bold font-serif">
|
||||||
|
‘‘
|
||||||
|
</div>
|
||||||
|
<div class="text-4xl font-medium">
|
||||||
|
What gets us into trouble is not what we don't know.
|
||||||
|
It's what we know for sure that just ain't so.
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="flex justify-end">
|
||||||
|
<span class="text-3xl font-serif italic">
|
||||||
|
— Mark Twain
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
4152
package-lock.json
generated
Normal file
4152
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
12
package.json
Normal file
12
package.json
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
{
|
||||||
|
"dependencies": {
|
||||||
|
"autoprefixer": "^10.3.1",
|
||||||
|
"postcss": "^8.3.5",
|
||||||
|
"postcss-import": "^14.0.2",
|
||||||
|
"postcss-scss": "^4.0.0"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"cssnano": "^5.0.6",
|
||||||
|
"tailwindcss": "^2.2.4"
|
||||||
|
}
|
||||||
|
}
|
||||||
11
postcss.config.js
Normal file
11
postcss.config.js
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
module.exports = {
|
||||||
|
parser: 'postcss-scss',
|
||||||
|
plugins: [
|
||||||
|
require('postcss-import'),
|
||||||
|
require('tailwindcss'),
|
||||||
|
require("autoprefixer"), // example of plugin you might use
|
||||||
|
...(process.env.JEKYLL_ENV == "production" // example of only using a plugin in production
|
||||||
|
? [require("cssnano")({ preset: "default" })]
|
||||||
|
: [])
|
||||||
|
]
|
||||||
|
};
|
||||||
17
tailwind.config.js
Normal file
17
tailwind.config.js
Normal file
@ -0,0 +1,17 @@
|
|||||||
|
module.exports = {
|
||||||
|
purge: {
|
||||||
|
enabled: process.env.JEKYLL_ENV == "production",
|
||||||
|
content:[
|
||||||
|
'./_includes/**/*.html',
|
||||||
|
'./_layouts/**/*.html',
|
||||||
|
'./_posts/*.md',
|
||||||
|
'./*.html',
|
||||||
|
],
|
||||||
|
},
|
||||||
|
darkMode: false,
|
||||||
|
theme: {
|
||||||
|
extend: {}
|
||||||
|
},
|
||||||
|
variants: {},
|
||||||
|
plugins: [],
|
||||||
|
}
|
||||||
Loading…
x
Reference in New Issue
Block a user