@brixtol/bootstrap - npm Package Compare versions

Comparing version 1.4.3 to 1.5.0

package.json

 {
   "name": "@brixtol/bootstrap",
-  "version": "1.4.3",
+  "version": "1.5.0",
   "private": false,
@@ -26,2 +26,8 @@ "description": "Webshop strap for Brixtol Textiles.",
   "files": [
+    "_readme.md",
+    "_base.scss",
+    "_components.scss",
+    "_forms.scss",
+    "_variables.scss",
+    "_variation.scss",
     "index.scss",
@@ -32,2 +38,39 @@ "sass/**/*.scss"
   "prettier": "@brixtol/prettier-config",
+  "stylelint": {
+    "extends": "@brixtol/stylelint-config",
+    "ignoreFiles": [
+      "sass/bootstrap/**",
+      "demo/style.scss"
+    ],
+    "rules": {
+      "scss/dollar-variable-empty-line-before": null,
+      "indentation": 2,
+      "block-no-empty": null,
+      "color-no-invalid-hex": true,
+      "comment-empty-line-before": [
+        "always",
+        {
+          "ignore": [
+            "stylelint-commands",
+            "after-comment"
+          ]
+        }
+      ],
+      "no-descending-specificity": null,
+      "declaration-colon-space-after": "always",
+      "max-empty-lines": 2,
+      "block-opening-brace-newline-after": "always-multi-line",
+      "rule-empty-line-before": [
+        "always",
+        {
+          "except": [
+            "first-nested"
+          ],
+          "ignore": [
+            "after-comment"
+          ]
+        }
+      ]
+    }
+  },
   "eslintConfig": {
@@ -42,3 +85,3 @@ "ignorePatterns": [
     "entry": [
-      "./site/bundle.ts"
+      "./demo/bundle.ts"
     ],
@@ -53,24 +96,22 @@ "outDir": "docs",
   "devDependencies": {
-    "@11ty/eleventy": "^1.0.2",
+    "@11ty/eleventy": "^2.0.1",
     "@11ty/eleventy-navigation": "^0.3.5",
-    "@11ty/eleventy-plugin-syntaxhighlight": "^4.1.0",
+    "@11ty/eleventy-plugin-syntaxhighlight": "^5.0.0",
     "@brixtol/browserslist-config": "^1.1.0",
     "@brixtol/eslint-config": "^1.2.4",
     "@brixtol/prettier-config": "^1.2.0",
-    "@panoply/11ty": "^0.1.0",
-    "autoprefixer": "^10.4.13",
-    "concurrently": "^7.5.0",
-    "cssnano": "^5.1.14",
-    "postcss": "^8.4.18",
-    "postcss-cli": "^10.0.0",
-    "sass": "^1.55.0",
+    "@panoply/11ty": "^0.2.0",
+    "autoprefixer": "^10.4.14",
+    "concurrently": "^8.1.0",
+    "cssnano": "^6.0.1",
+    "postcss": "^8.4.24",
+    "postcss-cli": "^10.1.0",
+    "sass": "^1.63.0",
     "stickybits": "^3.7.11",
-    "stylelint": "^14.14.0",
-    "stylelint-config-rational-order": "^0.1.2",
-    "stylelint-config-standard-scss": "^6.0.0",
-    "stylelint-scss": "^4.3.0",
-    "tsup": "^6.3.0"
+    "stimulus": "^3.2.1",
+    "tsup": "^6.7.0",
+    "@brixtol/stylelint-config": "^1.0.0"
   },
   "optionalDependencies": {
-    "@hotwired/stimulus": "^3.1.0",
+    "@hotwired/stimulus": "^3.2.1",
     "fontfaceobserver": "^2.3.0",
@@ -83,4 +124,4 @@ "lazysizes": "^5.3.2",
     "build": "rm -rf docs && pnpm run 11ty:build && pnpm run sass:build && postcss docs/bootstrap.css -r --no-map && tsup --minify",
-    "sass:wdocs": "sass site/style.scss docs/style.css --no-source-map --watch",
-    "sass:bdocs": "sass site/style.scss docs/style.css --no-source-map",
+    "sass:wdocs": "sass demo/style.scss docs/style.css --no-source-map --watch",
+    "sass:bdocs": "sass demo/style.scss docs/style.css --no-source-map",
     "sass:build": "sass --load-path=node_modules/bootstrap/scss/ index.scss docs/bootstrap.css --no-source-map",
@@ -87,0 +128,0 @@ "sass:watch": "sass --load-path=node_modules/bootstrap/scss/ index.scss docs/bootstrap.css --no-source-map --watch",

readme.md

@@ -1,7 +0,9 @@
-# @brixtol/strap
+# @brixtol/bootstrap
 
-Stripped down and customized [Bootstrap v5.2](https://getbootstrap.com/) variation with a refined set of styles and components. This module is used under the hood in our [webshop](https://brixtoltextiles.com).
+Stripped down and customized [Bootstrap v5](https://getbootstrap.com/) variation with a refined set of styles and components. This module is used under the hood in our [webshop](https://brixtoltextiles.com). The bundle is refined for usage within our internal and public facing projects. This means that the included logic is developed for our web applications.
 
-**The bundle is refined for usage within our internal and public facing projects. This means that the included logic is developed for our web apps.**
+Visit the reference demo: [https://brixtol.github.io/bootstrap](https://brixtol.github.io/bootstrap/)
 
+> **Note** <br> You are free to leverage and use the variation for your own use cases but be aware that this project will not accept feature requests. Only bug reporting or issues are applicable.
+
 ### Key Features
@@ -17,5 +19,5 @@
 
-We here at [Brixtol Textiles](https://github.com/brixtol) leverage the bootstrap grid system and some of its utilities in various public facing web applications. We employ custom naming conventions for classes in order to keep production bundles small without needed to purge. It was extraneous having to constantly overwrite defaults together with the constant breaking changes of Bootstrap it made things difficult and we wanted a single point of control which we can depend upon.
+We here at [Brixtol Textiles](https://github.com/brixtol) leverage the bootstrap grid system and some of its utilities in various public facing web applications. We employ custom naming conventions for classes in order to keep production bundles small without needing to purge. It was extraneous having to constantly overwrite defaults together with the constant breaking changes of Bootstrap it made things difficult and we wanted a single point of control which we can depend upon while still being able to extend the base to our requirements.
 
-## Install
+# Install
 
@@ -28,17 +30,114 @@ ```cli
 
-## Usage
+# Usage
 
-When using this variation you can either either leverage its defaults or create a per-project `strap.scss` file to overwrite defaults. This flavor of Bootstrap is intended to be bundled along side project specific stylings, so the defaults are completely stripped of
+When using this variation you can either either leverage its defaults or create a per-project `strap.scss` file to overwrite defaults. This flavor of Bootstrap is intended to be bundled along side project specific stylings, so the defaults are completely stripped and largely refactored. The main `sass/*` directory contains all the overwrites and refactors, the `sass/bootstrap/*` directory contains the hard-fork of Bootstrap and the `_` prefixed files in the root of this directory are import facing.
 
-#### Imports
+Usage is considered on a per-project basis. Below are the main approaches we employ.
 
-The variations default variables overwrite bootstraps defaults. Projects which use
+### Full Import
 
+This will pull in the entire variation.
+
 ```scss
-@import 'variables';
-@import '~@brixtol/bootstrap';
+// FULL IMPORT
+//
+@import '@brixtol/bootstrap';
 ```
 
-## LICENSE
+### Variation Import
 
+This import method **requires** the base `variables.scss` file to be imported. The `variation.scss` import includes a full import of variation. This method is used when you want to apply variable overwrites.
+
+<!--prettier-ignore-->
+```scss
+@import '@brixtol/bootstrap/variables';     // DEFAULT VARIABLES FIRST
+
+// VARIABLE OVERWRITES
+//
+$some-variable: null;
+
+@import '@brixtol/bootstrap/variation';     // VARIATION IMPORT
+```
+
+### Customized Import
+
+This import method **requires** the base `variables.scss` file to be imported first. The additional files can be included on a per-requirement level. This method is used for producing a more refined distribution bundle.
+
+<!--prettier-ignore-->
+```scss
+@import '@brixtol/bootstrap/variables';     // DEFAULT VARIABLES FIRST
+
+// CUSTOM VARIABLES
+//
+@import 'custom-variables';
+
+@import '@brixtol/bootstrap/base';          // BASE IMPORT
+@import '@brixtol/bootstrap/forms';         // FORMS IMPORT
+@import '@brixtol/bootstrap/components';    // COMPONENTS IMPORT
+```
+
+### Cherry Picking Import
+
+This import method **requires** the base `variables.scss` file to be imported first. You can cherry-pick the entire variation from here and include any customizations. This method is used for fine grained control over the distribution bundle.
+
+<!--prettier-ignore-->
+```scss
+@import '@brixtol/bootstrap/variables';     // DEFAULT VARIABLES FIRST
+
+// CUSTOM VARIABLES
+//
+@import 'custom-variables';
+
+/* GRID ---------------------------------------- */
+
+@import "@brixtol/bootstrap/sass/grid";
+
+/* BASE ---------------------------------------- */
+
+@import "@brixtol/bootstrap/sass/headings";
+@import "@brixtol/bootstrap/sass/code";
+@import "@brixtol/bootstrap/sass/spacing";
+@import "@brixtol/bootstrap/sass/display";
+@import "@brixtol/bootstrap/sass/helpers";
+@import "@brixtol/bootstrap/sass/flex";
+@import "@brixtol/bootstrap/sass/backgrounds";
+@import "@brixtol/bootstrap/sass/text";
+@import "@brixtol/bootstrap/sass/font";
+@import "@brixtol/bootstrap/sass/sizing";
+@import "@brixtol/bootstrap/sass/lists";
+@import "@brixtol/bootstrap/sass/links";
+@import "@brixtol/bootstrap/sass/borders";
+@import "@brixtol/bootstrap/sass/radius";
+@import "@brixtol/bootstrap/sass/spinner";
+@import "@brixtol/bootstrap/sass/buttons";
+@import "@brixtol/bootstrap/sass/tooltip";
+@import "@brixtol/bootstrap/sass/ratio";
+
+/* COMPONENTS -------------------------------- */
+
+@import "@brixtol/bootstrap/sass/components/dropdown";
+@import "@brixtol/bootstrap/sass/components/accordion";
+@import "@brixtol/bootstrap/sass/components/modal";
+
+/* FORMS -------------------------------------- */
+
+@import "@brixtol/bootstrap/sass/forms/labels";
+@import "@brixtol/bootstrap/sass/forms/text";
+@import "@brixtol/bootstrap/sass/forms/input";
+@import "@brixtol/bootstrap/sass/forms/dropdown";
+@import "@brixtol/bootstrap/sass/forms/check";
+@import "@brixtol/bootstrap/sass/forms/color";
+@import "@brixtol/bootstrap/sass/forms/switch";
+@import "@brixtol/bootstrap/sass/forms/select";
+@import "@brixtol/bootstrap/sass/forms/range";
+@import "@brixtol/bootstrap/sass/forms/float";
+@import "@brixtol/bootstrap/sass/forms/group";
+@import "@brixtol/bootstrap/sass/forms/number";
+@import "@brixtol/bootstrap/sass/forms/feedback";
+@import "@brixtol/bootstrap/sass/forms/validation";
+
+```
+
+# LICENSE
+
 MIT

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Dev dependency count

17

decreased by-10.53%

Number of package files

144

increased by2.86%

Number of lines in readme file

142

increased by230.23%

Worsened metrics

Total package byte prevSize

433739

decreased by-0.07%

No dependency changes