├── .all-contributorsrc ├── .babelrc ├── .github └── dependabot.yml ├── .gitignore ├── .nvmrc ├── .ruby-version ├── Gemfile ├── Gemfile.lock ├── LICENSE.md ├── README.md ├── _config.yml ├── _includes ├── footer.html └── header.html ├── _layouts └── default.html ├── gulpfile.babel.js ├── index.html ├── netlify.toml ├── package-lock.json ├── package.json ├── src └── style.css └── tailwind.config.js /.all-contributorsrc: -------------------------------------------------------------------------------- 1 | { 2 | "files": [ 3 | "README.md" 4 | ], 5 | "imageSize": 100, 6 | "commit": false, 7 | "contributors": [ 8 | { 9 | "login": "phproberto", 10 | "name": "Roberto Segura", 11 | "avatar_url": "https://avatars0.githubusercontent.com/u/1119272?v=4", 12 | "profile": "http://phproberto.com", 13 | "contributions": [ 14 | "code" 15 | ] 16 | }, 17 | { 18 | "login": "benmp", 19 | "name": "benmp", 20 | "avatar_url": "https://avatars3.githubusercontent.com/u/9081154?v=4", 21 | "profile": "https://github.com/benmp", 22 | "contributions": [ 23 | "code" 24 | ] 25 | }, 26 | { 27 | "login": "jd4no", 28 | "name": "Joey Defourneaux", 29 | "avatar_url": "https://avatars0.githubusercontent.com/u/15043675?v=4", 30 | "profile": "https://github.com/jd4no", 31 | "contributions": [ 32 | "code" 33 | ] 34 | }, 35 | { 36 | "login": "shime", 37 | "name": "Hrvoje Šimić", 38 | "avatar_url": "https://avatars3.githubusercontent.com/u/703563?v=4", 39 | "profile": "https://shime.sh", 40 | "contributions": [ 41 | "code" 42 | ] 43 | }, 44 | { 45 | "login": "alexphi", 46 | "name": "Alejandro Figueroa", 47 | "avatar_url": "https://avatars2.githubusercontent.com/u/7116453?v=4", 48 | "profile": "https://alejof.dev", 49 | "contributions": [ 50 | "code" 51 | ] 52 | } 53 | ], 54 | "contributorsPerLine": 7, 55 | "projectName": "jekyll-starter-tailwind", 56 | "projectOwner": "taylorbryant", 57 | "repoType": "github", 58 | "repoHost": "https://github.com", 59 | "skipCi": true 60 | } 61 | -------------------------------------------------------------------------------- /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["env"] 3 | } 4 | -------------------------------------------------------------------------------- /.github/dependabot.yml: -------------------------------------------------------------------------------- 1 | version: 2 2 | updates: 3 | - package-ecosystem: npm 4 | directory: "/" 5 | schedule: 6 | interval: daily 7 | time: "11:00" 8 | open-pull-requests-limit: 99 9 | ignore: 10 | - dependency-name: tailwindcss 11 | versions: 12 | - 2.1.1 13 | - 2.1.2 14 | - dependency-name: postcss 15 | versions: 16 | - 8.2.10 17 | - 8.2.12 18 | - 8.2.6 19 | - 8.2.8 20 | - 8.2.9 21 | - dependency-name: cssnano 22 | versions: 23 | - 4.1.11 24 | - 5.0.0 25 | - 5.0.1 26 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | _site 2 | .DS_Store 3 | .jekyll-cache 4 | .jekyll-metadata 5 | assets/css 6 | node_modules 7 | .bundle/ 8 | vendor/ 9 | -------------------------------------------------------------------------------- /.nvmrc: -------------------------------------------------------------------------------- 1 | 12 -------------------------------------------------------------------------------- /.ruby-version: -------------------------------------------------------------------------------- 1 | 2.7.0 2 | -------------------------------------------------------------------------------- /Gemfile: -------------------------------------------------------------------------------- 1 | source 'https://rubygems.org' 2 | gem 'jekyll' -------------------------------------------------------------------------------- /Gemfile.lock: -------------------------------------------------------------------------------- 1 | GEM 2 | remote: https://rubygems.org/ 3 | specs: 4 | addressable (2.8.0) 5 | public_suffix (>= 2.0.2, < 5.0) 6 | colorator (1.1.0) 7 | concurrent-ruby (1.1.9) 8 | em-websocket (0.5.2) 9 | eventmachine (>= 0.12.9) 10 | http_parser.rb (~> 0.6.0) 11 | eventmachine (1.2.7) 12 | ffi (1.15.4) 13 | forwardable-extended (2.6.0) 14 | http_parser.rb (0.6.0) 15 | i18n (1.8.10) 16 | concurrent-ruby (~> 1.0) 17 | jekyll (4.2.0) 18 | addressable (~> 2.4) 19 | colorator (~> 1.0) 20 | em-websocket (~> 0.5) 21 | i18n (~> 1.0) 22 | jekyll-sass-converter (~> 2.0) 23 | jekyll-watch (~> 2.0) 24 | kramdown (~> 2.3) 25 | kramdown-parser-gfm (~> 1.0) 26 | liquid (~> 4.0) 27 | mercenary (~> 0.4.0) 28 | pathutil (~> 0.9) 29 | rouge (~> 3.0) 30 | safe_yaml (~> 1.0) 31 | terminal-table (~> 2.0) 32 | jekyll-sass-converter (2.1.0) 33 | sassc (> 2.0.1, < 3.0) 34 | jekyll-watch (2.2.1) 35 | listen (~> 3.0) 36 | kramdown (2.3.1) 37 | rexml 38 | kramdown-parser-gfm (1.1.0) 39 | kramdown (~> 2.0) 40 | liquid (4.0.3) 41 | listen (3.7.0) 42 | rb-fsevent (~> 0.10, >= 0.10.3) 43 | rb-inotify (~> 0.9, >= 0.9.10) 44 | mercenary (0.4.0) 45 | pathutil (0.16.2) 46 | forwardable-extended (~> 2.6) 47 | public_suffix (4.0.6) 48 | rb-fsevent (0.11.0) 49 | rb-inotify (0.10.1) 50 | ffi (~> 1.0) 51 | rexml (3.2.5) 52 | rouge (3.26.0) 53 | safe_yaml (1.0.5) 54 | sassc (2.4.0) 55 | ffi (~> 1.9) 56 | terminal-table (2.0.0) 57 | unicode-display_width (~> 1.1, >= 1.1.1) 58 | unicode-display_width (1.7.0) 59 | 60 | PLATFORMS 61 | ruby 62 | 63 | DEPENDENCIES 64 | jekyll 65 | 66 | BUNDLED WITH 67 | 2.1.2 68 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | Copyright (c) 2018 Taylor Bryant 2 | 3 | Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: 4 | 5 | The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. 6 | 7 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. 8 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Jekyll Starter Tailwind 2 | [![All Contributors](https://img.shields.io/badge/all_contributors-4-orange.svg?style=flat-square)](#contributors) 3 | 4 | A starter kit for using [Tailwind](https://tailwindcss.com) with [Jekyll](https://jekyllrb.com/) that includes: 5 | * A barebones Jekyll starter theme 6 | * A Gulpfile that does the following: 7 | 8 | * Compiles Tailwind 9 | * Strips out unused CSS using Tailwind's `purge` option 10 | * Runs [Autoprefixer](https://github.com/postcss/autoprefixer) 11 | * Minifies your CSS 12 | * Compiles Jekyll 13 | * Runs [Browsersync](https://www.browsersync.io/) for local development 14 | 15 | ## What is Tailwind? 16 | >"Tailwind is a utility-first CSS framework for rapidly building custom user interfaces." 17 | –[Tailwind](https://tailwindcss.com) 18 | 19 | ## What is Jekyll? 20 | >"Jekyll is a simple, blog-aware, static site generator perfect for personal, project, or organization sites. Think of it like a file-based CMS, without all the complexity. Jekyll takes your content, renders Markdown and Liquid templates, and spits out a complete, static website ready to be served by Apache, Nginx or another web server. Jekyll is the engine behind GitHub Pages, which you can use to host sites right from your GitHub repositories." 21 | –[Jekyll](https://jekyllrb.com/) 22 | 23 | ## Requirements 24 | * [Bundler](http://bundler.io/) 25 | * [Jekyll](https://jekyllrb.com/) 26 | * [Node.js](https://nodejs.org/en/) 27 | * [npm](https://www.npmjs.com/) 28 | * [Ruby](https://www.ruby-lang.org/en/) 29 | 30 | ## Get started 31 | * `bundle install` to install Ruby gems 32 | * `npm ci` to install npm packages listed in `package-lock.json` 33 | * `npm run start` or `npm run dev` to compile the site with development settings and run BrowserSync 34 | 35 | ## Build your site 36 | * `npm run build:dev` to compile the site with development settings 37 | * `npm run build:production` or `npm run build` to compile the site for production 38 | 39 | 40 | ## Deploy 41 | [![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/taylorbryant/jekyll-starter-tailwind) 42 | 43 | Note: By default, Netlify uses `jekyll build` as the build command. The included `netlify.toml` file will override it to use `npm run build`. 44 | 45 | ## License 46 | [MIT](https://github.com/taylorbryant/jekyll-starter-tailwind/blob/master/LICENSE.md) 47 | 48 | ## How you can help 49 | Enjoying Jekyll Starter Tailwind and want to help? You can: 50 | * [Create an issue](https://github.com/taylorbryant/jekyll-starter-tailwind/issues/new) with some constructive criticism 51 | * [Submit a pull request](https://github.com/taylorbryant/jekyll-starter-tailwind/compare) with some improvements to the project 52 | 53 | ## Contributors 54 | 55 | Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 |

