Optimizing page style

This commit is contained in:
cuigh 2018-04-03 20:41:03 +08:00
parent e48578b5f8
commit 2d08f97cb6
2 changed files with 43 additions and 35 deletions

View File

@ -24,7 +24,7 @@
<div class="level-item has-text-centered"> <div class="level-item has-text-centered">
<div> <div>
<p class="heading">{{text}}</p> <p class="heading">{{text}}</p>
<p class="title"><a href="{{url}}" style="text-decoration: none">{{count}}</a></p> <p class="title"><a href="{{url}}" style="text-decoration: none; color: white">{{count}}</a></p>
</div> </div>
</div> </div>
</div> </div>
@ -39,6 +39,7 @@
{{end}} {{end}}
{{ block body() }} {{ block body() }}
{*{{ if !.Charts }}*}
<section class="hero is-primary is-bold"> <section class="hero is-primary is-bold">
<div class="hero-body"> <div class="hero-body">
<div class="container has-text-centered"> <div class="container has-text-centered">
@ -57,40 +58,43 @@
</div> </div>
</div> </div>
</section> </section>
{*{{ end }}*}
<section class="section"> <section class="hero is-light is-small">
<div class="notification is-warning is-hidden"> <div class="hero-body">
WARNING: Swirl is running on basic mode now, some features are disabled. You can enable full features by configuring database. <div class="columns">
</div> {{yield infobox(style="success", icon="cubes", text=i18n("home.node"), url="/node/", count=.NodeCount)}}
<div class="columns"> {{yield infobox(style="info", icon="globe", text=i18n("home.network"), url="/network/", count=.NetworkCount)}}
{{yield infobox(style="success", icon="cubes", text=i18n("home.node"), url="/node/", count=.NodeCount)}} {{yield infobox(style="danger", icon="ticket-alt", text=i18n("home.service"), url="/service/", count=.ServiceCount)}}
{{yield infobox(style="info", icon="globe", text=i18n("home.network"), url="/network/", count=.NetworkCount)}} {{yield infobox(style="primary", icon="server", text=i18n("home.stack"), url="/stack/task/", count=.StackCount)}}
{{yield infobox(style="danger", icon="ticket-alt", text=i18n("home.service"), url="/service/", count=.ServiceCount)}}
{{yield infobox(style="primary", icon="server", text=i18n("home.stack"), url="/stack/task/", count=.StackCount)}}
</div>
<hr>
<nav class="level is-mobile">
<div class="level-left">
<div class="level-item">
<p class="subtitle is-5">
<strong>{{ i18n("home.monitor") }}</strong>
</p>
</div>
</div> </div>
<div class="level-right"> </div>
<div class="level-item"> </section>
<button id="btn-add" class="button is-success">
<span class="icon"><i class="fas fa-plus"></i></span><span>{{ i18n("button.add") }}</span> <section class="hero is-small">
</button> <div class="hero-body">
<nav class="level is-mobile">
<div class="level-left">
<div class="level-item">
<p class="subtitle is-5">
<strong>{{ i18n("home.monitor") }}</strong>
</p>
</div>
</div> </div>
<div class="level-item"> <div class="level-right">
<button id="btn-save" class="button is-info"> <div class="level-item">
<span class="icon"><i class="fas fa-save"></i></span><span>{{ i18n("button.save") }}</span> <div class="buttons has-addons">
</button> <button id="btn-add" class="button">
<span class="icon"><i class="fas fa-plus"></i></span><span>{{ i18n("button.add") }}</span>
</button>
<button id="btn-save" class="button">
<span class="icon"><i class="fas fa-save"></i></span><span>{{ i18n("button.save") }}</span>
</button>
</div>
</div>
</div> </div>
</div> </nav>
</nav> <div id="div-charts" class="columns is-multiline"></div>
<div id="div-charts" class="columns is-multiline">
</div> </div>
</section> </section>

View File

@ -80,10 +80,14 @@
</form> </form>
<div class="level-right"> <div class="level-right">
<div class="level-item"> <div class="level-item">
<button id="btn-add" class="button is-success"><span class="icon"><i class="fas fa-plus"></i></span><span>{{ i18n("button.add") }}</span></button> <div class="buttons has-addons">
</div> <button id="btn-add" class="button">
<div class="level-item"> <span class="icon"><i class="fas fa-plus"></i></span><span>{{ i18n("button.add") }}</span>
<button id="btn-save" class="button is-info"><span class="icon"><i class="fas fa-save"></i></span><span>{{ i18n("button.save") }}</span></button> </button>
<button id="btn-save" class="button">
<span class="icon"><i class="fas fa-save"></i></span><span>{{ i18n("button.save") }}</span>
</button>
</div>
</div> </div>
</div> </div>
</nav> </nav>