aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/App.vue32
-rw-r--r--src/components/CollapsibleToolMenu.vue3
-rw-r--r--src/components/ColoredCard.vue4
-rw-r--r--src/components/SearchBar.vue1
-rw-r--r--src/layouts/base.layout.vue1
-rw-r--r--src/layouts/tool.layout.vue1
-rw-r--r--src/main.ts35
-rw-r--r--src/pages/Home.page.vue34
-rw-r--r--src/plugins/plausible.plugin.ts2
-rw-r--r--src/router.ts67
-rw-r--r--src/tools/index.ts240
11 files changed, 227 insertions, 193 deletions
diff --git a/src/App.vue b/src/App.vue
index 98199af..56bd733 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,30 +1,30 @@
<script setup lang="ts">
-import { computed } from 'vue';
-import { useRoute, RouterView } from 'vue-router';
-import { darkTheme, NGlobalStyle, NMessageProvider, NNotificationProvider } from 'naive-ui';
-import { darkThemeOverrides, lightThemeOverrides } from './themes';
-import { layouts } from './layouts';
-import { useStyleStore } from './stores/style.store';
+// import { computed } from 'vue';
+// import { darkTheme, NGlobalStyle, NMessageProvider, NNotificationProvider } from 'naive-ui';
+// import { useRoute, RouterView } from 'vue-router';
+// import { darkThemeOverrides, lightThemeOverrides } from './themes';
+// import { layouts } from './layouts';
+// import { useStyleStore } from './stores/style.store';
-const route = useRoute();
-const layout = computed(() => route?.meta?.layout ?? layouts.base);
-const styleStore = useStyleStore();
+// const route = useRoute();
+// const layout = computed(() => route?.meta?.layout ?? layouts.base);
+// const styleStore = useStyleStore();
-const theme = computed(() => (styleStore.isDarkTheme ? darkTheme : null));
-const themeOverrides = computed(() => (styleStore.isDarkTheme ? darkThemeOverrides : lightThemeOverrides));
+// const theme = computed(() => (styleStore.isDarkTheme ? darkTheme : null));
+// const themeOverrides = computed(() => (styleStore.isDarkTheme ? darkThemeOverrides : lightThemeOverrides));
</script>
<template>
- <n-config-provider :theme="theme" :theme-overrides="themeOverrides">
+ <!-- <n-config-provider :theme="theme" :theme-overrides="themeOverrides">
<n-global-style />
<n-message-provider placement="bottom">
<n-notification-provider placement="bottom-right">
- <component :is="layout">
- <router-view />
- </component>
+ <component :is="layout"> -->
+ <router-view />
+ <!-- </component>
</n-notification-provider>
</n-message-provider>
- </n-config-provider>
+ </n-config-provider> -->
</template>
<style>
diff --git a/src/components/CollapsibleToolMenu.vue b/src/components/CollapsibleToolMenu.vue
index b766255..0f6f844 100644
--- a/src/components/CollapsibleToolMenu.vue
+++ b/src/components/CollapsibleToolMenu.vue
@@ -14,7 +14,6 @@
<n-menu
class="menu"
- :value="(route.name as string)"
:collapsed-width="64"
:collapsed-icon-size="22"
:options="tools"
@@ -32,7 +31,7 @@ import { ChevronRight } from '@vicons/tabler';
import { useStorage } from '@vueuse/core';
import { useThemeVars } from 'naive-ui';
import { toRefs, computed, h } from 'vue';
-import { RouterLink, useRoute } from 'vue-router';
+import { RouterLink } from 'vue-router';
import MenuIconItem from './MenuIconItem.vue';
const props = withDefaults(defineProps<{ toolsByCategory?: ToolCategory[] }>(), { toolsByCategory: () => [] });
diff --git a/src/components/ColoredCard.vue b/src/components/ColoredCard.vue
index eb29e40..5c97e22 100644
--- a/src/components/ColoredCard.vue
+++ b/src/components/ColoredCard.vue
@@ -6,12 +6,12 @@
<n-h3 class="title">
<n-ellipsis>{{ title }}</n-ellipsis>
</n-h3>
-
+ <!--
<div class="description">
<n-ellipsis :line-clamp="2" :tooltip="false">
<slot />
</n-ellipsis>
- </div>
+ </div> -->
</n-card>
</template>
diff --git a/src/components/SearchBar.vue b/src/components/SearchBar.vue
index 78d6fd7..0485223 100644
--- a/src/components/SearchBar.vue
+++ b/src/components/SearchBar.vue
@@ -7,7 +7,6 @@ import { SearchRound } from '@vicons/material';
import { useMagicKeys, whenever } from '@vueuse/core';
import type { NInput } from 'naive-ui';
import { computed, h, ref } from 'vue';
-import { useRouter } from 'vue-router';
import SearchBarItem from './SearchBarItem.vue';
const toolToOption = (tool: Tool) => ({ label: tool.name, value: tool.path, tool });
diff --git a/src/layouts/base.layout.vue b/src/layouts/base.layout.vue
index 1d57a5a..ecbc079 100644
--- a/src/layouts/base.layout.vue
+++ b/src/layouts/base.layout.vue
@@ -1,7 +1,6 @@
<script lang="ts" setup>
import { NIcon, useThemeVars } from 'naive-ui';
import { computed } from 'vue';
-import { RouterLink } from 'vue-router';
import { Heart, Menu2, Home2 } from '@vicons/tabler';
import { toolsByCategory } from '@/tools';
import { useStyleStore } from '@/stores/style.store';
diff --git a/src/layouts/tool.layout.vue b/src/layouts/tool.layout.vue
index 6cccbb0..17819f9 100644
--- a/src/layouts/tool.layout.vue
+++ b/src/layouts/tool.layout.vue
@@ -1,5 +1,4 @@
<script lang="ts" setup>
-import { useRoute } from 'vue-router';
import { useHead } from '@vueuse/head';
import type { HeadObject } from '@vueuse/head';
import { computed } from 'vue';
diff --git a/src/main.ts b/src/main.ts
index f063ef6..12bda00 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,25 +1,30 @@
-import { createApp } from 'vue';
import { createPinia } from 'pinia';
-import { createHead } from '@vueuse/head';
// eslint-disable-next-line import/no-unresolved
-import { registerSW } from 'virtual:pwa-register';
+import { ViteSSG } from 'vite-ssg';
import { plausible } from './plugins/plausible.plugin';
import 'virtual:uno.css';
-registerSW();
-
-import { naive } from './plugins/naive.plugin';
+// import { naive } from './plugins/naive.plugin';
import App from './App.vue';
-import router from './router';
-
-const app = createApp(App);
+import { routes } from './router';
+import { config } from './config';
+// import { useToolStore } from './tools/tools.store';
-app.use(createPinia());
-app.use(createHead());
-app.use(router);
-app.use(naive);
-app.use(plausible);
+export const createApp = ViteSSG(
+ // the root component
+ App,
+ // vue-router options
+ { routes, base: config.app.baseUrl },
+ // function to have custom setups
+ async ({ app, router, routes, isClient, initialState }) => {
+ // install plugins etc.
+ const pinia = createPinia();
+ app.use(pinia);
-app.mount('#app');
+ app.use(plausible);
+ // import { registerSW } from 'virtual:pwa-register';
+ // registerSW();
+ },
+);
diff --git a/src/pages/Home.page.vue b/src/pages/Home.page.vue
index cd77e0c..f8bc301 100644
--- a/src/pages/Home.page.vue
+++ b/src/pages/Home.page.vue
@@ -12,6 +12,38 @@ useHead({ title: 'IT Tools - Handy online tools for developers' });
</script>
<template>
+ Lorem ipsum dolor sit amet, consectetur adipisicing elit. Earum voluptatibus, voluptatum excepturi quidem ipsam
+ dignissimos sit eius illo corrupti, provident aliquam quaerat nostrum obcaecati velit ratione neque possimus beatae
+ quod?
+
+ <n-grid v-if="config.showBanner" x-gap="12" y-gap="12" cols="1 400:2 800:3 1200:4 2000:8">
+ <n-gi>
+ aa
+ <colored-card title="You like it-tools?" :icon="Heart">
+ Give us a star on
+ <!-- <a
+ href="https://github.com/CorentinTh/it-tools"
+ rel="noopener"
+ target="_blank"
+ aria-label="IT-Tools' GitHub repository"
+ >GitHub</a
+ >
+ or follow us on
+ <a
+ href="https://twitter.com/ittoolsdottech"
+ rel="noopener"
+ target="_blank"
+ aria-label="IT-Tools' Twitter account"
+ >Twitter</a
+ >! Thank you
+ <n-icon :component="Heart" /> -->
+ </colored-card>
+ </n-gi>
+ </n-grid>
+
+ <n-button>a</n-button>
+
+ <!--
<div class="home-page">
<div class="grid-wrapper">
<n-grid v-if="config.showBanner" x-gap="12" y-gap="12" cols="1 400:2 800:3 1200:4 2000:8">
@@ -67,7 +99,7 @@ useHead({ title: 'IT Tools - Handy online tools for developers' });
</n-gi>
</n-grid>
</div>
- </div>
+ </div> -->
</template>
<style scoped lang="less">
diff --git a/src/plugins/plausible.plugin.ts b/src/plugins/plausible.plugin.ts
index 50a694d..d014c3d 100644
--- a/src/plugins/plausible.plugin.ts
+++ b/src/plugins/plausible.plugin.ts
@@ -21,7 +21,7 @@ function createPlausibleInstance({
trackLocalhost: boolean;
};
}) {
- if (config.isTrackerEnabled) {
+ if (config.isTrackerEnabled && !import.meta.env.SSR) {
return Plausible(config);
}
diff --git a/src/router.ts b/src/router.ts
index f16b418..101fe99 100644
--- a/src/router.ts
+++ b/src/router.ts
@@ -1,39 +1,38 @@
-import { createRouter, createWebHistory } from 'vue-router';
-import { layouts } from './layouts/index';
+import type { RouteRecordRaw } from 'vue-router';
import HomePage from './pages/Home.page.vue';
+// import { layouts } from './layouts/index';
import NotFound from './pages/404.page.vue';
-import { tools } from './tools';
-import { config } from './config';
+// import { tools } from './tools';
-const toolsRoutes = tools.map(({ path, name, component, ...config }) => ({
- path,
- name,
- component,
- meta: { isTool: true, layout: layouts.toolLayout, name, ...config },
-}));
-const toolsRedirectRoutes = tools
- .filter(({ redirectFrom }) => redirectFrom && redirectFrom.length > 0)
- .flatMap(
- ({ path, redirectFrom }) => redirectFrom?.map((redirectSource) => ({ path: redirectSource, redirect: path })) ?? [],
- );
+// const toolsRoutes = tools.map(({ path, name, component, ...config }) => ({
+// path,
+// name,
+// component,
+// meta: { isTool: true, layout: layouts.toolLayout, name, ...config },
+// }));
+// const toolsRedirectRoutes = tools
+// .filter(({ redirectFrom }) => redirectFrom && redirectFrom.length > 0)
+// .flatMap(
+// ({ path, redirectFrom }) => redirectFrom?.map((redirectSource) => ({ path: redirectSource, redirect: path })) ?? [],
+// );
+//
+// console.log({ toolsRoutes, toolsRedirectRoutes });
-const router = createRouter({
- history: createWebHistory(config.app.baseUrl),
- routes: [
- {
- path: '/',
- name: 'home',
- component: HomePage,
- },
- {
- path: '/about',
- name: 'about',
- component: () => import('./pages/About.vue'),
- },
- ...toolsRoutes,
- ...toolsRedirectRoutes,
- { path: '/:pathMatch(.*)*', name: 'NotFound', component: NotFound },
- ],
-});
+const routes: RouteRecordRaw[] = [
+ // ...toolsRoutes,
+ // ...toolsRedirectRoutes,
+ {
+ path: '/',
+ name: 'home',
+ component: HomePage,
+ },
+ // {
+ // path: '/about',
+ // name: 'about',
+ // component: () => import('./pages/About.vue'),
+ // },
-export default router;
+ // { path: '/:pathMatch(.*)*', name: 'NotFound', component: NotFound },
+];
+
+export { routes };
diff --git a/src/tools/index.ts b/src/tools/index.ts
index ad6167e..d30a81b 100644
--- a/src/tools/index.ts
+++ b/src/tools/index.ts
@@ -1,130 +1,132 @@
-import { tool as base64FileConverter } from './base64-file-converter';
-import { tool as base64StringConverter } from './base64-string-converter';
-import { tool as basicAuthGenerator } from './basic-auth-generator';
-import { tool as httpStatusCodes } from './http-status-codes';
-import { tool as yamlToJson } from './yaml-to-json-converter';
-import { tool as jsonToYaml } from './json-to-yaml-converter';
-import { tool as ipv6UlaGenerator } from './ipv6-ula-generator';
-import { tool as ipv4AddressConverter } from './ipv4-address-converter';
-import { tool as benchmarkBuilder } from './benchmark-builder';
-import { tool as userAgentParser } from './user-agent-parser';
-import { tool as ipv4SubnetCalculator } from './ipv4-subnet-calculator';
-import { tool as dockerRunToDockerComposeConverter } from './docker-run-to-docker-compose-converter';
-import { tool as htmlWysiwygEditor } from './html-wysiwyg-editor';
-import { tool as rsaKeyPairGenerator } from './rsa-key-pair-generator';
-import { tool as textToNatoAlphabet } from './text-to-nato-alphabet';
-import { tool as slugifyString } from './slugify-string';
-import { tool as keycodeInfo } from './keycode-info';
-import { tool as jsonMinify } from './json-minify';
-import { tool as bcrypt } from './bcrypt';
-import { tool as bip39 } from './bip39-generator';
-import { tool as caseConverter } from './case-converter';
-import { tool as chmodCalculator } from './chmod-calculator';
-import { tool as chronometer } from './chronometer';
-import { tool as colorConverter } from './color-converter';
-import { tool as crontabGenerator } from './crontab-generator';
-import { tool as dateTimeConverter } from './date-time-converter';
-import { tool as deviceInformation } from './device-information';
-import { tool as cypher } from './encryption';
-import { tool as etaCalculator } from './eta-calculator';
-import { tool as gitMemo } from './git-memo';
-import { tool as hashText } from './hash-text';
-import { tool as hmacGenerator } from './hmac-generator';
-import { tool as htmlEntities } from './html-entities';
-import { tool as baseConverter } from './integer-base-converter';
-import { tool as jsonViewer } from './json-viewer';
-import { tool as jwtParser } from './jwt-parser';
-import { tool as loremIpsumGenerator } from './lorem-ipsum-generator';
-import { tool as mathEvaluator } from './math-evaluator';
-import { tool as metaTagGenerator } from './meta-tag-generator';
-import { tool as mimeTypes } from './mime-types';
-import { tool as otpCodeGeneratorAndValidator } from './otp-code-generator-and-validator';
-import { tool as qrCodeGenerator } from './qr-code-generator';
-import { tool as randomPortGenerator } from './random-port-generator';
-import { tool as romanNumeralConverter } from './roman-numeral-converter';
-import { tool as sqlPrettify } from './sql-prettify';
-import { tool as svgPlaceholderGenerator } from './svg-placeholder-generator';
-import { tool as temperatureConverter } from './temperature-converter';
-import { tool as textStatistics } from './text-statistics';
-import { tool as tokenGenerator } from './token-generator';
+// import { tool as base64FileConverter } from './base64-file-converter';
+// import { tool as base64StringConverter } from './base64-string-converter';
+// import { tool as basicAuthGenerator } from './basic-auth-generator';
+// import { tool as httpStatusCodes } from './http-status-codes';
+// import { tool as yamlToJson } from './yaml-to-json-converter';
+// import { tool as jsonToYaml } from './json-to-yaml-converter';
+// import { tool as ipv6UlaGenerator } from './ipv6-ula-generator';
+// import { tool as ipv4AddressConverter } from './ipv4-address-converter';
+// import { tool as benchmarkBuilder } from './benchmark-builder';
+// import { tool as userAgentParser } from './user-agent-parser';
+// import { tool as ipv4SubnetCalculator } from './ipv4-subnet-calculator';
+// import { tool as dockerRunToDockerComposeConverter } from './docker-run-to-docker-compose-converter';
+// import { tool as htmlWysiwygEditor } from './html-wysiwyg-editor';
+// import { tool as rsaKeyPairGenerator } from './rsa-key-pair-generator';
+// import { tool as textToNatoAlphabet } from './text-to-nato-alphabet';
+// import { tool as slugifyString } from './slugify-string';
+// import { tool as keycodeInfo } from './keycode-info';
+// import { tool as jsonMinify } from './json-minify';
+// import { tool as bcrypt } from './bcrypt';
+// import { tool as bip39 } from './bip39-generator';
+// import { tool as caseConverter } from './case-converter';
+// import { tool as chmodCalculator } from './chmod-calculator';
+// import { tool as chronometer } from './chronometer';
+// import { tool as colorConverter } from './color-converter';
+// import { tool as crontabGenerator } from './crontab-generator';
+// import { tool as dateTimeConverter } from './date-time-converter';
+// import { tool as deviceInformation } from './device-information';
+// import { tool as cypher } from './encryption';
+// import { tool as etaCalculator } from './eta-calculator';
+// import { tool as gitMemo } from './git-memo';
+// import { tool as hashText } from './hash-text';
+// import { tool as hmacGenerator } from './hmac-generator';
+// import { tool as htmlEntities } from './html-entities';
+// import { tool as baseConverter } from './integer-base-converter';
+// import { tool as jsonViewer } from './json-viewer';
+// import { tool as jwtParser } from './jwt-parser';
+// import { tool as loremIpsumGenerator } from './lorem-ipsum-generator';
+// import { tool as mathEvaluator } from './math-evaluator';
+// import { tool as metaTagGenerator } from './meta-tag-generator';
+// import { tool as mimeTypes } from './mime-types';
+// import { tool as otpCodeGeneratorAndValidator } from './otp-code-generator-and-validator';
+// import { tool as qrCodeGenerator } from './qr-code-generator';
+// import { tool as randomPortGenerator } from './random-port-generator';
+// import { tool as romanNumeralConverter } from './roman-numeral-converter';
+// import { tool as sqlPrettify } from './sql-prettify';
+// import { tool as svgPlaceholderGenerator } from './svg-placeholder-generator';
+// import { tool as temperatureConverter } from './temperature-converter';
+// import { tool as textStatistics } from './text-statistics';
+// import { tool as tokenGenerator } from './token-generator';
import type { ToolCategory } from './tools.types';
-import { tool as urlEncoder } from './url-encoder';
-import { tool as urlParser } from './url-parser';
-import { tool as uuidGenerator } from './uuid-generator';
-import { tool as macAddressLookup } from './mac-address-lookup';
+// import { tool as urlEncoder } from './url-encoder';
+// import { tool as urlParser } from './url-parser';
+// import { tool as uuidGenerator } from './uuid-generator';
+// import { tool as macAddressLookup } from './mac-address-lookup';
export const toolsByCategory: ToolCategory[] = [
{
name: 'Crypto',
- components: [tokenGenerator, hashText, bcrypt, uuidGenerator, cypher, bip39, hmacGenerator, rsaKeyPairGenerator],
- },
- {
- name: 'Converter',
- components: [
- dateTimeConverter,
- baseConverter,
- romanNumeralConverter,
- base64StringConverter,
- base64FileConverter,
- colorConverter,
- caseConverter,
- textToNatoAlphabet,
- yamlToJson,
- jsonToYaml,
- ],
- },
- {
- name: 'Web',
- components: [
- urlEncoder,
- htmlEntities,
- urlParser,
- deviceInformation,
- basicAuthGenerator,
- metaTagGenerator,
- otpCodeGeneratorAndValidator,
- mimeTypes,
- jwtParser,
- keycodeInfo,
- slugifyString,
- htmlWysiwygEditor,
- userAgentParser,
- httpStatusCodes,
- ],
- },
- {
- name: 'Images',
- components: [qrCodeGenerator, svgPlaceholderGenerator],
- },
- {
- name: 'Development',
components: [
- gitMemo,
- randomPortGenerator,
- crontabGenerator,
- jsonViewer,
- jsonMinify,
- sqlPrettify,
- chmodCalculator,
- dockerRunToDockerComposeConverter,
+ /* tokenGenerator, hashText, bcrypt, uuidGenerator, cypher, bip39, hmacGenerator, rsaKeyPairGenerator*/
],
},
- {
- name: 'Network',
- components: [ipv4SubnetCalculator, ipv4AddressConverter, macAddressLookup, ipv6UlaGenerator],
- },
- {
- name: 'Math',
- components: [mathEvaluator, etaCalculator],
- },
- {
- name: 'Measurement',
- components: [chronometer, temperatureConverter, benchmarkBuilder],
- },
- {
- name: 'Text',
- components: [loremIpsumGenerator, textStatistics],
- },
+ // {
+ // name: 'Converter',
+ // components: [
+ // dateTimeConverter,
+ // baseConverter,
+ // romanNumeralConverter,
+ // base64StringConverter,
+ // base64FileConverter,
+ // colorConverter,
+ // caseConverter,
+ // textToNatoAlphabet,
+ // yamlToJson,
+ // jsonToYaml,
+ // ],
+ // },
+ // {
+ // name: 'Web',
+ // components: [
+ // urlEncoder,
+ // htmlEntities,
+ // urlParser,
+ // deviceInformation,
+ // basicAuthGenerator,
+ // metaTagGenerator,
+ // otpCodeGeneratorAndValidator,
+ // mimeTypes,
+ // jwtParser,
+ // keycodeInfo,
+ // slugifyString,
+ // htmlWysiwygEditor,
+ // userAgentParser,
+ // httpStatusCodes,
+ // ],
+ // },
+ // {
+ // name: 'Images',
+ // components: [qrCodeGenerator, svgPlaceholderGenerator],
+ // },
+ // {
+ // name: 'Development',
+ // components: [
+ // gitMemo,
+ // randomPortGenerator,
+ // crontabGenerator,
+ // jsonViewer,
+ // jsonMinify,
+ // sqlPrettify,
+ // chmodCalculator,
+ // dockerRunToDockerComposeConverter,
+ // ],
+ // },
+ // {
+ // name: 'Network',
+ // components: [ipv4SubnetCalculator, ipv4AddressConverter, macAddressLookup, ipv6UlaGenerator],
+ // },
+ // {
+ // name: 'Math',
+ // components: [mathEvaluator, etaCalculator],
+ // },
+ // {
+ // name: 'Measurement',
+ // components: [chronometer, temperatureConverter, benchmarkBuilder],
+ // },
+ // {
+ // name: 'Text',
+ // components: [loremIpsumGenerator, textStatistics],
+ // },
];
export const tools = toolsByCategory.flatMap(({ components }) => components);