Roberto Segura
💻
benmp
💻
Joey Defourneaux
💻
Hrvoje Šimić
💻
Alejandro Figueroa
💻
69 | 70 | 71 | 72 | 73 | 74 | This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome! 75 | -------------------------------------------------------------------------------- /_config.yml: -------------------------------------------------------------------------------- 1 | title: Tailwind Jekyll Starter Kit 2 | description: A starter kit for using Tailwind with Jekyll 3 | 4 | exclude: 5 | - Gemfile 6 | - Gemfile.lock 7 | - gulpfile.babel.js 8 | - LICENSE.md 9 | - node_modules 10 | - package.json 11 | - package-lock.json 12 | - README.md 13 | - src 14 | - tailwind.config.js 15 | - netlify.toml 16 | -------------------------------------------------------------------------------- /_includes/footer.html: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /_includes/header.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Tailwind Jekyll Starter Kit 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /_layouts/default.html: -------------------------------------------------------------------------------- 1 | --- 2 | --- 3 | 4 | {% include header.html %} 5 | 6 |
9 | {{ content }} 10 |
11 | 12 | {% include footer.html %} 13 | -------------------------------------------------------------------------------- /gulpfile.babel.js: -------------------------------------------------------------------------------- 1 | import autoprefixer from "autoprefixer"; 2 | import browserSync from "browser-sync"; 3 | import spawn from "cross-spawn"; 4 | import cssnano from "cssnano"; 5 | import { dest, series, src, task, watch } from "gulp"; 6 | import postcss from "gulp-postcss"; 7 | import atimport from "postcss-import"; 8 | import tailwindcss from "tailwindcss"; 9 | 10 | const SITE_ROOT = "./_site"; 11 | const POST_BUILD_STYLESHEET = `${SITE_ROOT}/assets/css/`; 12 | const PRE_BUILD_STYLESHEET = "./src/style.css"; 13 | const TAILWIND_CONFIG = "./tailwind.config.js"; 14 | 15 | // Fix for Windows compatibility 16 | const jekyll = process.platform === "win32" ? "jekyll.bat" : "jekyll"; 17 | 18 | const isDevelopmentBuild = process.env.NODE_ENV === "development"; 19 | 20 | task("buildJekyll", () => { 21 | browserSync.notify("Building Jekyll site..."); 22 | 23 | const args = ["exec", jekyll, "build"]; 24 | 25 | if (isDevelopmentBuild) { 26 | args.push("--incremental"); 27 | } 28 | 29 | return spawn("bundle", args, { stdio: "inherit" }); 30 | }); 31 | 32 | task("processStyles", () => { 33 | browserSync.notify("Compiling styles..."); 34 | 35 | return src(PRE_BUILD_STYLESHEET) 36 | .pipe( 37 | postcss([ 38 | atimport(), 39 | tailwindcss(TAILWIND_CONFIG), 40 | ...(isDevelopmentBuild ? [] : [autoprefixer(), cssnano()]), 41 | ]) 42 | ) 43 | .pipe(dest(POST_BUILD_STYLESHEET)); 44 | }); 45 | 46 | task("startServer", () => { 47 | browserSync.init({ 48 | files: [SITE_ROOT + "/**"], 49 | open: "local", 50 | port: 4000, 51 | server: { 52 | baseDir: SITE_ROOT, 53 | serveStaticOptions: { 54 | extensions: ["html"], 55 | }, 56 | }, 57 | }); 58 | 59 | watch( 60 | [ 61 | "**/*.css", 62 | "**/*.html", 63 | "**/*.js", 64 | "**/*.md", 65 | "**/*.markdown", 66 | "!_site/**/*", 67 | "!node_modules/**/*", 68 | ], 69 | { interval: 500 }, 70 | buildSite 71 | ); 72 | }); 73 | 74 | const buildSite = series("buildJekyll", "processStyles"); 75 | 76 | exports.serve = series(buildSite, "startServer"); 77 | exports.default = series(buildSite); 78 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: default 3 | --- 4 | 5 |

