WIP on Vue based FlexGrid. Grid and Row mostly done (Col next)

agnosticui-vue/copystyles.js

@@ -53,4 +53,11 @@ fs.writeFileSync('./src/stories/Header.vue', headerSynchronized, 'utf8');
 css = fs.readFileSync('../agnosticui-css/headernav.css', 'utf8');
 const headerNavVue = fs.readFileSync('./src/stories/HeaderNav.vue', 'utf8');
 const headerNavSynchronized = headerNavVue.replace(styleRegex, `<style module>\n${css}\n</style>`);
-fs.writeFileSync('./src/stories/HeaderNav.vue', headerNavSynchronized, 'utf8');
+fs.writeFileSync('./src/stories/HeaderNav.vue', headerNavSynchronized, 'utf8');
+
+
+/**
+ * FlexGrid
+ */
+css = fs.readFileSync('../agnosticui-css/flexboxgrid-custom.css', 'utf8');
+fs.writeFileSync('./src/stories/FlexGrid/FlexBoxGrid2Custom.module.css', css, 'utf8');

agnosticui-vue/src/stories/Button.stories.js

@@ -18,7 +18,6 @@ export const Buttons = () => ({
   title: 'Buttons',
   components: { ButtonTests },
   template: `<button-tests />`,
-
 });
 Buttons.parameters = {
   docs: {

agnosticui-vue/src/stories/FlexGrid.stories.js

@@ -0,0 +1,37 @@
+import FlexGrid from './FlexGrid/FlexGrid.vue';
+import FlexGridTests from './FlexGridTests.vue';
+// import FlexRow from './FlexGrid/FlexRow.js'
+// import FlexCol from './FlexGrid/FlexCol.js'
+// import styles from './FlexGrid/FlexGridExample.module.css'
+// const Field = ({ label = "Field" }) => <p className={styles.Field}>{label}</p>
+
+/*
+import AgnosticHeader from "./Header.vue";
+import AgnosticHeaderNav from "./HeaderNav.vue";
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { AgnosticHeader, AgnosticHeaderNav },
+  template: '<agnostic-header v-bind="$props"><template v-slot:logoleft><a href="#">Logo on Left</a></template><template v-slot:headernav><agnostic-header-nav><ul><li><a href="#">Home</a></li><li><a href="#">About</a></li></ul></agnostic-header-nav></template><template v-slot:logoright><a href="#">Logo on Right</a></template></agnostic-header>'
+});
+
+*/
+export default {
+  title: 'FlexGrid',
+  component: FlexGrid,
+}
+
+export const Grid = () => ({
+  title: 'Grids',
+  components: { FlexGridTests },
+  template: '<flex-grid-tests />'
+});
+Grid.parameters = {
+  docs: {
+    source: {
+      code: `
+      /* TBD */
+      `
+    }
+  }
+}