minor language additions and css adjustments

Signed-off-by: Michael Kaufmann <d00p@froxlor.org>
This commit is contained in:
Michael Kaufmann
2022-09-20 08:09:53 +02:00
parent fd596801e2
commit b1f7cf4bc7
16 changed files with 60 additions and 29 deletions

View File

@@ -22,7 +22,7 @@
<h5 class="card-title">{{ lng('apcuinfo.memnote') }}</h5>
<div class="progress position-relative">
<div class="progress-bar bg-success" role="progressbar" style="width: {{ apcuinfo.mem_used_percentage }}%" aria-valuenow="{{ apcuinfo.mem_used }}" aria-valuemin="0" aria-valuemax="{{ apcuinfo.mem_avail }}"></div>
<small class="justify-content-center d-flex position-absolute w-100">{{ apcuinfo.mem_used_percentage }}%</small>
<small class="justify-content-center d-flex position-absolute w-100 text-dark">{{ apcuinfo.mem_used_percentage }}%</small>
</div>
</div>
<ul class="list-group list-group-flush">
@@ -48,7 +48,7 @@
<div class="progress position-relative">
<div class="progress-bar bg-success" role="progressbar" style="width: {{ apcuinfo.num_hits_percentage }}%" aria-valuenow="{{ apcuinfo.num_hits }}" aria-valuemin="0" aria-valuemax="{{ apcuinfo.num_hits_and_misses }}"></div>
<div class="progress-bar bg-danger" role="progressbar" style="width: {{ 100 - apcuinfo.num_misses_percentage }}%" aria-valuenow="{{ apcuinfo.num_misses }}" aria-valuemin="0" aria-valuemax="{{ apcuinfo.num_hits_and_misses }}"></div>
<small class="justify-content-center d-flex position-absolute w-100">{{ apcuinfo.num_hits_percentage }}%</small>
<small class="justify-content-center d-flex position-absolute w-100 text-dark">{{ apcuinfo.num_hits_percentage }}%</small>
</div>
</div>
<ul class="list-group list-group-flush">
@@ -98,7 +98,7 @@
{% if apcuinfo.fragmentation is iterable %}
<div class="progress position-relative">
<div class="progress-bar bg-success" role="progressbar" style="width: {{ apcuinfo.fragmentation.used_percentage }}%" aria-valuenow="{{ apcuinfo.fragmentation.used_bytes }}" aria-valuemin="0" aria-valuemax="{{ apcuinfo.fragmentation.total_bytes }}"></div>
<small class="justify-content-center d-flex position-absolute w-100">{{ apcuinfo.fragmentation.used_percentage }}%</small>
<small class="justify-content-center d-flex position-absolute w-100 text-dark">{{ apcuinfo.fragmentation.used_percentage }}%</small>
</div>
<ul class="list-group list-group-flush">
<li class="list-group-item d-flex justify-content-between align-items-center">

View File