Jekyll Starter Tailwind

6 | -------------------------------------------------------------------------------- /netlify.toml: -------------------------------------------------------------------------------- 1 | [build] 2 | command = "npm run build" 3 | publish = "_site/" 4 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "jekyll-starter-tailwind", 3 | "version": "6.0.0", 4 | "description": "A starter kit for using Tailwind with Jekyll", 5 | "main": "gulpfile.babel.js", 6 | "devDependencies": { 7 | "autoprefixer": "10.3.4", 8 | "babel-preset-env": "1.7.0", 9 | "babel-register": "6.26.0", 10 | "browser-sync": "2.27.4", 11 | "browsersync": "0.0.1-security", 12 | "cross-env": "7.0.3", 13 | "cross-spawn": "7.0.3", 14 | "cssnano": "5.0.8", 15 | "gulp": "4.0.2", 16 | "gulp-postcss": "9.0.1", 17 | "postcss": "8.3.6", 18 | "postcss-import": "14.0.2", 19 | "tailwindcss": "2.2.15" 20 | }, 21 | "scripts": { 22 | "build:production": "cross-env NODE_ENV=production gulp", 23 | "build:dev": "cross-env NODE_ENV=development gulp", 24 | "build": "npm run build:production", 25 | "dev": "cross-env NODE_ENV=development gulp serve", 26 | "start": "npm run dev" 27 | }, 28 | "repository": { 29 | "type": "git", 30 | "url": "https://github.com/taylorbryant/jekyll-starter-tailwind.git" 31 | }, 32 | "author": "Taylor Bryant", 33 | "license": "MIT", 34 | "bugs": { 35 | "url": "https://github.com/taylorbryant/jekyll-starter-tailwind/issues" 36 | }, 37 | "publishConfig": { 38 | "access": "public" 39 | } 40 | } -------------------------------------------------------------------------------- /src/style.css: -------------------------------------------------------------------------------- 1 | @tailwind base; 2 | @tailwind components; 3 | @tailwind utilities; 4 | -------------------------------------------------------------------------------- /tailwind.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | purge: [`_site/**/*.html`], 3 | theme: { 4 | extend: {}, 5 | }, 6 | variants: {}, 7 | plugins: [], 8 | }; 9 | --------------------------------------------------------------------------------