Updates before nor(DEV):con

taking-flight-with-tailwind-css/code/writing-plugin-1.js

@@ -0,0 +1,24 @@
+// Start require plugin
+const plugin = require("tailwindcss/plugin");
+// End require plugin
+
+// Start add function
+const plugin = require("tailwindcss/plugin");
+
+module.exports = plugin(function({ addUtilities }) {
+
+})
+// End add function
+
+// Start function contents
+const plugin = require("tailwindcss/plugin");
+
+module.exports = plugin(function({ addUtilities }) {
+  addUtilities({
+    '.list-reset': {
+      listStyle: 'none',
+      padding: 0,
+    },
+  })
+})
+// End function contents

taking-flight-with-tailwind-css/code/writing-plugin-2.js

@@ -0,0 +1,47 @@
+// Start create plugin
+const plugin = require("tailwindcss/plugin");
+
+module.exports = plugin(({ addComponents, theme }) {
+
+});
+// End create plugin
+
+// Start define styles
+const plugin = require("tailwindcss/plugin");
+
+module.exports = plugin(({ addComponents, theme }) {
+  let styles = {
+    primary: {
+      default: {
+        backgroundColor: theme("colors.primary.DEFAULT"),
+        border: `2px solid ${theme("colors.primary.dark")}`,
+        borderRadius: "10px",
+        color: theme("colors.white"),
+        cursor: "pointer",
+        padding: `${theme("padding.3")} ${theme("padding.12")}`,
+      },
+
+      hover: {
+        backgroundColor: theme("colors.white"),
+        color: theme("colors.primary.DEFAULT"),
+      },
+    },
+  }
+});
+
+// End define styles
+
+// Start add components
+const plugin = require("tailwindcss/plugin");
+
+module.exports = plugin(({ addComponents, theme }) {
+
+  // ...
+
+  addComponents({
+    "#edit-checkout.button": styles.primary.default,
+    "#edit-checkout.button:hover, #edit-checkout.button:focus":
+      styles.primary.hover,
+  });
+});
+// End add components