brut 0.0.20 → 0.0.22

data/brut-css/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "brut-css",
+  "version": "0.0.1",
+  "description": "Utility CSS Library for Full Stack Developers",
+  "keywords": [
+    "css"
+  ],
+  "files": [
+    "dist/"
+  ],
+  "bugs": {
+    "url": "https://github.com/thirdtank/brut/issues",
+    "email": "davec@naildrivin5.com"
+  },
+  "repository": "https://github.com/thirdtank/brut",
+  "type": "module",
+  "devDependencies": {
+    "comment-parser": "^1.4.1",
+    "cssnano": "^7.0.7",
+    "ejs": "^3.1.10",
+    "http-server": "^14.1.1",
+    "js-beautify": "^1.15.4",
+    "markdown-it": "^14.1.0",
+    "postcss": "^8.5.6",
+    "postcss-cli": "^11.0.1",
+    "postcss-import": "^16.1.1",
+    "postcss-selector-parser": "^7.1.0",
+    "prismjs": "^1.30.0"
+  },
+  "author": {
+    "name": "David Copeland",
+    "email": "davec@naildrivin5.com",
+    "url": "https://naildrivin5.com"
+  },
+  "license": "Hippocratic-2.1"
+}

data/brut-css/src/css/appearance.css

@@ -0,0 +1,145 @@
+/* Appearannce and decoration-type classes beyond what you'd have in typography, colors, or borders. 
+ *
+ * @category appearances Appearance and Decoration
+ * @see class-category:borders
+ * @see class-category:foreground-colors
+ * @see class-category:typography
+ */
+
+/* The `apperance` property.
+ * @group appearance
+ */
+.appearance-none {
+  appearance: none;
+}
+.appearance-auto {
+  appearance: auto;
+}
+
+
+/* Box shadows.  This is a six-step scale with 1 being the "lowest" shadow and 6 being very high and very scattered.
+ * In theory something with `shadow-1` will look higher than something with `shadow-none`, but lower than something with
+ * `shadow-3`.
+ * @scale box-shadow
+ * @see class-scale:inset-shadow
+ */
+.shadow-1 {
+  box-shadow: rgb(135, 135, 135) 1px 1px 4px 0px;
+}
+.shadow-2 {
+  box-shadow: rgb(135, 135, 135) 1px 1px 10.64px 0px;
+}
+.shadow-3 {
+  box-shadow: rgb(135, 135, 135) 1px 1px 15.022px 0px;
+}
+.shadow-4 {
+  box-shadow: rgb(135, 135, 135) 1px 1px 22.297px 0px;
+}
+.shadow-5 {
+  box-shadow: rgb(135, 135, 135) 1px 1px 34.373px 0px;
+}
+.shadow-6 {
+  box-shadow: rgb(135, 135, 135) 1px 1px 54.419px 0px;
+}
+.shadow-none {
+  box-shadow: none;
+}
+/* Inset shadows.  This is a six-step scale with 1 being the "shallowest" shadow and 6 being very deep and scattered.
+ * In theory something with `inset-shadow-1` will look deeper than something with `inset-shadow-none`, but more shallow than something with `inset-shadow-3`.
+ * @scale inset-shadow
+ * @see class-scale:box-shadow
+ */
+.inset-shadow-1 {
+  box-shadow: rgb(106, 106, 106) 1px 1px 4px -1px inset;
+}
+.inset-shadow-2 {
+  box-shadow: rgb(106, 106, 106) 1px 1px 5.52px -1.043px inset;
+}
+.inset-shadow-3 {
+  box-shadow: rgb(106, 106, 106) 1px 1px 8.195px -1.193px inset;
+}
+.inset-shadow-4 {
+  box-shadow: rgb(106, 106, 106) 1px 1px 12.903px -1.485px inset;
+}
+.inset-shadow-5 {
+  box-shadow: rgb(106, 106, 106) 1px 1px 21.190px -1.986px inset;
+}
+.inset-shadow-6 {
+  box-shadow: rgb(106, 106, 106) 1px 1px 35.774px -2.802px inset;
+}
+.inset-shadow-none {
+  box-shadow: none;
+}
+
+/* Cursors.
+ * @group cursors
+ */
+.cursor-default {
+  cursor: default;
+}
+.pointer {
+  cursor: pointer;
+}
+.cursor-pointer {
+  cursor: pointer;
+}
+.cursor-progress {
+  cursor: progress;
+}
+.cursor-move {
+  cursor: move;
+}
+.cursor-grab {
+  cursor: grab;
+}
+.cursor-not-allowed {
+  cursor: not-allowed;
+}
+
+/** Opacity percentage-based scale, including `third` and `two-thirds`.
+ *
+ * @scale opacity-percent
+ */
+.o-10 {
+  opacity: 10%;
+}
+.o-20 {
+  opacity: 20%;
+}
+.o-25 {
+  opacity: 25%;
+}
+.o-30 {
+  opacity: 30%;
+}
+.o-40 {
+  opacity: 40%;
+}
+.o-50 {
+  opacity: 50%;
+}
+.o-60 {
+  opacity: 60%;
+}
+.o-70 {
+  opacity: 70%;
+}
+.o-75 {
+  opacity: 75%;
+}
+.o-80 {
+  opacity: 80%;
+}
+.o-90 {
+  opacity: 90%;
+}
+.o-100 {
+  opacity: 100%;
+}
+.o-third {
+  opacity: calc(100% / 3);
+}
+.o-two-thirds {
+  opacity: calc(100% / 1.5);
+}
+

