diff --git a/packages/gui/vite.config.ts b/packages/gui/vite.config.ts index d80b0db..d5d67a0 100644 --- a/packages/gui/vite.config.ts +++ b/packages/gui/vite.config.ts @@ -16,6 +16,11 @@ const config: UserConfig = { $libs: path.resolve('./src/libs'), $appcss: path.resolve('./src/app.css') } + }, + server: { + fs: { + allow: ['..'] + } } }; diff --git a/packages/ui/.gitignore b/packages/ui/.gitignore index 6635cf5..dacbf58 100644 --- a/packages/ui/.gitignore +++ b/packages/ui/.gitignore @@ -8,3 +8,5 @@ node_modules !.env.example vite.config.js.timestamp-* vite.config.ts.timestamp-* +scripts/*.zip +scripts/*.css \ No newline at end of file diff --git a/packages/ui/README.md b/packages/ui/README.md index a39dd21..7dc7768 100644 --- a/packages/ui/README.md +++ b/packages/ui/README.md @@ -11,6 +11,12 @@ $ pnpm install # assuming you have not done so $ pnpm dev ``` +### How to update icons + +1. update fontastic.me tea-icons, you would probably need tom's credentials +2. run `pnpm update-icons` +3. stage and commit the changes + ## Todo [] setup a scaffolding script to make it easier making elements @@ -21,3 +27,4 @@ This library is dependent on the following - [svelte](https://svelte.dev/) - [tailwind](https://tailwindcss.com/) +- [fontastic](https://fontastic.me) diff --git a/packages/ui/package.json b/packages/ui/package.json index f922f12..407aff1 100644 --- a/packages/ui/package.json +++ b/packages/ui/package.json @@ -11,7 +11,8 @@ "lint": "prettier --plugin-search-dir . --check . && eslint .", "format": "prettier --plugin-search-dir . --write .", "dev": "storybook dev -p 6006", - "build-storybook": "storybook build" + "build-storybook": "storybook build", + "update-icons": "node scripts/update-icons.js" }, "files": [ "src/**/*", diff --git a/packages/ui/scripts/update-icons.js b/packages/ui/scripts/update-icons.js new file mode 100644 index 0000000..513b2da --- /dev/null +++ b/packages/ui/scripts/update-icons.js @@ -0,0 +1,46 @@ +import https from 'https'; +import fs from 'fs'; +import path from 'path'; + +const fontasticDownloadURI = 'https://file.myfontastic.com/Fd33ifaooDVpESwnDXETgR/icons.css'; +// i tried the zip dl unfortunately its auth protected so have to hack our way into the resources + +const downloadFileTo = async (uri, path) => { + return new Promise((resolve) => { + const file = fs.createWriteStream(path); + https.get(uri, (res) => { + res.pipe(file); + file.on('finish', () => { + file.close(); + console.log(`downloaded: ${uri}`); + resolve(); + }); + }); + }); +}; + +async function main() { + const tmpIconsCss = './scripts/icons.css'; + const iconsFolder = './src/icons/'; + await downloadFileTo(fontasticDownloadURI, tmpIconsCss); // works + + const cssFile = fs.readFileSync(tmpIconsCss, 'utf-8'); + + const matches = cssFile.matchAll(/url\(.*?\)/gi); + const [url] = matches.next().value; + const fileVersion = url.split('/').pop().split('.')[0]; + + const exts = ['eot', 'woff', 'ttf', 'svg']; + + for (const ext of exts) { + const uri = `https://file.myfontastic.com/Fd33ifaooDVpESwnDXETgR/fonts/${fileVersion}.${ext}`; + await downloadFileTo(uri, path.join(iconsFolder, `fonts/tea-icons.${ext}`)); + } + + const newCssFile = cssFile + .replaceAll('https://file.myfontastic.com/Fd33ifaooDVpESwnDXETgR/', '') + .replaceAll('1669684803', 'tea-icons'); + await fs.writeFileSync(path.join(iconsFolder, 'icons.css'), newCssFile, { encoding: 'utf-8' }); +} + +main(); diff --git a/packages/ui/src/PackageCard/PackageCard.css b/packages/ui/src/PackageCard/PackageCard.css deleted file mode 100644 index 7ddd2d1..0000000 --- a/packages/ui/src/PackageCard/PackageCard.css +++ /dev/null @@ -1 +0,0 @@ -@import '../app.css'; diff --git a/packages/ui/src/PackageCard/PackageCard.svelte b/packages/ui/src/PackageCard/PackageCard.svelte index 8b0cde6..fb7e727 100644 --- a/packages/ui/src/PackageCard/PackageCard.svelte +++ b/packages/ui/src/PackageCard/PackageCard.svelte @@ -1,5 +1,5 @@ -
-
+
+
- +