fix(overview): traffic widget, truncate the texts to fix overflow

This commit is contained in:
kunish 2024-08-11 13:15:48 +08:00
parent bc9aba87dc
commit dc9db7c60c
No known key found for this signature in database
GPG Key ID: 67D3ACD788F3A7CD
3 changed files with 3974 additions and 1456 deletions

View File

@ -15,7 +15,7 @@
},
"dependencies": {
"@commitlint/config-conventional": "^19.2.2",
"@eslint/js": "^9.8.0",
"@eslint/js": "^9.9.0",
"@felte/solid": "^1.2.13",
"@felte/validator-zod": "^1.0.17",
"@fontsource/fira-sans": "^5.0.20",
@ -37,41 +37,41 @@
"@thisbeyond/solid-dnd": "^0.7.5",
"@types/byte-size": "^8.1.2",
"@types/lodash": "^4.17.7",
"@types/node": "^22.1.0",
"@types/node": "^22.2.0",
"@types/uuid": "^10.0.0",
"@vite-pwa/assets-generator": "^0.2.4",
"apexcharts": "^3.51.0",
"apexcharts": "^3.52.0",
"autoprefixer": "^10.4.20",
"byte-size": "^9.0.0",
"commitlint": "^19.4.0",
"daisyui": "^4.12.10",
"dayjs": "^1.11.12",
"eslint": "^9.8.0",
"eslint": "^9.9.0",
"eslint-config-prettier": "^9.1.0",
"eslint-plugin-prettier": "^5.2.1",
"husky": "^9.1.4",
"is-ip": "^5.0.1",
"ky": "^1.5.0",
"lint-staged": "^15.2.7",
"lint-staged": "^15.2.8",
"lodash": "^4.17.21",
"match-sorter": "^6.3.4",
"prettier": "^3.3.3",
"prettier-plugin-organize-imports": "^4.0.0",
"prettier-plugin-tailwindcss": "^0.6.5",
"prettier-plugin-tailwindcss": "^0.6.6",
"solid-apexcharts": "^0.3.4",
"solid-js": "^1.8.20",
"solid-toast": "^0.5.0",
"sort-package-json": "^2.10.0",
"tailwind-merge": "^2.4.0",
"tailwindcss": "^3.4.7",
"tailwindcss": "^3.4.9",
"typescript": "^5.5.4",
"typescript-eslint": "^8.0.1",
"unplugin-auto-import": "^0.18.2",
"uuid": "^10.0.0",
"vite": "^5.3.5",
"vite": "^5.4.0",
"vite-plugin-pwa": "^0.20.1",
"vite-plugin-solid": "^2.10.2",
"zod": "^3.23.8"
},
"packageManager": "pnpm@9.6.0"
"packageManager": "pnpm@9.7.0"
}

File diff suppressed because it is too large Load Diff

View File

@ -11,7 +11,7 @@ import { endpoint, latestConnectionMsg, useWsRequest } from '~/signals'
const TrafficWidget: ParentComponent<{ label: JSX.Element }> = (props) => (
<div class="stat flex-1 place-items-center">
<div class="stat-title text-primary-content">{props.label}</div>
<div class="stat-value text-2xl text-primary-content lg:text-3xl">
<div class="stat-value w-full truncate text-center text-2xl text-primary-content lg:text-3xl">
{children(() => props.children)()}
</div>
</div>