{"_id":"@anoyomoose/q2-fresh-paint-md3e","_rev":"14-ba6c542d7f67ccaefd5d2e2d4ca0446f","name":"@anoyomoose/q2-fresh-paint-md3e","dist-tags":{"latest":"0.1.13"},"versions":{"0.1.0":{"name":"@anoyomoose/q2-fresh-paint-md3e","version":"0.1.0","license":"MIT","_id":"@anoyomoose/q2-fresh-paint-md3e@0.1.0","maintainers":[{"name":"anoyomoose","email":"anoyomoose@proton.me"}],"dist":{"shasum":"c05003fc6858f9ef583685de7e3e76acaa278482","tarball":"https://registry.npmjs.org/@anoyomoose/q2-fresh-paint-md3e/-/q2-fresh-paint-md3e-0.1.0.tgz","fileCount":56,"integrity":"sha512-yw/xFVX1sumsANtuQa5DaiZr8c5qkURMIqXUfIM/3YUYxQxDGvjhqQCZIzbUI1MgRzVvfrDWuH70mAzeDHxs9A==","signatures":[{"sig":"MEYCIQCbvlpWsMVPmiz282ce3rrBD+haQisHdAIBqNodYaawRwIhAOgC4sbi+kmLIupbMd4yPH3Qp/1LcrQM3sMPkM2D2JEq","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1456290},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./boot":{"import":"./dist/theme/boot.js","require":"./dist/theme/boot.cjs"},"./components":{"types":"./dist/components/index.d.ts","import":"./dist/components/index.js","require":"./dist/components/index.cjs"}},"gitHead":"b63265dc06322b4ce1050683b911d28b02c5f659","scripts":{"dev":"tsup --watch","build":"tsup && cp -r src/theme dist/"},"_npmUser":{"name":"anoyomoose","email":"anoyomoose@proton.me"},"_npmVersion":"11.3.0","description":"MD3 Expressive theme for Quasar Framework","directories":{},"_nodeVersion":"25.6.1","dependencies":{"@material/material-color-utilities":"^0.4.0"},"_hasShrinkwrap":false,"devDependencies":{"vue":"^3.5.30","tsup":"^8.0.0","vite":"^6.0.0","quasar":"^2.0.0","typescript":"^5.0.0","@types/node":"^22.0.0","@anoyomoose/q2-fresh-paint-core":"link:../q2-fresh-paint-core"},"peerDependencies":{"vue":"^3.0.0","quasar":"^2.0.0","@anoyomoose/q2-fresh-paint-core":"^0.1.0"},"_npmOperationalInternal":{"tmp":"tmp/q2-fresh-paint-md3e_0.1.0_1774465178684_0.3925027536456165","host":"s3://npm-registry-packages-npm-production"}},"0.1.1":{"name":"@anoyomoose/q2-fresh-paint-md3e","version":"0.1.1","license":"MIT","_id":"@anoyomoose/q2-fresh-paint-md3e@0.1.1","maintainers":[{"name":"anoyomoose","email":"anoyomoose@proton.me"}],"dist":{"shasum":"8017b415d57ca260063af858438c48a1e66dedd6","tarball":"https://registry.npmjs.org/@anoyomoose/q2-fresh-paint-md3e/-/q2-fresh-paint-md3e-0.1.1.tgz","fileCount":56,"integrity":"sha512-fCrkTz4V4W0JNJ0KMDPLs8cAAg32BqapJPGk+R/P9HS/WexzH5zNxQsbEmF68mWNSF9SvhB+T14k/s2CJRXikg==","signatures":[{"sig":"MEUCIQCUogU/7oJNydj4VjVcN3jtWCyAYwFicPQjayP7nlk3mQIgcu/Duv9P9A8mUmBro2vHEW2DYWy83iC8u1vEjI9bWLg=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1456290},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./boot":{"import":"./dist/theme/boot.js","require":"./dist/theme/boot.cjs"},"./components":{"types":"./dist/components/index.d.ts","import":"./dist/components/index.js","require":"./dist/components/index.cjs"}},"gitHead":"a1a6c426c9431f42d3a92db60477fae5d7df0c38","scripts":{"dev":"tsup --watch","build":"tsup && cp -r src/theme dist/"},"_npmUser":{"name":"anoyomoose","email":"anoyomoose@proton.me"},"_npmVersion":"11.3.0","description":"MD3 Expressive theme for Quasar Framework","directories":{},"_nodeVersion":"25.6.1","dependencies":{"@material/material-color-utilities":"^0.4.0"},"_hasShrinkwrap":false,"devDependencies":{"vue":"^3.5.30","tsup":"^8.0.0","vite":"^6.0.0","quasar":"^2.0.0","typescript":"^5.0.0","@types/node":"^22.0.0","@anoyomoose/q2-fresh-paint-core":"link:../q2-fresh-paint-core"},"peerDependencies":{"vue":"^3.0.0","quasar":"^2.0.0","@anoyomoose/q2-fresh-paint-core":"^0.1.1"},"_npmOperationalInternal":{"tmp":"tmp/q2-fresh-paint-md3e_0.1.1_1774470580327_0.7148430013957698","host":"s3://npm-registry-packages-npm-production"}},"0.1.2":{"name":"@anoyomoose/q2-fresh-paint-md3e","version":"0.1.2","license":"MIT","_id":"@anoyomoose/q2-fresh-paint-md3e@0.1.2","maintainers":[{"name":"anoyomoose","email":"anoyomoose@proton.me"}],"dist":{"shasum":"728f4e0809ca3647c0b77709e3ba085262519d10","tarball":"https://registry.npmjs.org/@anoyomoose/q2-fresh-paint-md3e/-/q2-fresh-paint-md3e-0.1.2.tgz","fileCount":56,"integrity":"sha512-Pguj79yY7e2B7h43rReT1c5OirmZIH+79HvFl4yKPzwPIz9j0q8RTKpzp8bOYVVS17fTnzWcoMT3WuxTdS8c2A==","signatures":[{"sig":"MEUCIQCDxhqmoWGHDZqCSQaPMNydp3VOko0qinPHDMZpwJZoXwIgGCQyJKbdPfiaXtDCOjLBUpBH6dGMrNxsPU8DR6ZpN78=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1457266},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./boot":{"import":"./dist/theme/boot.js","require":"./dist/theme/boot.cjs"},"./components":{"types":"./dist/components/index.d.ts","import":"./dist/components/index.js","require":"./dist/components/index.cjs"}},"gitHead":"df192a4652b109883cb3473d43346586d460afbb","scripts":{"dev":"tsup --watch","build":"tsup && cp -r src/theme dist/"},"_npmUser":{"name":"anoyomoose","email":"anoyomoose@proton.me"},"_npmVersion":"11.3.0","description":"MD3 Expressive theme for Quasar Framework","directories":{},"_nodeVersion":"25.6.1","dependencies":{"@material/material-color-utilities":"^0.4.0"},"_hasShrinkwrap":false,"devDependencies":{"vue":"^3.5.30","tsup":"^8.0.0","vite":"^6.0.0","quasar":"^2.0.0","typescript":"^5.0.0","@types/node":"^22.0.0","@anoyomoose/q2-fresh-paint-core":"link:../q2-fresh-paint-core"},"peerDependencies":{"vue":"^3.0.0","quasar":"^2.0.0","@anoyomoose/q2-fresh-paint-core":"^0.1.2"},"_npmOperationalInternal":{"tmp":"tmp/q2-fresh-paint-md3e_0.1.2_1774480423143_0.41594519740092384","host":"s3://npm-registry-packages-npm-production"}},"0.1.3":{"name":"@anoyomoose/q2-fresh-paint-md3e","version":"0.1.3","license":"MIT","_id":"@anoyomoose/q2-fresh-paint-md3e@0.1.3","maintainers":[{"name":"anoyomoose","email":"anoyomoose@proton.me"}],"dist":{"shasum":"5ffca3cba36f9387c0b9665dae2e47fd2133c662","tarball":"https://registry.npmjs.org/@anoyomoose/q2-fresh-paint-md3e/-/q2-fresh-paint-md3e-0.1.3.tgz","fileCount":56,"integrity":"sha512-JvIM//xL+0P4CvMlL8aXDIP75vYXPC8ygN32l/AKmlzGIEEOk8Wn5bTvBkm4+nQrkHiBPfr7ahX982JAHUxTuw==","signatures":[{"sig":"MEUCIGaj+EELBYwzPdGLThkBBXCg2OaER9YwMsBDF1TXDo6+AiEA7FJa2JHNBa0WGRv3TtddfgqNT6z0dWSK2PChfrJTJzA=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1457670},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./boot":{"import":"./dist/theme/boot.js","require":"./dist/theme/boot.cjs"},"./components":{"types":"./dist/components/index.d.ts","import":"./dist/components/index.js","require":"./dist/components/index.cjs"}},"gitHead":"d5500324bb2306ce82c2924fe33327f544015807","scripts":{"dev":"tsup --watch","build":"tsup && cp -r src/theme dist/"},"_npmUser":{"name":"anoyomoose","email":"anoyomoose@proton.me"},"_npmVersion":"11.3.0","description":"MD3 Expressive theme for Quasar Framework","directories":{},"_nodeVersion":"25.6.1","dependencies":{"@material/material-color-utilities":"^0.4.0"},"_hasShrinkwrap":false,"devDependencies":{"vue":"^3.5.30","tsup":"^8.0.0","vite":"^6.0.0","quasar":"^2.0.0","typescript":"^5.0.0","@types/node":"^22.0.0","@anoyomoose/q2-fresh-paint-core":"link:../q2-fresh-paint-core"},"peerDependencies":{"vue":"^3.0.0","quasar":"^2.0.0","@anoyomoose/q2-fresh-paint-core":"^0.1.2"},"_npmOperationalInternal":{"tmp":"tmp/q2-fresh-paint-md3e_0.1.3_1774496460970_0.7545896863265651","host":"s3://npm-registry-packages-npm-production"}},"0.1.4":{"name":"@anoyomoose/q2-fresh-paint-md3e","version":"0.1.4","license":"MIT","_id":"@anoyomoose/q2-fresh-paint-md3e@0.1.4","maintainers":[{"name":"anoyomoose","email":"anoyomoose@proton.me"}],"dist":{"shasum":"f73a42a4c5d004eed05fb858712690536de71c4c","tarball":"https://registry.npmjs.org/@anoyomoose/q2-fresh-paint-md3e/-/q2-fresh-paint-md3e-0.1.4.tgz","fileCount":56,"integrity":"sha512-Pvb2nIfLLYkesMbfJ4J4Ue7k95A7G3kz3g6epstq7HODs1/TdNUgHyHErdydezsWC8u85nEAp5bVLIzvg0HYfA==","signatures":[{"sig":"MEQCIADGaMcsvLEl9kJMGn8NfWEXCI2i3IZva1A8ETYmL13sAiBdACza1eTg5t1jLmp/3CtR9I44GmET+4fSFnbmnb3o0Q==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1460611},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./boot":{"import":"./dist/theme/boot.js","require":"./dist/theme/boot.cjs"},"./components":{"types":"./dist/components/index.d.ts","import":"./dist/components/index.js","require":"./dist/components/index.cjs"}},"gitHead":"b68b4908d1d48f6cbff1d8786911a88e4348e81d","scripts":{"dev":"tsup --watch","build":"tsup && cp -r src/theme dist/"},"_npmUser":{"name":"anoyomoose","email":"anoyomoose@proton.me"},"_npmVersion":"11.3.0","description":"MD3 Expressive theme for Quasar Framework","directories":{},"_nodeVersion":"25.6.1","dependencies":{"@material/material-color-utilities":"^0.4.0"},"_hasShrinkwrap":false,"devDependencies":{"vue":"^3.5.30","tsup":"^8.0.0","vite":"^6.0.0","quasar":"^2.0.0","typescript":"^5.0.0","@types/node":"^22.0.0","@anoyomoose/q2-fresh-paint-core":"link:../q2-fresh-paint-core"},"peerDependencies":{"vue":"^3.0.0","quasar":"^2.0.0","@anoyomoose/q2-fresh-paint-core":"^0.1.2"},"_npmOperationalInternal":{"tmp":"tmp/q2-fresh-paint-md3e_0.1.4_1774527716234_0.6626370552015659","host":"s3://npm-registry-packages-npm-production"}},"0.1.5":{"name":"@anoyomoose/q2-fresh-paint-md3e","version":"0.1.5","license":"MIT","_id":"@anoyomoose/q2-fresh-paint-md3e@0.1.5","maintainers":[{"name":"anoyomoose","email":"anoyomoose@proton.me"}],"dist":{"shasum":"b03da3625b09f6d19e79704be77398da34da9ca4","tarball":"https://registry.npmjs.org/@anoyomoose/q2-fresh-paint-md3e/-/q2-fresh-paint-md3e-0.1.5.tgz","fileCount":56,"integrity":"sha512-A48PNRu7GwlxlctKqUrSQJFuIx3MTcygEFRBqIn8KUsH7+n2kjRvKD5mLyL7jCG0724xfYzL1cq+mZF1Z3YFBQ==","signatures":[{"sig":"MEYCIQD+4yaFBZiZsqwA1CTckRg3DoHbNsBLcZa63HRWdoBsnwIhAKoCBPPcVCJkaw0RJJCgKmxFh42F1vQwL6K5WQoG4j18","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1462687},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./boot":{"import":"./dist/theme/boot.js","require":"./dist/theme/boot.cjs"},"./components":{"types":"./dist/components/index.d.ts","import":"./dist/components/index.js","require":"./dist/components/index.cjs"}},"gitHead":"9242fb6808064ff38de1aefb08120e603318df47","scripts":{"dev":"tsup --watch","build":"tsup && cp -r src/theme dist/"},"_npmUser":{"name":"anoyomoose","email":"anoyomoose@proton.me"},"_npmVersion":"11.3.0","description":"MD3 Expressive theme for Quasar Framework","directories":{},"_nodeVersion":"25.6.1","dependencies":{"@material/material-color-utilities":"^0.4.0"},"_hasShrinkwrap":false,"devDependencies":{"vue":"^3.5.30","tsup":"^8.0.0","vite":"^6.0.0","quasar":"^2.0.0","typescript":"^5.0.0","@types/node":"^22.0.0","@anoyomoose/q2-fresh-paint-core":"link:../q2-fresh-paint-core"},"peerDependencies":{"vue":"^3.0.0","quasar":"^2.0.0","@anoyomoose/q2-fresh-paint-core":"^0.1.2"},"_npmOperationalInternal":{"tmp":"tmp/q2-fresh-paint-md3e_0.1.5_1774543665608_0.9208302761384082","host":"s3://npm-registry-packages-npm-production"}},"0.1.6":{"name":"@anoyomoose/q2-fresh-paint-md3e","version":"0.1.6","license":"MIT","_id":"@anoyomoose/q2-fresh-paint-md3e@0.1.6","maintainers":[{"name":"anoyomoose","email":"anoyomoose@proton.me"}],"dist":{"shasum":"7f0fdc08db6441e4346543627adda2bc9489c605","tarball":"https://registry.npmjs.org/@anoyomoose/q2-fresh-paint-md3e/-/q2-fresh-paint-md3e-0.1.6.tgz","fileCount":66,"integrity":"sha512-iZpM6D72F7ToXIa8T0S9IdGhoQK2BJ/zR+88f1kQbeso3+QL5ZU9ArV+q0TEpEcz8hZq52HQYlF3Sim5isFnDQ==","signatures":[{"sig":"MEYCIQCyDolKXZ7tcuo1yibtQ0XSj0uzXG37wwOdEKwqgVmuJAIhALVUFyn3zVKXME22XOsmO/f9tjXff9XugmIxRzb7j2S7","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":2254390},"main":"./dist/index.cjs","type":"module","_from":"file:anoyomoose-q2-fresh-paint-md3e-0.1.6.tgz","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./boot":{"import":"./dist/theme/boot.js","require":"./dist/theme/boot.cjs"},"./palette":{"types":"./dist/palette.d.ts","import":"./dist/palette.js","require":"./dist/palette.cjs"},"./components":{"types":"./dist/components/index.d.ts","import":"./dist/components/index.js","require":"./dist/components/index.cjs"}},"scripts":{"dev":"tsup --watch","build":"tsup && cp -r src/theme dist/"},"_npmUser":{"name":"anoyomoose","email":"anoyomoose@proton.me"},"_resolved":"/tmp/97737d78fedcb0925400f7b1112a9eed/anoyomoose-q2-fresh-paint-md3e-0.1.6.tgz","_integrity":"sha512-iZpM6D72F7ToXIa8T0S9IdGhoQK2BJ/zR+88f1kQbeso3+QL5ZU9ArV+q0TEpEcz8hZq52HQYlF3Sim5isFnDQ==","_npmVersion":"11.9.0","description":"MD3 Expressive theme for Quasar Framework","directories":{},"_nodeVersion":"25.6.1","dependencies":{"@material/material-color-utilities":"^0.4.0"},"_hasShrinkwrap":false,"devDependencies":{"vue":"^3.5.30","tsup":"^8.0.0","vite":"^6.0.0","quasar":"^2.0.0","typescript":"^5.0.0","@types/node":"^22.0.0","@anoyomoose/q2-fresh-paint-core":"link:../q2-fresh-paint-core"},"peerDependencies":{"vue":"^3.0.0","quasar":"^2.0.0","@anoyomoose/q2-fresh-paint-core":"^0.1.2"},"_npmOperationalInternal":{"tmp":"tmp/q2-fresh-paint-md3e_0.1.6_1774567216846_0.7377723615486733","host":"s3://npm-registry-packages-npm-production"}},"0.1.7":{"name":"@anoyomoose/q2-fresh-paint-md3e","version":"0.1.7","license":"MIT","_id":"@anoyomoose/q2-fresh-paint-md3e@0.1.7","maintainers":[{"name":"anoyomoose","email":"anoyomoose@proton.me"}],"dist":{"shasum":"dc7f87c3ce27f8d3783f1ce03b68ec53db454694","tarball":"https://registry.npmjs.org/@anoyomoose/q2-fresh-paint-md3e/-/q2-fresh-paint-md3e-0.1.7.tgz","fileCount":69,"integrity":"sha512-Uf4rjdGFu74tvkimQCyDUmUxUmjaq44B/2oM0AnuDcuIp0jV6AEqhT5uwlv3hjpEZzvWfa3pX15CWJofgBjP+A==","signatures":[{"sig":"MEQCIEXBy/XxPU6crGc2yCIwR0wxblr3ziQ7f6HKcNXxFbytAiBgm+nOmm7zS/MWuhClyXoC9cz+7qrGlJDkAzRKyw+6Tg==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":2259011},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./boot":{"import":"./dist/theme/boot.js","require":"./dist/theme/boot.cjs"},"./palette":{"types":"./dist/palette.d.ts","import":"./dist/palette.js","require":"./dist/palette.cjs"},"./components":{"types":"./dist/components/index.d.ts","import":"./dist/components/index.js","require":"./dist/components/index.cjs"}},"gitHead":"1a4355680e5772e3eca4dace70ba1d07c0f69531","scripts":{"dev":"tsup --watch","build":"tsup && cp -r src/theme dist/"},"_npmUser":{"name":"anoyomoose","email":"anoyomoose@proton.me"},"_npmVersion":"11.3.0","description":"MD3 Expressive theme for Quasar Framework","directories":{},"_nodeVersion":"25.6.1","dependencies":{"@material/material-color-utilities":"^0.4.0"},"_hasShrinkwrap":false,"devDependencies":{"vue":"^3.5.30","tsup":"^8.0.0","vite":"^6.0.0","quasar":"^2.0.0","typescript":"^5.0.0","@types/node":"^22.0.0","@anoyomoose/q2-fresh-paint-core":"link:../q2-fresh-paint-core"},"peerDependencies":{"vue":"^3.0.0","quasar":"^2.0.0","@anoyomoose/q2-fresh-paint-core":"^0.1.2"},"_npmOperationalInternal":{"tmp":"tmp/q2-fresh-paint-md3e_0.1.7_1774637737074_0.013737216073501202","host":"s3://npm-registry-packages-npm-production"}},"0.1.8":{"name":"@anoyomoose/q2-fresh-paint-md3e","version":"0.1.8","license":"MIT","_id":"@anoyomoose/q2-fresh-paint-md3e@0.1.8","maintainers":[{"name":"anoyomoose","email":"anoyomoose@proton.me"}],"dist":{"shasum":"d3371db7f66301ebd3616a6f3354e9211140dc74","tarball":"https://registry.npmjs.org/@anoyomoose/q2-fresh-paint-md3e/-/q2-fresh-paint-md3e-0.1.8.tgz","fileCount":69,"integrity":"sha512-nskaN5xvof2N+LG5doMiiCbYZv2FXg0Q/YVLnEh1yK7coov0qiKIMGC5+h/RpowUppR9wOeHpsBmUtAvkLvNTg==","signatures":[{"sig":"MEUCIQDcxcisqnOdMb5EApQbm6TqnVXhONV3dIlc5bqnpamj2AIgGgs+CBuhvY1WkdXfbgtnMlJv2cKR7xTK6OFKKQzRKAo=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":2322026},"main":"./dist/index.cjs","type":"module","_from":"file:anoyomoose-q2-fresh-paint-md3e-0.1.8.tgz","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./boot":{"import":"./dist/theme/boot.js","require":"./dist/theme/boot.cjs"},"./palette":{"types":"./dist/palette.d.ts","import":"./dist/palette.js","require":"./dist/palette.cjs"},"./components":{"types":"./dist/components/index.d.ts","import":"./dist/components/index.js","require":"./dist/components/index.cjs"}},"scripts":{"dev":"tsup --watch","build":"tsup && cp -r src/theme dist/"},"_npmUser":{"name":"anoyomoose","email":"anoyomoose@proton.me"},"_resolved":"/tmp/f6113602f0b3f9913781770c627129c5/anoyomoose-q2-fresh-paint-md3e-0.1.8.tgz","_integrity":"sha512-nskaN5xvof2N+LG5doMiiCbYZv2FXg0Q/YVLnEh1yK7coov0qiKIMGC5+h/RpowUppR9wOeHpsBmUtAvkLvNTg==","_npmVersion":"11.9.0","description":"MD3 Expressive theme for Quasar Framework","directories":{},"_nodeVersion":"25.6.1","dependencies":{"@material/material-color-utilities":"^0.4.0"},"_hasShrinkwrap":false,"devDependencies":{"vue":"^3.5.30","tsup":"^8.0.0","vite":"^6.0.0","quasar":"^2.0.0","typescript":"^5.0.0","@types/node":"^22.0.0","@anoyomoose/q2-fresh-paint-core":"link:../q2-fresh-paint-core"},"peerDependencies":{"vue":"^3.0.0","quasar":"^2.0.0","@anoyomoose/q2-fresh-paint-core":"^0.1.2"},"_npmOperationalInternal":{"tmp":"tmp/q2-fresh-paint-md3e_0.1.8_1774734097234_0.5354715826078229","host":"s3://npm-registry-packages-npm-production"}},"0.1.9":{"name":"@anoyomoose/q2-fresh-paint-md3e","version":"0.1.9","license":"MIT","_id":"@anoyomoose/q2-fresh-paint-md3e@0.1.9","maintainers":[{"name":"anoyomoose","email":"anoyomoose@proton.me"}],"dist":{"shasum":"8155ec30852cca3826175d29501e060a4593399d","tarball":"https://registry.npmjs.org/@anoyomoose/q2-fresh-paint-md3e/-/q2-fresh-paint-md3e-0.1.9.tgz","fileCount":93,"integrity":"sha512-fUShlKjmYce091TnCQ12SOf3exJ21v/iS8CajC2WGVtJu9OlvkChlSquD/yGL+zYA5//ee4+gyGELKO33sXzpg==","signatures":[{"sig":"MEUCIQCFxW0C3tsGBh487Hk1+DFb2PJTdqmBTvWqohOeFCwyaQIgaOhFDwHzOHxoG2xMkp4qXb9VeSNsxPujgWSNGGIsvCA=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":2357902},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./boot":{"import":"./dist/theme/boot.js","require":"./dist/theme/boot.cjs"},"./palette":{"types":"./dist/palette.d.ts","import":"./dist/palette.js","require":"./dist/palette.cjs"},"./components/Md3eBtn":{"types":"./dist/components/Md3eBtn.d.ts","import":"./dist/components/Md3eBtn.js","require":"./dist/components/Md3eBtn.cjs"},"./components/Md3eFab":{"types":"./dist/components/Md3eFab.d.ts","import":"./dist/components/Md3eFab.js","require":"./dist/components/Md3eFab.cjs"},"./components/Md3eToolbar":{"types":"./dist/components/Md3eToolbar.d.ts","import":"./dist/components/Md3eToolbar.js","require":"./dist/components/Md3eToolbar.cjs"},"./components/Md3eBtnGroup":{"types":"./dist/components/Md3eBtnGroup.d.ts","import":"./dist/components/Md3eBtnGroup.js","require":"./dist/components/Md3eBtnGroup.cjs"},"./components/Md3eFabAction":{"types":"./dist/components/Md3eFabAction.d.ts","import":"./dist/components/Md3eFabAction.js","require":"./dist/components/Md3eFabAction.cjs"}},"gitHead":"bccbbc6e148e05a8879d1675548ae1fe8d0d1e77","scripts":{"dev":"tsup --watch","build":"tsup && cp -r src/theme dist/"},"_npmUser":{"name":"anoyomoose","email":"anoyomoose@proton.me"},"_npmVersion":"11.3.0","description":"MD3 Expressive theme for Quasar Framework","directories":{},"_nodeVersion":"25.6.1","dependencies":{"@material/material-color-utilities":"^0.4.0"},"_hasShrinkwrap":false,"devDependencies":{"vue":"^3.5.30","tsup":"^8.0.0","vite":"^6.0.0","quasar":"^2.0.0","typescript":"^5.0.0","@types/node":"^22.0.0","@anoyomoose/q2-fresh-paint-core":"link:../q2-fresh-paint-core"},"peerDependencies":{"vue":"^3.0.0","quasar":"^2.0.0","@anoyomoose/q2-fresh-paint-core":"^0.1.3"},"_npmOperationalInternal":{"tmp":"tmp/q2-fresh-paint-md3e_0.1.9_1774900171985_0.9758274285536332","host":"s3://npm-registry-packages-npm-production"}},"0.1.10":{"name":"@anoyomoose/q2-fresh-paint-md3e","version":"0.1.10","license":"MIT","_id":"@anoyomoose/q2-fresh-paint-md3e@0.1.10","maintainers":[{"name":"anoyomoose","email":"anoyomoose@proton.me"}],"dist":{"shasum":"ccc50d76616fd75dd72a98627739aa5312e3130f","tarball":"https://registry.npmjs.org/@anoyomoose/q2-fresh-paint-md3e/-/q2-fresh-paint-md3e-0.1.10.tgz","fileCount":98,"integrity":"sha512-dD6TdjBTl/gCUfiXxL2TYLnu0htVCj6v41RiJSd5fNweB28Rf2vcamFvKj5dpwaW8tb7sCw5a+hHWY6hAjjRuQ==","signatures":[{"sig":"MEQCIHrUxLLIS053NiMp3IDhJZ3d95XiWmzFisKouRaYUT5tAiALAKNYseacpepq/XYXmDdu1Oys5ota7kYkmTlowrJJrA==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":3115087},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./boot":{"import":"./dist/theme/boot.js","require":"./dist/theme/boot.cjs"},"./palette":{"types":"./dist/palette.d.ts","import":"./dist/palette.js","require":"./dist/palette.cjs"},"./components/Md3eBtn":{"types":"./dist/components/Md3eBtn.d.ts","import":"./dist/components/Md3eBtn.js","require":"./dist/components/Md3eBtn.cjs"},"./components/Md3eFab":{"types":"./dist/components/Md3eFab.d.ts","import":"./dist/components/Md3eFab.js","require":"./dist/components/Md3eFab.cjs"},"./components/Md3eToolbar":{"types":"./dist/components/Md3eToolbar.d.ts","import":"./dist/components/Md3eToolbar.js","require":"./dist/components/Md3eToolbar.cjs"},"./components/Md3eBtnGroup":{"types":"./dist/components/Md3eBtnGroup.d.ts","import":"./dist/components/Md3eBtnGroup.js","require":"./dist/components/Md3eBtnGroup.cjs"},"./components/Md3eFabAction":{"types":"./dist/components/Md3eFabAction.d.ts","import":"./dist/components/Md3eFabAction.js","require":"./dist/components/Md3eFabAction.cjs"}},"gitHead":"24d572d1f2f90ff6b46411a07b18a6f0f0f116f0","scripts":{"dev":"tsup --watch","build":"tsup && cp -r src/theme dist/"},"_npmUser":{"name":"anoyomoose","email":"anoyomoose@proton.me"},"_npmVersion":"11.3.0","description":"MD3 Expressive theme for Quasar Framework","directories":{},"_nodeVersion":"25.6.1","dependencies":{},"_hasShrinkwrap":false,"devDependencies":{"vue":"^3.5.30","tsup":"^8.0.0","vite":"^6.0.0","quasar":"^2.0.0","typescript":"^5.0.0","@types/node":"^22.0.0","ok-material-colors":"link:../ok-material-colors","@anoyomoose/q2-fresh-paint-core":"link:../q2-fresh-paint-core","@material/material-color-utilities":"link:vendor/material-color-utilities/typescript"},"peerDependencies":{"vue":"^3.0.0","quasar":"^2.0.0","@anoyomoose/q2-fresh-paint-core":"^0.1.5"},"_npmOperationalInternal":{"tmp":"tmp/q2-fresh-paint-md3e_0.1.10_1774992859630_0.4918533007678576","host":"s3://npm-registry-packages-npm-production"}},"0.1.11":{"name":"@anoyomoose/q2-fresh-paint-md3e","version":"0.1.11","license":"MIT","_id":"@anoyomoose/q2-fresh-paint-md3e@0.1.11","maintainers":[{"name":"anoyomoose","email":"anoyomoose@proton.me"}],"dist":{"shasum":"56fd8c8773dc655ae0912e0f3f508bfd593646b9","tarball":"https://registry.npmjs.org/@anoyomoose/q2-fresh-paint-md3e/-/q2-fresh-paint-md3e-0.1.11.tgz","fileCount":104,"integrity":"sha512-4HFt3jdjmFgr+n+p/K9HwrWqqAzqtLq0Oovf12uW7LeGebWmnpr1Ot2K5KM4+i7zB2ohD0NNdrDSK/rjJFW0Jw==","signatures":[{"sig":"MEUCIQCi0bgqKyN4qBMeXDBUtjGMkYNc0aJwt8JZh/VvRTWyxAIgDUEnpcsBk3RVjYH65JvkR9och9tr5ME3p/JItIx0cB8=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":3158844},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./boot":{"import":"./dist/theme/boot.js","require":"./dist/theme/boot.cjs"},"./palette":{"types":"./dist/palette.d.ts","import":"./dist/palette.js","require":"./dist/palette.cjs"},"./components/Md3eBtn":{"types":"./dist/components/Md3eBtn.d.ts","import":"./dist/components/Md3eBtn.js","require":"./dist/components/Md3eBtn.cjs"},"./components/Md3eFab":{"types":"./dist/components/Md3eFab.d.ts","import":"./dist/components/Md3eFab.js","require":"./dist/components/Md3eFab.cjs"},"./components/Md3eSlider":{"types":"./dist/components/Md3eSlider.d.ts","import":"./dist/components/Md3eSlider.js","require":"./dist/components/Md3eSlider.cjs"},"./components/Md3eToolbar":{"types":"./dist/components/Md3eToolbar.d.ts","import":"./dist/components/Md3eToolbar.js","require":"./dist/components/Md3eToolbar.cjs"},"./components/Md3eBtnGroup":{"types":"./dist/components/Md3eBtnGroup.d.ts","import":"./dist/components/Md3eBtnGroup.js","require":"./dist/components/Md3eBtnGroup.cjs"},"./components/Md3eFabAction":{"types":"./dist/components/Md3eFabAction.d.ts","import":"./dist/components/Md3eFabAction.js","require":"./dist/components/Md3eFabAction.cjs"}},"gitHead":"6d56f2794bdcf01709ddcc7af9a1e56c9ef1a69e","scripts":{"dev":"tsup --watch","build":"tsup && cp -r src/theme dist/"},"_npmUser":{"name":"anoyomoose","email":"anoyomoose@proton.me"},"_npmVersion":"11.3.0","description":"MD3 Expressive theme for Quasar Framework","directories":{},"_nodeVersion":"25.6.1","dependencies":{},"_hasShrinkwrap":false,"devDependencies":{"vue":"^3.5.30","tsup":"^8.0.0","vite":"^6.0.0","quasar":"^2.0.0","typescript":"^5.0.0","@types/node":"^22.0.0","ok-material-colors":"link:../ok-material-colors","@anoyomoose/q2-fresh-paint-core":"link:../q2-fresh-paint-core","@material/material-color-utilities":"link:vendor/material-color-utilities/typescript"},"peerDependencies":{"vue":"^3.0.0","quasar":"^2.0.0","@anoyomoose/q2-fresh-paint-core":"^0.1.5"},"_npmOperationalInternal":{"tmp":"tmp/q2-fresh-paint-md3e_0.1.11_1775085112816_0.30529364942372283","host":"s3://npm-registry-packages-npm-production"}},"0.1.12":{"name":"@anoyomoose/q2-fresh-paint-md3e","version":"0.1.12","license":"MIT","_id":"@anoyomoose/q2-fresh-paint-md3e@0.1.12","maintainers":[{"name":"anoyomoose","email":"anoyomoose@proton.me"}],"dist":{"shasum":"7ebc98c555ee0daccf3ac8e302f6a5a6c478d0a4","tarball":"https://registry.npmjs.org/@anoyomoose/q2-fresh-paint-md3e/-/q2-fresh-paint-md3e-0.1.12.tgz","fileCount":105,"integrity":"sha512-hAZE4LmNWNzTFZPgyJ5DS+4pdrDN0TMaDE3G2udawFrQqg2dU3+ZShbKyXgoxcQjzIVV1v5Yi55s6L0m2be1aw==","signatures":[{"sig":"MEUCIQDklhsijeR39M9cEq+GjcDTYTwNyHsha9QUEKbNWyDPcQIgQNraKtutodfHRg5WRbpn4cEowodtloX0QPGm7dW6OHk=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":3236671},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./boot":{"import":"./dist/theme/boot.js","require":"./dist/theme/boot.cjs"},"./palette":{"types":"./dist/palette.d.ts","import":"./dist/palette.js","require":"./dist/palette.cjs"},"./components/Md3eBtn":{"types":"./dist/components/Md3eBtn.d.ts","import":"./dist/components/Md3eBtn.js","require":"./dist/components/Md3eBtn.cjs"},"./components/Md3eFab":{"types":"./dist/components/Md3eFab.d.ts","import":"./dist/components/Md3eFab.js","require":"./dist/components/Md3eFab.cjs"},"./components/Md3eSlider":{"types":"./dist/components/Md3eSlider.d.ts","import":"./dist/components/Md3eSlider.js","require":"./dist/components/Md3eSlider.cjs"},"./components/Md3eToolbar":{"types":"./dist/components/Md3eToolbar.d.ts","import":"./dist/components/Md3eToolbar.js","require":"./dist/components/Md3eToolbar.cjs"},"./components/Md3eBtnGroup":{"types":"./dist/components/Md3eBtnGroup.d.ts","import":"./dist/components/Md3eBtnGroup.js","require":"./dist/components/Md3eBtnGroup.cjs"},"./components/Md3eFabAction":{"types":"./dist/components/Md3eFabAction.d.ts","import":"./dist/components/Md3eFabAction.js","require":"./dist/components/Md3eFabAction.cjs"}},"gitHead":"267bc829d111d641845ed71ce676fed3d4b851f4","scripts":{"dev":"tsup --watch","build":"tsup && cp -r src/theme dist/"},"_npmUser":{"name":"anoyomoose","email":"anoyomoose@proton.me"},"_npmVersion":"11.3.0","description":"MD3 Expressive theme for Quasar Framework","directories":{},"_nodeVersion":"25.6.1","dependencies":{},"_hasShrinkwrap":false,"devDependencies":{"vue":"^3.5.30","tsup":"^8.0.0","vite":"^6.0.0","quasar":"^2.0.0","typescript":"^5.0.0","@types/node":"^22.0.0","ok-material-colors":"link:../ok-material-colors","@anoyomoose/q2-fresh-paint-core":"link:../q2-fresh-paint-core","@material/material-color-utilities":"link:vendor/material-color-utilities/typescript"},"peerDependencies":{"vue":"^3.0.0","quasar":"^2.0.0","@anoyomoose/q2-fresh-paint-core":"^0.1.7"},"_npmOperationalInternal":{"tmp":"tmp/q2-fresh-paint-md3e_0.1.12_1775312371506_0.5674691804724274","host":"s3://npm-registry-packages-npm-production"}},"0.1.13":{"name":"@anoyomoose/q2-fresh-paint-md3e","version":"0.1.13","description":"MD3 Expressive theme for Quasar Framework","license":"MIT","type":"module","main":"./dist/index.cjs","module":"./dist/index.js","types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./boot":{"import":"./dist/theme/boot.js","require":"./dist/theme/boot.cjs"},"./components/Md3eBtn":{"types":"./dist/components/Md3eBtn.d.ts","import":"./dist/components/Md3eBtn.js","require":"./dist/components/Md3eBtn.cjs"},"./components/Md3eBtnGroup":{"types":"./dist/components/Md3eBtnGroup.d.ts","import":"./dist/components/Md3eBtnGroup.js","require":"./dist/components/Md3eBtnGroup.cjs"},"./components/Md3eFab":{"types":"./dist/components/Md3eFab.d.ts","import":"./dist/components/Md3eFab.js","require":"./dist/components/Md3eFab.cjs"},"./components/Md3eFabAction":{"types":"./dist/components/Md3eFabAction.d.ts","import":"./dist/components/Md3eFabAction.js","require":"./dist/components/Md3eFabAction.cjs"},"./components/Md3eToolbar":{"types":"./dist/components/Md3eToolbar.d.ts","import":"./dist/components/Md3eToolbar.js","require":"./dist/components/Md3eToolbar.cjs"},"./components/Md3eSlider":{"types":"./dist/components/Md3eSlider.d.ts","import":"./dist/components/Md3eSlider.js","require":"./dist/components/Md3eSlider.cjs"},"./palette":{"types":"./dist/palette.d.ts","import":"./dist/palette.js","require":"./dist/palette.cjs"}},"scripts":{"build":"tsup && cp -r src/theme dist/","dev":"tsup --watch"},"dependencies":{},"peerDependencies":{"@anoyomoose/q2-fresh-paint-core":"^0.1.7","quasar":"^2.0.0","vue":"^3.0.0"},"devDependencies":{"@anoyomoose/q2-fresh-paint-core":"link:../q2-fresh-paint-core","@material/material-color-utilities":"link:vendor/material-color-utilities/typescript","ok-material-colors":"link:../ok-material-colors","@types/node":"^22.0.0","quasar":"^2.0.0","tsup":"^8.0.0","typescript":"^5.0.0","vite":"^6.0.0","vue":"^3.5.30"},"_id":"@anoyomoose/q2-fresh-paint-md3e@0.1.13","gitHead":"8d50db1e65ec1695da4e6403e447ba8c2a525c9f","_nodeVersion":"25.6.1","_npmVersion":"11.3.0","dist":{"integrity":"sha512-oY63mB+jW2kwuV4g/rOCTaAWJWbDuuDmUSHiIiluaNQ1QEeH8le1EXfZJDhRzSsEW25LE8auIDbORjJeo+NcvA==","shasum":"429990a7308b0450129b67b774fd77ff590b5005","tarball":"https://registry.npmjs.org/@anoyomoose/q2-fresh-paint-md3e/-/q2-fresh-paint-md3e-0.1.13.tgz","fileCount":105,"unpackedSize":3245083,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQCIpe1kSV52EQbWMxdzahXzMzlhJayo0D6eoRmb1sdy8gIgQH8f8OJMYTzC1SGzKktnBP5EDsFrPFGgBBrQ1czVq6g="}]},"_npmUser":{"name":"anoyomoose","email":"anoyomoose@proton.me"},"directories":{},"maintainers":[{"name":"anoyomoose","email":"anoyomoose@proton.me"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/q2-fresh-paint-md3e_0.1.13_1775345404046_0.7110360145363379"},"_hasShrinkwrap":false}},"time":{"created":"2026-03-25T18:59:38.557Z","modified":"2026-04-04T23:30:04.333Z","0.1.0":"2026-03-25T18:59:38.839Z","0.1.1":"2026-03-25T20:29:40.528Z","0.1.2":"2026-03-25T23:13:43.371Z","0.1.3":"2026-03-26T03:41:01.182Z","0.1.4":"2026-03-26T12:21:56.449Z","0.1.5":"2026-03-26T16:47:45.836Z","0.1.6":"2026-03-26T23:20:17.013Z","0.1.7":"2026-03-27T18:55:37.261Z","0.1.8":"2026-03-28T21:41:37.459Z","0.1.9":"2026-03-30T19:49:32.146Z","0.1.10":"2026-03-31T21:34:19.818Z","0.1.11":"2026-04-01T23:11:53.108Z","0.1.12":"2026-04-04T14:19:31.684Z","0.1.13":"2026-04-04T23:30:04.205Z"},"license":"MIT","description":"MD3 Expressive theme for Quasar Framework","maintainers":[{"name":"anoyomoose","email":"anoyomoose@proton.me"}],"readme":"# @anoyomoose/q2-fresh-paint-md3e\n\nMaterial Design 3 Expressive (MD3E) theme for Quasar Framework v2. Generates a full MD3 color palette from a single source color using `@material/material-color-utilities`, maps it to Quasar's Sass variable system, and provides component style overrides, shape/motion tokens, and MD3E-specific components.\n\nRequires [`@anoyomoose/q2-fresh-paint-core`](https://github.com/anoyomoose/q2-fresh-paint-core) as the theme engine.\n\n## About\n\nThis is an attempt to (partially) provide a Material Design 3 Expressive theme to Quasar 2.x, including (but not limited to):\n\n- **Color system**: the complete MD3E color palette, generated from a single source color, adjustable at runtime, targetable to specific containers \n- **Spring-based motion**: bouncy overshoot curves on interactive elements, replacing MD2's linear easing\n- **Morphing**: extensive morphing animations for specific elements such as buttons\n- **5-level shadow scale**: replacing Quasar's variable shadows\n- **Tonal elevation**: elevation shifted from shadow-based to tonal - darker surfaces are lower, shadows are secondary cues\n- **Typography**: 15-role type scale, no uppercase anywhere, zero letter spacing on most roles, emphasized weight variants\n- **Spacing**: all margins, paddings, and other spacings are updated from MD2 to MD3E specification\n- **Buttons**: completely redesigned to follow MD3E specification; pill-shaped by default, no shadows at rest, spring-bouncy shape morphing on press, subtle shadow lift on hover, color-based variants (filled, elevated, tonal, outlined, text) that automatically pair background and text colors based on the palette. Toggle buttons morph between pill and square shapes with animated transitions.\n- **Button groups**: similarly redesigned, standard and connected variants; gap-based layouts with button morphing per MD3E specification\n- **Segmented buttons**: officially deprecated, but QBtnToggle in standard mode has been redesigned to copy MD3 (non-Expressive) behavior. Note that virtually all imaginable cases where you previously used QBtnToggle are better served (both by look and feel and per MD3E specification) with a standard or connected button group utilizing `Md3eBtn`'s toggle modes instead.\n- **Toggle switches**: completely redesigned to follow MD3E specification with expanding handles\n- **Sliders**: updated as best as possible, uses MD2 sizes by default, see `Md3eSlider`\n- **Outlined inputs**: labels now animated and positioned to intersect the border as per MD3E specification\n- **FABs**: adjusted to MD3E standards, see the `Md3eBtn` section for (extended) FABs, and `Md3eFab` section for FAB menus\n- **Toolbars, headers and footers**: Now use MD3E specification mandated palette entries\n\n30+ Quasar built-in components have received styling changes, so this summary is by no means exhaustive. This is still a work-in-progress and likely several components will need further tweaking.\n\nWhile the theme is *mostly* drop-in, in an existing project you will no doubt have to adjust many things to make it fit.\n\n## Playground\n\nA version of Quasar's UI Playground with this theme loaded is available [on GitHub pages](https://anoyomoose.github.io/q2-fresh-paint-md3e/), with the default settings as described further below.\n\nSome pages of particular interest (not mobile friendly):\n- [MD3E Palette](https://anoyomoose.github.io/q2-fresh-paint-md3e/components/md3e-palette-test) (interactive, with many component examples)\n- [MD3E Buttons](https://anoyomoose.github.io/q2-fresh-paint-md3e/components/md3e-btn-test)\n- [Toggles](https://anoyomoose.github.io/q2-fresh-paint-md3e/form/toggle)\n- [Cards](https://anoyomoose.github.io/q2-fresh-paint-md3e/components/card)\n- [Inputs](https://anoyomoose.github.io/q2-fresh-paint-md3e/form/input) (see the outlined section)\n\nNote that the UI Playground hardcodes colors in many (many!) places, which fights the theme. No effort was taken to counter this, so it may not always be a good representation of how the theme would look when applied properly.\n\n## Installation & Quick Start\n\n```bash\n# or equivalent for your package manager\npnpm add @anoyomoose/q2-fresh-paint-core @anoyomoose/q2-fresh-paint-md3e\n```\n\nConfigure in `quasar.config.js`:\n\n```js\nimport { freshPaint } from '@anoyomoose/q2-fresh-paint-core'\nimport { md3eTheme } from '@anoyomoose/q2-fresh-paint-md3e'\n\nexport default defineConfig({\n  boot: [\n    '~@anoyomoose/q2-fresh-paint-md3e/boot'\n  ],\n\n  build: {\n    vitePlugins: [\n      freshPaint({\n        themes: [\n          md3eTheme({ sourceColor: '#6750a4', scheme: 'tonalSpot', contrastLevel: 0 })\n        ],\n      })\n    ]\n  }\n})\n```\n\nBoth entries are required:\n- The **boot file** sets runtime component prop defaults and initializes the outlined field notch observer.\n- The **Vite plugin** handles Sass variable injection, component style overrides, and base theme loading at build time.\n\n### Important: Check your `quasar.variables.scss`\n\nThe md3e theme manages brand colors, border radii, typography, and many other Quasar variables via its own variable system. Quasar loads `quasar.variables.scss` **before** any theme variables, and it typically uses hard assignments (no `!default`). Any color variable defined there (e.g., `$primary: #1976D2`) will override the theme's `var()` mapping and **break runtime palette switching**.\n\n**Remove all color definitions** from `quasar.variables.scss`:\n\n```scss\n// REMOVE these - the md3e theme manages them via palette generation:\n// $primary   : #1976D2;\n// $secondary : #26A69A;\n// $accent    : #9C27B0;\n// $negative  : #C10015;\n// $dark      : #1d1d1d;\n// $dark-page : #121212;\n// $separator-color: rgba(0, 0, 0, .12);\n```\n\nNon-color variables (sizing, spacing, etc.) are still safe in `quasar.variables.scss`. The theme also manages shape tokens (`$generic-border-radius`, `$button-border-radius`, `$button-padding`), typography (`$h1`–`$h6`, `$body1`, `$body2`), and component variables (`$toolbar-*`, `$tooltip-*`, `$table-*`, `$menu-*`, `$input-*`, `$dialog-*`). If you've customized any of these, they'll take precedence over the theme. Check the theme's [`variables.scss`](src/theme/variables.scss) for the full list of managed variables.\n\nThe recommended approach is to start with an empty `quasar.variables.scss`, configure your base color via the `sourceColor` option in the plugin configuration, and then selectively re-add non-color variable overrides one at a time to see their effect. For color customization, override `$md3-*` palette tokens in `src/theme/md3e/variables.pre.scss` in your local tree instead, i.e. instead of `$primary` modify `$md3-primary` there. \n\n### Important: Remove `bg-primary` from toolbars, headers, and footers\n\nMD3E uses `surface-container`-colored app bars - not `primary`. The theme enforces this by setting `background-color: var(--md3-surface-container)` on `.q-toolbar` and `.q-layout__section--marginal`. If your layouts use the common MD2 pattern of `bg-primary text-white` on headers and footers, **remove those classes** - they'll fight the theme and produce incorrect text colors.\n\n```html\n<!-- Before (MD2 pattern) -->\n<q-header class=\"bg-primary text-white\">\n  <q-toolbar>\n    <q-toolbar-title>My App</q-toolbar-title>\n  </q-toolbar>\n</q-header>\n\n<!-- After (MD3E default colors) -->\n<q-header>\n  <q-toolbar>\n    <q-toolbar-title>My App</q-toolbar-title>\n  </q-toolbar>\n</q-header>\n\n<!-- After (force your primary, counter defaults) -->\n<!-- Using the --light variant usually looks better in dark mode -->\n<q-header class=\"bg-primary--light text-on-primary--light\">\n  <q-toolbar class=\"bg-primary--light text-on-primary--light\">\n    <q-toolbar-title>My App</q-toolbar-title>\n  </q-toolbar>\n</q-header>\n```\n\nThis also applies to `<q-footer>` and any other component where you manually set `bg-primary` on a toolbar or app bar. The theme uses `on-surface` for text and icons, which adapts correctly in both light and dark mode.\n\nBe sure to read the `Md3eToolbar` section below, it also applies to `QToolbar`.\n\n## Options\n\n```ts\nmd3eTheme(options?: Md3eThemeOptions): ThemeDescriptor\n```\n\n### `sourceColor`\n\nHex color string used as the seed for palette generation. All MD3 color roles (primary, secondary, tertiary, error, surface, etc.) are derived from this single color.\n\nDefault: `'#6750a4'`\n\n### `scheme`\n\nControls how the palette is derived from the source color. Each variant produces different relationships between the color roles.\n\n| Variant | Description |\n|---|---|\n| `'tonalSpot'` | Balanced, stays close to source hue (default) |\n| `'expressive'` | Intentionally detached from source, high color variety |\n| `'vibrant'` | Maximum colorfulness, stays on source hue |\n| `'fidelity'` | High fidelity to source color |\n| `'content'` | Based on source color content |\n| `'monochrome'` | Grayscale palette |\n| `'neutral'` | Subdued, low chroma |\n| `'rainbow'` | Full hue range |\n| `'fruitSalad'` | Playful, high variety |\n| `'cmf'` | Color, Material, Finish — hardware-oriented, uses 2026 spec exclusively |\n\nBoth light and dark scheme tokens are generated from every variant (as `$md3-<token>--light` and `$md3-<token>--dark` Sass variables). The SCSS layer then maps these to CSS custom properties with `--light`/`--dark` constants and switching aliases for light/dark mode.\n\nWhen `oklab` is enabled, `scheme` can also be a `SchemeConfig` object for full control over palette generation — see below.\n\n### `oklab`\n\nUse OkLCH/OkHSL-based palette generation instead of Google's HCT color space. OkLAB produces perceptually more uniform palettes with better saturation control, and is fully tweakable.\n\nDefault: `false`\n\nWhen enabled, the `scheme` option accepts either a preset name (same list as above) or a custom `SchemeConfig` object for fine-grained control over hue offsets and saturation for each palette role. \n\nSee [docs/colors.md](docs/colors.md) for more information.\n\nThe [Palette Demonstration](https://anoyomoose.github.io/q2-fresh-paint-md3e/components/md3e-palette-test) page includes an interactive OkLAB scheme editor with a copy button that exports your chosen configuration to the clipboard.\n\n### `contrastLevel`\n\nAdjusts the contrast of the generated palette. Accepts a number from -1.0 to 1.0.\n\n| Value | Effect |\n|---|---|\n| `-1.0` | Reduced contrast — lower contrast between foreground and background |\n| `0` | Standard contrast (default) |\n| `0.5` | Medium-high contrast |\n| `1.0` | High contrast — maximum contrast between foreground and background |\n\nDefault: `0`\n\n### `positiveColor`, `infoColor`, `warningColor`\n\nSeed colors for the harmonized custom color roles. These are blended toward the `sourceColor` to produce palette-cohesive variants of Quasar's positive/info/warning colors. When `oklab` is enabled, harmonization uses OkLCH hue blending instead of HCT.\n\n| Option | Default | Quasar equivalent |\n|---|---|---|\n| `positiveColor` | `'#21BA45'` | `$positive` (green) |\n| `infoColor` | `'#31CCEC'` | `$info` (cyan) |\n| `warningColor` | `'#F2C037'` | `$warning` (yellow) |\n\nEach produces four tokens: `<role>`, `on-<role>`, `<role>-container`, `on-<role>-container`. To customize, pass seed colors to `md3eTheme()` — do **not** override `$positive`/`$info`/`$warning` in Sass, as that breaks the `var()` chain.\n\n## Colors\n\nThe theme generates 30+ MD3 color tokens from your `sourceColor` and makes them available in four ways:\n\n```vue\n<!-- Quasar color props - just works, auto text color included -->\n<q-btn color=\"primary-container\" label=\"Container\" />\n<q-chip color=\"tertiary-container\" text-color=\"on-tertiary-container\" />\n\n<!-- CSS utility classes -->\n<div class=\"bg-surface-container text-on-surface\">...</div>\n\n<!-- CSS custom properties (switch automatically in dark mode) -->\n<style>\n.my-card { background: var(--md3-surface-container-low); }\n</style>\n\n<!-- Sass variables (compile-time) -->\n<style lang=\"scss\">\n.my-card { border-color: $md3-outline-variant; }\n</style>\n```\n\nQuasar's brand colors (`primary`, `secondary`, `accent`, `negative`) are mapped to MD3 roles and work as usual. The theme also patches Quasar's hardcoded `text-white` fallback so that brand-colored and token-colored elements get the correct `on-*` text color automatically.\n\nGenerally speaking, you can just search your code-base for `text-white` and `text-black` and either remove those classes or use the correct `on-*` variant.\n\nFor the full token list, dark mode details, and how the system works under the hood, see [docs/colors.md](docs/colors.md).\n\nLikely, none of this makes sense until you read the [Color Roles](https://m3.material.io/styles/color/roles) section of the Material Design 3 specification.\n\n## Runtime Palette\n\nChange the color palette at runtime - from a color picker, an image, or programmatically - for the entire page, or targeted elements.\n\nSee [docs/colors.md](docs/colors.md) for details.\n\n## Components\n\nThese are convenience wrappers and not required to be used.\n\n### Importing\n\nAll `Md3e...` components have an `M...` alias for easier typing! The full name is always used in other examples. Both\nare shown in this section, though you would pick one to use.\n\nThe import path is always `@anoyomoose/q2-fresh-paint-md3e/components/<fullname>`\n\n```ts\nimport { Md3eBtn, MBtn } from '@anoyomoose/q2-fresh-paint-md3e/components/Md3eBtn'\n```\n\nOr register locally in a component:\n\n```ts\nimport { Md3eBtn, MBtn } from '@anoyomoose/q2-fresh-paint-md3e/components/Md3eBtn'\n\nexport default {\n  components: { Md3eBtn, MBtn },\n}\n```\n\nRegister globally in your app entry point:\n\n```ts\nimport { Md3eBtn, MBtn } from '@anoyomoose/q2-fresh-paint-md3e/components/Md3eBtn'\n\napp.component('Md3eBtn', Md3eBtn)\napp.component('MBtn', MBtn)\n```\n\nIn templates, use the kebab-case name:\n\n```html\n<md3e-btn label=\"Click me\" />\n```\n\nFor tree-shaking purposes, you should import and/or register only what you use! \n\n### `Md3eBtn`\n\nA `QBtn` wrapper that adds MD3E toggle/selection behavior, color family shortcuts, and variant shortcuts.\n\n```vue\n<md3e-btn v-model=\"isActive\" label=\"Toggle me\" />\n<md3e-btn elevated label=\"Elevated\" />\n<md3e-btn tonal secondary label=\"Tonal\" />\n```\n\nMust-know in short:\n- The wrapper ignores most coloring settings (unless `allow-color` is set); you should generally only use `primary` (mostly), and `secondary`, `tertiary` and `error` (scarcely), as these move with the theme. Per the spec, if no color is specified for a `tonal` button, it uses `secondary` rather than `primary`. Only default, `rounded`, `square`, and `text` buttons support other colors in practise.\n- `tonal` maps to `glossy`, which has been repurposed\n- `text` maps to `flat`, they're the same thing, the MD3E spec just calls them `text`\n- `elevated` similarly maps to `:unelevated=false`\n- You can use `glossy` and `:unelevated=false` directly on any QBtn for the same effect\n- Toggle modes are CSS-driven; while a standard QBtn does not have a `v-model`, the same look can be achieved by adding `q-btn--toggle` and `q-btn--selected` classes.\n- Morph transition can be disabled with `no-morph` attribute or class\n- FABs: `fab-mini` = `md` size, `fab-medium` = ~48px/~24px icon (Md3eBtn only), `fab` = `lg` size; shape is `square`; only default and `tonal` variants should be used\n\nFor full documentation including all props, selection modes, color system, variant shortcuts, and migration guide, see [docs/Md3eBtn.md](docs/Md3eBtn.md).\n\n### `Md3eBtnGroup`\n\nA `QBtnGroup` wrapper that defaults to the MD3E standard group variant (spaced buttons, individual pill shapes). Use `connected` for the connected variant.\n\n```vue\n<md3e-btn-group>\n  <md3e-btn v-model=\"styles\" value=\"bold\" icon=\"format_bold\" />\n  <md3e-btn v-model=\"styles\" value=\"italic\" icon=\"format_italic\" />\n</md3e-btn-group>\n```\n\nMust-know in short: \n- `Md3eBtnGroup` uses the standard group look and behavior by default (which translates to a repurposed `stretch` on the underlying `QBtnGroup`), use the `connected` attribute to get the connected group look and behavior. This is inverse to `QBtnGroup`, which is connected by default and standard by attribute.\n- You can indeed just use `QBtn` instead of `Md3eBtn`\n- Shape definitions do not inherit properly (nor do they on `QBtnGroup` anymore), due to a combination of how Quasar's CSS rules work and the MD3E specification. You should not use them on the group at all; rather you should specify each button's shape and style explicitly if you want to depart from MD3E's default behavior, in so far as the design will actually allow it (some things are just forced by the specification). Particularly in connected groups, look and feel is probably initially different from what you'd expect!\n- Transitions do not work on dense buttons\n- You should not mix sizes and dense in the same group\n- Widening transition can be disabled with `no-widening` attribute or class\n\nFor full documentation including group variants, shape morphing, design props, and known limitations, see [docs/Md3eBtnGroup.md](docs/Md3eBtnGroup.md).\n\n### `Md3eToolbar`\n\nA `QToolbar` wrapper with MD3E variant shortcuts for docked and floating toolbars.\n\n```vue\n<!-- use tonal for toggle buttons! -->\n\n<!-- AppBar (docked toolbar) -->\n<md3e-toolbar>\n  <!-- buttons SHOULD be (round) square, and SHOULD NOT be either dense nor stretch -->\n  <md3e-btn round square text icon=\"sym_r_menu\" />\n  <q-toolbar-title>My App</q-toolbar-title>\n  <md3e-btn square text icon=\"sym_r_search\" />\n</md3e-toolbar>\n\n<!-- Docked toolbar -->\n<md3e-toolbar between><!-- between: spreads buttons evenly -->\n  <!-- buttons SHOULD be (round) square, and SHOULD NOT be either dense nor stretch -->\n  <md3e-btn round square tonal icon=\"sym_r_format_bold\" v-model=\"myToggle\" />\n  <md3e-btn square text icon=\"sym_r_brush\" />\n  <md3e-btn round square icon=\"sym_r_palette\" />\n</md3e-toolbar>\n\n<!-- Floating toolbar -->\n<md3e-toolbar floating>\n  <!-- buttons MAY NOT be square when floating, PREFER round, NO label -->\n  <md3e-btn round tonal icon=\"sym_r_format_bold\" v-model=\"myToggle\" />\n  <md3e-btn round text icon=\"sym_r_brush\" />\n  <md3e-btn round icon=\"sym_r_palette\" />\n</md3e-toolbar>\n\n<!-- Floating vertical vibrant toolbar -->\n<md3e-toolbar floating vertical vibrant>\n  <!-- buttons MAY NOT be square when floating, PREFER round, NO label -->\n  <md3e-btn round tonal icon=\"sym_r_format_bold\" v-model=\"myToggle\" />\n  <md3e-btn round text icon=\"sym_r_brush\" />\n  <md3e-btn round icon=\"sym_r_palette\" />\n</md3e-toolbar>\n```\n\nMust-know in short:\n- Toolbars are slightly larger now: Quasar's examples use `dense` icons and `stretch` buttons - remove both attributes from your existing code for a better look\n- Your toolbar probably uses something like `class=\"bg-primary text-white\"` - for MD3E look remove them, or change to `class=\"bg-primary text-on-primary\"` to force your primary\n- Avoid setting toolbar color and/or button colors\n- Toolbars now use `gap` (8px), so all your `q-m...` classes inside it are wrong, and should probably just be removed. Use `no-gap` to disable.\n- For docked toolbars (including the app bar), buttons should be `round square` or `square`, and optionally `flat`, or `tonal` for toggle buttons\n- For floating toolbars, buttons should be icon-only, `round square` (preferred) or `square`, and optionally `flat`, or `tonal` for toggle buttons\n- `floating` makes the toolbar auto-sized, pill-shaped, with FAB-level elevation and 16dp margin (`.q-toolbar--floating`)\n- `vibrant` (requires `floating`) uses `primary-container` background for higher emphasis (`.q-toolbar--floating--vibrant`)\n- `vertical` (requires `floating`) switches to column layout (`.q-toolbar--floating--vertical`)\n- `surface` overrides the background to `surface`, if you want the toolbar (usually the app bar) to have the same color as the body (`.bg-surface`)\n\nFor full documentation, see [docs/Md3eToolbar.md](docs/Md3eToolbar.md).\n\n### `Md3eFab` / `Md3eFabAction`\n\n`QFab` / `QFabAction` wrappers that default to MD3E FAB menus.\n\nMD3E FAB Menus are much more restricted than all the options Quasar provides. Implementation and testing has been limited to the spec:\n- Only `primary`, `secondary`, `tertiary` and `error` colors are supported. Others at your own risk\n- The menu button itself uses the `tonal` color scheme when closed, and the `filled` scheme when open and showing a close icon\n- An icon is required, a label is optional and not recommended\n- Only `direction=\"up\"` is supported\n- Menus on the left side of the screen should use `label-position=\"left\" vertical-align=\"left\"` on the `QFab`, and `label-position=\"left\"` on the `QFabAction`; menus on the right side of the screen can omit these attributes as they default to `right`.\n- A `QFabAction` corresponds to a `<q-btn size=\"lg\" />`\n- `QFabAction`s **require** *both* an icon *and* a label\n- `QFabAction` automatically use the right `tonal` color (supported colors only)\n- The spec removes shadows from the popups, but that just looks bad, so they're kept\n\nUsing `QFab`:\n\n```vue\n<q-fab secondary icon=\"sym_r_edit\" label=\"Edit\" label-position=\"left\" vertical-actions-align=\"left\" direction=\"up\">\n  <q-fab-action icon=\"sym_r_mail\" label=\"Mail\" label-position=\"left\" />\n  <q-fab-action icon=\"sym_r_alarm\" label=\"Alarm\" label-position=\"left\"/>\n</q-fab>\n```\n\nUsing `Md3eFab` / `Md3eFabAction`:\n- Supports `primary` (default), `secondary`, `tertiary`, `error` attributes as well as `allow-color` (at your own risk), like `Md3eBtn` does\n- `label-position`, `vertical-actions-align`, `direction` automatically set if `left` attribute is used\n- `left` attribute automatically propagates to children\n- `mini` supported (`q-fab--mini`) - note this only changes the size of the FAB, not of the popups\n- `medium` supported (`q-fab--medium`) - ~48px square, ~24px icon; same note about popups\n\n```vue\n<md3e-fab secondary left icon=\"sym_r_edit\" label=\"Edit\">\n  <md3e-fab-action icon=\"sym_r_mail\" label=\"Mail\" />\n  <md3e-fab-action icon=\"sym_r_alarm\" label=\"Alarm\" />\n</md3e-fab>\n```\n\n### `Md3eSlider`\n\nA `QSlider` wrapper with MD3E `size` shortcuts and `icon` capability.\n\nThese sizes correspond to the MD3E specification, not to Quasar sizes of the same name. `sm` is the default. Mappings:\n\n| size | track-size | thumb-size | icon-size | corner size |\n|:----:|:----------:|:----------:|:---------:|:-----------:|\n|  xs  |    16px    |    32px    |   12px    |     8px     |\n|  sm  |    24px    |    44px    |   16px    |     8px     |\n|  md  |    40px    |    52px    |   24px    |    12px     |\n|  lg  |    56px    |    68px    |   28px    |    16px     |\n|  xl  |    96px    |   108px    |   32px    |    28px     |\n\nImplemented as a wrapper as the MD2 slider default sizes are quite different, and `icon` support had to be bolted on. \nUsing a `QSlider` with this theme gives you the same style but a thin track. You can replicate `Md3eSlider` behavior\nwith a `QSlider` by passing the `track-size` and `thumb-size` values from this map, and setting the `q-slider--{size}`\nclass.\n\n`icon-size` (CSS units) and `icon-color` (palette) attributes are also available.\n\n### `QMenu`\n\nThere is no specific wrapper for `QMenu`, vibrant color scheme menus can be created by using the `q-menu--vibrant` class:\n\n```vue\n<q-menu anchor=\"top right\" self=\"bottom right\" class=\"q-menu--vibrant\">\n  <!-- ... -->\n</q-menu>\n\n<q-select\n  popup-content-class=\"q-menu--vibrant\"\n  <!-- ... -->\n/>\n```\n\n### `QDrawer`\n\nThere is no specific wrapper for `QDrawer`. MD3E styles for collapsed navigation drawers and navigation rails can be\nachieved with `QList` helper classes, which also feature new animations (not setting any class will keep original\nQuasar behavior). These are made specifically for `mini` mode, desktop mode needs to be forced, and `mini-width`\nneeds to be set correctly. Avatars are supposed to be icons.\n\n**`q-list--drawer`**\n\nStandard `q-list` inside `q-drawer`, with updated styles and animations, MD3 (non-Expressive). `mini-width` needs to be\nset to `80`.\n\n**`q-list--rail`**\n\nUpdated *rail* style, MD3**E**. The item label appears below the icon in collapsed state, and active/focused indicator\nis a smaller pill around the icon and excludes the label. `mini-width` needs to be set to `96`. Padding is slightly\nwider on the rail to allow for longer labels in collapsed state.\n\n**`q-list--rail q-list--rail--narrow`**\n\nIf your item labels are small enough, you can use the narrow variant of the rail (you need to set both classes), it\nkeeps the old drawer-style paddings rather than the new rail-style paddings. `mini-width` needs to be set to `80`.\n\n**Recipe:**\n\n```vue\n<!-- use the correct mini-width! -->\n<q-drawer v-model=\"drawerLeftOpen\" :width=\"300\" :mini-width=\"96\" mini behavior=\"desktop\" bordered>\n  \n  <!-- pick your style -->\n  <q-list class=\"q-list--rail\">\n    \n    <!-- Top FABs are supported, but you need to set q-pa-none on q-item -->\n    <q-item class=\"q-pa-none q-mb-lg\">\n      <!-- You must use the medium size FAB, label optional -->\n      <m-btn fab-medium icon=\"sym_r_edit\" label=\"Fab\" />\n    </q-item>\n    \n    <!-- standard home item, two icons, simple label -->\n    <q-item clickable v-ripple :active=\"activeNav === 'home'\" @click=\"activeNav = 'home'\">\n      <q-item-section avatar><q-icon name=\"sym_r_home\" /></q-item-section>\n      <q-item-section>Home</q-item-section>\n      <q-item-section avatar><q-icon name=\"sym_r_home\" /></q-item-section>\n    </q-item>\n    \n    <!-- complex inbox item, an icon, label with sub-caption, and right-side badge -->\n    <q-item clickable v-ripple :active=\"activeNav === 'inbox'\" @click=\"activeNav = 'inbox'\">\n      <q-item-section avatar>\n        <q-icon name=\"sym_r_inbox\"><q-badge color=\"error\" floating></q-badge></q-icon>\n      </q-item-section>\n      <q-item-section>\n        <q-item-label>Inbox</q-item-label>\n        <q-item-label caption>You're so behind!</q-item-label>\n      </q-item-section>\n      <q-item-section side>\n        <q-badge color=\"error\">123</q-badge>\n      </q-item-section>\n    </q-item>\n  </q-list>\n</q-drawer>\n```\n\n### Navigation bar\n\nBoth narrow (icons above label, narrow screens) and wide (icons next to label, wider screens)\nnavigation bars have been implemented the same as the navigation rail (see `QDrawer`). They use the \n`q-list--rail-h--wide` and `q-list--rail-h--narrow` classes:\n\n```vue\n<q-footer>\n  <q-list class=\"q-list--rail-h--wide\">\n    <q-item clickable v-ripple :active=\"activeNav === 'home'\" @click=\"activeNav = 'home'\">\n      <q-item-section avatar><q-icon name=\"sym_r_home\" /></q-item-section>\n      <q-item-section>Home</q-item-section>\n    </q-item>\n    <!-- ... -->        \n  </q-list>\n</q-footer>\n```\n\nButtons and FABs are not supported here, though.\n\n### `QBadge`\n\nThe standard Quasar badge extends to the left from the right side of the target. Added `q-badge--center` class that\nkeeps the middle of the badge on the right side of the target, and `q-badge--right` that extends longer badges to the\nright. Intended for use with *floating* badges.\n\n### `QTabs`\n\nPer MD3E specs, primary tabs should be icon above label (*not* `inline-label`) have `narrow-indicator` set, and be\nequal width (`class=\"q-tabs--equal\"` inside `QToolbar`, `align=\"justify\"` elsewhere). When used inside a `QToolbar`,\nyou also need to replace `shrink` with `stretch` for the buttons to fit:\n\n```vue\n<q-toolbar>\n  <q-tabs narrow-indicator stretch class=\"q-tabs--equal\" />\n</q-toolbar>\n```\n\nSecondary tabs should have `inline-label` and *wide* indicators:\n\n```vue\n<q-tabs inline-label align=\"justify\" />\n```\n\n## Boot File\n\nThe boot file (`~@anoyomoose/q2-fresh-paint-md3e/boot`) must be registered in the `boot` array of `quasar.config.js`. It runs at app startup and does two things:\n\n**1. Component prop defaults** -- patches the following Quasar components to match MD3E conventions:\n\n| Component | Props changed | Reason |\n|---|---|---|\n| `QBtn` | `noCaps: true`, `unelevated: true` | MD3E uses sentence case and filled (no shadow) as the default button variant |\n| `QBtnDropdown` | `noCaps: true`, `unelevated: true` | Same as QBtn |\n| `QChip` | `square: true` | MD3E chips use `corner-small` (8px), not pill shape; `square` disables the default radius so the CSS override applies |\n| `QTabs` | `noCaps: true` | MD3E tabs use sentence case |\n\n**2. Outlined field notch observer** -- sets up MutationObserver + ResizeObserver watchers that calculate and animate the notch gap in outlined text fields (`q-field--outlined`). The notch animates open/closed as the label floats. Add the `.no-input-notch` class to a field or its ancestor to opt out.\n\n## User Overrides\n\nNon-color variable overrides (e.g., `$button-padding: 8px 24px`) can go in `src/css/quasar.variables.scss` — that file has the highest priority since Quasar loads it before any theme variables. **Do not put color overrides there** — they break runtime palette switching. See [the colors documentation](docs/colors.md#user-overrides) for details.\n\nFor color and theme token overrides, place files in `src/theme/md3e/`. Three variable override files are available, each at a different point in the import chain:\n\n- **`variables.pre.scss`** - before the generated palette. Override individual `$md3-*` palette tokens:\n  ```scss\n  $md3-primary: #ff0000 !default;  // force primary, let rest of palette generate\n  ```\n\n- **`variables.scss`** - after the generated palette, before the package's own variables. Remap palette tokens or override non-color theme variables:\n  ```scss\n  $md3-primary: $md3-tertiary !default;  // remap primary to tertiary palette\n  $button-border-radius: $md3-corner-large !default;  // reference a shape token\n  ```\n\n- **`variables.post.scss`** - after everything. Can reference all tokens. Use hard assignments (no `!default`):\n  ```scss\n  $generic-border-radius: 16px;  // force a specific shape\n  ```\n\nVariable files **extend** the theme (all are imported, yours just has higher priority). Component overrides (`components/QBtn.scss`) and `base.scss` **replace** the theme's files entirely.\n\nSee the [core package documentation](https://github.com/anoyomoose/q2-fresh-paint-core/blob/main/README.md#user-overrides) for the full override mechanism, directory layout, and how to extend replaced files.\n\n## Implementation notes\n\n- **Button variant mapping** MD3E button variants are mapped to Quasar props: Filled (default, `unelevated`), Elevated (`:unelevated=\"false\"`), Outlined (`outline`), Text (`flat`), Tonal (`glossy`). The `push` prop is kept as a Quasar-specific variant. The `square` prop is repurposed as MD3E's \"square\" button shape option, where the default is now \"pill\" shaped. Arbitrary colors (not `primary` / `secondary` / `teriary` / `error` or an alias) are *not* supported on `elevated`, `total` or `toggle` buttons!\n- **Button groups** Split QBtnDropdown components inside groups render as nested wrapper divs, so they don't participate in the press morph/widen interaction, and should not be used (they look bad).\n- **Split button dropdowns** icon gets filled look in case of Tonal (`glossy`), not fixable without code changes\n- **Segmented buttons** MD3E's deprecated \"segmented buttons\" are implemented via Quasar's QBtnToggle component (themed in QBtnToggle.scss). The default variant (no design prop) is styled as a segmented button with checkmark icon via CSS mask. Consider if you don't mean to use a connected button group instead.\n- **text-white/black** to maintain correct contrast in light and dark modes, the basic background colors have their text colors overridden from Quasar's forced `text-white` and `text-black`. This may cause your own usage of these to be blocked in some cases, and you should use the closest grey (or define your CSS class you add) instead\n- **Outlined text field notch** the MD3E outlined text field label-on-border notch is implemented using a CSS `mask-image` on the `::before`/`::after` border pseudo-elements, with JS (`boot.ts`) measuring the label width via `ResizeObserver` and `MutationObserver` to set `--notch-left`/`--notch-width` custom properties. Add the `.no-input-notch` class to a `<q-input>` or any ancestor element to disable the notch and revert to standard Quasar outlined behavior (label floats inside the box). \n- **MD3E app bars use `surface-container`, not `primary`** MD3E toolbars, headers, and footers use `surface-container` background with `on-surface` text/icons. This is a deliberate departure from MD2 where `bg-primary text-white` was the standard toolbar pattern. Apps migrating from MD2 to MD3E will need to remove `bg-primary`/`text-white` from their headers and footers. Floating toolbars support a `vibrant` variant with `secondary-container` background and its own child component token remapping. The vertical floating toolbar overrides QToolbar's hardcoded `flex-direction: row` with `!important`.\n- **Shape morphing** uses CSS `:active` which may not trigger reliably on all mobiles browsers\n- **QSlider** handle is approximated with CSS pseudo-element, stop indicators not implemented\n- **Surface tint deprecated** we use tone-based surface containers (correct per Feb 2023 spec update)\n- **Dense variants** of QToggle and QSlider are proportionally scaled approximations\n- **QCarousel** is fundamentally different from MD3E carousel and not themed\n- **QToggle three-state animation** When transitioning from indeterminate (middle) to ON, the thumb briefly snaps to the OFF position before animating to ON. This is caused by Quasar's JS removing the `--indet` class (resetting `left` to the base OFF value) before adding `--truthy` in the same frame. The CSS transition then animates from OFF to ON instead of middle to ON. This is a Quasar core behavior that cannot be fixed via CSS theming alone.\n- **Per-component dark mode** Quasar's base `.q-dark` rule is stripped via `stripRules`. The theme replaces it with `body.body--light .q-dark` which flips all `--md3-*` aliases to their `--dark` constants, plus a fallback `background: var(--md3-surface)` and `color: var(--md3-on-surface)` for unthemed components. Themed components override the fallback background via source order. A corresponding `body.body--dark .q-light` rule flips aliases back to `--light` constants for light-mode overrides within a dark page.\n- **Claude** has been a massive help getting all of this done\n","readmeFilename":"README.md"}