refactor: fonts are now bundled with packages (#3227)

This commit is contained in:
Liyas Thomas
2023-08-05 23:42:31 +05:30
committed by GitHub
parent 0e70c28324
commit 5c8ebaff3e
18 changed files with 240 additions and 115 deletions

View File

@@ -1,7 +1,7 @@
@mixin base-theme {
--font-sans: "Inter", sans-serif;
--font-mono: "Roboto Mono", monospace;
--font-icon: "Material Icons";
--font-sans: "Inter Variable", sans-serif;
--font-icon: "Material Symbols Rounded Variable";
--font-mono: "Roboto Mono Variable", monospace;
--font-size-tiny: calc(var(--font-size-body) - 0.062rem);
}

View File

@@ -33,6 +33,9 @@
"@codemirror/search": "^6.0.0",
"@codemirror/state": "^6.1.0",
"@codemirror/view": "^6.0.2",
"@fontsource-variable/inter": "^5.0.5",
"@fontsource-variable/material-symbols-rounded": "^5.0.5",
"@fontsource-variable/roboto-mono": "^5.0.6",
"@hoppscotch/codemirror-lang-graphql": "workspace:^",
"@hoppscotch/data": "workspace:^",
"@hoppscotch/js-sandbox": "workspace:^",
@@ -139,11 +142,11 @@
"rollup-plugin-polyfill-node": "^0.10.1",
"sass": "^1.53.0",
"typescript": "^4.5.4",
"unplugin-fonts": "^1.0.3",
"unplugin-icons": "^0.14.9",
"unplugin-vue-components": "^0.21.0",
"vite": "^3.1.4",
"vite-plugin-checker": "^0.5.1",
"vite-plugin-fonts": "^0.6.0",
"vite-plugin-html-config": "^1.0.10",
"vite-plugin-inspect": "^0.7.4",
"vite-plugin-pages": "^0.26.0",

View File

@@ -10,6 +10,9 @@ import "virtual:windi.css"
import "../assets/scss/themes.scss"
import "../assets/scss/styles.scss"
import "nprogress/nprogress.css"
import "@fontsource-variable/inter"
import "@fontsource-variable/material-symbols-rounded"
import "@fontsource-variable/roboto-mono"
import App from "./App.vue"

View File

@@ -15,17 +15,18 @@
"skipLibCheck": true,
"noUnusedLocals": true,
"paths": {
"~/*": [ "./src/*" ],
"@composables/*": [ "./src/composables/*" ],
"@components/*": [ "./src/components/*" ],
"@helpers/*": [ "./src/helpers/*" ],
"@modules/*": [ "./src/modules/*" ],
"@workers/*": [ "./src/workers/*" ],
"@functional/*": [ "./src/helpers/functional/*" ]
"~/*": ["./src/*"],
"@composables/*": ["./src/composables/*"],
"@components/*": ["./src/components/*"],
"@helpers/*": ["./src/helpers/*"],
"@modules/*": ["./src/modules/*"],
"@workers/*": ["./src/workers/*"],
"@functional/*": ["./src/helpers/functional/*"]
},
"types": [
"vite/client",
"unplugin-icons/types/vue",
"unplugin-fonts/client",
"vite-plugin-pages/client",
"vite-plugin-vue-layouts/client",
"vite-plugin-pwa/client"

View File

@@ -23,6 +23,9 @@
"postinstall": "pnpm run gql-codegen"
},
"dependencies": {
"@fontsource-variable/inter": "^5.0.5",
"@fontsource-variable/material-symbols-rounded": "^5.0.5",
"@fontsource-variable/roboto-mono": "^5.0.6",
"@hoppscotch/common": "workspace:^",
"@hoppscotch/data": "workspace:^",
"axios": "^0.21.4",
@@ -59,10 +62,10 @@
"eslint-plugin-vue": "^9.5.1",
"npm-run-all": "^4.1.5",
"typescript": "^4.6.4",
"unplugin-fonts": "^1.0.3",
"unplugin-icons": "^0.14.9",
"unplugin-vue-components": "^0.21.0",
"vite": "^3.2.3",
"vite-plugin-fonts": "^0.6.0",
"vite-plugin-html-config": "^1.0.10",
"vite-plugin-inspect": "^0.7.4",
"vite-plugin-pages": "^0.26.0",

View File

@@ -13,12 +13,11 @@
"skipLibCheck": true,
"noEmit": true,
"paths": {
"@hoppscotch/common": [ "../hoppscotch-common/src/index.ts" ],
"@hoppscotch/common/*": [ "../hoppscotch-common/src/*" ],
"@hoppscotch/common": ["../hoppscotch-common/src/index.ts"],
"@hoppscotch/common/*": ["../hoppscotch-common/src/*"],
"@platform/*": ["./src/platform/*"],
"@lib/*": ["./src/lib/*"],
"@lib/*": ["./src/lib/*"]
}
},
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
"references": [{ "path": "./tsconfig.node.json" }]

View File

@@ -15,7 +15,7 @@ import Layouts from "vite-plugin-vue-layouts"
import IconResolver from "unplugin-icons/resolver"
import { FileSystemIconLoader } from "unplugin-icons/loaders"
import * as path from "path"
import { VitePluginFonts } from "vite-plugin-fonts"
import Unfonts from "unplugin-fonts/vite"
import legacy from "@vitejs/plugin-legacy"
const ENV = loadEnv("development", path.resolve(__dirname, "../../"))
@@ -217,12 +217,21 @@ export default defineConfig({
],
},
}),
VitePluginFonts({
google: {
Unfonts({
fontsource: {
families: [
"Inter:wght@400;500;600;700;800",
"Roboto+Mono:wght@400;500",
"Material+Icons",
{
name: "Inter Variable",
variables: ["variable-full"],
},
{
name: "Material Symbols Rounded Variable",
variables: ["variable-full"],
},
{
name: "Roboto Mono Variable",
variables: ["variable-full"],
},
],
},
}),

View File

@@ -1,7 +1,7 @@
@mixin base-theme {
--font-sans: 'Inter', sans-serif;
--font-mono: 'Roboto Mono', monospace;
--font-icon: 'Material Icons';
--font-sans: "Inter Variable", sans-serif;
--font-icon: "Material Symbols Rounded Variable";
--font-mono: "Roboto Mono Variable", monospace;
--font-size-tiny: calc(var(--font-size-body) - 0.062rem);
}

View File

@@ -13,6 +13,9 @@
"preview": "vite preview"
},
"dependencies": {
"@fontsource-variable/inter": "^5.0.5",
"@fontsource-variable/material-symbols-rounded": "^5.0.5",
"@fontsource-variable/roboto-mono": "^5.0.6",
"@graphql-typed-document-node/core": "^3.1.1",
"@hoppscotch/ui": "workspace:^",
"@hoppscotch/vue-toasted": "^0.1.0",
@@ -56,6 +59,7 @@
"sass": "^1.57.1",
"ts-node": "^10.9.1",
"typescript": "^4.9.3",
"unplugin-fonts": "^1.0.3",
"vite": "^3.1.4",
"vite-plugin-pages": "^0.26.0",
"vite-plugin-vue-layouts": "^0.7.0",

View File

@@ -7,6 +7,9 @@ import 'virtual:windi.css';
import '@hoppscotch/ui/style.css';
import '../assets/scss/themes.scss';
import '../assets/scss/styles.scss';
import '@fontsource-variable/inter';
import '@fontsource-variable/material-symbols-rounded';
import '@fontsource-variable/roboto-mono';
// END STYLES
import { HOPP_MODULES } from './modules';

View File

@@ -25,6 +25,7 @@
"types": [
"vite/client",
"unplugin-icons/types/vue",
"unplugin-fonts/client",
"vite-plugin-pages/client",
"vite-plugin-vue-layouts/client"
]

View File

@@ -2,6 +2,7 @@ import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import { FileSystemIconLoader } from 'unplugin-icons/loaders';
import Icons from 'unplugin-icons/vite';
import Unfonts from "unplugin-fonts/vite";
import IconResolver from 'unplugin-icons/resolver';
import Components from 'unplugin-vue-components/vite';
import WindiCSS from 'vite-plugin-windicss';
@@ -68,5 +69,23 @@ export default defineConfig({
auth: FileSystemIconLoader('../hoppscotch-sh-admin/assets/icons/auth'),
},
}),
Unfonts({
fontsource: {
families: [
{
name: "Inter Variable",
variables: ["variable-full"],
},
{
name: "Material Symbols Rounded Variable",
variables: ["variable-full"],
},
{
name: "Roboto Mono Variable",
variables: ["variable-full"],
},
],
},
}),
],
});

