- //
- plugin(({addVariant}) => addVariant("phx-click-loading", [".phx-click-loading&", ".phx-click-loading &"])),
- plugin(({addVariant}) => addVariant("phx-submit-loading", [".phx-submit-loading&", ".phx-submit-loading &"])),
- plugin(({addVariant}) => addVariant("phx-change-loading", [".phx-change-loading&", ".phx-change-loading &"])),
+ content: ["./js/**/*.js", "../lib/exmr_web.ex", "../lib/exmr_web/**/*.*ex"],
+ theme: {
+ extend: {
+ colors: {
+ brand: "#C47BC6",
+ },
+ },
+ },
+ plugins: [
+ require("@tailwindcss/forms"),
+ // Allows prefixing tailwind classes with LiveView classes to add rules
+ // only when LiveView classes are applied, for example:
+ //
+ //
+ //
+ plugin(({ addVariant }) =>
+ addVariant("phx-click-loading", [
+ ".phx-click-loading&",
+ ".phx-click-loading &",
+ ]),
+ ),
+ plugin(({ addVariant }) =>
+ addVariant("phx-submit-loading", [
+ ".phx-submit-loading&",
+ ".phx-submit-loading &",
+ ]),
+ ),
+ plugin(({ addVariant }) =>
+ addVariant("phx-change-loading", [
+ ".phx-change-loading&",
+ ".phx-change-loading &",
+ ]),
+ ),
- // Embeds Heroicons (https://heroicons.com) into your app.css bundle
- // See your `CoreComponents.icon/1` for more information.
- //
- plugin(function({matchComponents, theme}) {
- let iconsDir = path.join(__dirname, "../deps/heroicons/optimized")
- let values = {}
- let icons = [
- ["", "/24/outline"],
- ["-solid", "/24/solid"],
- ["-mini", "/20/solid"],
- ["-micro", "/16/solid"]
- ]
- icons.forEach(([suffix, dir]) => {
- fs.readdirSync(path.join(iconsDir, dir)).forEach(file => {
- let name = path.basename(file, ".svg") + suffix
- values[name] = {name, fullPath: path.join(iconsDir, dir, file)}
- })
- })
- matchComponents({
- "hero": ({name, fullPath}) => {
- let content = fs.readFileSync(fullPath).toString().replace(/\r?\n|\r/g, "")
- let size = theme("spacing.6")
- if (name.endsWith("-mini")) {
- size = theme("spacing.5")
- } else if (name.endsWith("-micro")) {
- size = theme("spacing.4")
- }
- return {
- [`--hero-${name}`]: `url('data:image/svg+xml;utf8,${content}')`,
- "-webkit-mask": `var(--hero-${name})`,
- "mask": `var(--hero-${name})`,
- "mask-repeat": "no-repeat",
- "background-color": "currentColor",
- "vertical-align": "middle",
- "display": "inline-block",
- "width": size,
- "height": size
- }
- }
- }, {values})
- })
- ]
-}
+ // Embeds Heroicons (https://heroicons.com) into your app.css bundle
+ // See your `CoreComponents.icon/1` for more information.
+ //
+ plugin(function({ matchComponents, theme }) {
+ let iconsDir = path.join(__dirname, "../deps/heroicons/optimized");
+ let values = {};
+ let icons = [
+ ["", "/24/outline"],
+ ["-solid", "/24/solid"],
+ ["-mini", "/20/solid"],
+ ["-micro", "/16/solid"],
+ ];
+ icons.forEach(([suffix, dir]) => {
+ fs.readdirSync(path.join(iconsDir, dir)).forEach((file) => {
+ let name = path.basename(file, ".svg") + suffix;
+ values[name] = { name, fullPath: path.join(iconsDir, dir, file) };
+ });
+ });
+ matchComponents(
+ {
+ hero: ({ name, fullPath }) => {
+ let content = fs
+ .readFileSync(fullPath)
+ .toString()
+ .replace(/\r?\n|\r/g, "");
+ let size = theme("spacing.6");
+ if (name.endsWith("-mini")) {
+ size = theme("spacing.5");
+ } else if (name.endsWith("-micro")) {
+ size = theme("spacing.4");
+ }
+ return {
+ [`--hero-${name}`]: `url('data:image/svg+xml;utf8,${content}')`,
+ "-webkit-mask": `var(--hero-${name})`,
+ mask: `var(--hero-${name})`,
+ "mask-repeat": "no-repeat",
+ "background-color": "currentColor",
+ "vertical-align": "middle",
+ display: "inline-block",
+ width: size,
+ height: size,
+ };
+ },
+ },
+ { values },
+ );
+ }),
+ ],
+};
diff --git a/lib/exmr_web/components/layouts/app.html.heex b/lib/exmr_web/components/layouts/app.html.heex
index e23bfc8..9b83af0 100644
--- a/lib/exmr_web/components/layouts/app.html.heex
+++ b/lib/exmr_web/components/layouts/app.html.heex
@@ -5,23 +5,9 @@
- v<%= Application.spec(:phoenix, :vsn) %>
+ v<%= Application.spec(:exmr, :vsn) %>