Feature/extend grid (#18)

* Feature/grid (#13)

* Change .colorizeMsg font color behaviour.

* Add different toggle sizes to shoelace template

* Update change log (#10)

* fix: Add sans-serif fallback to sans-serif font stack (#11)

* feat: Change some custom properties in shoelace.css

* chore: Update changelog and package.json

* feat: Adjust small input size

* feat: Add container unit break out grid!

* feat: Small adjustments

* chore: Update changelog and package

* Bump braces from 3.0.2 to 3.0.3 (#14)

Bumps [braces](https://github.com/micromatch/braces) from 3.0.2 to 3.0.3.
- [Changelog](https://github.com/micromatch/braces/blob/master/CHANGELOG.md)
- [Commits](micromatch/braces@3.0.2...3.0.3)

---
updated-dependencies:
- dependency-name: braces
  dependency-type: indirect
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>

* feat: Add shoelace.css to npm package (#16) (#17)

* feat: Add .bind and .wrap class to grid

to ensure downward compatibility

* feat: Add grid to ignite.css and pre build

---------

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>

foundation/grid.css

@@ -53,3 +53,26 @@
   grid-template-columns: repeat(var(--ignt-subgrid-columns), var(--ignt-column-unit));
   grid-column-gap: var(--ignt-gutter-unit);
 }
+
+.wrap {
+  grid-column: wrap-start / wrap-end;
+  display: grid;
+  grid-template-columns: subgrid;
+  position: relative;
+  & + .wrap {margin-top: var(--ignt-spacing-medium);}
+}
+
+.bind {
+  grid-column: bind-start / bind-end;
+  display: grid;
+  grid-template-columns: subgrid;
+  position: relative;
+  & + .bind {margin-top: var(--ignt-spacing-medium);}
+  @media (--ignt-mq-print) {
+    padding:0;
+    margin:0;
+    display:block;
+    flex:none;
+    max-width:210mm;
+  };
+}

ignite.css

@@ -18,6 +18,7 @@ It imports all css files in their intended order for easy mass-inclusion.
 @import url('foundation/mediaqueries.css') layer(utilities.mediaqueries);
 @import url('foundation/reset.css') layer(foundation.reset);
 @import url('foundation/basic.css') layer(foundation.basic);
+@import url('foundation/grid.css') layer(foundation.grid);
 @import url('foundation/color.css') layer(foundation.color);
 
 @import url('themes/dark.css') layer(themes.dark);