From e76f65409f3089954e1cb26c42a91f2fe7d6da28 Mon Sep 17 00:00:00 2001 From: Vladimir Rubin Date: Wed, 27 Nov 2024 19:31:17 +0200 Subject: [PATCH] style(homepage): change out the defaults --- assets/tailwind.config.js | 153 +++++++++------- lib/exmr_web/components/layouts/app.html.heex | 16 +- .../controllers/page_html/home.html.heex | 168 +++--------------- priv/static/favicon.ico | Bin 152 -> 15406 bytes priv/static/images/logo.svg | 7 +- 5 files changed, 109 insertions(+), 235 deletions(-) diff --git a/assets/tailwind.config.js b/assets/tailwind.config.js index 669b8f5..2e6b547 100644 --- a/assets/tailwind.config.js +++ b/assets/tailwind.config.js @@ -1,74 +1,91 @@ // See the Tailwind configuration guide for advanced usage // https://tailwindcss.com/docs/configuration -const plugin = require("tailwindcss/plugin") -const fs = require("fs") -const path = require("path") +const plugin = require("tailwindcss/plugin"); +const fs = require("fs"); +const path = require("path"); module.exports = { - content: [ - "./js/**/*.js", - "../lib/exmr_web.ex", - "../lib/exmr_web/**/*.*ex" - ], - theme: { - extend: { - colors: { - brand: "#FD4F00", - } - }, - }, - 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 &"])), + 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) %>

-
- - @elixirphoenix - - - GitHub - - - Get Started - -
diff --git a/lib/exmr_web/controllers/page_html/home.html.heex b/lib/exmr_web/controllers/page_html/home.html.heex index dc1820b..d9d3147 100644 --- a/lib/exmr_web/controllers/page_html/home.html.heex +++ b/lib/exmr_web/controllers/page_html/home.html.heex @@ -7,23 +7,23 @@ class="absolute inset-0 h-full w-full" preserveAspectRatio="xMinYMid slice" > - +
- -

- Phoenix Framework - - v<%= Application.spec(:phoenix, :vsn) %> + +

+ ExMR + + v<%= Application.spec(:exmr, :vsn) %>

- Peace of mind from prototype to production. + hell yeah

- Build rich, interactive web applications quickly, with less code and fewer moving parts. Join our growing community of developers using Phoenix to craft APIs, HTML5 apps and more, for fun or at scale. + y'all really though i'm gonna be serious? lol

- - - - - - Guides & Docs - - Source Code + -
-
- - - - - -
+
+ <.link navigate={~p"/exams"} class="underline hover:text-red-400 transition-all ease-in-out">exams +

diff --git a/priv/static/favicon.ico b/priv/static/favicon.ico index 7f372bfc21cdd8cb47585339d5fa4d9dd424402f..2344190b5f4a9a3046025ac225395647b2d64253 100644 GIT binary patch literal 15406 zcmeHN4^&iT79UVhf<#6V3k5;~`mFLaq57Z(Q?E?m&qG#21BY%MMa zb+dYzO})^iqy8HT=m6Vo>s3|g${EPSyLbXpxf{{_-N z-EevpURNTUBF0TLzm<8gNtP>{i1$1({mq*Xfn7!bmxI5#Z zZcDAw!^5L;O5|ja7s%e{m9fm8IB_C~#bT)5R}F|`hNX?^PfwfE_>w2k3%heB(k~pBHlLIGUb?$W{N_g$giX!UWK$)Xw}feUcO6O^+9Y ze4PyB`LY}#=UC^=|F5v^8rgjP)z?6;(Lurk30LUe;r(yLx;@UgcvkTqE?>3>_ejYo zBSg;pH={5-l<*MfyY-+~>ovGNCYyZ7%Q@_?-AD}h@t>*dx-x0A9Hvh$yrnRylEATTfxI#eBCIB&Sz-Q7)d zFOi*p^;xw7>u8@3w}svYuddw*m3b8(_;~wNQ5|7;bJ<=%|GkPlX)4wUk=4IMA_3Yv zq7ZB;+X6zM!W@Nm%Sbb!zO3HG^BPGp7r)7(Sff9zfGrPxmluPxa{ zklREY?(6{!b!H5> z{$0=f8HgAZ$ZX6eO-ll=zPu< zT@U_zH1rKJ`1$%l#UCm_r#|lz|GdZM)uOz0eI#9196BZx5Px5Ou0VE4`9hm*J_%L( z(O~h@C*Eab=6`x}GHBIWc80Nf8!+2$$ za{QT`Gr^dv8;*LeXfW|#hz9Rx#<_b>T+u7S&MorZ1n%ma~A{CMWE36(!bX1)><5}-@n#m>JB zT7w>Q<6?{Pf$*Ca0B0>CGtrk*JQdply z18}3?jd1eBNigb+V9@HXVBeW(W7sMFHOtpf3_d0s#6e@m!qYPr!`7^FC|vZ?r(^xc zwqU(=ew{h#Q8=4-hMlj;@}wtJ1*$RF?uz>1$L}wws;XlDi=iS6^YnzA>>PIXX3!aW z@%-;i06fb3js)>{oNoUrIWd{$PPS&;95@c%SpPb-A5?+rP31pTRjLKpM&F*VBeOX; z&@T|)T7J-SJ|(@(<#SW8%@y^-uU4xeDJjX?KktpZ7g{APefZBCE||3a&XEN1OW$eh zjlU=U8aijT<|NMs*#T)E{%YlMd6k^+e>A55#>;J*)px#*^FPS)+KOC($F_d>D=RC( z%gc-Tq&-e)X(_{QG8n(spVt>!#;mPbLHsSpBoG}D&Fs*;oAp!{bkyOQAjV%=t=y@r z(|KErOu+I2GLwBS@wvYB7x8mzW&12L&I&vHyLRn@h={&_GRPkN_o-AUEoYZTvstSR z7ceA}@ZPunBv}q!L#LFI9_8tD*w!;GcY^&_>`}_Md z8)S#h`i~tw#-DwH*p#*TYBKgS{9K;&n)C%}BDT4re)#Dh zV}(M&&b{&6|0B$0-R{Z&wh6|c@>l7L(syF}C&=u*hKvh=lFZF;aMJ;(%CGt~Xmn5& zw*80N>EDo)yHeo&-1pe}CC`_hQLIzY*mgyB_$l_gckgC7IK1eH^dtu-_Yw|BvS!23e65Y`M ziUMsuL>OGxJ2>FZ4eF z<%`>p&yF26wthp}h89VQq=hS$RdYpcPc{}c-hgdxa!0@&0e1x45pYMq9RYU)+!1g` J;AfA({{W$mJJ