feat: move templates into AFFiNE (#5750)

Related to https://github.com/toeverything/blocksuite/pull/6156

### Change
Move the edgeless templates to AFFiNE. All templates are stored as zip files. Run `node build-edgeless.mjs` in `@affine/templates` to generate JSON-format templates and importing script. The template will be generated automatically during building and dev (`yarn dev`).
This commit is contained in:
Lye Hongtao 2024-02-21 06:26:01 +00:00
parent 53b312c06f
commit 4641bc422b
No known key found for this signature in database
GPG Key ID: 30B1140CE1C07C99
42 changed files with 896 additions and 2 deletions

View File

@ -12,3 +12,4 @@ static
web-static
public
packages/frontend/i18n/src/i18n-generated.ts
packages/frontend/templates/edgeless-templates.gen.ts

3
.gitignore vendored
View File

@ -79,3 +79,6 @@ lib
affine.db
apps/web/next-routes.conf
.nx
packages/frontend/templates/edgeless
packages/frontend/core/public/static/templates

View File

@ -16,6 +16,7 @@ packages/frontend/i18n/src/i18n-generated.ts
packages/frontend/graphql/src/graphql/index.ts
tests/affine-legacy/**/static
.yarnrc.yml
packages/frontend/templates/edgeless-templates.gen.ts
packages/frontend/templates/templates.gen.ts
packages/frontend/templates/onboarding

View File

@ -0,0 +1,7 @@
import { builtInTemplates } from '@affine/templates/edgeless';
import {
EdgelessTemplatePanel,
type TemplateManager,
} from '@blocksuite/blocks';
EdgelessTemplatePanel.templates.extend(builtInTemplates as TemplateManager);

View File

@ -1,4 +1,5 @@
import './register-blocksuite-components';
import './edgeless-template';
import { setupGlobal } from '@affine/env/global';
import * as Sentry from '@sentry/react';

View File

@ -0,0 +1,314 @@
import { existsSync, mkdirSync, readFileSync, statSync } from 'node:fs';
import fs from 'node:fs/promises';
import path, { join } from 'node:path';
import { fileURLToPath } from 'node:url';
import JSZip from 'jszip';
const __dirname = join(fileURLToPath(import.meta.url), '..');
const ZIP_PATH = join(__dirname, './edgeless-snapshot');
const ASSETS_PREFIX = `/static/templates`;
const ASSETS_PATH = join(__dirname, '../core/public/', ASSETS_PREFIX);
const TEMPLATE_PATH = join(__dirname, './edgeless');
const getZipFilesInCategroies = () => {
return fs.readdir(ZIP_PATH).then(folders => {
return Promise.all(
folders
.filter(folder => {
return statSync(join(ZIP_PATH, folder)).isDirectory();
})
.map(async folder => {
const files = await fs.readdir(join(ZIP_PATH, folder));
return {
category: folder,
files: files.filter(file => path.extname(file) === '.zip'),
};
})
);
});
};
const setupFolder = async () => {
if (!existsSync(ASSETS_PATH)) {
mkdirSync(ASSETS_PATH);
}
if (!existsSync(TEMPLATE_PATH)) {
mkdirSync(TEMPLATE_PATH);
}
};
/**
* @typedef Block
* @type {object}
* @property {string} flavour
* @property {Array<Block> | undefined} children
* @property {object} props
* @property {string} props.sourceId
*/
/**
* @param {Block} block
*/
const convertSourceId = (block, assetsExtMap) => {
if (block.props?.sourceId) {
const extname = assetsExtMap[block.props.sourceId];
if (!extname) {
console.warn(`No extname found for ${block.props.sourceId}`);
}
block.props.sourceId = `${ASSETS_PREFIX}/${block.props.sourceId}${
extname ?? ''
}`;
}
if (block.children && Array.isArray(block.children)) {
block.children.forEach(block => convertSourceId(block, assetsExtMap));
}
};
const parseSnapshot = async () => {
const filesInCategroies = await getZipFilesInCategroies();
await setupFolder();
/**
* @type {Array<{ category: string, templates: string[] }}>}
*/
const templatesInCategory = [];
for (let cate of filesInCategroies) {
const templates = [];
const assetsExtentionMap = {};
for (let file of cate.files) {
const templateName = path.basename(file, '.zip');
const zip = new JSZip();
const { files: unarchivedFiles } = await zip.loadAsync(
readFileSync(join(ZIP_PATH, cate.category, file))
);
/**
* @type {Array<JSZip.JSZipObject>}
*/
const assetsFiles = [];
/**
* @type {Array<JSZip.JSZipObject>}
*/
const snapshotFiles = [];
Object.entries(unarchivedFiles).forEach(([name, fileObj]) => {
if (name.includes('MACOSX') || name.includes('__MACOSX')) return;
if (name.startsWith('assets/') && !fileObj.dir) {
assetsFiles.push(fileObj);
return;
}
if (name.endsWith('.snapshot.json')) {
snapshotFiles.push(fileObj);
return;
}
});
await Promise.all(
assetsFiles.map(async file => {
const blob = await file.async('blob');
const arrayBuffer = await blob.arrayBuffer();
const buffer = Buffer.from(arrayBuffer, 'binary');
const extname = path.extname(file.name);
assetsExtentionMap[
file.name.replace('assets/', '').replace(extname, '')
] = extname;
await fs.writeFile(
join(ASSETS_PATH, file.name.replace('assets/', '')),
buffer
);
})
);
await Promise.all(
snapshotFiles.map(async snapshot => {
const json = await snapshot.async('text');
const snapshotContent = JSON.parse(json);
const previewPath = join(
ZIP_PATH,
cate.category,
`${templateName}.svg`
);
let previewContent = '';
if (existsSync(previewPath)) {
const previewFile = readFileSync(previewPath, 'utf-8');
previewContent = previewFile
.replace(/\n/g, '')
.replace(/\s+/g, ' ')
.replace('fill="white"', 'fill="currentColor"');
} else {
console.warn(`No preview found for ${templateName}`);
}
convertSourceId(snapshotContent.blocks, assetsExtentionMap);
const template = {
name: templateName,
type: 'template',
preview: previewContent,
content: snapshotContent,
};
await fs.writeFile(
join(join(TEMPLATE_PATH, `${templateName}.json`)),
JSON.stringify(template, undefined, 2)
);
templates.push(templateName);
})
);
}
templatesInCategory.push({
category: cate.category,
templates,
});
}
return templatesInCategory;
};
function numberToWords(n) {
const ones = [
'Zero',
'One',
'Two',
'Three',
'Four',
'Five',
'Six',
'Seven',
'Eight',
'Nine',
];
if (n < 10) {
return ones[n];
} else {
throw new Error(`Not implemented: ${n}`);
}
}
const camelCaseNumber = variable => {
const words = variable.split(' ');
return words
.map(word => word.charAt(0).toUpperCase() + word.slice(1))
.join('');
};
const toVariableName = name => {
const converted = Array.from(name).reduce((pre, char) => {
if (char >= '0' && char <= '9') {
return pre + numberToWords(char - '0');
}
return pre + char;
}, '');
return camelCaseNumber(converted);
};
/**
*
* @param {Array<{category: string, templates: string[]}} templatesInGroup
*/
const buildScript = async templatesInGroup => {
const templates = [];
const templateVariableMap = {};
templatesInGroup.forEach(group => {
group.templates.forEach(template => {
templates.push(template);
templateVariableMap[template] = toVariableName(template);
});
});
const importStatements = templates
.map(template => {
return `import ${toVariableName(
template
)} from './edgeless/${template}.json';`;
})
.join('\n');
const templatesDeclaration = templatesInGroup.map(group => {
return `'${group.category}': [
${group.templates
.map(template => templateVariableMap[template])
.join(',\n ')}
]`;
});
const code = `${importStatements}
const templates = {
${templatesDeclaration.join(',\n ')}
}
function lcs(text1: string, text2: string) {
const dp: number[][] = Array.from({ length: text1.length + 1 })
.fill(null)
.map(() => Array.from<number>({length: text2.length + 1}).fill(0));
for (let i = 1; i <= text1.length; i++) {
for (let j = 1; j <= text2.length; j++) {
if (text1[i - 1] === text2[j - 1]) {
dp[i][j] = dp[i - 1][j - 1] + 1;
} else {
dp[i][j] = Math.max(dp[i - 1][j], dp[i][j - 1]);
}
}
}
return dp[text1.length][text2.length];
}
export const builtInTemplates = {
list: async (category: string) => {
// @ts-expect-error type should be asserted when using
return templates[category] ?? []
},
categories: async () => {
return Object.keys(templates)
},
search: async(query: string) => {
const candidates: unknown[] = [];
const cates = Object.keys(templates);
query = query.toLowerCase();
for(let cate of cates) {
// @ts-expect-error type should be asserted when using
const templatesOfCate = templates[cate];
for(let temp of templatesOfCate) {
if(lcs(query, temp.name.toLowerCase()) === query.length) {
candidates.push(temp);
}
}
}
return candidates;
},
}
`;
await fs.writeFile(join(__dirname, './edgeless-templates.gen.ts'), code, {
encoding: 'utf-8',
});
};
async function main() {
const templatesInGroup = await parseSnapshot();
await buildScript(templatesInGroup);
}
main();

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 35 KiB

View File

@ -0,0 +1,20 @@
<svg width="135" height="80" viewBox="0 0 135 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="135" height="80" fill="white"/>
<rect x="8" y="31" width="19" height="12" rx="0.728829" fill="#F16F6F"/>
<rect x="51" y="7" width="16" height="16" rx="0.728829" fill="#9DD194"/>
<path d="M81.1768 15.1768C81.2744 15.0791 81.2744 14.9209 81.1768 14.8232L79.5858 13.2322C79.4882 13.1346 79.3299 13.1346 79.2322 13.2322C79.1346 13.3299 79.1346 13.4882 79.2322 13.5858L80.6464 15L79.2322 16.4142C79.1346 16.5118 79.1346 16.6701 79.2322 16.7678C79.3299 16.8654 79.4882 16.8654 79.5858 16.7678L81.1768 15.1768ZM67 15.25H81V14.75H67V15.25Z" fill="#7CC270"/>
<path d="M107.177 65.1768C107.274 65.0791 107.274 64.9209 107.177 64.8232L105.586 63.2322C105.488 63.1346 105.33 63.1346 105.232 63.2322C105.135 63.3299 105.135 63.4882 105.232 63.5858L106.646 65L105.232 66.4142C105.135 66.5118 105.135 66.6701 105.232 66.7678C105.33 66.8654 105.488 66.8654 105.586 66.7678L107.177 65.1768ZM93 65.25H107V64.75H93V65.25Z" fill="#FFD338"/>
<rect x="81" y="9" width="12" height="12" rx="0.728829" fill="#9DD194"/>
<rect x="112" y="19" width="12" height="12" rx="0.728829" fill="#ED8CBD"/>
<rect x="112" y="37" width="12" height="12" rx="0.728829" fill="#ED8CBD"/>
<rect x="81" y="59" width="12" height="12" rx="0.728829" fill="#FFDE6B"/>
<rect x="51" y="51" width="16" height="16" rx="0.728829" fill="#FFDE6B"/>
<rect x="81" y="31" width="12" height="12" rx="0.728829" fill="#ED8CBD"/>
<rect x="107" y="59" width="12" height="12" rx="0.728829" fill="#FFDE6B"/>
<path d="M51.1768 15.1769C51.2744 15.0792 51.2744 14.9209 51.1768 14.8233L49.5859 13.2322C49.4882 13.1346 49.3299 13.1346 49.2323 13.2322C49.1347 13.3299 49.1347 13.4882 49.2323 13.5858L50.6464 15.0001L49.2322 16.4142C49.1345 16.5118 49.1345 16.6701 49.2322 16.7678C49.3298 16.8654 49.4881 16.8654 49.5857 16.7678L51.1768 15.1769ZM27 37.25C29.6064 37.25 31.4984 35.8069 33.0346 33.7103C34.565 31.6215 35.7728 28.8425 37.004 26.1025C38.242 23.3473 39.505 20.6278 41.1503 18.5948C42.788 16.5711 44.786 15.25 47.5 15.25V14.75C44.5907 14.75 42.4623 16.1789 40.7616 18.2802C39.0686 20.3722 37.7813 23.1527 36.5479 25.8975C35.3077 28.6575 34.1232 31.3785 32.6313 33.4147C31.1451 35.4431 29.3848 36.75 27 36.75V37.25ZM47.5 15.25C48.3245 15.25 49.1995 15.25 49.8683 15.25C50.2028 15.25 50.4857 15.2501 50.685 15.2501C50.7846 15.2501 50.8634 15.2501 50.9172 15.2501C50.9442 15.2501 50.9648 15.2501 50.9788 15.2501C50.9858 15.2501 50.9911 15.2501 50.9946 15.2501C50.9964 15.2501 50.9977 15.2501 50.9986 15.2501C50.9991 15.2501 50.9994 15.2501 50.9997 15.2501C50.9998 15.2501 50.9998 15.2501 50.9999 15.2501C50.9999 15.2501 51 15.2501 51 15.2501C51 15.2501 51 15.2501 51 15.0001C51 14.7501 51 14.7501 51 14.7501C51 14.7501 51 14.7501 50.9999 14.7501C50.9999 14.7501 50.9998 14.7501 50.9997 14.7501C50.9994 14.7501 50.9991 14.7501 50.9987 14.7501C50.9978 14.7501 50.9964 14.7501 50.9946 14.7501C50.9911 14.7501 50.9858 14.7501 50.9788 14.7501C50.9649 14.7501 50.9442 14.7501 50.9173 14.7501C50.8634 14.7501 50.7847 14.7501 50.685 14.7501C50.4857 14.7501 50.2028 14.75 49.8684 14.75C49.1995 14.75 48.3245 14.75 47.5 14.75V15.25Z" fill="#ED3F3F"/>
<path d="M81.1768 37.1769C81.2744 37.0792 81.2744 36.9209 81.1768 36.8233L79.5859 35.2322C79.4883 35.1346 79.33 35.1346 79.2324 35.2322C79.1347 35.3298 79.1347 35.4881 79.2323 35.5857L80.6464 37L79.2321 38.4142C79.1345 38.5118 79.1345 38.6701 79.2321 38.7677C79.3297 38.8654 79.488 38.8654 79.5857 38.7677L81.1768 37.1769ZM67 59.25C67.8169 59.25 68.5092 58.861 69.0998 58.2248C69.6868 57.5926 70.187 56.703 70.6324 55.6608C71.523 53.5771 72.2258 50.8052 72.9445 48.0634C73.6667 45.308 74.4051 42.5818 75.3671 40.5442C76.3381 38.4874 77.4807 37.25 78.9583 37.25V36.75C77.1556 36.75 75.8913 38.2626 74.9149 40.3308C73.9295 42.4182 73.1802 45.192 72.4608 47.9366C71.7378 50.6948 71.0451 53.4229 70.1727 55.4642C69.7366 56.4845 69.2634 57.3137 68.7334 57.8846C68.2071 58.4515 67.6389 58.75 67 58.75V59.25ZM78.9583 37.25C79.4393 37.25 79.9497 37.25 80.3399 37.25C80.535 37.25 80.7 37.2501 80.8162 37.2501C80.8744 37.2501 80.9203 37.2501 80.9517 37.2501C80.9674 37.2501 80.9795 37.2501 80.9876 37.2501C80.9917 37.2501 80.9948 37.2501 80.9969 37.2501C80.9979 37.2501 80.9987 37.2501 80.9992 37.2501C80.9995 37.2501 80.9997 37.2501 80.9998 37.2501C80.9999 37.2501 80.9999 37.2501 80.9999 37.2501C81 37.2501 81 37.2501 81 37.2501C81 37.2501 81 37.2501 81 37.0001C81 36.7501 81 36.7501 81 36.7501C81 36.7501 81 36.7501 81 36.7501C80.9999 36.7501 80.9999 36.7501 80.9998 36.7501C80.9997 36.7501 80.9995 36.7501 80.9992 36.7501C80.9987 36.7501 80.9979 36.7501 80.9969 36.7501C80.9948 36.7501 80.9917 36.7501 80.9877 36.7501C80.9795 36.7501 80.9674 36.7501 80.9517 36.7501C80.9203 36.7501 80.8744 36.7501 80.8163 36.7501C80.7 36.7501 80.535 36.75 80.3399 36.75C79.9497 36.75 79.4393 36.75 78.9583 36.75V37.25Z" fill="#FFD338"/>
<path d="M112.177 25.1768C112.274 25.0792 112.274 24.9209 112.177 24.8233L110.586 23.2322C110.488 23.1346 110.33 23.1346 110.232 23.2322C110.135 23.3299 110.135 23.4881 110.232 23.5858L111.646 25L110.232 26.4142C110.135 26.5118 110.135 26.6701 110.232 26.7678C110.33 26.8654 110.488 26.8654 110.586 26.7678L112.177 25.1768ZM93 37.25C97.1095 37.25 99.0116 34.1068 100.949 31.1366C102.91 28.1288 104.925 25.25 109.229 25.25V24.75C104.629 24.75 102.481 27.8712 100.53 30.8634C98.554 33.8932 96.7933 36.75 93 36.75V37.25ZM109.229 25.25C109.882 25.25 110.575 25.25 111.104 25.25C111.369 25.25 111.593 25.25 111.751 25.25C111.83 25.25 111.892 25.25 111.934 25.25C111.956 25.25 111.972 25.25 111.983 25.25C111.989 25.25 111.993 25.25 111.996 25.25C111.997 25.25 111.998 25.25 111.999 25.25C111.999 25.25 112 25.25 112 25.25C112 25.25 112 25.25 112 25.25C112 25.25 112 25.25 112 25.25C112 25.25 112 25.25 112 25C112 24.75 112 24.75 112 24.75C112 24.75 112 24.75 112 24.75C112 24.75 112 24.75 112 24.75C112 24.75 111.999 24.75 111.999 24.75C111.998 24.75 111.997 24.75 111.996 24.75C111.993 24.75 111.989 24.75 111.983 24.75C111.972 24.75 111.956 24.75 111.934 24.75C111.892 24.75 111.83 24.75 111.751 24.75C111.593 24.75 111.369 24.75 111.104 24.75C110.575 24.75 109.882 24.75 109.229 24.75V25.25Z" fill="#E660A4"/>
<path d="M112.177 41.8232C112.274 41.9208 112.274 42.0791 112.177 42.1768L110.586 43.7678C110.488 43.8654 110.33 43.8654 110.232 43.7678C110.135 43.6701 110.135 43.5118 110.232 43.4142L111.646 42L110.232 40.5858C110.135 40.4882 110.135 40.3299 110.232 40.2322C110.33 40.1346 110.488 40.1346 110.586 40.2322L112.177 41.8232ZM93 36.75C95.0041 36.75 96.481 37.0673 97.7089 37.5485C98.9323 38.0278 99.9003 38.6673 100.874 39.2893C101.85 39.9132 102.839 40.5246 104.132 40.9831C105.423 41.4411 107.028 41.75 109.229 41.75V42.25C106.979 42.25 105.317 41.9339 103.965 41.4544C102.615 40.9754 101.585 40.3368 100.605 39.7107C99.6217 39.0827 98.6959 38.4722 97.5265 38.014C96.3618 37.5577 94.9474 37.25 93 37.25V36.75ZM109.229 41.75C109.882 41.75 110.575 41.75 111.104 41.75C111.369 41.75 111.593 41.75 111.751 41.75C111.83 41.75 111.892 41.75 111.934 41.75C111.956 41.75 111.972 41.75 111.983 41.75C111.989 41.75 111.993 41.75 111.996 41.75C111.997 41.75 111.998 41.75 111.999 41.75C111.999 41.75 112 41.75 112 41.75C112 41.75 112 41.75 112 41.75C112 41.75 112 41.75 112 41.75C112 41.75 112 41.75 112 42C112 42.25 112 42.25 112 42.25C112 42.25 112 42.25 112 42.25C112 42.25 112 42.25 112 42.25C112 42.25 111.999 42.25 111.999 42.25C111.998 42.25 111.997 42.25 111.996 42.25C111.993 42.25 111.989 42.25 111.983 42.25C111.972 42.25 111.956 42.25 111.934 42.25C111.892 42.25 111.83 42.25 111.751 42.25C111.593 42.25 111.369 42.25 111.104 42.25C110.575 42.25 109.882 42.25 109.229 42.25V41.75Z" fill="#E660A4"/>
<path d="M81.1768 64.8232C81.2744 64.9208 81.2744 65.0791 81.1768 65.1768L79.5858 66.7678C79.4882 66.8654 79.3299 66.8654 79.2323 66.7678C79.1346 66.6702 79.1346 66.5119 79.2323 66.4142L80.6464 65L79.2322 63.5858C79.1346 63.4882 79.1346 63.3299 79.2322 63.2322C79.3298 63.1346 79.4881 63.1346 79.5858 63.2322L81.1768 64.8232ZM67 58.75C70.0276 58.75 71.4435 60.3291 72.8829 61.8268C73.6041 62.5772 74.3263 63.3032 75.266 63.846C76.1999 64.3855 77.3599 64.75 78.9583 64.75V65.25C77.2765 65.25 76.0295 64.8645 75.0159 64.279C74.0083 63.6968 73.2428 62.9228 72.5224 62.1732C71.0785 60.6709 69.7955 59.25 67 59.25V58.75ZM78.9583 64.75C79.4393 64.75 79.9497 64.75 80.3399 64.75C80.535 64.75 80.7 64.75 80.8162 64.75C80.8744 64.75 80.9203 64.75 80.9517 64.75C80.9674 64.75 80.9795 64.75 80.9876 64.75C80.9917 64.75 80.9948 64.75 80.9969 64.75C80.9979 64.75 80.9987 64.75 80.9992 64.75C80.9995 64.75 80.9997 64.75 80.9998 64.75C80.9999 64.75 80.9999 64.75 80.9999 64.75C81 64.75 81 64.75 81 64.75C81 64.75 81 64.75 81 65C81 65.25 81 65.25 81 65.25C81 65.25 81 65.25 81 65.25C80.9999 65.25 80.9999 65.25 80.9998 65.25C80.9997 65.25 80.9995 65.25 80.9992 65.25C80.9987 65.25 80.9979 65.25 80.9969 65.25C80.9948 65.25 80.9917 65.25 80.9876 65.25C80.9795 65.25 80.9674 65.25 80.9517 65.25C80.9203 65.25 80.8744 65.25 80.8163 65.25C80.7 65.25 80.535 65.25 80.3399 65.25C79.9497 65.25 79.4393 65.25 78.9583 65.25V64.75Z" fill="#FFD338"/>
<path d="M51.1768 58.8231C51.2744 58.9208 51.2744 59.0791 51.1768 59.1767L49.5859 60.7678C49.4882 60.8654 49.3299 60.8654 49.2323 60.7678C49.1347 60.6701 49.1347 60.5118 49.2323 60.4142L50.6464 58.9999L49.2322 57.5858C49.1345 57.4882 49.1345 57.3299 49.2322 57.2322C49.3298 57.1346 49.4881 57.1346 49.5857 57.2322L51.1768 58.8231ZM27 36.75C29.6064 36.75 31.4984 38.1931 33.0346 40.2897C34.565 42.3785 35.7728 45.1575 37.004 47.8975C38.242 50.6527 39.505 53.3722 41.1503 55.4052C42.788 57.4289 44.786 58.75 47.5 58.75V59.25C44.5907 59.25 42.4623 57.8211 40.7616 55.7198C39.0686 53.6278 37.7813 50.8473 36.5479 48.1025C35.3077 45.3425 34.1232 42.6215 32.6313 40.5853C31.1451 38.5569 29.3848 37.25 27 37.25V36.75ZM47.5 58.75C48.3245 58.75 49.1995 58.75 49.8683 58.75C50.2028 58.75 50.4857 58.7499 50.685 58.7499C50.7846 58.7499 50.8634 58.7499 50.9172 58.7499C50.9442 58.7499 50.9648 58.7499 50.9788 58.7499C50.9858 58.7499 50.9911 58.7499 50.9946 58.7499C50.9964 58.7499 50.9977 58.7499 50.9986 58.7499C50.9991 58.7499 50.9994 58.7499 50.9997 58.7499C50.9998 58.7499 50.9998 58.7499 50.9999 58.7499C50.9999 58.7499 51 58.7499 51 58.7499C51 58.7499 51 58.7499 51 58.9999C51 59.2499 51 59.2499 51 59.2499C51 59.2499 51 59.2499 50.9999 59.2499C50.9999 59.2499 50.9998 59.2499 50.9997 59.2499C50.9994 59.2499 50.9991 59.2499 50.9987 59.2499C50.9978 59.2499 50.9964 59.2499 50.9946 59.2499C50.9911 59.2499 50.9858 59.2499 50.9788 59.2499C50.9649 59.2499 50.9442 59.2499 50.9173 59.2499C50.8634 59.2499 50.7847 59.2499 50.685 59.2499C50.4857 59.2499 50.2028 59.25 49.8684 59.25C49.1995 59.25 48.3245 59.25 47.5 59.25V58.75Z" fill="#ED3F3F"/>
</svg>

After

Width:  |  Height:  |  Size: 10 KiB

View File

@ -0,0 +1,23 @@
<svg width="135" height="80" viewBox="0 0 135 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="135" height="80" fill="white"/>
<line x1="27" y1="45.8907" x2="37" y2="45.8907" stroke="black" stroke-opacity="0.6" stroke-width="0.218649"/>
<line x1="27" y1="45.8907" x2="37" y2="45.8907" stroke="black" stroke-opacity="0.6" stroke-width="0.218649"/>
<path d="M53 46H57.2695V32.4864V26.0002L63 26" stroke="black" stroke-opacity="0.6" stroke-width="0.218649"/>
<path d="M81 26H99.2825V16V11L105 11.0002" stroke="black" stroke-opacity="0.6" stroke-width="0.218649"/>
<path d="M48 46H57.2841L57.2848 55.8122V60.9998L63 61" stroke="black" stroke-opacity="0.6" stroke-width="0.218649"/>
<path d="M96 26H100.475V35.3332V39.9998L106 40" stroke="black" stroke-opacity="0.6" stroke-width="0.218649"/>
<rect x="63" y="55" width="18" height="11" rx="0.728829" fill="#9DD194"/>
<rect x="63.0364" y="55.0364" width="17.9271" height="10.9271" rx="0.692388" stroke="black" stroke-opacity="0.1" stroke-width="0.0728829"/>
<rect x="8" y="41" width="19" height="10" rx="0.728829" fill="#FFDE6B"/>
<rect x="8.03644" y="41.0364" width="18.9271" height="9.92712" rx="0.692388" stroke="black" stroke-opacity="0.1" stroke-width="0.0728829"/>
<rect width="9.73582" height="9.73582" transform="matrix(0.676371 -0.736561 0.676371 0.736561 85.4199 26.1201)" fill="#937EE7"/>
<rect x="0.0492959" width="9.66294" height="9.66294" transform="matrix(0.676371 -0.736561 0.676371 0.736561 85.4359 26.1564)" stroke="black" stroke-opacity="0.1" stroke-width="0.0728829"/>
<rect width="9.73582" height="9.73582" transform="matrix(0.676371 -0.736561 0.676371 0.736561 35.5234 46.1709)" fill="#937EE7"/>
<rect x="0.0492959" width="9.66294" height="9.66294" transform="matrix(0.676371 -0.736561 0.676371 0.736561 35.5394 46.2072)" stroke="black" stroke-opacity="0.1" stroke-width="0.0728829"/>
<rect x="63" y="20" width="18" height="12" rx="0.728829" fill="#FFDE6B"/>
<rect x="63.0364" y="20.0364" width="17.9271" height="11.9271" rx="0.692388" stroke="black" stroke-opacity="0.1" stroke-width="0.0728829"/>
<rect x="105" y="8" width="20" height="10" rx="0.728829" fill="#937EE7"/>
<rect x="105.036" y="8.03644" width="19.9271" height="9.92712" rx="0.692388" stroke="black" stroke-opacity="0.1" stroke-width="0.0728829"/>
<rect x="105" y="34" width="20" height="12" rx="0.728829" fill="#937EE7"/>
<rect x="105.036" y="34.0364" width="19.9271" height="11.9271" rx="0.692388" stroke="black" stroke-opacity="0.1" stroke-width="0.0728829"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -0,0 +1,13 @@
<svg width="135" height="80" viewBox="0 0 135 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="135" height="80" fill="white"/>
<rect x="9" y="25" width="21" height="30" fill="#9DD194"/>
<rect x="33" y="25" width="21" height="30" fill="#ED8CBD"/>
<rect x="57" y="25" width="21" height="30" fill="#937EE7"/>
<rect x="81" y="25" width="21" height="30" fill="#FFDE6B"/>
<rect x="105" y="25" width="21" height="30" fill="#FFC46B"/>
<path d="M19.32 47.14C18.2933 47.14 17.3733 46.9733 16.56 46.64C15.7467 46.3067 15.0933 45.8133 14.6 45.16C14.12 44.5067 13.8667 43.72 13.84 42.8H17.48C17.5333 43.32 17.7133 43.72 18.02 44C18.3267 44.2667 18.7267 44.4 19.22 44.4C19.7267 44.4 20.1267 44.2867 20.42 44.06C20.7133 43.82 20.86 43.4933 20.86 43.08C20.86 42.7333 20.74 42.4467 20.5 42.22C20.2733 41.9933 19.9867 41.8067 19.64 41.66C19.3067 41.5133 18.8267 41.3467 18.2 41.16C17.2933 40.88 16.5533 40.6 15.98 40.32C15.4067 40.04 14.9133 39.6267 14.5 39.08C14.0867 38.5333 13.88 37.82 13.88 36.94C13.88 35.6333 14.3533 34.6133 15.3 33.88C16.2467 33.1333 17.48 32.76 19 32.76C20.5467 32.76 21.7933 33.1333 22.74 33.88C23.6867 34.6133 24.1933 35.64 24.26 36.96H20.56C20.5333 36.5067 20.3667 36.1533 20.06 35.9C19.7533 35.6333 19.36 35.5 18.88 35.5C18.4667 35.5 18.1333 35.6133 17.88 35.84C17.6267 36.0533 17.5 36.3667 17.5 36.78C17.5 37.2333 17.7133 37.5867 18.14 37.84C18.5667 38.0933 19.2333 38.3667 20.14 38.66C21.0467 38.9667 21.78 39.26 22.34 39.54C22.9133 39.82 23.4067 40.2267 23.82 40.76C24.2333 41.2933 24.44 41.98 24.44 42.82C24.44 43.62 24.2333 44.3467 23.82 45C23.42 45.6533 22.8333 46.1733 22.06 46.56C21.2867 46.9467 20.3733 47.14 19.32 47.14Z" fill="#7CC270"/>
<path d="M51.14 32.96V47H47.72V38.58L44.58 47H41.82L38.66 38.56V47H35.24V32.96H39.28L43.22 42.68L47.12 32.96H51.14Z" fill="#E660A4"/>
<path d="M69.98 44.52H64.74L63.9 47H60.32L65.4 32.96H69.36L74.44 47H70.82L69.98 44.52ZM69.1 41.88L67.36 36.74L65.64 41.88H69.1Z" fill="#6E52DF"/>
<path d="M93.4 47L90.48 41.7H89.66V47H86.24V32.96H91.98C93.0867 32.96 94.0267 33.1533 94.8 33.54C95.5867 33.9267 96.1733 34.46 96.56 35.14C96.9467 35.8067 97.14 36.5533 97.14 37.38C97.14 38.3133 96.8733 39.1467 96.34 39.88C95.82 40.6133 95.0467 41.1333 94.02 41.44L97.26 47H93.4ZM89.66 39.28H91.78C92.4067 39.28 92.8733 39.1267 93.18 38.82C93.5 38.5133 93.66 38.08 93.66 37.52C93.66 36.9867 93.5 36.5667 93.18 36.26C92.8733 35.9533 92.4067 35.8 91.78 35.8H89.66V39.28Z" fill="#FFD338"/>
<path d="M121.34 32.96V35.7H117.62V47H114.2V35.7H110.48V32.96H121.34Z" fill="#FF8C38"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -0,0 +1,16 @@
<svg width="135" height="80" viewBox="0 0 135 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="135" height="80" fill="white"/>
<rect x="20" y="18" width="47" height="24" rx="2" stroke="#6E52DF" stroke-width="2"/>
<rect x="20" y="49" width="47" height="24" rx="2" stroke="#84CFFF" stroke-width="2"/>
<rect x="75" y="18" width="46" height="24" rx="2" stroke="#FF8C38" stroke-width="2"/>
<rect x="75" y="49" width="46" height="24" rx="2" stroke="#7CC270" stroke-width="2"/>
<rect x="19" y="8" width="49" height="5" rx="2" fill="#937EE7"/>
<rect x="74" y="8" width="48" height="5" rx="2" fill="#FFC46B"/>
<rect x="8" y="74" width="26" height="5" rx="2" transform="rotate(-90 8 74)" fill="#9DD194"/>
<rect x="13" y="17" width="26" height="5" rx="2" transform="rotate(90 13 17)" fill="#B8E3FF"/>
<rect x="24" y="22" width="30" height="3" rx="1" fill="#D8D9D8"/>
<rect x="79" y="22" width="20" height="3" rx="1" fill="#D8D9D8"/>
<rect x="79" y="57" width="16" height="3" rx="1" fill="#D8D9D8"/>
<rect x="79" y="63" width="20" height="3" rx="1" fill="#D8D9D8"/>
<rect x="24" y="27" width="13" height="3" rx="1" fill="#D8D9D8"/>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@ -0,0 +1,45 @@
<svg width="135" height="80" viewBox="0 0 135 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="135" height="80" fill="white"/>
<rect x="6" y="7" width="56" height="30" rx="1" fill="#DFF4E8"/>
<rect x="72" y="7" width="56" height="30" rx="1" fill="#E1EFFF"/>
<rect x="6" y="44" width="56" height="30" rx="1" fill="#FFEACA"/>
<rect x="72" y="44" width="56" height="30" rx="1" fill="#FFE1E1"/>
<rect x="9" y="11" width="10" height="9" fill="#9DD194"/>
<rect x="9.05" y="11.05" width="9.9" height="8.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="9" y="24" width="10" height="9" fill="#9DD194"/>
<rect x="9.05" y="24.05" width="9.9" height="8.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="22" y="11" width="10" height="9" fill="#9DD194"/>
<rect x="22.05" y="11.05" width="9.9" height="8.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="84" y="17" width="10" height="11" fill="#84CFFF"/>
<rect x="84.05" y="17.05" width="9.9" height="10.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="99" y="17" width="10" height="11" fill="#84CFFF"/>
<rect x="99.05" y="17.05" width="9.9" height="10.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="113" y="17" width="10" height="11" fill="#84CFFF"/>
<rect x="113.05" y="17.05" width="9.9" height="10.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="76" y="47" width="10" height="8" fill="#F16F6F"/>
<rect x="76.05" y="47.05" width="9.9" height="7.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="89" y="47" width="10" height="8" fill="#F16F6F"/>
<rect x="89.05" y="47.05" width="9.9" height="7.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="102" y="47" width="10" height="8" fill="#F16F6F"/>
<rect x="102.05" y="47.05" width="9.9" height="7.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="115" y="47" width="10" height="8" fill="#F16F6F"/>
<rect x="115.05" y="47.05" width="9.9" height="7.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="115" y="57" width="10" height="8" fill="#F16F6F"/>
<rect x="115.05" y="57.05" width="9.9" height="7.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="102" y="57" width="10" height="8" fill="#F16F6F"/>
<rect x="102.05" y="57.05" width="9.9" height="7.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="89" y="57" width="10" height="8" fill="#F16F6F"/>
<rect x="89.05" y="57.05" width="9.9" height="7.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="76" y="57" width="10" height="8" fill="#F16F6F"/>
<rect x="76.05" y="57.05" width="9.9" height="7.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="35" y="11" width="10" height="9" fill="#9DD194"/>
<rect x="35.05" y="11.05" width="9.9" height="8.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<line x1="6" y1="40.85" x2="128" y2="40.85" stroke="#E3E2E4" stroke-width="0.3"/>
<line x1="67.15" y1="7" x2="67.15" y2="74" stroke="#E3E2E4" stroke-width="0.3"/>
<rect x="9" y="48" width="10" height="10" fill="#FFC46B"/>
<rect x="9.05" y="48.05" width="9.9" height="9.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="22" y="55" width="10" height="10" fill="#FFC46B"/>
<rect x="22.05" y="55.05" width="9.9" height="9.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="35" y="50" width="10" height="10" fill="#FFC46B"/>
<rect x="35.05" y="50.05" width="9.9" height="9.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
</svg>

After

Width:  |  Height:  |  Size: 3.5 KiB

View File

@ -0,0 +1,53 @@
<svg width="135" height="80" viewBox="0 0 135 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_7497_25255)">
<rect width="135" height="80" fill="white"/>
<rect x="6.5" y="8.5" width="37" height="28" rx="3.5" fill="#DFF4E8" stroke="#7CC270"/>
<path d="M13.3345 31.1385C12.7498 31.1385 12.2479 30.9905 11.8288 30.6946C11.4122 30.3963 11.0914 29.9666 10.8665 29.4055C10.6439 28.8421 10.5327 28.1638 10.5327 27.3707C10.535 26.5777 10.6475 25.9029 10.87 25.3466C11.0949 24.7879 11.4157 24.3617 11.8324 24.0682C12.2514 23.7746 12.7521 23.6278 13.3345 23.6278C13.9169 23.6278 14.4176 23.7746 14.8366 24.0682C15.2557 24.3617 15.5765 24.7879 15.799 25.3466C16.0239 25.9053 16.1364 26.58 16.1364 27.3707C16.1364 28.1662 16.0239 28.8456 15.799 29.4091C15.5765 29.9702 15.2557 30.3987 14.8366 30.6946C14.42 30.9905 13.9193 31.1385 13.3345 31.1385ZM13.3345 30.027C13.7891 30.027 14.1477 29.8033 14.4105 29.3558C14.6757 28.906 14.8082 28.2443 14.8082 27.3707C14.8082 26.7931 14.7479 26.3078 14.6271 25.9148C14.5064 25.5218 14.3359 25.2259 14.1158 25.027C13.8956 24.8258 13.6352 24.7251 13.3345 24.7251C12.8823 24.7251 12.5249 24.95 12.2621 25.3999C11.9993 25.8473 11.8667 26.5043 11.8643 27.3707C11.862 27.9508 11.92 28.4384 12.0384 28.8338C12.1591 29.2292 12.3295 29.5275 12.5497 29.7287C12.7699 29.9276 13.0315 30.027 13.3345 30.027ZM20.2743 23.7273V31H18.9569V25.0092H18.9142L17.2132 26.0959V24.8885L19.0208 23.7273H20.2743Z" fill="#7CC270"/>
<rect x="49.5" y="44.5" width="37" height="28" rx="3.5" fill="#FFE1E1" stroke="#E660A4"/>
<rect x="92.5" y="44.5" width="37" height="28" rx="3.5" fill="#F5F5F5" stroke="#BFC0BF"/>
<path d="M56.3345 66.1385C55.7498 66.1385 55.2479 65.9905 54.8288 65.6946C54.4122 65.3963 54.0914 64.9666 53.8665 64.4055C53.6439 63.8421 53.5327 63.1638 53.5327 62.3707C53.535 61.5777 53.6475 60.9029 53.87 60.3466C54.0949 59.7879 54.4157 59.3617 54.8324 59.0682C55.2514 58.7746 55.7521 58.6278 56.3345 58.6278C56.9169 58.6278 57.4176 58.7746 57.8366 59.0682C58.2557 59.3617 58.5765 59.7879 58.799 60.3466C59.0239 60.9053 59.1364 61.58 59.1364 62.3707C59.1364 63.1662 59.0239 63.8456 58.799 64.4091C58.5765 64.9702 58.2557 65.3987 57.8366 65.6946C57.42 65.9905 56.9193 66.1385 56.3345 66.1385ZM56.3345 65.027C56.7891 65.027 57.1477 64.8033 57.4105 64.3558C57.6757 63.906 57.8082 63.2443 57.8082 62.3707C57.8082 61.7931 57.7479 61.3078 57.6271 60.9148C57.5064 60.5218 57.3359 60.2259 57.1158 60.027C56.8956 59.8258 56.6352 59.7251 56.3345 59.7251C55.8823 59.7251 55.5249 59.95 55.2621 60.3999C54.9993 60.8473 54.8667 61.5043 54.8643 62.3707C54.862 62.9508 54.92 63.4384 55.0384 63.8338C55.1591 64.2292 55.3295 64.5275 55.5497 64.7287C55.7699 64.9276 56.0315 65.027 56.3345 65.027ZM60.1848 64.6506V63.603L63.2708 58.7273H64.1444V60.2188H63.6117L61.5343 63.5107V63.5675H65.8418V64.6506H60.1848ZM63.6543 66V64.331L63.6685 63.8622V58.7273H64.9114V66H63.6543Z" fill="#E660A4"/>
<path d="M99.3345 66.1385C98.7498 66.1385 98.2479 65.9905 97.8288 65.6946C97.4122 65.3963 97.0914 64.9666 96.8665 64.4055C96.6439 63.8421 96.5327 63.1638 96.5327 62.3707C96.535 61.5777 96.6475 60.9029 96.87 60.3466C97.0949 59.7879 97.4157 59.3617 97.8324 59.0682C98.2514 58.7746 98.7521 58.6278 99.3345 58.6278C99.9169 58.6278 100.418 58.7746 100.837 59.0682C101.256 59.3617 101.576 59.7879 101.799 60.3466C102.024 60.9053 102.136 61.58 102.136 62.3707C102.136 63.1662 102.024 63.8456 101.799 64.4091C101.576 64.9702 101.256 65.3987 100.837 65.6946C100.42 65.9905 99.9193 66.1385 99.3345 66.1385ZM99.3345 65.027C99.7891 65.027 100.148 64.8033 100.411 64.3558C100.676 63.906 100.808 63.2443 100.808 62.3707C100.808 61.7931 100.748 61.3078 100.627 60.9148C100.506 60.5218 100.336 60.2259 100.116 60.027C99.8956 59.8258 99.6352 59.7251 99.3345 59.7251C98.8823 59.7251 98.5249 59.95 98.2621 60.3999C97.9993 60.8473 97.8667 61.5043 97.8643 62.3707C97.862 62.9508 97.92 63.4384 98.0384 63.8338C98.1591 64.2292 98.3295 64.5275 98.5497 64.7287C98.7699 64.9276 99.0315 65.027 99.3345 65.027ZM105.845 66.0994C105.371 66.0994 104.947 66.0107 104.573 65.8331C104.199 65.6532 103.902 65.407 103.682 65.0945C103.464 64.782 103.348 64.4245 103.334 64.022H104.612C104.636 64.3203 104.765 64.5642 104.999 64.7536C105.234 64.9406 105.516 65.0341 105.845 65.0341C106.103 65.0341 106.332 64.9749 106.534 64.8565C106.735 64.7382 106.893 64.5736 107.009 64.3629C107.125 64.1522 107.182 63.9119 107.18 63.642C107.182 63.3674 107.124 63.1236 107.006 62.9105C106.887 62.6974 106.725 62.5305 106.519 62.4098C106.313 62.2867 106.077 62.2251 105.809 62.2251C105.591 62.2228 105.377 62.263 105.166 62.3459C104.956 62.4287 104.789 62.5376 104.666 62.6726L103.476 62.4773L103.856 58.7273H108.075V59.8281H104.946L104.737 61.7564H104.779C104.914 61.5978 105.105 61.4664 105.351 61.3622C105.597 61.2557 105.867 61.2024 106.161 61.2024C106.601 61.2024 106.994 61.3066 107.34 61.5149C107.685 61.7209 107.958 62.005 108.156 62.3672C108.355 62.7294 108.455 63.1437 108.455 63.6101C108.455 64.0907 108.343 64.5192 108.121 64.8956C107.901 65.2696 107.594 65.5644 107.201 65.7798C106.811 65.9929 106.358 66.0994 105.845 66.0994Z" fill="#BFC0BF"/>
<rect x="49.5" y="8.5" width="37" height="28" rx="3.5" fill="#F3F0FF" stroke="#6E52DF"/>
<path d="M56.3345 31.1385C55.7498 31.1385 55.2479 30.9905 54.8288 30.6946C54.4122 30.3963 54.0914 29.9666 53.8665 29.4055C53.6439 28.8421 53.5327 28.1638 53.5327 27.3707C53.535 26.5777 53.6475 25.9029 53.87 25.3466C54.0949 24.7879 54.4157 24.3617 54.8324 24.0682C55.2514 23.7746 55.7521 23.6278 56.3345 23.6278C56.9169 23.6278 57.4176 23.7746 57.8366 24.0682C58.2557 24.3617 58.5765 24.7879 58.799 25.3466C59.0239 25.9053 59.1364 26.58 59.1364 27.3707C59.1364 28.1662 59.0239 28.8456 58.799 29.4091C58.5765 29.9702 58.2557 30.3987 57.8366 30.6946C57.42 30.9905 56.9193 31.1385 56.3345 31.1385ZM56.3345 30.027C56.7891 30.027 57.1477 29.8033 57.4105 29.3558C57.6757 28.906 57.8082 28.2443 57.8082 27.3707C57.8082 26.7931 57.7479 26.3078 57.6271 25.9148C57.5064 25.5218 57.3359 25.2259 57.1158 25.027C56.8956 24.8258 56.6352 24.7251 56.3345 24.7251C55.8823 24.7251 55.5249 24.95 55.2621 25.3999C54.9993 25.8473 54.8667 26.5043 54.8643 27.3707C54.862 27.9508 54.92 28.4384 55.0384 28.8338C55.1591 29.2292 55.3295 29.5275 55.5497 29.7287C55.7699 29.9276 56.0315 30.027 56.3345 30.027ZM60.3162 31V30.0483L62.8411 27.5732C63.0826 27.3293 63.2838 27.1127 63.4448 26.9233C63.6058 26.7339 63.7265 26.5504 63.807 26.3729C63.8875 26.1953 63.9277 26.0059 63.9277 25.8047C63.9277 25.575 63.8757 25.3786 63.7715 25.2152C63.6673 25.0495 63.5241 24.9216 63.3418 24.8317C63.1595 24.7417 62.9524 24.6967 62.7203 24.6967C62.4812 24.6967 62.2717 24.7464 62.0918 24.8459C61.9119 24.9429 61.7722 25.0814 61.6728 25.2614C61.5757 25.4413 61.5272 25.6555 61.5272 25.9041H60.2736C60.2736 25.4425 60.379 25.0412 60.5897 24.7003C60.8004 24.3594 61.0904 24.0954 61.4597 23.9084C61.8314 23.7214 62.2575 23.6278 62.7381 23.6278C63.2258 23.6278 63.6543 23.719 64.0236 23.9013C64.3929 24.0836 64.6794 24.3333 64.883 24.6506C65.089 24.9678 65.1919 25.33 65.1919 25.7372C65.1919 26.0095 65.1399 26.277 65.0357 26.5398C64.9315 26.8026 64.748 27.0937 64.4853 27.4134C64.2248 27.733 63.8591 28.12 63.388 28.5746L62.1344 29.8494V29.8991H65.302V31H60.3162Z" fill="#6E52DF"/>
<rect x="6.5" y="44.5" width="37" height="28" rx="3.5" fill="#FFEACA" stroke="#FF8C38"/>
<path d="M13.3345 66.1385C12.7498 66.1385 12.2479 65.9905 11.8288 65.6946C11.4122 65.3963 11.0914 64.9666 10.8665 64.4055C10.6439 63.8421 10.5327 63.1638 10.5327 62.3707C10.535 61.5777 10.6475 60.9029 10.87 60.3466C11.0949 59.7879 11.4157 59.3617 11.8324 59.0682C12.2514 58.7746 12.7521 58.6278 13.3345 58.6278C13.9169 58.6278 14.4176 58.7746 14.8366 59.0682C15.2557 59.3617 15.5765 59.7879 15.799 60.3466C16.0239 60.9053 16.1364 61.58 16.1364 62.3707C16.1364 63.1662 16.0239 63.8456 15.799 64.4091C15.5765 64.9702 15.2557 65.3987 14.8366 65.6946C14.42 65.9905 13.9193 66.1385 13.3345 66.1385ZM13.3345 65.027C13.7891 65.027 14.1477 64.8033 14.4105 64.3558C14.6757 63.906 14.8082 63.2443 14.8082 62.3707C14.8082 61.7931 14.7479 61.3078 14.6271 60.9148C14.5064 60.5218 14.3359 60.2259 14.1158 60.027C13.8956 59.8258 13.6352 59.7251 13.3345 59.7251C12.8823 59.7251 12.5249 59.95 12.2621 60.3999C11.9993 60.8473 11.8667 61.5043 11.8643 62.3707C11.862 62.9508 11.92 63.4384 12.0384 63.8338C12.1591 64.2292 12.3295 64.5275 12.5497 64.7287C12.7699 64.9276 13.0315 65.027 13.3345 65.027ZM19.9263 66.0994C19.415 66.0994 18.9604 66.0118 18.5627 65.8366C18.1673 65.6615 17.8548 65.4176 17.6252 65.1051C17.3955 64.7926 17.2736 64.4316 17.2594 64.022H18.5946C18.6065 64.2185 18.6716 64.3902 18.79 64.5369C18.9083 64.6813 19.0658 64.7938 19.2623 64.8743C19.4587 64.9548 19.6789 64.995 19.9228 64.995C20.1832 64.995 20.414 64.95 20.6152 64.8601C20.8165 64.7678 20.9739 64.6399 21.0875 64.4766C21.2012 64.3132 21.2568 64.125 21.2544 63.9119C21.2568 63.6918 21.2 63.4976 21.084 63.3295C20.968 63.1615 20.7999 63.0301 20.5797 62.9354C20.3619 62.8407 20.0991 62.7933 19.7914 62.7933H19.1486V61.7777H19.7914C20.0447 61.7777 20.266 61.7339 20.4554 61.6463C20.6472 61.5587 20.7975 61.4356 20.9064 61.277C21.0153 61.116 21.0686 60.9302 21.0662 60.7195C21.0686 60.5135 21.0224 60.3348 20.9277 60.1832C20.8354 60.0294 20.704 59.9098 20.5336 59.8246C20.3655 59.7393 20.1678 59.6967 19.9405 59.6967C19.718 59.6967 19.512 59.737 19.3226 59.8175C19.1332 59.898 18.9805 60.0128 18.8645 60.1619C18.7485 60.3087 18.687 60.4839 18.6799 60.6875H17.4121C17.4216 60.2803 17.5388 59.9228 17.7637 59.6151C17.9909 59.3049 18.294 59.0634 18.6728 58.8906C19.0516 58.7154 19.4765 58.6278 19.9476 58.6278C20.4329 58.6278 20.8543 58.719 21.2118 58.9013C21.5717 59.0812 21.8498 59.3239 22.0463 59.6293C22.2428 59.9347 22.3411 60.272 22.3411 60.6413C22.3435 61.0509 22.2227 61.3942 21.9789 61.6712C21.7374 61.9482 21.4202 62.1293 21.0272 62.2145V62.2713C21.5385 62.3423 21.9303 62.5317 22.2026 62.8395C22.4772 63.1449 22.6133 63.5249 22.611 63.9794C22.611 64.3866 22.495 64.7512 22.263 65.0732C22.0333 65.3928 21.7161 65.6437 21.3113 65.826C20.9088 66.0083 20.4471 66.0994 19.9263 66.0994Z" fill="#FF8C38"/>
<path d="M78.9575 32.2139C83.9295 32.5977 88.8546 32.913 93.666 34.2906C95.1402 34.7126 98.2175 35.4761 97.7562 37.6359C97.4452 39.0919 96.3376 40.4716 95.3996 41.5771C93.8059 43.4554 92.0234 45.2793 90.6864 47.3558C89.9336 48.5249 89.6354 49.6117 90.7992 50.6108C91.604 51.3017 92.6247 51.6679 93.6163 51.9968C94.8768 52.4148 96.1623 52.7528 97.4673 52.999C99.0062 53.2894 100.565 53.4598 102.126 53.5679C102.228 53.5749 102.813 53.5859 102.767 53.5859" stroke="#9A6533" stroke-width="3" stroke-linecap="round"/>
<g filter="url(#filter0_dd_7497_25255)">
<path d="M121.276 48.3562L119.608 47.5357L159.992 22.4125L160.825 23.7522L121.276 48.3562Z" fill="#9A6533"/>
<path d="M119.331 47.7085L118.312 46.071L158.974 20.7747L159.993 22.4122L119.331 47.7085Z" fill="#9A6533"/>
<path d="M118.311 46.0718L117.292 44.4343L157.954 19.138L158.973 20.7754L118.311 46.0718Z" fill="#9A6533"/>
<path d="M113.757 46.6338L117.573 42.4017L157.122 17.7977L157.955 19.1374L113.757 46.6338Z" fill="#9A6533"/>
<path d="M110.445 51.998C109.545 52.2999 108.85 51.1836 109.519 50.5094L112.192 47.8136L117.54 42.4222L117.635 42.7593C117.86 43.5526 118.401 44.2185 119.132 44.6005L119.449 44.7661C119.771 44.9346 119.976 45.2648 119.985 45.6284L120.004 46.4162C120.017 46.9657 120.256 47.4856 120.664 47.8537L121.244 48.3766L114.045 50.7909L110.445 51.998Z" fill="white"/>
<g filter="url(#filter1_b_7497_25255)">
<path d="M107.644 52.937C107.444 53.004 107.29 52.7562 107.438 52.6066L110.053 49.9702L111.164 51.7565L107.644 52.937Z" fill="#9A6533"/>
</g>
</g>
</g>
<defs>
<filter id="filter0_dd_7497_25255" x="95.9996" y="14.6782" width="74.0355" height="56.5039" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
<feMorphology radius="2" operator="erode" in="SourceAlpha" result="effect1_dropShadow_7497_25255"/>
<feOffset dy="4"/>
<feGaussianBlur stdDeviation="2"/>
<feColorMatrix type="matrix" values="0 0 0 0 0.258824 0 0 0 0 0.254902 0 0 0 0 0.286275 0 0 0 0.1 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_7497_25255"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
<feMorphology radius="1" operator="dilate" in="SourceAlpha" result="effect2_dropShadow_7497_25255"/>
<feOffset dy="6"/>
<feGaussianBlur stdDeviation="4"/>
<feColorMatrix type="matrix" values="0 0 0 0 0.258824 0 0 0 0 0.254902 0 0 0 0 0.286275 0 0 0 0.05 0"/>
<feBlend mode="normal" in2="effect1_dropShadow_7497_25255" result="effect2_dropShadow_7497_25255"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect2_dropShadow_7497_25255" result="shape"/>
</filter>
<filter id="filter1_b_7497_25255" x="105.476" y="48.0668" width="7.59217" height="6.78492" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feGaussianBlur in="BackgroundImageFix" stdDeviation="0.951724"/>
<feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_7497_25255"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_7497_25255" result="shape"/>
</filter>
<clipPath id="clip0_7497_25255">
<rect width="135" height="80" fill="white"/>
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 13 KiB

View File

@ -0,0 +1,31 @@
<svg width="135" height="80" viewBox="0 0 135 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="135" height="80" fill="white"/>
<rect x="29" y="8" width="98" height="16" fill="#B8E3FF" stroke="white" stroke-width="2"/>
<rect x="29" y="24" width="98" height="16" fill="#B8E3FF" stroke="white" stroke-width="2"/>
<rect opacity="0.3" x="29" y="40" width="98" height="16" fill="#B8E3FF" stroke="white" stroke-width="2"/>
<rect x="29" y="56" width="98" height="16" fill="#B8E3FF" stroke="white" stroke-width="2"/>
<rect x="9" y="8" width="20" height="16" fill="#84CFFF" stroke="white" stroke-width="2"/>
<rect x="9" y="24" width="20" height="16" fill="#84CFFF" stroke="white" stroke-width="2"/>
<rect x="9" y="40" width="20" height="16" fill="#84CFFF" stroke="white" stroke-width="2"/>
<rect x="9" y="56" width="20" height="16" fill="#84CFFF" stroke="white" stroke-width="2"/>
<path d="M38 52.1881C43.9372 52.1881 50.7225 43.5972 57.9319 43.5972C65.1414 43.5972 70.6545 52.5972 78.288 52.5972C85.9215 52.5972 86.7696 43.5972 98.644 43.5972C106.277 43.5972 113.911 52.1881 119 52.5972" stroke="black" stroke-opacity="0.3" stroke-dasharray="2 2"/>
<circle cx="37.0469" cy="52.0469" r="3.04688" fill="#FFD338"/>
<circle cx="57.1406" cy="44.0469" r="3.04688" fill="#FFD338"/>
<circle cx="77.2344" cy="52.0469" r="3.04688" fill="#FFD338"/>
<circle cx="97.3281" cy="44.0469" r="3.04688" fill="#FFD338"/>
<circle cx="117.422" cy="52.0469" r="3.04688" fill="#FFD338"/>
<rect x="50" y="11" width="10" height="10" fill="#F16F6F"/>
<rect x="50.05" y="11.05" width="9.9" height="9.9" stroke="black" stroke-opacity="0.3" stroke-width="0.1"/>
<rect x="32" y="27" width="10" height="10" fill="#FF8C38"/>
<rect x="32.05" y="27.05" width="9.9" height="9.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="72" y="26" width="10" height="10" fill="#937EE7"/>
<rect x="72.05" y="26.05" width="9.9" height="9.9" stroke="black" stroke-opacity="0.3" stroke-width="0.1"/>
<rect x="73" y="60" width="10" height="10" fill="#937EE7"/>
<rect x="73.05" y="60.05" width="9.9" height="9.9" stroke="black" stroke-opacity="0.3" stroke-width="0.1"/>
<rect x="92" y="26" width="10" height="10" fill="#9DD194"/>
<rect x="92.05" y="26.05" width="9.9" height="9.9" stroke="black" stroke-opacity="0.3" stroke-width="0.1"/>
<rect x="112" y="12" width="10" height="10" fill="#ED8CBD"/>
<rect x="112.05" y="12.05" width="9.9" height="9.9" stroke="black" stroke-opacity="0.3" stroke-width="0.1"/>
<rect x="112" y="60" width="10" height="10" fill="#ED8CBD"/>
<rect x="112.05" y="60.05" width="9.9" height="9.9" stroke="black" stroke-opacity="0.3" stroke-width="0.1"/>
</svg>

After

Width:  |  Height:  |  Size: 2.6 KiB

View File

@ -0,0 +1,40 @@
<svg width="135" height="80" viewBox="0 0 135 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="135" height="80" fill="white"/>
<rect x="10" y="10" width="53.5" height="26" rx="1" fill="#937EE7"/>
<rect x="71.5" y="10" width="53.5" height="26" rx="1" fill="#937EE7"/>
<rect x="10" y="44" width="53.5" height="26" rx="1" fill="#937EE7"/>
<rect x="71.5" y="44" width="53.5" height="26" rx="1" fill="#937EE7"/>
<rect x="16" y="14" width="28" height="2" rx="1" fill="white"/>
<rect x="101" y="55" width="8" height="1" rx="0.5" fill="white"/>
<rect x="101" y="50" width="9" height="2" rx="1" fill="white"/>
<rect x="49" y="48" width="9" height="2" rx="1" fill="white"/>
<rect x="50" y="60" width="9" height="2" rx="1" fill="white"/>
<rect x="21" y="66" width="9" height="2" rx="1" fill="white"/>
<rect x="13" y="57" width="9" height="2" rx="1" fill="white"/>
<rect x="18" y="46" width="9" height="2" rx="1" fill="white"/>
<rect x="101" y="62" width="8" height="1" rx="0.5" fill="white"/>
<rect x="111" y="55" width="8" height="1" rx="0.5" fill="white"/>
<rect x="111" y="62" width="8" height="1" rx="0.5" fill="white"/>
<rect x="101" y="57" width="8" height="1" rx="0.5" fill="white"/>
<rect x="101" y="64" width="8" height="1" rx="0.5" fill="white"/>
<rect x="111" y="57" width="8" height="1" rx="0.5" fill="white"/>
<rect x="111" y="64" width="8" height="1" rx="0.5" fill="white"/>
<rect x="16" y="19" width="12" height="13" rx="1" fill="#F3F0FF"/>
<rect x="31" y="19" width="12" height="13" rx="1" fill="#F3F0FF"/>
<rect x="46" y="19" width="12" height="13" rx="1" fill="#F3F0FF"/>
<rect x="77" y="49" width="18" height="17" rx="1" fill="#F3F0FF"/>
<path d="M82 21L82 31" stroke="#6E52DF"/>
<path d="M93 21L93 31" stroke="#6E52DF"/>
<path d="M104 21L104 31" stroke="#6E52DF"/>
<path d="M115 21L115 31" stroke="#6E52DF"/>
<path d="M78 31C78 30.4477 78.4477 30 79 30H125V32H79C78.4477 32 78 31.5523 78 31Z" fill="#F3F0FF"/>
<circle cx="33.4481" cy="48.0479" r="2.84855" transform="rotate(-17.6914 33.4481 48.0479)" fill="#F3F0FF"/>
<circle cx="27.2546" cy="57.5328" r="2.84855" transform="rotate(-17.6914 27.2546 57.5328)" fill="#F3F0FF"/>
<circle cx="34.5333" cy="65.9317" r="2.84855" transform="rotate(-17.6914 34.5333 65.9317)" fill="#F3F0FF"/>
<circle cx="44.875" cy="61.9756" r="2.84855" transform="rotate(-17.6914 44.875 61.9756)" fill="#F3F0FF"/>
<circle cx="44.1049" cy="51.0879" r="2.84855" transform="rotate(-17.6914 44.1049 51.0879)" fill="#F3F0FF"/>
<rect x="78" y="14" width="8" height="9" rx="1" fill="#F3F0FF"/>
<rect x="89" y="14" width="8" height="9" rx="1" fill="#F3F0FF"/>
<rect x="100" y="14" width="8" height="9" rx="1" fill="#F3F0FF"/>
<rect x="111" y="14" width="8" height="9" rx="1" fill="#F3F0FF"/>
</svg>

After

Width:  |  Height:  |  Size: 2.7 KiB

View File

@ -0,0 +1,28 @@
<svg width="135" height="80" viewBox="0 0 135 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="135" height="80" fill="white"/>
<rect x="10" y="10" width="53.5" height="26" rx="1" fill="#FFC46B"/>
<rect x="15" y="14" width="19" height="1" rx="0.5" fill="#FF8C38"/>
<rect x="15" y="18" width="19" height="1" rx="0.5" fill="#FF8C38"/>
<rect x="71.5" y="10" width="53.5" height="26" rx="1" fill="#FFC46B"/>
<rect x="20" y="28" width="4" height="4" rx="1" fill="#FFEACA"/>
<rect x="28" y="25" width="4" height="7" rx="1" fill="#FFEACA"/>
<rect x="36" y="22" width="4" height="10" rx="1" fill="#FFEACA"/>
<rect x="44" y="18" width="4" height="14" rx="1" fill="#FFEACA"/>
<rect x="52" y="14" width="4" height="18" rx="1" fill="#FFEACA"/>
<rect x="10" y="44" width="53.5" height="26" rx="1" fill="#FFC46B"/>
<rect x="71.5" y="44" width="53.5" height="26" rx="1" fill="#FFC46B"/>
<path d="M81 27.25L87.3333 15L93.6667 21.5625L100 22.875L106.333 20.25L112.667 29H119" stroke="#FFEACA"/>
<path d="M78 14V32H120" stroke="#FF8C38"/>
<circle cx="83.5" cy="58.5" r="6.5" fill="#FFEACA"/>
<circle cx="20" cy="61" r="4" fill="#FF8C38"/>
<circle cx="43" cy="51" r="4" fill="#FFEACA"/>
<circle cx="54" cy="56" r="4" fill="#FFEACA"/>
<circle cx="35" cy="63" r="4" fill="#FFEACA"/>
<circle cx="33.5" cy="54.5" r="2.5" fill="#FF8C38"/>
<circle cx="49.5" cy="64.5" r="2.5" fill="#FF8C38"/>
<circle cx="26" cy="51" r="2" fill="#FFEACA"/>
<circle cx="17" cy="50" r="2" fill="#FF8C38"/>
<circle cx="98.5" cy="58.5" r="6.5" fill="#FFEACA"/>
<circle cx="113.5" cy="58.5" r="6.5" fill="#FFEACA"/>
<rect x="77" y="47" width="28" height="2" rx="1" fill="#FF8C38"/>
</svg>

After

Width:  |  Height:  |  Size: 1.6 KiB

View File

@ -0,0 +1,21 @@
<svg width="135" height="80" viewBox="0 0 135 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="135" height="80" fill="white"/>
<rect x="10" y="10" width="53.5" height="26" rx="1" fill="#9DD194"/>
<rect x="71.5" y="10" width="53.5" height="26" rx="1" fill="#9DD194"/>
<rect x="10" y="44" width="53.5" height="26" rx="1" fill="#9DD194"/>
<path d="M106 10H124C124.552 10 125 10.4477 125 11V35C125 35.5523 124.552 36 124 36H106V10Z" fill="#7CC270"/>
<path d="M10 56L10 45C10 44.4477 10.4477 44 11 44L62.5 44C63.0523 44 63.5 44.4477 63.5 45L63.5 56L10 56Z" fill="#7CC270"/>
<rect x="71.5" y="44" width="53.5" height="26" rx="1" fill="#9DD194"/>
<rect x="83" y="48" width="28" height="2" rx="1" fill="#DFF4E8"/>
<rect x="26" y="20" width="22" height="3" rx="1.5" fill="#DFF4E8"/>
<rect x="26" y="49" width="22" height="2" rx="1" fill="#DFF4E8"/>
<rect x="31" y="25" width="12" height="2" rx="1" fill="#DFF4E8"/>
<rect x="78" y="17" width="19" height="1" rx="0.5" fill="#DFF4E8"/>
<rect x="78" y="21" width="19" height="1" rx="0.5" fill="#DFF4E8"/>
<rect x="101" y="55" width="18" height="1" rx="0.5" fill="#DFF4E8"/>
<rect x="78" y="25" width="19" height="1" rx="0.5" fill="#DFF4E8"/>
<rect x="101" y="60" width="18" height="1" rx="0.5" fill="#DFF4E8"/>
<rect x="78" y="29" width="19" height="1" rx="0.5" fill="#DFF4E8"/>
<rect x="101" y="65" width="18" height="1" rx="0.5" fill="#DFF4E8"/>
<rect x="77" y="55" width="18" height="11" rx="1" fill="#DFF4E8"/>
</svg>

After

Width:  |  Height:  |  Size: 1.4 KiB

View File

@ -0,0 +1,31 @@
<svg width="135" height="80" viewBox="0 0 135 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="135" height="80" fill="white"/>
<rect x="22" y="39" width="82" height="2" fill="#77757D"/>
<path d="M125.478 34.3617C129.347 36.6946 129.347 42.3054 125.478 44.6383L109.098 54.5144C105.099 56.9255 100 54.0457 100 49.3761L100 29.6239C100 24.9543 105.099 22.0745 109.098 24.4856L125.478 34.3617Z" fill="#77757D"/>
<path d="M21.2542 36.712C23.5502 38.3028 23.5502 41.6972 21.2542 43.288L13.528 48.6409C10.8752 50.4788 7.25 48.5802 7.25 45.3529L7.25 34.6471C7.25 31.4198 10.8752 29.5212 13.528 31.3591L21.2542 36.712Z" fill="#77757D"/>
<path d="M83 17L95 39" stroke="#77757D" stroke-width="2" stroke-linecap="round"/>
<path d="M83 63L95 41" stroke="#77757D" stroke-width="2" stroke-linecap="round"/>
<path d="M56 17L68 39" stroke="#77757D" stroke-width="2" stroke-linecap="round"/>
<path d="M56 63L68 41" stroke="#77757D" stroke-width="2" stroke-linecap="round"/>
<path d="M29 17L41 39" stroke="#77757D" stroke-width="2" stroke-linecap="round"/>
<path d="M29 63L41 41" stroke="#77757D" stroke-width="2" stroke-linecap="round"/>
<circle cx="123.5" cy="39.5" r="2.5" fill="white"/>
<rect x="47.5" y="8.5" width="17" height="10" rx="1.5" fill="#E3E2E0" stroke="#77757D"/>
<rect x="0.5" y="-0.5" width="17" height="10" rx="1.5" transform="matrix(1 0 0 -1 47 71)" fill="#E3E2E0" stroke="#77757D"/>
<rect x="74.5" y="8.5" width="16" height="10" rx="1.5" fill="#E3E2E0" stroke="#77757D"/>
<rect x="0.5" y="-0.5" width="16" height="10" rx="1.5" transform="matrix(1 0 0 -1 74 71)" fill="#E3E2E0" stroke="#77757D"/>
<rect x="21.5" y="8.5" width="16" height="10" rx="1.5" fill="#E3E2E0" stroke="#77757D"/>
<rect x="0.5" y="-0.5" width="16" height="10" rx="1.5" transform="matrix(1 0 0 -1 21 71)" fill="#E3E2E0" stroke="#77757D"/>
<line x1="75" y1="27.5" x2="89" y2="27.5" stroke="#77757D" stroke-dasharray="2 2"/>
<line x1="48" y1="27.5" x2="62" y2="27.5" stroke="#77757D" stroke-dasharray="2 2"/>
<line x1="21" y1="27.5" x2="35" y2="27.5" stroke="#77757D" stroke-dasharray="2 2"/>
<line x1="77" y1="32.5" x2="91" y2="32.5" stroke="#77757D" stroke-dasharray="2 2"/>
<line x1="50" y1="32.5" x2="64" y2="32.5" stroke="#77757D" stroke-dasharray="2 2"/>
<line x1="23" y1="32.5" x2="37" y2="32.5" stroke="#77757D" stroke-dasharray="2 2"/>
<line y1="-0.5" x2="14" y2="-0.5" transform="matrix(1 0 0 -1 74 54)" stroke="#77757D" stroke-dasharray="2 2"/>
<line y1="-0.5" x2="14" y2="-0.5" transform="matrix(1 0 0 -1 47 54)" stroke="#77757D" stroke-dasharray="2 2"/>
<line y1="-0.5" x2="14" y2="-0.5" transform="matrix(1 0 0 -1 20 54)" stroke="#77757D" stroke-dasharray="2 2"/>
<line y1="-0.5" x2="14" y2="-0.5" transform="matrix(1 0 0 -1 76 49)" stroke="#77757D" stroke-dasharray="2 2"/>
<line y1="-0.5" x2="14" y2="-0.5" transform="matrix(1 0 0 -1 49 49)" stroke="#77757D" stroke-dasharray="2 2"/>
<line y1="-0.5" x2="14" y2="-0.5" transform="matrix(1 0 0 -1 22 49)" stroke="#77757D" stroke-dasharray="2 2"/>
</svg>

After

Width:  |  Height:  |  Size: 2.9 KiB

View File

@ -0,0 +1,29 @@
<svg width="135" height="80" viewBox="0 0 135 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="135" height="80" fill="white"/>
<rect x="28" y="7" width="19" height="10" fill="#FFDE6B" stroke="white"/>
<rect x="47" y="7" width="20" height="10" fill="#FFDE6B" stroke="white"/>
<rect x="67" y="7" width="20" height="10" fill="#FFDE6B" stroke="white"/>
<rect x="87" y="7" width="19" height="10" fill="#FFDE6B" stroke="white"/>
<rect x="106" y="7" width="20" height="10" fill="#FFDE6B" stroke="white"/>
<rect x="8" y="7" width="20" height="10" fill="#FFDE6B" stroke="white"/>
<rect x="8" y="17" width="20" height="14" fill="#FFC46B" stroke="white"/>
<rect x="28" y="17" width="98" height="14" fill="#FFC46B" stroke="white"/>
<rect x="8" y="31" width="20" height="14" fill="#937EE7" stroke="white"/>
<rect x="28" y="31" width="98" height="14" fill="#937EE7" stroke="white"/>
<rect x="8" y="45" width="20" height="14" fill="#B8E3FF" stroke="white"/>
<rect x="28" y="45" width="98" height="14" fill="#B8E3FF" stroke="white"/>
<rect x="8" y="59" width="20" height="14" fill="#9DD194" stroke="white"/>
<rect x="28" y="59" width="98" height="14" fill="#9DD194" stroke="white"/>
<rect x="30" y="19" width="18" height="4" fill="#FFEACA"/>
<rect x="30.05" y="19.05" width="17.9" height="3.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="48" y="33" width="18" height="4" fill="#F3F0FF"/>
<rect x="48.05" y="33.05" width="17.9" height="3.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="55" y="39" width="34" height="4" fill="#F3F0FF"/>
<rect x="55.05" y="39.05" width="33.9" height="3.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="87" y="49" width="34" height="4" fill="#E1EFFF"/>
<rect x="87.05" y="49.05" width="33.9" height="3.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="40" y="62" width="28" height="4" fill="#DFF4E8"/>
<rect x="40.05" y="62.05" width="27.9" height="3.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="40" y="67" width="28" height="4" fill="#DFF4E8"/>
<rect x="40.05" y="67.05" width="27.9" height="3.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
</svg>

After

Width:  |  Height:  |  Size: 2.1 KiB

View File

@ -0,0 +1,47 @@
<svg width="135" height="80" viewBox="0 0 135 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="135" height="80" fill="white"/>
<rect x="28" y="7" width="19" height="10" fill="#FFC46B" stroke="white"/>
<rect x="28" y="17" width="19" height="14" fill="#FFF4D8" stroke="white"/>
<rect x="28" y="31" width="19" height="14" fill="#FFF4D8" stroke="white"/>
<rect x="28" y="45" width="19" height="14" fill="#FFF4D8" stroke="white"/>
<rect x="28" y="59" width="19" height="14" fill="#FFF4D8" stroke="white"/>
<rect x="47" y="7" width="20" height="10" fill="#FFC46B" stroke="white"/>
<rect x="47" y="17" width="20" height="14" fill="#FFF4D8" stroke="white"/>
<rect x="47" y="31" width="20" height="14" fill="#FFF4D8" stroke="white"/>
<rect x="47" y="45" width="20" height="14" fill="#FFF4D8" stroke="white"/>
<rect x="47" y="59" width="20" height="14" fill="#FFF4D8" stroke="white"/>
<rect x="67" y="7" width="20" height="10" fill="#FFC46B" stroke="white"/>
<rect x="67" y="17" width="20" height="14" fill="#FFF4D8" stroke="white"/>
<rect x="67" y="31" width="20" height="14" fill="#FFF4D8" stroke="white"/>
<rect x="67" y="45" width="20" height="14" fill="#FFF4D8" stroke="white"/>
<rect x="67" y="59" width="20" height="14" fill="#FFF4D8" stroke="white"/>
<rect x="87" y="7" width="19" height="10" fill="#FFC46B" stroke="white"/>
<rect x="87" y="17" width="19" height="14" fill="#FFF4D8" stroke="white"/>
<rect x="87" y="31" width="19" height="14" fill="#FFF4D8" stroke="white"/>
<rect x="87" y="45" width="19" height="14" fill="#FFF4D8" stroke="white"/>
<rect x="87" y="59" width="19" height="14" fill="#FFF4D8" stroke="white"/>
<rect x="106" y="7" width="20" height="10" fill="#FFC46B" stroke="white"/>
<rect x="106" y="17" width="20" height="14" fill="#FFF4D8" stroke="white"/>
<rect x="106" y="31" width="20" height="14" fill="#FFF4D8" stroke="white"/>
<rect x="106" y="45" width="20" height="14" fill="#FFF4D8" stroke="white"/>
<rect x="106" y="59" width="20" height="14" fill="#FFF4D8" stroke="white"/>
<rect x="8" y="7" width="20" height="10" fill="#FFC46B" stroke="white"/>
<rect x="8" y="17" width="20" height="14" fill="#FFC46B" stroke="white"/>
<rect x="8" y="31" width="20" height="14" fill="#FFC46B" stroke="white"/>
<rect x="8" y="45" width="20" height="14" fill="#FFC46B" stroke="white"/>
<rect x="8" y="59" width="20" height="14" fill="#FFC46B" stroke="white"/>
<rect x="92" y="35" width="11" height="6" fill="#937EE7"/>
<rect x="92.05" y="35.05" width="10.9" height="5.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="90" y="62" width="11" height="6" fill="#F16F6F"/>
<rect x="90.05" y="62.05" width="10.9" height="5.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="54" y="48" width="12" height="6" fill="#F16F6F"/>
<rect x="54.05" y="48.05" width="11.9" height="5.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="32" y="21" width="12" height="6" fill="#84CFFF"/>
<rect x="32.05" y="21.05" width="11.9" height="5.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="69" y="32" width="12" height="6" fill="#84CFFF"/>
<rect x="69.05" y="32.05" width="11.9" height="5.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="111" y="48" width="11" height="6" fill="#9DD194"/>
<rect x="111.05" y="48.05" width="10.9" height="5.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="32" y="63" width="11" height="6" fill="#937EE7"/>
<rect x="32.05" y="63.05" width="10.9" height="5.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
</svg>

After

Width:  |  Height:  |  Size: 3.5 KiB

View File

@ -0,0 +1,22 @@
<svg width="135" height="80" viewBox="0 0 135 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="135" height="80" fill="white"/>
<rect x="10" y="7" width="29" height="65" fill="#937EE7"/>
<rect x="39" y="7" width="29" height="65" fill="#B8E3FF"/>
<rect x="68" y="7" width="29" height="65" fill="#937EE7"/>
<rect x="97" y="7" width="29" height="65" fill="#B8E3FF"/>
<rect x="22" y="27" width="13" height="13" fill="white"/>
<rect x="22.05" y="27.05" width="12.9" height="12.9" stroke="black" stroke-opacity="0.3" stroke-width="0.1"/>
<rect x="47" y="24" width="13" height="13" fill="#ED8CBD"/>
<rect x="47.05" y="24.05" width="12.9" height="12.9" stroke="black" stroke-opacity="0.3" stroke-width="0.1"/>
<rect x="73" y="36" width="13" height="13" fill="#ED8CBD"/>
<rect x="73.05" y="36.05" width="12.9" height="12.9" stroke="black" stroke-opacity="0.3" stroke-width="0.1"/>
<rect x="13" y="53" width="13" height="13" fill="#FFDE6B"/>
<rect x="13.05" y="53.05" width="12.9" height="12.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="101" y="22" width="13" height="13" fill="white"/>
<rect x="109" y="46" width="13" height="13" fill="#FFDE6B"/>
<rect x="109.05" y="46.05" width="12.9" height="12.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="80" y="26" width="13" height="13" fill="#FFDE6B"/>
<rect x="80.05" y="26.05" width="12.9" height="12.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="15" y="18" width="13" height="13" fill="#B8E3FF"/>
<rect x="15.05" y="18.05" width="12.9" height="12.9" stroke="black" stroke-opacity="0.3" stroke-width="0.1"/>
</svg>

After

Width:  |  Height:  |  Size: 1.6 KiB

View File

@ -0,0 +1,25 @@
<svg width="135" height="80" viewBox="0 0 135 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="135" height="80" fill="white"/>
<rect x="8" y="15" width="36" height="57" rx="1" fill="#F3F0FF"/>
<rect x="49" y="15" width="37" height="57" rx="1" fill="#FFF4D8"/>
<rect x="91" y="15" width="36" height="57" rx="1" fill="#F5F5F5"/>
<rect x="13" y="19" width="11" height="10" fill="#937EE7"/>
<rect x="13.05" y="19.05" width="10.9" height="9.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="55" y="19" width="11" height="10" fill="#FFC46B"/>
<rect x="55.05" y="19.05" width="10.9" height="9.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="27" y="19" width="11" height="10" fill="#937EE7"/>
<rect x="27.05" y="19.05" width="10.9" height="9.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="69" y="19" width="11" height="10" fill="#FFC46B"/>
<rect x="69.05" y="19.05" width="10.9" height="9.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="96" y="19" width="11" height="10" fill="#B8E3FF"/>
<rect x="96.05" y="19.05" width="10.9" height="9.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="96" y="34" width="11" height="10" fill="#B8E3FF"/>
<rect x="96.05" y="34.05" width="10.9" height="9.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="112" y="26" width="11" height="10" fill="#B8E3FF"/>
<rect x="112.05" y="26.05" width="10.9" height="9.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="13" y="32" width="11" height="10" fill="#937EE7"/>
<rect x="13.05" y="32.05" width="10.9" height="9.9" stroke="black" stroke-opacity="0.1" stroke-width="0.1"/>
<rect x="8" y="7" width="15" height="4" rx="2" fill="#937EE7"/>
<rect x="49" y="7" width="15" height="4" rx="2" fill="#FFC46B"/>
<rect x="91" y="7" width="15" height="4" rx="2" fill="#B8E3FF"/>
</svg>

After

Width:  |  Height:  |  Size: 1.9 KiB

View File

@ -0,0 +1,92 @@
import FiveWTwoH from './edgeless/5W2H.json';
import ConceptMap from './edgeless/Concept Map.json';
import Flowchart from './edgeless/Flowchart.json';
import SMART from './edgeless/SMART.json';
import SWOT from './edgeless/SWOT.json';
import FourPMarketingMatrix from './edgeless/4P Marketing Matrix.json';
import Storyboard from './edgeless/Storyboard.json';
import UserJourneyMap from './edgeless/User Journey Map.json';
import BusinessProposal from './edgeless/Business Proposal.json';
import DataAnalysis from './edgeless/Data Analysis.json';
import SimplePresentation from './edgeless/Simple Presentation.json';
import FishboneDiagram from './edgeless/Fishbone Diagram.json';
import GanttChart from './edgeless/Gantt Chart.json';
import MonthlyCalendar from './edgeless/Monthly Calendar.json';
import ProjectPlanning from './edgeless/Project Planning.json';
import ProjectTrackingKanban from './edgeless/Project Tracking Kanban.json';
const templates = {
'Brainstorming': [
FiveWTwoH,
ConceptMap,
Flowchart,
SMART,
SWOT
],
'Marketing': [
FourPMarketingMatrix,
Storyboard,
UserJourneyMap
],
'Presentation': [
BusinessProposal,
DataAnalysis,
SimplePresentation
],
'Project Management': [
FishboneDiagram,
GanttChart,
MonthlyCalendar,
ProjectPlanning,
ProjectTrackingKanban
]
}
function lcs(text1: string, text2: string) {
const dp: number[][] = Array.from({ length: text1.length + 1 })
.fill(null)
.map(() => Array.from<number>({length: text2.length + 1}).fill(0));
for (let i = 1; i <= text1.length; i++) {
for (let j = 1; j <= text2.length; j++) {
if (text1[i - 1] === text2[j - 1]) {
dp[i][j] = dp[i - 1][j - 1] + 1;
} else {
dp[i][j] = Math.max(dp[i - 1][j], dp[i][j - 1]);
}
}
}
return dp[text1.length][text2.length];
}
export const builtInTemplates = {
list: async (category: string) => {
// @ts-expect-error type should be asserted when using
return templates[category] ?? []
},
categories: async () => {
return Object.keys(templates)
},
search: async(query: string) => {
const candidates: unknown[] = [];
const cates = Object.keys(templates);
query = query.toLowerCase();
for(let cate of cates) {
// @ts-expect-error type should be asserted when using
const templatesOfCate = templates[cate];
for(let temp of templatesOfCate) {
if(lcs(query, temp.name.toLowerCase()) === query.length) {
candidates.push(temp);
}
}
}
return candidates;
},
}

View File

@ -4,10 +4,14 @@
"sideEffect": false,
"version": "0.12.0",
"scripts": {
"postinstall": "node ./build.mjs"
"postinstall": "node ./build.mjs && node ./build-edgeless.mjs"
},
"type": "module",
"exports": {
".": "./templates.gen.ts"
".": "./templates.gen.ts",
"./edgeless": "./edgeless-templates.gen.ts"
},
"devDependencies": {
"jszip": "^3.10.1"
}
}

View File

@ -171,6 +171,14 @@ function awaitChildProcess(child: ChildProcess): Promise<number> {
}
try {
await awaitChildProcess(
spawn('node', ['build-edgeless.mjs'], {
cwd: path.resolve(projectRoot, 'packages/frontend/templates'),
stdio: 'inherit',
shell: true,
env: process.env,
})
);
// Start webpack
await awaitChildProcess(
spawn(

View File

@ -790,6 +790,8 @@ __metadata:
"@affine/templates@workspace:*, @affine/templates@workspace:packages/frontend/templates":
version: 0.0.0-use.local
resolution: "@affine/templates@workspace:packages/frontend/templates"
dependencies:
jszip: "npm:^3.10.1"
languageName: unknown
linkType: soft