@@ -22,7 +22,7 @@
<h5 class="card-title">{{ lng('opcacheinfo.memusage') }}</h5>
<div class="progress position-relative">
<div class="progress-bar bg-success" role="progressbar" style="width: {{ opcacheinfo.overview.used_memory_percentage }}%" aria-valuenow="{{ opcacheinfo.overview.used_memory }}" aria-valuemin="0" aria-valuemax="{{ opcacheinfo.overview.total_memory }}"></div>
<small class="justify-content-center d-flex position-absolute w-100">{{ opcacheinfo.overview.used_memory_percentage }}%</small>
<small class="justify-content-center d-flex position-absolute w-100 text-dark">{{ opcacheinfo.overview.used_memory_percentage }}%</small>
</div>
</div>
<ul class="list-group list-group-flush">
@@ -52,7 +52,7 @@
<div class="progress position-relative">
<div class="progress-bar bg-success" role="progressbar" style="width: {{ opcacheinfo.overview.hit_rate_percentage }}%" aria-valuenow="{{ opcacheinfo.overview.hits }}" aria-valuemin="0" aria-valuemax="{{ opcacheinfo.overview.hits + opcacheinfo.overview.misses }}"></div>
<div class="progress-bar bg-danger" role="progressbar" style="width: {{ 100 - opcacheinfo.overview.hit_rate_percentage }}%" aria-valuenow="{{ opcacheinfo.overview.misses }}" aria-valuemin="0" aria-valuemax="{{ opcacheinfo.overview.hits + opcacheinfo.overview.misses }}"></div>
<small class="justify-content-center d-flex position-absolute w-100">{{ opcacheinfo.overview.hit_rate_percentage }}%</small>
<small class="justify-content-center d-flex position-absolute w-100 text-dark">{{ opcacheinfo.overview.hit_rate_percentage }}%</small>
</div>
</div>
<ul class="list-group list-group-flush">
@@ -81,7 +81,7 @@
<h5 class="card-title">{{ lng('opcacheinfo.usedkey') }}</h5>
<div class="progress position-relative">
<div class="progress-bar bg-success" role="progressbar" style="width: {{ opcacheinfo.overview.used_key_percentage }}%" aria-valuenow="{{ opcacheinfo.overview.num_cached_keys }}" aria-valuemin="0" aria-valuemax="{{ opcacheinfo.overview.max_cached_keys }}"></div>
<small class="justify-content-center d-flex position-absolute w-100">{{ opcacheinfo.overview.used_key_percentage }}%</small>
<small class="justify-content-center d-flex position-absolute w-100 text-dark">{{ opcacheinfo.overview.used_key_percentage }}%</small>
</div>
</div>
<ul class="list-group list-group-flush">

View File

@@ -9,7 +9,7 @@
{% block content %}
<div class="card table-responsive">
<table class="table table-borderless table-striped align-middle mb-0 px-3">
<table class="table table-borderless table-striped align-middle mb-0 px-3" id="phpinfotable">
<tbody>
{% for name,section in phpinfo %}
{% if name|lower == 'phpinfo' %}

View File

@@ -2,7 +2,7 @@
<ul class="nav d-flex flex-fill flex-column py-3">
{% for idx,mitems in nav_entries %}
{% if mitems.items is not empty %}
<li class="nav-item {% if mitems.active == 1 %}active{% endif %}" {% if mitems.active == 1 %}aria-current="page"{% endif %}>
<li class="nav-item" {% if mitems.active == 1 %}aria-current="page"{% endif %}>
<a class="nav-link text-light {% if mitems.active == 0 %}collapsed{% endif %}" href="#sub{{ idx }}" data-bs-toggle="collapse" data-bs-target="#sub{{ idx }}">
{% if mitems.icon is not empty %}
<i class="{{ mitems.icon }}"></i>
@@ -12,15 +12,15 @@
<div class="collapse {% if mitems.active == 1 %}show{% endif %}" id="sub{{ idx }}" aria-expanded="{% if mitems.active == 1 %}true{% else %}false{% endif %}">
<ul class="flex-column ps-3 nav">
{% for item in mitems.items %}
<li class="nav-item {% if item.active == 1 %}active{% endif %}" {% if item.active == 1 %}aria-current="page"{% endif %}>
<a class="nav-link text-light {% if item.active == 1 %}fw-bold{% endif %}" href="{{ item.url|raw }}">{{ item.label|raw }}</a>
<li class="nav-item" {% if item.active == 1 %}aria-current="page"{% endif %}>
<a class="nav-link text-light {% if item.active == 1 %}active fw-bold{% endif %}" href="{{ item.url|raw }}">{{ item.label|raw }}</a>
</li>
{% endfor %}
</ul>
</div>
</li>
{% else %}
<li class="nav-item {% if mitems.active == 1 %}active{% endif %}" {% if mitems.active == 1 %}aria-current="page"{% endif %}>
<li class="nav-item" {% if mitems.active == 1 %}aria-current="page"{% endif %}>
<a class="nav-link text-light {% if mitems.active == 1 %}active{% endif %}" href="{% if mitems.url is not empty %}{{ mitems.url|raw }}{% else %}#{% endif %}" {% if mitems.target is not empty %} target="{{ mitems.target }}" {% endif %}>
{% if mitems.icon is not empty %}
<i class="{{ mitems.icon }}"></i>

