From 5141223f5eb48dcfd9d295b16aa1414c935779b1 Mon Sep 17 00:00:00 2001 From: Dan Matthew <111794+danielmatthew@users.noreply.github.com> Date: Wed, 16 Feb 2022 16:34:56 +0000 Subject: [PATCH 01/18] docs: remove link from find module --- docs/otis/find-module/index.html | 8 ++++---- src/docs/otis/find-module.njk | 8 ++++---- 2 files changed, 8 insertions(+), 8 deletions(-) diff --git a/docs/otis/find-module/index.html b/docs/otis/find-module/index.html index 893cad4..ea2fb81 100644 --- a/docs/otis/find-module/index.html +++ b/docs/otis/find-module/index.html @@ -214,23 +214,23 @@

- Astronomy or Astrology + Astronomy or Astrology 02 Mar 2021 02 Sep 2021 - + - The Impact of Digitalization on Literteracy - Digital Immigrants vs Digital Natives + The Impact of Digitalization on Literacy - Digital Immigrants vs Digital Natives 02 Mar 2021 02 Sep 2021 - + diff --git a/src/docs/otis/find-module.njk b/src/docs/otis/find-module.njk index e1cc3af..d077965 100644 --- a/src/docs/otis/find-module.njk +++ b/src/docs/otis/find-module.njk @@ -46,23 +46,23 @@ - Astronomy or Astrology + Astronomy or Astrology 02 Mar 2021 02 Sep 2021 - + - The Impact of Digitalization on Literteracy - Digital Immigrants vs Digital Natives + The Impact of Digitalization on Literacy - Digital Immigrants vs Digital Natives 02 Mar 2021 02 Sep 2021 - + From 3faea51c576a14b82c2ffcf6599975531295cf20 Mon Sep 17 00:00:00 2001 From: Dan Matthew <111794+danielmatthew@users.noreply.github.com> Date: Mon, 28 Feb 2022 09:58:09 +0000 Subject: [PATCH 02/18] docs: update readme --- README.md | 56 ++++++++++++++++++++++++++++++++++++++++++++++++++----- 1 file changed, 51 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index d91add1..6bd23ab 100644 --- a/README.md +++ b/README.md @@ -1,11 +1,57 @@ # Bootstrap v5 Theme ## Usage -1. Create a [Personal Access Token](https://github.com/settings/tokens/) granting the `write:packages` scope. `write` also allows `read`… +1. Create a [Personal Access Token](https://github.com/settings/tokens/) granting the `write:packages` scope. `write` also allows `read`… 2. Add `@talis:registry=https://npm.pkg.github.com` to your project's `.npmrc` file. -3. Two options: - - **Either** import `talis.scss` which includes Bootstrap customisations _and_ Bootstrap v5; - - **Or** include the Talis variables ahead of Bootstrap, and the Talis components afterwards. - +3. Place variable overrides first, then import the styles you need. Some Bootstrap partials stylesheets are required no matter what. + +```scss +// Toggle global options +$enable-gradients: false; +$enable-shadows: false; + +// Customize some defaults +@import "bootstrap/scss/functions"; // Required + +@import "variables"; // Talis customisations are here + +@import "bootstrap/scss/variables"; // Required +@import "bootstrap/scss/mixins"; // Required +@import "bootstrap/scss/utilities"; // Required + +@import "bootstrap/scss/root"; // Required +@import "bootstrap/scss/reboot"; // Required +@import "bootstrap/scss/type"; +@import "bootstrap/scss/images"; + +// Core Bootstrap components +@import "bootstrap/scss/containers"; +@import "bootstrap/scss/grid"; +@import "bootstrap/scss/tables"; +@import "bootstrap/scss/forms"; +@import "bootstrap/scss/buttons"; +@import "bootstrap/scss/transitions"; +@import "bootstrap/scss/dropdown"; +@import "bootstrap/scss/button-group"; +@import "bootstrap/scss/nav"; +@import "bootstrap/scss/navbar"; +@import "bootstrap/scss/accordion"; +@import "bootstrap/scss/breadcrumb"; +@import "bootstrap/scss/pagination"; +@import "bootstrap/scss/badge"; +@import "bootstrap/scss/alert"; +@import "bootstrap/scss/progress"; +@import "bootstrap/scss/close"; +@import "bootstrap/scss/toasts"; +@import "bootstrap/scss/modal"; + +// Helpers +@import "bootstrap/scss/helpers"; + +// Utilities +@import "bootstrap/scss/utilities/api"; + +@import 'theme'; +``` ## Contributing From 4737c3f85d126522da30508f96915eb47ce1ead9 Mon Sep 17 00:00:00 2001 From: Dan Matthew <111794+danielmatthew@users.noreply.github.com> Date: Mon, 28 Feb 2022 10:15:58 +0000 Subject: [PATCH 03/18] docs: update readme --- README.md | 36 +++--------------------------------- 1 file changed, 3 insertions(+), 33 deletions(-) diff --git a/README.md b/README.md index 6bd23ab..efc7100 100644 --- a/README.md +++ b/README.md @@ -65,26 +65,15 @@ cd $DEVELOPMENT_WORK_DIR/bootstrap-theme # Install dependencies npm i -# Compile Sass -npm run css-compile - -# Watch Sass for changes (uses nodemon) -npm run watch - -# Start local server (uses sirv-cli) -npm run server - -# Watches Sass for changes and starts a local server +# Compiles Sass, builds the Eleventy-powered docs, watches both for changes npm start ``` -For the most straightforward development, open two Terminal tabs to execute `npm run server` and `npm run watch` at the same time. - -Open to see the page in action. +Open to see the page in action. ## Scripts -The following npm scripts are available to you in this starter repo. With the exception of `npm start` and `npm test`, the remaining scripts can be run from your command line with `npm run scriptName`. +The following npm scripts are available. With the exception of `npm start` and `npm test`, the remaining scripts can be run from your command line with `npm run scriptName`. | Script | Description | | --- | --- | @@ -102,25 +91,6 @@ The following npm scripts are available to you in this starter repo. With the ex Before you start to use tools that remove Bootstrap styling like [PurgeCSS](#purgecss), you can make some broad optimizations by only including the stylesheets you think you'll need. -### Optimizing JS - -Similar to optimizing CSS, Bootstrap publishes individual scripts for each of their plugins. This allows you to import only what you need, versus the entire bundle and dependencies. For example, if you don't plan on using dropdowns, tooltips, or popovers, you can safely omit the Popper.js depdendency. - -Add more options here, or import the entire `bootstrap-bundle.min.js` file, to get all JavaScript plugins and Popper.js. - -### PurgeCSS - -[PurgeCSS](https://purgecss.com/) is a [PostCSS](https://postcss.org) plugin that removes unused CSS based on your site's HTML. It finds rulesets that are unused by your HTML and removes them, ensuring only what's needed is sent to your site's visitors while improving file size and performance. - -A single npm script runs PurgeCSS against the `index.html` file to remove unused styles from `assets/css/starter.css`. - -To purge CSS, run `npm run css-purge` from the command line. This executes the following: - -```shell -npm purgecss --css assets/css/starter.css --content index.html --output assets/css/ -``` - -PurgeCSS is a PostCSS plugin and [can be configured](https://purgecss.com/configuration.html) to your exact needs with a little extra effort, including additional [command line options](https://purgecss.com/CLI.html). ### Stylelint From 10b92f1499cc568b44474e06a28098804bb6fba2 Mon Sep 17 00:00:00 2001 From: Dan Matthew <111794+danielmatthew@users.noreply.github.com> Date: Mon, 28 Feb 2022 10:22:29 +0000 Subject: [PATCH 04/18] docs: update page-header example --- docs/index.html | 2 +- src/docs/_includes/page-header.njk | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/index.html b/docs/index.html index d53a261..be9446b 100644 --- a/docs/index.html +++ b/docs/index.html @@ -178,7 +178,7 @@