💄 优化 server status 主题

nezhahq · Nov 8, 2023 · ce2e543 · ce2e543
1 parent b6c2410
commit ce2e543
Show file tree

Hide file tree

Showing 7 changed files with 59 additions and 51 deletions.
diff --git a/README.md b/README.md
@@ -4,7 +4,7 @@
   <br>
   <small><i>LOGO designed by <a href="https://xio.ng" target="_blank">熊大</a> .</i></small>
   <br><br>
-<img src="https://img.shields.io/github/actions/workflow/status/naiba/nezha/dashboard.yml?branch=master&label=Dash%20v0.15.8&logo=github&style=for-the-badge">&nbsp;<img src="https://img.shields.io/github/v/release/nezhahq/agent?color=brightgreen&label=Agent&style=for-the-badge&logo=github">&nbsp;<img src="https://img.shields.io/github/actions/workflow/status/nezhahq/agent/agent.yml?branch=v0.15.8&label=Agent%20CI&logo=github&style=for-the-badge">&nbsp;<img src="https://img.shields.io/badge/Installer-v0.15.0-brightgreen?style=for-the-badge&logo=linux">
+<img src="https://img.shields.io/github/actions/workflow/status/naiba/nezha/dashboard.yml?branch=master&label=Dash%20v0.15.9&logo=github&style=for-the-badge">&nbsp;<img src="https://img.shields.io/github/v/release/nezhahq/agent?color=brightgreen&label=Agent&style=for-the-badge&logo=github">&nbsp;<img src="https://img.shields.io/github/actions/workflow/status/nezhahq/agent/agent.yml?branch=v0.15.11&label=Agent%20CI&logo=github&style=for-the-badge">&nbsp;<img src="https://img.shields.io/badge/Installer-v0.15.0-brightgreen?style=for-the-badge&logo=linux">
   <br>
   <br>
   <p>:trollface: <b>Nezha Monitoring: Self-hostable, lightweight, servers and websites monitoring and O&M tool.</b></p>

diff --git a/resource/template/theme-server-status/content-footer.html b/resource/template/theme-server-status/content-footer.html
@@ -1,8 +1,8 @@
 {{define "theme-server-status/content-footer"}}
-<div class="container">
+<footer class="container" style="padding-bottom: 2rem;">
     <p style="text-align: center; font-size: 10px;">
-        {{ .Title }} | Theme <a href="https://github.com/cppla/ServerStatus">ServerStatus</a> | Powered by <a
+        {{ .Conf.Site.Brand }} | Theme <a href="https://github.com/cppla/ServerStatus">ServerStatus</a> | Powered by <a
             href="https://github.com/naiba/nezha">{{tr "NezhaMonitoring"}}</a> {{.Version}}
     </p>
-</div>
+</footer>
 {{end}}
diff --git a/resource/template/theme-server-status/content-nav.html b/resource/template/theme-server-status/content-nav.html
@@ -9,7 +9,10 @@
                     <span class="icon-bar"></span>
                     <span class="icon-bar"></span>
                 </button>
-                <a href="/" class="navbar-brand">{{.Conf.Site.Brand}}</a>
+                <a href="/" class="navbar-brand">
+                    <img src="/static/logo.svg?v20210804" style="height: 2rem;display: inline-block;">
+                    {{.Conf.Site.Brand}}
+                </a>
             </div>
             <div class="navbar-collapse collapse">
                 <ul class="nav navbar-nav">

diff --git a/resource/template/theme-server-status/header.html b/resource/template/theme-server-status/header.html
@@ -15,6 +15,7 @@
           rel="stylesheet"/>
     <link rel="stylesheet" type="text/css"
           href="https://cdn.staticfile.org/semantic-ui/2.4.1/semantic.min.css">
+    <link rel="shortcut icon" type="image/png" href="/static/logo.svg?v20210804" />
     <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
     <!--[if lt IE 9]>
     <script src="/static/theme-server-status/js/html5shiv.js"></script>

diff --git a/resource/template/theme-server-status/home.html b/resource/template/theme-server-status/home.html
@@ -70,7 +70,7 @@
                             <div style="display: flex;align-items: center;justify-content: center;flex-direction: column;">
                                 <div style="display: flex;align-items: flex-start;justify-content: center;flex-direction: column; width: 450px;max-width: 90vw">
                                 <span class="node-cell-expand">
-                                    <span class="node-cell-expand-label">系统:</span>
+                                    <span class="node-cell-expand-label">{{tr "Platform"}}:</span>
                                     @#node.host.Platform#@
                                 </span>
                                     <span class="node-cell-expand" v-if="node.host.CPU">

diff --git a/resource/template/theme-server-status/service.html b/resource/template/theme-server-status/service.html
@@ -44,51 +44,55 @@
         </table>
     </div>
 
-    <div class="ui container" style="margin-bottom: 20px;">
+    <div class="container" style="margin-bottom: 20px;padding:unset">
         {{if .CycleTransferStats}}
