mirror of
https://github.com/nezhahq/nezha.git
synced 2025-02-02 01:28:13 -05:00
💄 improve(ui): progress bar and percent
This commit is contained in:
parent
76c789efd8
commit
6bf1233ce8
@ -70,5 +70,10 @@
|
||||
}
|
||||
|
||||
.ui.progress .bar {
|
||||
min-width: .15em !important;
|
||||
min-width: 1.26em !important;
|
||||
text-align: right;
|
||||
padding-right: .4em;
|
||||
line-height: 1.75em;
|
||||
color: rgba(255, 255, 255, .7);
|
||||
font-weight: 700;
|
||||
}
|
@ -190,5 +190,7 @@ table tr {
|
||||
}
|
||||
|
||||
.ui.progress .bar {
|
||||
min-width: .15em !important;
|
||||
min-width: 1.26em !important;
|
||||
text-align: right;
|
||||
padding-right: 0.4em;
|
||||
}
|
@ -9,7 +9,7 @@
|
||||
<title>{{.Title}}</title>
|
||||
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.1/dist/semantic.min.css">
|
||||
<link rel="stylesheet" type="text/css" href="/static/semantic-ui-alerts.min.css">
|
||||
<link rel="stylesheet" type="text/css" href="/static/main.css?v202012202312">
|
||||
<link rel="stylesheet" type="text/css" href="/static/main.css?v202012252026">
|
||||
<link rel="shortcut icon" type="image/png" href="/static/logo.png" />
|
||||
</head>
|
||||
|
||||
|
@ -36,9 +36,7 @@
|
||||
<div class="thirteen wide column">
|
||||
<div :class="formatPercent(server.live,server.State.CPU, 100).class">
|
||||
<div class="bar" :style="formatPercent(server.live,server.State.CPU, 100).style">
|
||||
<div class="progress">
|
||||
<small>@#formatPercent(server.live,server.State.CPU,100).percent#@%</small>
|
||||
</div>
|
||||
<small>@#formatPercent(server.live,server.State.CPU,100).percent#@%</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -48,9 +46,7 @@
|
||||
:class="formatPercent(server.live,server.State.MemUsed, server.Host.MemTotal).class">
|
||||
<div class="bar"
|
||||
:style="formatPercent(server.live,server.State.MemUsed, server.Host.MemTotal).style">
|
||||
<div class="progress">
|
||||
<small>@#parseInt(server.State?server.State.MemUsed/server.Host.MemTotal*100:0)#@%</small>
|
||||
</div>
|
||||
<small>@#parseInt(server.State?server.State.MemUsed/server.Host.MemTotal*100:0)#@%</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -60,9 +56,7 @@
|
||||
:class="formatPercent(server.live,server.State.SwapUsed, server.Host.SwapTotal).class">
|
||||
<div class="bar"
|
||||
:style="formatPercent(server.live,server.State.SwapUsed, server.Host.SwapTotal).style">
|
||||
<div class="progress">
|
||||
<small>@#parseInt(server.State?server.State.SwapUsed/server.Host.SwapTotal*100:0)#@%</small>
|
||||
</div>
|
||||
<small>@#parseInt(server.State?server.State.SwapUsed/server.Host.SwapTotal*100:0)#@%</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -79,9 +73,7 @@
|
||||
:class="formatPercent(server.live,server.State.DiskUsed, server.Host.DiskTotal).class">
|
||||
<div class="bar"
|
||||
:style="formatPercent(server.live,server.State.DiskUsed, server.Host.DiskTotal).style">
|
||||
<div class="progress">
|
||||
<small>@#parseInt(server.State?server.State.DiskUsed/server.Host.DiskTotal*100:0)#@%</small>
|
||||
</div>
|
||||
<small>@#parseInt(server.State?server.State.DiskUsed/server.Host.DiskTotal*100:0)#@%</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -17,7 +17,7 @@
|
||||
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css">
|
||||
<link rel="stylesheet" type="text/css" href="/static/semantic-ui-alerts.min.css">
|
||||
<link rel="stylesheet" href="/static/theme-hotaru/css/core.css?v202012121912" type="text/css">
|
||||
<link rel="stylesheet" href="/static/theme-hotaru/css/main.css?v202012202312" type="text/css">
|
||||
<link rel="stylesheet" href="/static/theme-hotaru/css/main.css?v202012252026" type="text/css">
|
||||
<link rel="stylesheet" href="/static/theme-hotaru/css/darkmode.css?v202012121912" type="text/css">
|
||||
{{if ts .CustomCode}}
|
||||
{{.CustomCode|safe}}
|
||||
|
Loading…
Reference in New Issue
Block a user