View File

@@ -67,3 +67,12 @@
.field-image-preview {
max-height: 5em;
}
#phpinfotable {
table-layout: fixed;
word-wrap: break-word;
}
a {
text-decoration: none;
}

View File

@@ -29,23 +29,22 @@
border-top: 1px solid var(--bs-body-bg)!important;
}
.form-select, .form-control,
.form-select,
.form-control,
.form-control:focus,
section h3,
section h3 + span,
section h5 {
color: $dark-bg;
}
.card-title,
.page-header {
color: $light;
}
.form-control:focus {
color: $dark-bg;
}
.form-control[readonly]:focus {
color: $white;
}
.form-control[readonly]:focus,
.form-control-plaintext {
color: $white;
}

View File

@@ -9,7 +9,6 @@ $card-bg: lighten($body-bg, 10);
$navbar-bg: $dark-bg;
$light: lighten($dark-bg, 15);
$list-group-bg: lighten($dark-bg, 10);
$list-group-color: $body-color;
@@ -17,3 +16,5 @@ $nav-link-color: $body-color;
$white: #e9ecef;
$light: #f8f9fa;
$link-color: $froxlor-blue-light;

View File

@@ -36,7 +36,7 @@ $body-color: $light-font-color;
// $border-radius: 0.5rem;
// Links
$links: $froxlor-blue-dark;
$link-color: $froxlor-blue-dark;
// Navbar
$navbar-bg: #ffffff;

View File

@@ -52,7 +52,7 @@
{# system infos #}
<div class="card mb-3">
<div class="card-header">
<i class="fa-solid fa-gears"></i>
<i class="fa-solid fa-gears me-1"></i>
{{ lng('admin.systemdetails') }}
</div>
<ul class="list-group list-group-flush">
@@ -125,7 +125,7 @@
{# account info #}
<div class="card mb-3">
<div class="card-header">
<i class="fa-solid fa-user"></i>
<i class="fa-solid fa-user me-1"></i>
{{ lng('index.accountdetails') }}
</div>
<ul class="list-group list-group-flush">
@@ -188,7 +188,7 @@
{# customer details #}
<div class="card">
<div class="card-header">
<i class="fa-solid fa-id-card"></i>
<i class="fa-solid fa-id-card me-1"></i>
{{ lng('index.customerdetails') }}
</div>
<ul class="list-group list-group-flush">
@@ -250,7 +250,7 @@
{# froxlor-details #}
<div class="card mb-3">
<div class="card-header">
<i class="fa-solid fa-wrench"></i>
<i class="fa-solid fa-wrench me-1"></i>
{{ lng('admin.froxlordetails') }}
</div>
<ul class="list-group list-group-flush">
@@ -281,7 +281,7 @@
<div id="newsfeed" class="card">
<div class="card-header">
<i class="fa-solid fa-info-circle"></i>
<i class="fa-solid fa-info-circle me-1"></i>
Froxlor Newsfeed
</div>
<div class="list-group list-group-flush" id="newsfeeditems">

View File

@@ -34,7 +34,7 @@
</select>
</div>
<div class="row row-cols-2 g-0 bg-white rounded shadow-sm mb-4">
<div class="row row-cols-1 row-cols-md-2 g-0 bg-white rounded shadow-sm mb-4">
<div class="col p-3 border-end">
<canvas id="trafficsummary" style="max-height:30vh;"></canvas>
</div>
@@ -44,7 +44,7 @@
</div>
<!-- Overview for given range -->
<div class="row row-cols-4 g-0 bg-white rounded shadow-sm mb-4">
<div class="row row-cols-2 row-cols-md-4 g-0 bg-white rounded shadow-sm mb-4">
<div class="col p-3 border-end">
<h3>{{ metrics.total|formatBytes }}</h3>
<span>Total</span>