data/brut-css/src/css/border.css

@@ -0,0 +1,522 @@
+/* Borders.
+ *
+ * @category borders
+ */
+
+/* Styles to add borders in various locations.  By default, these will add borders that are 1px in width, but you can use the
+ * {class-scale:border-widths} styles to adjust.
+ *
+ * @group borders
+ */
+.ba {
+  border-style: solid;
+  border-width: 1px;
+}
+.bl {
+  border-left-style: solid;
+  border-left-width: 1px;
+}
+.br {
+  border-right-style: solid;
+  border-right-width: 1px;
+}
+.bt {
+  border-top-style: solid;
+  border-top-width: 1px;
+}
+.bb {
+  border-bottom-style: solid;
+  border-bottom-width: 1px;
+}
+.bn {
+  border-style: none;
+  border-width: 0;
+}
+
+/* Collapse borders and remove spacing. This is most useful on `<table>` tags to take back a bit
+ * of control on how everything renders.
+ */
+.collapse {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+
+/* Border radius.  These are based on {property-scale:border-widths} and provide a six-step scale, along with a 100% class
+ * and a "pill" class to create a lozenge-type border.
+ *
+ * @scale border-radius
+ * @see property-scale:border-widths
+ */
+.br-0 {
+  border-radius: 0;
+}
+.br-1 {
+  border-radius: var(--bw-1);
+}
+.br-2 {
+  border-radius: var(--bw-2);
+}
+.br-3 {
+  border-radius: var(--bw-3);
+}
+.br-4 {
+  border-radius: var(--bw-4);
+}
+.br-5 {
+  border-radius: var(--bw-5);
+}
+.br-100 {
+  border-radius: 100%;
+}
+.br-pill {
+  border-radius: 999px;
+}
+
+/* Border bottom radius.
+ *
+ * @scale border-bottom-radius
+ * @see class-scale:border-radius
+ */
+.br-bottom-0 {
+  border-bottom-left-radius: 0;
+  border-bottom-right-radius: 0;
+}
+.br-bottom-1 {
+  border-bottom-left-radius: var(--bw-1);
+  border-bottom-right-radius: var(--bw-1);
+}
+.br-bottom-2 {
+  border-bottom-left-radius: var(--bw-2);
+  border-bottom-right-radius: var(--bw-2);
+}
+.br-bottom-3 {
+  border-bottom-left-radius: var(--bw-3);
+  border-bottom-right-radius: var(--bw-3);
+}
+.br-bottom-4 {
+  border-bottom-left-radius: var(--bw-4);
+  border-bottom-right-radius: var(--bw-4);
+}
+.br-bottom-5 {
+  border-bottom-left-radius: var(--bw-5);
+  border-bottom-right-radius: var(--bw-5);
+}
+.br-bottom-100 {
+  border-bottom-left-radius: 100%;
+  border-bottom-right-radius: 100%;
+}
+.br-bottom-pill {
+  border-bottom-left-radius: 999px;
+  border-bottom-right-radius: 999px;
+}
+/* Border top radius.
+ *
+ * @scale border-top-radius
+ * @see class-scale:border-radius
+ */
+.br-top-0 {
+  border-top-left-radius: 0;
+  border-top-right-radius: 0;
+}
+.br-top-1 {
+  border-top-left-radius: var(--bw-1);
+  border-top-right-radius: var(--bw-1);
+}
+.br-top-2 {
+  border-top-left-radius: var(--bw-2);
+  border-top-right-radius: var(--bw-2);
+}
+.br-top-3 {
+  border-top-left-radius: var(--bw-3);
+  border-top-right-radius: var(--bw-3);
+}
+.br-top-4 {
+  border-top-left-radius: var(--bw-4);
+  border-top-right-radius: var(--bw-4);
+}
+.br-top-5 {
+  border-top-left-radius: var(--bw-5);
+  border-top-right-radius: var(--bw-5);
+}
+.br-top-100 {
+  border-top-left-radius: 100%;
+  border-top-right-radius: 100%;
+}
+.br-top-pill {
+  border-top-left-radius: 999px;
+  border-top-right-radius: 999px;
+}
+/* Border left radius.
+ *
+ * @scale border-left-radius
+ * @see class-scale:border-radius
+ */
+.br-left-0 {
+  border-bottom-left-radius: 0;
+  border-top-left-radius: 0;
+}
+.br-left-1 {
+  border-bottom-left-radius: var(--bw-1);
+  border-top-left-radius: var(--bw-1);
+}
+.br-left-2 {
+  border-bottom-left-radius: var(--bw-2);
+  border-top-left-radius: var(--bw-2);
+}
+.br-left-3 {
+  border-bottom-left-radius: var(--bw-3);
+  border-top-left-radius: var(--bw-3);
+}
+.br-left-4 {
+  border-bottom-left-radius: var(--bw-4);
+  border-top-left-radius: var(--bw-4);
+}
+.br-left-5 {
+  border-bottom-left-radius: var(--bw-5);
+  border-top-left-radius: var(--bw-5);
+}
+.br-left-100 {
+  border-bottom-left-radius: 100%;
+  border-top-left-radius: 100%;
+}
+.br-left-pill {
+  border-bottom-left-radius: 999px;
+  border-top-left-radius: 999px;
+}
+/* Border right radius.
+ *
+ * @scale border-right-radius
+ * @see class-scale:border-radius
+ */
+.br-right-0 {
+  border-bottom-right-radius: 0;
+  border-top-right-radius: 0;
+}
+.br-right-1 {
+  border-bottom-right-radius: var(--bw-1);
+  border-top-right-radius: var(--bw-1);
+}
+.br-right-2 {
+  border-bottom-right-radius: var(--bw-2);
+  border-top-right-radius: var(--bw-2);
+}
+.br-right-3 {
+  border-bottom-right-radius: var(--bw-3);
+  border-top-right-radius: var(--bw-3);
+}
+.br-right-4 {
+  border-bottom-right-radius: var(--bw-4);
+  border-top-right-radius: var(--bw-4);
+}
+.br-right-5 {
+  border-bottom-right-radius: var(--bw-5);
+  border-top-right-radius: var(--bw-5);
+}
+.br-right-100 {
+  border-bottom-right-radius: 100%;
+  border-top-right-radius: 100%;
+}
+.br-right-pill {
+  border-bottom-right-radius: 999px;
+  border-top-right-radius: 999px;
+}
+/* Border top-right radius.
+ *
+ * @scale border-top-right-radius
+ * @see class-scale:border-radius
+ */
+.br-tr-0 {
+  border-top-right-radius: 0;
+}
+.br-tr-1 {
+  border-top-right-radius: var(--bw-1);
+}
+.br-tr-2 {
+  border-top-right-radius: var(--bw-2);
+}
+.br-tr-3 {
+  border-top-right-radius: var(--bw-3);
+}
+.br-tr-4 {
+  border-top-right-radius: var(--bw-4);
+}
+.br-tr-5 {
+  border-top-right-radius: var(--bw-5);
+}
+.br-tr-100 {
+  border-top-right-radius: 100%;
+}
+.br-tr-pill {
+  border-top-right-radius: 999px;
+}
+
+/* Border bottom-right radius.
+ *
+ * @scale border-bottom-right-radius
+ * @see class-scale:border-radius
+ */
+.br-br-0 {
+  border-bottom-right-radius: 0;
+}
+.br-br-1 {
+  border-bottom-right-radius: var(--bw-1);
+}
+.br-br-2 {
+  border-bottom-right-radius: var(--bw-2);
+}
+.br-br-3 {
+  border-bottom-right-radius: var(--bw-3);
+}
+.br-br-4 {
+  border-bottom-right-radius: var(--bw-4);
+}
+.br-br-5 {
+  border-bottom-right-radius: var(--bw-5);
+}
+.br-br-100 {
+  border-bottom-right-radius: 100%;
+}
+.br-br-pill {
+  border-bottom-right-radius: 999px;
+}
+
+/* Border top-left radius.
+ *
+ * @scale border-top-left-radius
+ * @see class-scale:border-radius
+ */
+.br-tl-0 {
+  border-top-left-radius: 0;
+}
+.br-tl-1 {
+  border-top-left-radius: var(--bw-1);
+}
+.br-tl-2 {
+  border-top-left-radius: var(--bw-2);
+}
+.br-tl-3 {
+  border-top-left-radius: var(--bw-3);
+}
+.br-tl-4 {
+  border-top-left-radius: var(--bw-4);
+}
+.br-tl-5 {
+  border-top-left-radius: var(--bw-5);
+}
+.br-tl-100 {
+  border-top-left-radius: 100%;
+}
+.br-tl-pill {
+  border-top-left-radius: 999px;
+}
+
+/* Border bottom-left radius.
+ *
+ * @scale border-bottom-left-radius
+ * @see class-scale:border-radius
+ */
+.br-bl-0 {
+  border-bottom-left-radius: 0;
+}
+.br-bl-1 {
+  border-bottom-left-radius: var(--bw-1);
+}
+.br-bl-2 {
+  border-bottom-left-radius: var(--bw-2);
+}
+.br-bl-3 {
+  border-bottom-left-radius: var(--bw-3);
+}
+.br-bl-4 {
+  border-bottom-left-radius: var(--bw-4);
+}
+.br-bl-5 {
+  border-bottom-left-radius: var(--bw-5);
+}
+.br-bl-100 {
+  border-bottom-left-radius: 100%;
+}
+.br-bl-pill {
+  border-bottom-left-radius: 999px;
+}
+.bs-dotted {
+  border-style: dotted;
+}
+.bs-dashed {
+  border-style: dashed;
+}
+.bs-solid {
+  border-style: solid;
+}
+.bs-none {
+  border-style: none;
+}
+.bls-dotted {
+  border-left-style: dotted;
+}
+.bls-dashed {
+  border-left-style: dashed;
+}
+.bls-solid {
+  border-left-style: solid;
+}
+.bls-none {
+  border-left-style: none;
+}
+.brs-dotted {
+  border-right-style: dotted;
+}
+.brs-dashed {
+  border-right-style: dashed;
+}
+.brs-solid {
+  border-right-style: solid;
+}
+.brs-none {
+  border-right-style: none;
+}
+.bts-dotted {
+  border-top-style: dotted;
+}
+.bts-dashed {
+  border-top-style: dashed;
+}
+.bts-solid {
+  border-top-style: solid;
+}
+.bts-none {
+  border-top-style: none;
+}
+.bbs-dotted {
+  border-bottom-style: dotted;
+}
+.bbs-dashed {
+  border-bottom-style: dashed;
+}
+.bbs-solid {
+  border-bottom-style: solid;
+}
+.bbs-none {
+  border-bottom-style: none;
+}
+
+/* Border widths. This provides a six-step scale.
+ *
+ * @scale border-widths
+ * @see property-scale:border-widths
+ */
+.bw-0 {
+  border-width: 0;
+}
+.bw-1 {
+  border-width: var(--bw-1);
+}
+.bw-2 {
+  border-width: var(--bw-2);
+}
+.bw-3 {
+  border-width: var(--bw-3);
+}
+.bw-4 {
+  border-width: var(--bw-4);
+}
+.bw-5 {
+  border-width: var(--bw-5);
+}
+
+/* Border left width.
+ *
+ * @scale border-left-width
+ * @see class-scale:border-widths
+ */
+.blw-0 {
+  border-left-width: 0;
+}
+.blw-1 {
+  border-left-width: var(--bw-1);
+}
+.blw-2 {
+  border-left-width: var(--bw-2);
+}
+.blw-3 {
+  border-left-width: var(--bw-3);
+}
+.blw-4 {
+  border-left-width: var(--bw-4);
+}
+.blw-5 {
+  border-left-width: var(--bw-5);
+}
+
+/* Border right width.
+ *
+ * @scale border-right-width
+ * @see class-scale:border-widths
+ */
+.brw-0 {
+  border-right-width: 0;
+}
+.brw-1 {
+  border-right-width: var(--bw-1);
+}
+.brw-2 {
+  border-right-width: var(--bw-2);
+}
+.brw-3 {
+  border-right-width: var(--bw-3);
+}
+.brw-4 {
+  border-right-width: var(--bw-4);
+}
+.brw-5 {
+  border-right-width: var(--bw-5);
+}
+
+/* Border top width.
+ *
+ * @scale border-top-width
+ * @see class-scale:border-widths
+ */
+.btw-0 {
+  border-top-width: 0;
+}
+.btw-1 {
+  border-top-width: var(--bw-1);
+}
+.btw-2 {
+  border-top-width: var(--bw-2);
+}
+.btw-3 {
+  border-top-width: var(--bw-3);
+}
+.btw-4 {
+  border-top-width: var(--bw-4);
+}
+.btw-5 {
+  border-top-width: var(--bw-5);
+}
+
+/* Border bottom width.
+ *
+ * @scale border-bottom-width
+ * @see class-scale:border-widths
+ */
+.bbw-0 {
+  border-bottom-width: 0;
+}
+.bbw-1 {
+  border-bottom-width: var(--bw-1);
+}
+.bbw-2 {
+  border-bottom-width: var(--bw-2);
+}
+.bbw-3 {
+  border-bottom-width: var(--bw-3);
+}
+.bbw-4 {
+  border-bottom-width: var(--bw-4);
+}
+.bbw-5 {
+  border-bottom-width: var(--bw-5);
+}