mirror of
https://github.com/CorentinTh/it-tools.git
synced 2024-09-11 13:37:53 +03:00
Merge 48b8a7f60a
into 76a19d218d
This commit is contained in:
commit
ce89b6dd7d
1
components.d.ts
vendored
1
components.d.ts
vendored
@ -132,6 +132,7 @@ declare module '@vue/runtime-core' {
|
||||
NConfigProvider: typeof import('naive-ui')['NConfigProvider']
|
||||
NDivider: typeof import('naive-ui')['NDivider']
|
||||
NEllipsis: typeof import('naive-ui')['NEllipsis']
|
||||
NForm: typeof import('naive-ui')['NForm']
|
||||
NFormItem: typeof import('naive-ui')['NFormItem']
|
||||
NGi: typeof import('naive-ui')['NGi']
|
||||
NGrid: typeof import('naive-ui')['NGrid']
|
||||
|
@ -89,6 +89,7 @@
|
||||
"uuid": "^9.0.0",
|
||||
"vue": "^3.3.4",
|
||||
"vue-i18n": "^9.9.1",
|
||||
"vue-markdown-render": "^2.2.1",
|
||||
"vue-router": "^4.1.6",
|
||||
"vue-tsc": "^1.8.1",
|
||||
"xml-formatter": "^3.3.2",
|
||||
|
@ -167,6 +167,9 @@ dependencies:
|
||||
vue-i18n:
|
||||
specifier: ^9.9.1
|
||||
version: 9.9.1(vue@3.3.4)
|
||||
vue-markdown-render:
|
||||
specifier: ^2.2.1
|
||||
version: 2.2.1(vue@3.3.4)
|
||||
vue-router:
|
||||
specifier: ^4.1.6
|
||||
version: 4.1.6(vue@3.3.4)
|
||||
@ -3354,7 +3357,7 @@ packages:
|
||||
dependencies:
|
||||
'@unhead/dom': 0.5.1
|
||||
'@unhead/schema': 0.5.1
|
||||
'@vueuse/shared': 10.8.0(vue@3.3.4)
|
||||
'@vueuse/shared': 10.11.0(vue@3.3.4)
|
||||
unhead: 0.5.1
|
||||
vue: 3.3.4
|
||||
transitivePeerDependencies:
|
||||
@ -3987,19 +3990,19 @@ packages:
|
||||
- vue
|
||||
dev: false
|
||||
|
||||
/@vueuse/shared@10.3.0(vue@3.3.4):
|
||||
resolution: {integrity: sha512-kGqCTEuFPMK4+fNWy6dUOiYmxGcUbtznMwBZLC1PubidF4VZY05B+Oht7Jh7/6x4VOWGpvu3R37WHi81cKpiqg==}
|
||||
/@vueuse/shared@10.11.0(vue@3.3.4):
|
||||
resolution: {integrity: sha512-fyNoIXEq3PfX1L3NkNhtVQUSRtqYwJtJg+Bp9rIzculIZWHTkKSysujrOk2J+NrRulLTQH9+3gGSfYLWSEWU1A==}
|
||||
dependencies:
|
||||
vue-demi: 0.14.5(vue@3.3.4)
|
||||
vue-demi: 0.14.8(vue@3.3.4)
|
||||
transitivePeerDependencies:
|
||||
- '@vue/composition-api'
|
||||
- vue
|
||||
dev: false
|
||||
|
||||
/@vueuse/shared@10.8.0(vue@3.3.4):
|
||||
resolution: {integrity: sha512-dUdy6zwHhULGxmr9YUg8e+EnB39gcM4Fe2oKBSrh3cOsV30JcMPtsyuspgFCUo5xxFNaeMf/W2yyKfST7Bg8oQ==}
|
||||
/@vueuse/shared@10.3.0(vue@3.3.4):
|
||||
resolution: {integrity: sha512-kGqCTEuFPMK4+fNWy6dUOiYmxGcUbtznMwBZLC1PubidF4VZY05B+Oht7Jh7/6x4VOWGpvu3R37WHi81cKpiqg==}
|
||||
dependencies:
|
||||
vue-demi: 0.14.7(vue@3.3.4)
|
||||
vue-demi: 0.14.5(vue@3.3.4)
|
||||
transitivePeerDependencies:
|
||||
- '@vue/composition-api'
|
||||
- vue
|
||||
@ -9158,8 +9161,8 @@ packages:
|
||||
vue: 3.3.4
|
||||
dev: false
|
||||
|
||||
/vue-demi@0.14.7(vue@3.3.4):
|
||||
resolution: {integrity: sha512-EOG8KXDQNwkJILkx/gPcoL/7vH+hORoBaKgGe+6W7VFMvCYJfmF2dGbvgDroVnI8LU7/kTu8mbjRZGBU1z9NTA==}
|
||||
/vue-demi@0.14.8(vue@3.3.4):
|
||||
resolution: {integrity: sha512-Uuqnk9YE9SsWeReYqK2alDI5YzciATE0r2SkA6iMAtuXvNTMNACJLJEXNXaEy94ECuBe4Sk6RzRU80kjdbIo1Q==}
|
||||
engines: {node: '>=12'}
|
||||
hasBin: true
|
||||
requiresBuild: true
|
||||
@ -9202,6 +9205,15 @@ packages:
|
||||
'@vue/devtools-api': 6.5.0
|
||||
vue: 3.3.4
|
||||
|
||||
/vue-markdown-render@2.2.1(vue@3.3.4):
|
||||
resolution: {integrity: sha512-XkYnC0PMdbs6Vy6j/gZXSvCuOS0787Se5COwXlepRqiqPiunyCIeTPQAO2XnB4Yl04EOHXwLx5y6IuszMWSgyQ==}
|
||||
peerDependencies:
|
||||
vue: ^3.3.4
|
||||
dependencies:
|
||||
markdown-it: 13.0.2
|
||||
vue: 3.3.4
|
||||
dev: false
|
||||
|
||||
/vue-router@4.1.6(vue@3.3.4):
|
||||
resolution: {integrity: sha512-DYWYwsG6xNPmLq/FmZn8Ip+qrhFEzA14EI12MsMgVxvHFDYvlr4NXpVF5hrRH1wVcDP8fGi5F4rxuJSl8/r+EQ==}
|
||||
peerDependencies:
|
||||
@ -9449,6 +9461,7 @@ packages:
|
||||
|
||||
/workbox-google-analytics@7.0.0:
|
||||
resolution: {integrity: sha512-MEYM1JTn/qiC3DbpvP2BVhyIH+dV/5BjHk756u9VbwuAhu0QHyKscTnisQuz21lfRpOwiS9z4XdqeVAKol0bzg==}
|
||||
deprecated: It is not compatible with newer versions of GA starting with v4, as long as you are using GAv3 it should be ok, but the package is not longer being maintained
|
||||
dependencies:
|
||||
workbox-background-sync: 7.0.0
|
||||
workbox-core: 7.0.0
|
||||
|
@ -2,7 +2,9 @@
|
||||
import { useRoute } from 'vue-router';
|
||||
import { useHead } from '@vueuse/head';
|
||||
import type { HeadObject } from '@vueuse/head';
|
||||
import VueMarkdown from 'vue-markdown-render';
|
||||
|
||||
import { useThemeVars } from 'naive-ui';
|
||||
import BaseLayout from './base.layout.vue';
|
||||
import FavoriteButton from '@/components/FavoriteButton.vue';
|
||||
import type { Tool } from '@/tools/tools.types';
|
||||
@ -28,6 +30,23 @@ const { t } = useI18n();
|
||||
const i18nKey = computed<string>(() => route.path.trim().replace('/', ''));
|
||||
const toolTitle = computed<string>(() => t(`tools.${i18nKey.value}.title`, String(route.meta.name)));
|
||||
const toolDescription = computed<string>(() => t(`tools.${i18nKey.value}.description`, String(route.meta.description)));
|
||||
const toolFooter = computed<string>(() => {
|
||||
const createLink = (linkText: string, url: string) => {
|
||||
return `[${linkText.replace('[', '\\[').replace(']', '\\]')}](${url.replace('(', '%28').replace(')', '%29')})`;
|
||||
};
|
||||
let footer = t(`tools.${i18nKey.value}.footer`, String(route.meta.footer));
|
||||
if (footer === 'undefined') {
|
||||
footer = '';
|
||||
}
|
||||
const npmPackages = (route.meta.npmPackages as string[] || [])
|
||||
.map(
|
||||
packageName => createLink(
|
||||
packageName,
|
||||
packageName.includes('://') ? packageName : `https://www.npmjs.com/package/${packageName}`),
|
||||
);
|
||||
return ((npmPackages.length > 0 ? `Made with ${npmPackages.join(', ')}\n` : '') + footer).trim();
|
||||
});
|
||||
const themeVars = useThemeVars();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@ -55,6 +74,10 @@ const toolDescription = computed<string>(() => t(`tools.${i18nKey.value}.descrip
|
||||
<div class="tool-content">
|
||||
<slot />
|
||||
</div>
|
||||
|
||||
<div class="tool-footer">
|
||||
<VueMarkdown :source="toolFooter" />
|
||||
</div>
|
||||
</BaseLayout>
|
||||
</template>
|
||||
|
||||
@ -66,9 +89,11 @@ const toolDescription = computed<string>(() => t(`tools.${i18nKey.value}.descrip
|
||||
align-items: flex-start;
|
||||
flex-wrap: wrap;
|
||||
gap: 16px;
|
||||
overflow-x: auto;
|
||||
|
||||
::v-deep(& > *) {
|
||||
flex: 0 1 600px;
|
||||
min-width:0;
|
||||
}
|
||||
}
|
||||
|
||||
@ -105,4 +130,14 @@ const toolDescription = computed<string>(() => t(`tools.${i18nKey.value}.descrip
|
||||
}
|
||||
}
|
||||
}
|
||||
.tool-footer {
|
||||
opacity: 0.7;
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
|
||||
::v-deep(a) {
|
||||
color: v-bind('themeVars.textColor1');
|
||||
font-style: italic;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@ -9,4 +9,5 @@ export const tool = defineTool({
|
||||
component: () => import('./ascii-text-drawer.vue'),
|
||||
icon: Artboard,
|
||||
createdAt: new Date('2024-03-03'),
|
||||
npmPackages: ['figlet'],
|
||||
});
|
||||
|
@ -9,4 +9,5 @@ export const tool = defineTool({
|
||||
keywords: ['base64', 'converter', 'upload', 'image', 'file', 'conversion', 'web', 'data', 'format'],
|
||||
component: () => import('./base64-file-converter.vue'),
|
||||
icon: FileDigit,
|
||||
npmPackages: ['js-base64'],
|
||||
});
|
||||
|
@ -10,4 +10,5 @@ export const tool = defineTool({
|
||||
component: () => import('./base64-string-converter.vue'),
|
||||
icon: FileDigit,
|
||||
redirectFrom: ['/file-to-base64', '/base64-converter'],
|
||||
npmPackages: ['js-base64'],
|
||||
});
|
||||
|
@ -9,4 +9,5 @@ export const tool = defineTool({
|
||||
keywords: ['bcrypt', 'hash', 'compare', 'password', 'salt', 'round', 'storage', 'crypto'],
|
||||
component: () => import('./bcrypt.vue'),
|
||||
icon: LockSquare,
|
||||
npmPackages: ['bcryptjs'],
|
||||
});
|
||||
|
@ -9,4 +9,5 @@ export const tool = defineTool({
|
||||
keywords: ['BIP39', 'passphrase', 'generator', 'mnemonic', 'entropy'],
|
||||
component: () => import('./bip39-generator.vue'),
|
||||
icon: AlignJustified,
|
||||
npmPackages: ['@it-tools/bip39'],
|
||||
});
|
||||
|
@ -23,4 +23,5 @@ export const tool = defineTool({
|
||||
],
|
||||
component: () => import('./case-converter.vue'),
|
||||
icon: LetterCaseToggle,
|
||||
npmPackages: ['change-case'],
|
||||
});
|
||||
|
@ -10,4 +10,5 @@ export const tool = defineTool({
|
||||
component: () => import('./color-converter.vue'),
|
||||
icon: Palette,
|
||||
redirectFrom: ['/color-picker-converter'],
|
||||
npmPackages: ['colord'],
|
||||
});
|
||||
|
@ -23,4 +23,5 @@ export const tool = defineTool({
|
||||
],
|
||||
component: () => import('./crontab-generator.vue'),
|
||||
icon: Alarm,
|
||||
npmPackages: ['cronstrue'],
|
||||
});
|
||||
|
@ -9,4 +9,5 @@ export const tool = defineTool({
|
||||
keywords: ['date', 'time', 'converter', 'iso', 'utc', 'timezone', 'year', 'month', 'day', 'minute', 'seconde'],
|
||||
component: () => import('./date-time-converter.vue'),
|
||||
icon: Calendar,
|
||||
npmPackages: ['date-fns'],
|
||||
});
|
||||
|
@ -10,4 +10,5 @@ export const tool = defineTool({
|
||||
component: () => import('./emoji-picker.vue'),
|
||||
icon: MoodSmile,
|
||||
createdAt: new Date('2023-08-07'),
|
||||
npmPackages: ['unicode-emoji-json', 'emojilib'],
|
||||
});
|
||||
|
@ -10,4 +10,5 @@ export const tool = defineTool({
|
||||
component: () => import('./encryption.vue'),
|
||||
icon: Lock,
|
||||
redirectFrom: ['/cypher'],
|
||||
npmPackages: ['crypto-s'],
|
||||
});
|
||||
|
@ -9,4 +9,5 @@ export const tool = defineTool({
|
||||
keywords: ['hmac', 'generator', 'MD5', 'SHA1', 'SHA256', 'SHA224', 'SHA512', 'SHA384', 'SHA3', 'RIPEMD160'],
|
||||
component: () => import('./hmac-generator.vue'),
|
||||
icon: ShortTextRound,
|
||||
npmPackages: ['crypto-js'],
|
||||
});
|
||||
|
@ -9,4 +9,5 @@ export const tool = defineTool({
|
||||
keywords: ['html', 'wysiwyg', 'editor', 'p', 'ul', 'ol', 'converter', 'live'],
|
||||
component: () => import('./html-wysiwyg-editor.vue'),
|
||||
icon: Edit,
|
||||
npmPackages: ['monaco', 'prettier'],
|
||||
});
|
||||
|
@ -10,4 +10,5 @@ export const tool = defineTool({
|
||||
component: () => import('./iban-validator-and-parser.vue'),
|
||||
icon: Bank,
|
||||
createdAt: new Date('2023-08-26'),
|
||||
npmPackages: ['ibantools'],
|
||||
});
|
||||
|
@ -10,4 +10,5 @@ export const tool = defineTool({
|
||||
component: () => import('./ipv6-ula-generator.vue'),
|
||||
icon: BuildingFactory,
|
||||
createdAt: new Date('2023-04-09'),
|
||||
npmPackages: ['crypto-js'],
|
||||
});
|
||||
|
@ -10,4 +10,5 @@ export const tool = defineTool({
|
||||
component: () => import('./json-diff.vue'),
|
||||
icon: CompareArrowsRound,
|
||||
createdAt: new Date('2023-04-20'),
|
||||
npmPackages: ['json5'],
|
||||
});
|
||||
|
@ -9,4 +9,5 @@ export const tool = defineTool({
|
||||
keywords: ['json', 'minify', 'format'],
|
||||
component: () => import('./json-minify.vue'),
|
||||
icon: Braces,
|
||||
npmPackages: ['json5'],
|
||||
});
|
||||
|
@ -10,4 +10,5 @@ export const tool = defineTool({
|
||||
component: () => import('./json-to-csv.vue'),
|
||||
icon: List,
|
||||
createdAt: new Date('2023-06-18'),
|
||||
npmPackages: ['json5'],
|
||||
});
|
||||
|
@ -10,4 +10,5 @@ export const tool = defineTool({
|
||||
component: () => import('./json-to-toml.vue'),
|
||||
icon: Braces,
|
||||
createdAt: new Date('2023-06-23'),
|
||||
npmPackages: ['json5', 'iarna-toml-esm'],
|
||||
});
|
||||
|
@ -10,4 +10,5 @@ export const tool = defineTool({
|
||||
component: () => import('./json-to-yaml.vue'),
|
||||
icon: Braces,
|
||||
createdAt: new Date('2023-04-10'),
|
||||
npmPackages: ['yaml', 'json5'],
|
||||
});
|
||||
|
@ -10,4 +10,5 @@ export const tool = defineTool({
|
||||
component: () => import('./json-viewer.vue'),
|
||||
icon: Braces,
|
||||
redirectFrom: ['/json-viewer'],
|
||||
npmPackages: ['json5'],
|
||||
});
|
||||
|
@ -25,4 +25,5 @@ export const tool = defineTool({
|
||||
],
|
||||
component: () => import('./jwt-parser.vue'),
|
||||
icon: Key,
|
||||
npmPackages: ['jwt-decode'],
|
||||
});
|
||||
|
@ -10,4 +10,5 @@ export const tool = defineTool({
|
||||
component: () => import('./mac-address-lookup.vue'),
|
||||
icon: Devices,
|
||||
createdAt: new Date('2023-04-06'),
|
||||
npmPackages: ['oui-data'],
|
||||
});
|
||||
|
@ -41,4 +41,5 @@ export const tool = defineTool({
|
||||
],
|
||||
component: () => import('./math-evaluator.vue'),
|
||||
icon: Math,
|
||||
npmPackages: ['mathjs'],
|
||||
});
|
||||
|
@ -23,4 +23,5 @@ export const tool = defineTool({
|
||||
],
|
||||
component: () => import('./meta-tag-generator.vue'),
|
||||
icon: Tags,
|
||||
npmPackages: ['@it-tools/oggen'],
|
||||
});
|
||||
|
@ -9,4 +9,5 @@ export const tool = defineTool({
|
||||
keywords: ['mime', 'types', 'extension', 'content', 'type'],
|
||||
component: () => import('./mime-types.vue'),
|
||||
icon: World,
|
||||
npmPackages: ['mime-types'],
|
||||
});
|
||||
|
@ -25,4 +25,5 @@ export const tool = defineTool({
|
||||
],
|
||||
component: () => import('./otp-code-generator-and-validator.vue'),
|
||||
icon: DeviceMobile,
|
||||
npmPackages: ['crypto-js'],
|
||||
});
|
||||
|
@ -10,4 +10,5 @@ export const tool = defineTool({
|
||||
component: () => import('./pdf-signature-checker.vue'),
|
||||
icon: FileCertIcon,
|
||||
createdAt: new Date('2023-12-09'),
|
||||
npmPackages: ['pdf-signature-reader'],
|
||||
});
|
||||
|
@ -22,4 +22,5 @@ export const tool = defineTool({
|
||||
component: () => import('./phone-parser-and-formatter.vue'),
|
||||
icon: Phone,
|
||||
createdAt: new Date('2023-05-01'),
|
||||
npmPackages: ['libphonenumber-js', 'country-code-lookup'],
|
||||
});
|
||||
|
@ -9,4 +9,5 @@ export const tool = defineTool({
|
||||
keywords: ['qr', 'code', 'generator', 'square', 'color', 'link', 'low', 'medium', 'quartile', 'high', 'transparent'],
|
||||
component: () => import('./qr-code-generator.vue'),
|
||||
icon: Qrcode,
|
||||
npmPackages: ['qrcode'],
|
||||
});
|
||||
|
@ -9,4 +9,5 @@ export const tool = defineTool({
|
||||
keywords: ['rsa', 'key', 'pair', 'generator', 'public', 'private', 'secret', 'ssh', 'pem'],
|
||||
component: () => import('./rsa-key-pair-generator.vue'),
|
||||
icon: Certificate,
|
||||
npmPackages: ['node-forge'],
|
||||
});
|
||||
|
@ -9,4 +9,5 @@ export const tool = defineTool({
|
||||
keywords: ['slugify', 'string', 'escape', 'emoji', 'special', 'character', 'space', 'trim'],
|
||||
component: () => import('./slugify-string.vue'),
|
||||
icon: AbcRound,
|
||||
npmPackages: ['@sindresorhus/slugify'],
|
||||
});
|
||||
|
@ -24,4 +24,5 @@ export const tool = defineTool({
|
||||
],
|
||||
component: () => import('./sql-prettify.vue'),
|
||||
icon: Database,
|
||||
npmPackages: ['sql-formatter'],
|
||||
});
|
||||
|
@ -11,4 +11,5 @@ export const tool = defineTool({
|
||||
component: () => import('./toml-to-json.vue'),
|
||||
icon: BracketIcon,
|
||||
createdAt: new Date('2023-06-23'),
|
||||
npmPackages: ['yaml', 'iarna-toml-esm'],
|
||||
});
|
||||
|
@ -10,4 +10,5 @@ export const tool = defineTool({
|
||||
component: () => import('./toml-to-yaml.vue'),
|
||||
icon: BracketIcon,
|
||||
createdAt: new Date('2023-06-23'),
|
||||
npmPackages: ['yaml', 'iarna-toml-esm'],
|
||||
});
|
||||
|
@ -10,6 +10,8 @@ export interface Tool {
|
||||
redirectFrom?: string[]
|
||||
isNew: boolean
|
||||
createdAt?: Date
|
||||
npmPackages?: string[]
|
||||
footer?: string
|
||||
}
|
||||
|
||||
export interface ToolCategory {
|
||||
|
@ -10,4 +10,5 @@ export const tool = defineTool({
|
||||
component: () => import('./ulid-generator.vue'),
|
||||
icon: SortDescendingNumbers,
|
||||
createdAt: new Date('2023-09-11'),
|
||||
npmPackages: ['ulid'],
|
||||
});
|
||||
|
@ -10,4 +10,5 @@ export const tool = defineTool({
|
||||
component: () => import('./user-agent-parser.vue'),
|
||||
icon: Browser,
|
||||
createdAt: new Date('2023-04-06'),
|
||||
npmPackages: ['ua-parser-js'],
|
||||
});
|
||||
|
@ -9,4 +9,5 @@ export const tool = defineTool({
|
||||
keywords: ['uuid', 'v4', 'random', 'id', 'alphanumeric', 'identity', 'token', 'string', 'identifier', 'unique', 'v1', 'v3', 'v5', 'nil'],
|
||||
component: () => import('./uuid-generator.vue'),
|
||||
icon: Fingerprint,
|
||||
npmPackages: ['uuid'],
|
||||
});
|
||||
|
@ -10,4 +10,5 @@ export const tool = defineTool({
|
||||
component: () => import('./wifi-qr-code-generator.vue'),
|
||||
icon: Qrcode,
|
||||
createdAt: new Date('2023-09-06'),
|
||||
npmPackages: ['qrcode'],
|
||||
});
|
||||
|
@ -10,4 +10,5 @@ export const tool = defineTool({
|
||||
component: () => import('./xml-formatter.vue'),
|
||||
icon: Code,
|
||||
createdAt: new Date('2023-06-17'),
|
||||
npmPackages: ['xml-formatter'],
|
||||
});
|
||||
|
@ -10,4 +10,5 @@ export const tool = defineTool({
|
||||
component: () => import('./yaml-to-json.vue'),
|
||||
icon: AlignJustified,
|
||||
createdAt: new Date('2023-04-10'),
|
||||
npmPackages: ['yaml'],
|
||||
});
|
||||
|
@ -10,4 +10,5 @@ export const tool = defineTool({
|
||||
component: () => import('./yaml-to-toml.vue'),
|
||||
icon: AlignJustified,
|
||||
createdAt: new Date('2023-06-23'),
|
||||
npmPackages: ['yaml', 'iarna-toml-esm'],
|
||||
});
|
||||
|
@ -10,4 +10,5 @@ export const tool = defineTool({
|
||||
component: () => import('./yaml-viewer.vue'),
|
||||
icon: AlignJustified,
|
||||
createdAt: new Date('2024-01-31'),
|
||||
npmPackages: ['yaml'],
|
||||
});
|
||||
|
Loading…
Reference in New Issue
Block a user