diff --git a/README.md b/README.md index 4ad8bfe8..5384025f 100644 --- a/README.md +++ b/README.md @@ -13,14 +13,27 @@

- +

-> [!IMPORTANT] -> The repository is currently a WIP towards v1. New icons and features may wait until the release. - - - +## Previews + +
+🌻 Latte + +
+
+🪴 Frappé + +
+
+🌺 Macchiato + +
+
+🌿 Mocha + +
## 💝 Thanks to diff --git a/assets/frappe.webp b/assets/frappe.webp new file mode 100644 index 00000000..4b1f7eef Binary files /dev/null and b/assets/frappe.webp differ diff --git a/assets/latte.webp b/assets/latte.webp new file mode 100644 index 00000000..e4277df2 Binary files /dev/null and b/assets/latte.webp differ diff --git a/assets/macchiato.webp b/assets/macchiato.webp new file mode 100644 index 00000000..6c60ce45 Binary files /dev/null and b/assets/macchiato.webp differ diff --git a/assets/mocha.webp b/assets/mocha.webp new file mode 100644 index 00000000..6becf3ff Binary files /dev/null and b/assets/mocha.webp differ diff --git a/scripts/preview.ts b/scripts/preview.ts index 2326c32a..68afae9c 100644 --- a/scripts/preview.ts +++ b/scripts/preview.ts @@ -1,61 +1,93 @@ import { readdir, writeFile } from 'node:fs/promises' import { join, resolve } from 'node:path' -import { temporaryWriteTask } from 'tempy' -import { flavors } from '@catppuccin/palette' +import type { FlavorName } from '@catppuccin/palette' +import { flavorEntries, flavors } from '@catppuccin/palette' import { launch } from 'puppeteer' +import { temporaryDirectoryTask } from 'tempy' const allIcons = await readdir('icons/latte') const fileIcons = allIcons.filter(i => !i.startsWith('folder_')) -// const folderIcons = allIcons.filter(i => i.startsWith('folder_') && !i.endsWith('_open.svg')) -const icons = fileIcons.toSorted(() => 0.5 - Math.random()).map(i => `${resolve(join('icons', 'latte', i))}`) +const folderIcons = allIcons.filter(i => i.startsWith('folder_') && !i.endsWith('_open.svg')) -// console.log(icons.map(i => resolve(i))) +function iconPath(icon: string, flavor: FlavorName) { + return `${resolve(join('icons', flavor, icon))}` +} -const html = ` +function generateHtml(flavor: FlavorName) { + return ` + -
- ${Array(3).fill(icons).flat().map(i => ``).join('\n')} +
+
+ ${fileIcons.map(i => ` +
+ + ${i.slice(0, -4)} +
+ `).join('\n')} +
+
+ ${folderIcons.map(i => ` +
+ + ${i.slice(7, -4)} +
+ `).join('\n')} +
` -await temporaryWriteTask(html, async (f) => { - const browser = await launch({ headless: 'new' }) - const page = await browser.newPage() - await page.setViewport({ - height: 300, - width: 600, - deviceScaleFactor: 3, - }) - await page.goto(join('file:', f)) - await page.screenshot({ - path: join(`latte.png`), - // fullPage: true, - omitBackground: true, - // captureBeyondViewport: true, - }) - await browser.close() -}, { extension: 'html' }) -await writeFile('preview.html', html) +} + +await temporaryDirectoryTask(async (tmp) => { + await Promise.all(flavorEntries.map(async ([flavor]) => { + const htmlPath = join(tmp, `${flavor}.html`) + const screenshotPath = join('assets', `${flavor}.webp`) + await writeFile(htmlPath, generateHtml(flavor)) + const browser = await launch({ headless: 'new' }) + const page = await browser.newPage() + await page.goto(join('file:', htmlPath)) + await page.screenshot({ + type: 'webp', + path: screenshotPath, + fullPage: true, + omitBackground: true, + }) + await browser.close() + })) +})