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