View File

@@ -1,5 +1,8 @@
import "./src/assets/scss/styles.scss"
import "./src/assets/scss/themes.scss"
import "virtual:windi.css"
import "@fontsource-variable/inter"
import "@fontsource-variable/material-symbols-rounded"
import "@fontsource-variable/roboto-mono"
export function setupVue3() {}

View File

@@ -18,6 +18,9 @@
"vue-router": "^4.0.16"
},
"dependencies": {
"@fontsource-variable/inter": "^5.0.5",
"@fontsource-variable/material-symbols-rounded": "^5.0.5",
"@fontsource-variable/roboto-mono": "^5.0.6",
"@hoppscotch/vue-toasted": "^0.1.0",
"@lezer/highlight": "^1.0.0",
"@vitejs/plugin-legacy": "^2.3.0",
@@ -67,12 +70,12 @@
"rollup-plugin-polyfill-node": "^0.10.1",
"sass": "^1.53.0",
"typescript": "^4.5.4",
"unplugin-fonts": "^1.0.3",
"unplugin-icons": "^0.15.3",
"unplugin-vue-components": "^0.21.0",
"vite": "^3.2.3",
"vite-plugin-checker": "^0.5.1",
"vite-plugin-dts": "2.0.0-beta.3",
"vite-plugin-fonts": "^0.6.0",
"vite-plugin-html-config": "^1.0.10",
"vite-plugin-inspect": "^0.7.4",
"vite-plugin-pages": "^0.26.0",

View File

@@ -1,7 +1,7 @@
@mixin base-theme {
--font-sans: "Inter", sans-serif;
--font-mono: "Roboto Mono", monospace;
--font-icon: "Material Icons";
--font-sans: "Inter Variable", sans-serif;
--font-icon: "Material Symbols Rounded Variable";
--font-mono: "Roboto Mono Variable", monospace;
--font-size-tiny: calc(var(--font-size-body) - 0.062rem);
}

View File

@@ -11,47 +11,26 @@
"resolveJsonModule": true,
"isolatedModules": true,
"esModuleInterop": true,
"lib": [
"ESNext",
"DOM"
],
"lib": ["ESNext", "DOM"],
"skipLibCheck": true,
"noUnusedLocals": true,
"paths": {
"~/*": [
"./src/*"
],
"@composables/*": [
"./src/composables/*"
],
"@components/*": [
"./src/components/*"
],
"@helpers/*": [
"./src/helpers/*"
],
"@modules/*": [
"./src/modules/*"
],
"@workers/*": [
"./src/workers/*"
],
"@functional/*": [
"./src/helpers/functional/*"
]
"~/*": ["./src/*"],
"@composables/*": ["./src/composables/*"],
"@components/*": ["./src/components/*"],
"@helpers/*": ["./src/helpers/*"],
"@modules/*": ["./src/modules/*"],
"@workers/*": ["./src/workers/*"],
"@functional/*": ["./src/helpers/functional/*"]
},
"types": [
"vite/client",
"unplugin-icons/types/vue",
"unplugin-fonts/client",
"vite-plugin-pages/client",
"vite-plugin-vue-layouts/client",
"vite-plugin-pwa/client"
]
},
"include": [
"src/**/*.ts",
"src/**/*.d.ts",
"src/**/*.tsx",
"src/**/*.vue"
]
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"]
}

View File

@@ -4,7 +4,7 @@ import path from "path"
import Icons from "unplugin-icons/vite"
import { defineConfig } from "vite"
import WindiCSS from "vite-plugin-windicss"
import { VitePluginFonts } from "vite-plugin-fonts"
import Unfonts from "unplugin-fonts/vite"
export default defineConfig({
plugins: [
@@ -20,12 +20,21 @@ export default defineConfig({
Icons({
compiler: "vue3"
}),
VitePluginFonts({
google: {
Unfonts({
fontsource: {
families: [
"Inter:wght@400;500;600;700;800",
"Roboto+Mono:wght@400;500",
"Material+Icons",
{
name: "Inter Variable",
variables: ["variable-full"],
},
{
name: "Material Symbols Rounded Variable",
variables: ["variable-full"],
},
{
name: "Roboto Mono Variable",
variables: ["variable-full"],
},
],
},
}),