-        <h2 style="text-align: center;">{{tr "CycleTransferStats"}}</h2>
-        <table class="table table-striped">
-            <thead>
-            <tr>
-                <th>ID</th>
-                <th>{{tr "Rules"}}</th>
-                <th>{{tr "Server"}}</th>
-                <th>{{tr "From"}}</th>
-                <th>{{tr "To"}}</th>
-                <th>MAX</th>
-                <th>MIN</th>
-                <th>{{tr "NextCheck"}}</th>
-                <th>{{tr "CurrentUsage"}}</th>
-                <th class='ui center aligned'>{{tr "Transleft"}}</th>
-            </tr>
-            </thead>
-            <tbody>
-            {{range $id, $stats := .CycleTransferStats}}
-            {{range $innerId, $transfer := $stats.Transfer}}
-            {{$TransLeftPercent := TransLeftPercent (UintToFloat $transfer) (UintToFloat $stats.Max)}}
-            <tr>
-                <td>{{$id}}</td>
-                <td>{{$stats.Name}}</td>
-                <td>{{index $stats.ServerName $innerId}}</td>
-                <td>{{$stats.From|tf}}</td>
-                <td>{{$stats.To|tf}}</td>
-                <td>{{$stats.Max|bf}}</td>
-                <td>{{$stats.Min|bf}}</td>
-                <td>{{(index $stats.NextUpdate $innerId)|sft}}</td>
-                <td>{{$transfer|bf}}</td>
-                <td>
-                    <div class="ui progress {{TransClassName $TransLeftPercent}}"
-                            style=" background: rgba(0,0,0,.1); background-color: rgba(0,0,0,.1)!important; height: 25px; margin: unset !important">
-                        <div class="bar"
-                                style="transition-duration: 300ms; min-width: unset; background-color: rgb(10, 148, 242); width: {{$TransLeftPercent}}% !important"></div>
-                        <small style="position: relative; top: -2em;">{{TransLeft $stats.Max $transfer}} /
-                            {{$TransLeftPercent}} %</small></div>
-                </td>
-            </tr>
-            {{end}}
-            {{end}}
-            </tbody>
-        </table>
+        <h4 style="text-align: center;">{{tr "CycleTransferStats"}}</h4>
+        <div class="table-responsive content">
+            <table class="table table-striped table-condensed">
+                <thead>
+                    <tr>
+                        <th>ID</th>
+                        <th>{{tr "Rules"}}</th>
+                        <th>{{tr "Server"}}</th>
+                        <th>{{tr "From"}}</th>
+                        <th>{{tr "To"}}</th>
+                        <th>MAX</th>
+                        <th>MIN</th>
+                        <th>{{tr "NextCheck"}}</th>
+                        <th>{{tr "CurrentUsage"}}</th>
+                        <th class='ui center aligned'>{{tr "Transleft"}}</th>
+                    </tr>
+                </thead>
+                <tbody>
+                    {{range $id, $stats := .CycleTransferStats}}
+                    {{range $innerId, $transfer := $stats.Transfer}}
+                    {{$TransLeftPercent := TransLeftPercent (UintToFloat $transfer) (UintToFloat $stats.Max)}}
+                    <tr>
+                        <td>{{$id}}</td>
+                        <td>{{$stats.Name}}</td>
+                        <td>{{index $stats.ServerName $innerId}}</td>
+                        <td>{{$stats.From|tf}}</td>
+                        <td>{{$stats.To|tf}}</td>
+                        <td>{{$stats.Max|bf}}</td>
+                        <td>{{$stats.Min|bf}}</td>
+                        <td>{{(index $stats.NextUpdate $innerId)|sft}}</td>
+                        <td>{{$transfer|bf}}</td>
+                        <td>
+                            <div class="ui progress {{TransClassName $TransLeftPercent}}"
+                                style=" background: rgba(0,0,0,.1); background-color: rgba(0,0,0,.1)!important; height: 25px; margin: unset !important">
+                                <div class="bar"
+                                    style="transition-duration: 300ms; min-width: unset; background-color: rgb(10, 148, 242); width: {{$TransLeftPercent}}% !important">
+                                </div>
+                                <small style="position: relative; top: -2em;">{{TransLeft $stats.Max $transfer}} /
+                                    {{$TransLeftPercent}} %</small>
+                            </div>
+                        </td>
+                    </tr>
+                    {{end}}
+                    {{end}}
+                </tbody>
+            </table>
+        </div>
         {{end}}
     </div>
     {{template "theme-server-status/content-footer" .}}

diff --git a/service/singleton/singleton.go b/service/singleton/singleton.go
@@ -12,7 +12,7 @@ import (
 	"github.com/naiba/nezha/pkg/utils"
 )
 
-var Version = "v0.15.8" // ！！记得修改 README 中的 badge 版本！！
+var Version = "v0.15.9" // ！！记得修改 README 中的 badge 版本！！
 
 var (
 	Conf  *model.Config