mirror of
https://github.com/donaldzou/WGDashboard.git
synced 2024-11-06 07:50:13 +01:00
Some UI adjustment
This commit is contained in:
parent
bd7139827b
commit
0c8bb990d0
4
src/static/app/dist/assets/index.css
vendored
4
src/static/app/dist/assets/index.css
vendored
File diff suppressed because one or more lines are too long
40
src/static/app/dist/assets/index.js
vendored
40
src/static/app/dist/assets/index.js
vendored
File diff suppressed because one or more lines are too long
@ -6,7 +6,7 @@
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "vite build",
|
||||
"build electron": "vite build --mode electron && cd ../../../../WGDashboard-Desktop && electron-builder",
|
||||
"build electron": "vite build && vite build --mode electron && cd ../../../../WGDashboard-Desktop && electron-builder",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
|
@ -25,7 +25,7 @@ const getActiveCrossServer = computed(() => {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<nav class="navbar bg-dark sticky-top border-bottom border-secondary-subtle" data-bs-theme="dark">
|
||||
<nav class="navbar bg-dark sticky-top" data-bs-theme="dark">
|
||||
<div class="container-fluid d-flex text-body align-items-center">
|
||||
<span class="navbar-brand mb-0 h1">WGDashboard</span>
|
||||
<small class="ms-auto text-muted" v-if="getActiveCrossServer !== undefined">
|
||||
|
@ -83,7 +83,7 @@ export default {
|
||||
|
||||
<template>
|
||||
<div class="mb-3">
|
||||
<div class="d-flex gap-2 z-3">
|
||||
<div class="d-flex gap-2 z-3 peerSearchContainer">
|
||||
<RouterLink
|
||||
to="create"
|
||||
class="text-decoration-none btn text-primary-emphasis bg-primary-subtle rounded-3 border-1 border-primary-subtle shadow-sm">
|
||||
@ -100,6 +100,10 @@ export default {
|
||||
@keyup="this.debounce()"
|
||||
v-model="this.searchString">
|
||||
</div>
|
||||
<div class="">
|
||||
|
||||
</div>
|
||||
|
||||
<div class="dropdown dropup">
|
||||
<button class="btn text-secondary-emphasis bg-secondary-subtle rounded-3 border-1 border-secondary-subtle shadow-sm"
|
||||
type="button" data-bs-toggle="dropdown" aria-expanded="false">
|
||||
@ -174,6 +178,11 @@ export default {
|
||||
filter: blur(0px);
|
||||
transform: translateY(-40px);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.peerSearchContainer{
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
</style>
|
@ -52,23 +52,23 @@ export default {
|
||||
</h6>
|
||||
</RouterLink>
|
||||
<div class="card-footer d-flex gap-2 flex-column">
|
||||
<div class="d-flex gap-4">
|
||||
<small >
|
||||
<div class="row">
|
||||
<small class="col-6 col-md-3">
|
||||
<i class="bi bi-arrow-down-up me-2"></i>{{c.DataUsage.Total > 0 ? c.DataUsage.Total.toFixed(4) : 0}} GB
|
||||
</small>
|
||||
<small class="text-primary-emphasis">
|
||||
<small class="text-primary-emphasis col-6 col-md-3">
|
||||
<i class="bi bi-arrow-down me-2"></i>{{c.DataUsage.Receive > 0 ? c.DataUsage.Receive.toFixed(4) : 0}} GB
|
||||
</small>
|
||||
<small class="text-success-emphasis">
|
||||
<small class="text-success-emphasis col-6 col-md-3">
|
||||
<i class="bi bi-arrow-up me-2"></i>{{c.DataUsage.Sent > 0 ? c.DataUsage.Sent.toFixed(4) : 0}} GB
|
||||
</small>
|
||||
<small class="ms-auto">
|
||||
<small class="text-md-end col-6 col-md-3">
|
||||
<span class="dot me-2" :class="{active: c.ConnectedPeers > 0}"></span>{{c.ConnectedPeers}} Peers
|
||||
</small>
|
||||
</div>
|
||||
<div class="d-flex align-items-center">
|
||||
<small class="me-2 text-muted">
|
||||
<strong>Public Key</strong>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<small class="text-muted">
|
||||
<strong style="word-break: keep-all">Public Key</strong>
|
||||
</small>
|
||||
<small class="mb-0 d-block d-lg-inline-block ">
|
||||
<samp style="line-break: anywhere">{{c.PublicKey}}</samp>
|
||||
|
@ -21,10 +21,9 @@ const getUrl = (url) => {
|
||||
}
|
||||
|
||||
console.log("URL fetching: ", import.meta.env.MODE === 'development' ? url
|
||||
: `${window.location.protocol}//${window.location.host}${window.location.pathname}${url}`)
|
||||
|
||||
: `${window.location.protocol}//${(window.location.host + window.location.pathname + url).replace(/\/\//g, '/')}`)
|
||||
return import.meta.env.MODE === 'development' ? url
|
||||
: `${window.location.protocol}//${window.location.host}${window.location.pathname}${url}`
|
||||
: `${window.location.protocol}//${(window.location.host + window.location.pathname + url).replace(/\/\//g, '/')}`
|
||||
}
|
||||
|
||||
export const fetchGet = async (url, params=undefined, callback=undefined) => {
|
||||
|
@ -24,7 +24,7 @@ export default {
|
||||
<div class="container-fluid flex-grow-1 main" :data-bs-theme="this.dashboardConfigurationStore.Configuration.Server.dashboard_theme">
|
||||
<div class="row h-100">
|
||||
<Navbar></Navbar>
|
||||
<main class="col-md-9 ml-sm-auto col-lg-10 px-md-4 overflow-y-scroll mb-0" style="height: calc(100vh - 50px)">
|
||||
<main class="col-md-9 ml-sm-auto col-lg-10 px-md-4 overflow-y-scroll mb-0" style="height: calc(100vh - 50px)">
|
||||
<Suspense>
|
||||
<RouterView v-slot="{Component}">
|
||||
<Transition name="fade2" mode="out-in">
|
||||
|
Loading…
Reference in New Issue
Block a user