maketank/Froxlor
2
0
Fork 0
Code Pull Requests Releases Activity

more bootstrap-5.3 adjustments in css-classes etc.

Browse Source 
Signed-off-by: Michael Kaufmann <d00p@froxlor.org>
This commit is contained in:
Michael Kaufmann
2023-10-15 11:26:08 +02:00
parent 597e765677
commit 041c2d176c
4 changed files with 144 additions and 112 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
lib/Froxlor/UI/Callbacks/Style.php
View File

@@ -31,17 +31,17 @@ class Style
{ {
public static function deactivated(array $attributes): string public static function deactivated(array $attributes): string
{ {
return $attributes['fields']['deactivated'] ? 'bg-danger' : ''; return $attributes['fields']['deactivated'] ? 'table-danger' : '';
} }
public static function loginDisabled(array $attributes): string public static function loginDisabled(array $attributes): string
{ {
return $attributes['fields']['login_enabled'] == 'N' ? 'bg-danger' : ''; return $attributes['fields']['login_enabled'] == 'N' ? 'table-danger' : '';
} }
public static function resultIntegrityBad(array $attributes): string public static function resultIntegrityBad(array $attributes): string
{ {
return $attributes['fields']['result'] ? '' : 'bg-warning'; return $attributes['fields']['result'] ? '' : 'table-warning';
} }
public static function invalidApiKey(array $attributes): string public static function invalidApiKey(array $attributes): string
@@ -53,7 +53,7 @@ class Style
$isValid = false; $isValid = false;
} }
} }
return $isValid ? '' : 'bg-danger'; return $isValid ? '' : 'table-danger';
} }
public static function resultDomainTerminatedOrDeactivated(array $attributes): string public static function resultDomainTerminatedOrDeactivated(array $attributes): string
@@ -63,24 +63,24 @@ class Style
if (!empty($termination_date)) { if (!empty($termination_date)) {
$cdate = strtotime($termination_date . " 23:59:59"); $cdate = strtotime($termination_date . " 23:59:59");
$today = time(); $today = time();
$termination_css = 'bg-warning'; $termination_css = 'table-warning';
if ($cdate < $today) { if ($cdate < $today) {
$termination_css = 'bg-danger text-light'; $termination_css = 'table-danger';
} }
} }
$deactivated = $attributes['fields']['deactivated'] || $attributes['fields']['customer_deactivated']; $deactivated = $attributes['fields']['deactivated'] || $attributes['fields']['customer_deactivated'];
return $deactivated ? 'bg-info text-light' : $termination_css; return $deactivated ? 'table-info' : $termination_css;
} }
public static function resultCustomerLockedOrDeactivated(array $attributes): string public static function resultCustomerLockedOrDeactivated(array $attributes): string
{ {
$row_css = ''; $row_css = '';
if ((int)$attributes['fields']['deactivated'] == 1) { if ((int)$attributes['fields']['deactivated'] == 1) {
$row_css = 'bg-info text-light'; $row_css = 'table-info';
} elseif ($attributes['fields']['loginfail_count'] >= Settings::Get('login.maxloginattempts') } elseif ($attributes['fields']['loginfail_count'] >= Settings::Get('login.maxloginattempts')
&& $attributes['fields']['lastlogin_fail'] > (time() - Settings::Get('login.deactivatetime')) && $attributes['fields']['lastlogin_fail'] > (time() - Settings::Get('login.deactivatetime'))
) { ) {
$row_css = 'bg-warning'; $row_css = 'table-warning';
} }
return $row_css; return $row_css;
@@ -96,9 +96,9 @@ class Style
$style = ''; $style = '';
if ((int)$attributes[$field] >= 0) { if ((int)$attributes[$field] >= 0) {
if (($attributes[$field] / 100) * $report_max < $attributes[$field . '_used']) { if (($attributes[$field] / 100) * $report_max < $attributes[$field . '_used']) {
$style = 'bg-danger'; $style = 'table-danger';
} elseif (($attributes[$field] / 100) * ($report_max - 15) < $attributes[$field . '_used']) { } elseif (($attributes[$field] / 100) * ($report_max - 15) < $attributes[$field . '_used']) {
$style = 'bg-warning'; $style = 'table-warning';
} }
} }
return $style; return $style;

167
templates/Froxlor/settings/opcacheinfo.html.twig
View File

@@ -20,9 +20,14 @@
<div class="card h-100 mb-3"> <div class="card h-100 mb-3">
<div class="card-body"> <div class="card-body">
<h5 class="card-title">{{ lng('opcacheinfo.memusage') }}</h5> <h5 class="card-title">{{ lng('opcacheinfo.memusage') }}</h5>
<div class="progress position-relative"> <div class="progress position-relative" role="progressbar"
<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> aria-valuenow="{{ opcacheinfo.overview.used_memory }}" aria-valuemin="0"
<small class="justify-content-center d-flex position-absolute w-100 text-dark">{{ opcacheinfo.overview.used_memory_percentage }}%</small> aria-valuemax="{{ opcacheinfo.overview.total_memory }}">
<div class="progress-bar bg-success"
style="width: {{ opcacheinfo.overview.used_memory_percentage }}%"></div>
<small
class="justify-content-center d-flex position-absolute w-100 text-dark">{{ opcacheinfo.overview.used_memory_percentage }}
%</small>
</div> </div>
</div> </div>
<ul class="list-group list-group-flush"> <ul class="list-group list-group-flush">
@@ -49,10 +54,22 @@
<div class="card h-100 mb-3"> <div class="card h-100 mb-3">
<div class="card-body"> <div class="card-body">
<h5 class="card-title">{{ lng('opcacheinfo.hitsc') }}</h5> <h5 class="card-title">{{ lng('opcacheinfo.hitsc') }}</h5>
<div class="progress position-relative"> <div class="progress-stacked 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" role="progressbar" aria-valuenow="{{ opcacheinfo.overview.hits }}"
<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> aria-valuemin="0"
<small class="justify-content-center d-flex position-absolute w-100 text-dark">{{ opcacheinfo.overview.hit_rate_percentage }}%</small> aria-valuemax="{{ opcacheinfo.overview.hits + opcacheinfo.overview.misses }}"
style="width: {{ opcacheinfo.overview.hit_rate_percentage }}%">
<div class="progress-bar bg-success"></div>
</div>
<div class="progress" role="progressbar" aria-valuenow="{{ opcacheinfo.overview.misses }}"
aria-valuemin="0"
aria-valuemax="{{ opcacheinfo.overview.hits + opcacheinfo.overview.misses }}"
style="width: {{ 100 - opcacheinfo.overview.hit_rate_percentage }}%">
<div class="progress-bar bg-danger"></div>
</div>
<small
class="justify-content-center d-flex position-absolute w-100 text-dark">{{ opcacheinfo.overview.hit_rate_percentage }}
%</small>
</div> </div>
</div> </div>
<ul class="list-group list-group-flush"> <ul class="list-group list-group-flush">
@@ -80,8 +97,13 @@
<div class="card-body"> <div class="card-body">
<h5 class="card-title">{{ lng('opcacheinfo.usedkey') }}</h5> <h5 class="card-title">{{ lng('opcacheinfo.usedkey') }}</h5>
<div class="progress position-relative"> <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> <div class="progress-bar bg-success" role="progressbar"
<small class="justify-content-center d-flex position-absolute w-100 text-dark">{{ opcacheinfo.overview.used_key_percentage }}%</small> 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 text-dark">{{ opcacheinfo.overview.used_key_percentage }}
%</small>
</div> </div>
</div> </div>
<ul class="list-group list-group-flush"> <ul class="list-group list-group-flush">
@@ -108,15 +130,18 @@
</li> </li>
<li class="list-group-item d-flex justify-content-between align-items-center"> <li class="list-group-item d-flex justify-content-between align-items-center">
{{ lng('opcacheinfo.used') }} {{ lng('opcacheinfo.used') }}
<span class="badge bg-secondary">{{ opcacheinfo.overview.readable.interned.strings_used_memory }}</span> <span
class="badge bg-secondary">{{ opcacheinfo.overview.readable.interned.strings_used_memory }}</span>
</li> </li>
<li class="list-group-item d-flex justify-content-between align-items-center"> <li class="list-group-item d-flex justify-content-between align-items-center">
{{ lng('opcacheinfo.free') }} {{ lng('opcacheinfo.free') }}
<span class="badge bg-secondary">{{ opcacheinfo.overview.readable.interned.strings_free_memory }}</span> <span
class="badge bg-secondary">{{ opcacheinfo.overview.readable.interned.strings_free_memory }}</span>
</li> </li>
<li class="list-group-item d-flex justify-content-between align-items-center"> <li class="list-group-item d-flex justify-content-between align-items-center">
{{ lng('opcacheinfo.strcount') }} {{ lng('opcacheinfo.strcount') }}
<span class="badge bg-secondary">{{ opcacheinfo.overview.readable.interned.number_of_strings }}</span> <span
class="badge bg-secondary">{{ opcacheinfo.overview.readable.interned.number_of_strings }}</span>
</li> </li>
</ul> </ul>
</div> </div>
@@ -128,53 +153,53 @@
<div class="card table-responsive mb-3"> <div class="card table-responsive mb-3">
<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">
<tbody> <tbody>
<tr> <tr>
<th class="text-center" colspan="2" scope="row">{{ lng('opcacheinfo.generaltitle') }}</th> <th class="text-center" colspan="2" scope="row">{{ lng('opcacheinfo.generaltitle') }}</th>
</tr> </tr>
<tr> <tr>
<th class="fw-bold" scope="row">{{ lng('opcacheinfo.version') }}</th> <th class="fw-bold" scope="row">{{ lng('opcacheinfo.version') }}</th>
<td class="text-end">{{ opcacheinfo.version.version }}</td> <td class="text-end">{{ opcacheinfo.version.version }}</td>
</tr> </tr>
<tr> <tr>
<th class="fw-bold" scope="row">{{ lng('opcacheinfo.phpversion') }}</th> <th class="fw-bold" scope="row">{{ lng('opcacheinfo.phpversion') }}</th>
<td class="text-end">{{ opcacheinfo.version.php }}</td> <td class="text-end">{{ opcacheinfo.version.php }}</td>
</tr> </tr>
<tr> <tr>
<th class="fw-bold" scope="row">{{ lng('admin.hostname') }}</th> <th class="fw-bold" scope="row">{{ lng('admin.hostname') }}</th>
<td class="text-end">{{ opcacheinfo.version.host }}</td> <td class="text-end">{{ opcacheinfo.version.host }}</td>
</tr> </tr>
<tr> <tr>
<th class="fw-bold" scope="row">{{ lng('admin.serversoftware') }}</th> <th class="fw-bold" scope="row">{{ lng('admin.serversoftware') }}</th>
<td class="text-end">{{ opcacheinfo.version.server }}</td> <td class="text-end">{{ opcacheinfo.version.server }}</td>
</tr> </tr>
<tr> <tr>
<th class="fw-bold" scope="row">{{ lng('opcacheinfo.start') }}</th> <th class="fw-bold" scope="row">{{ lng('opcacheinfo.start') }}</th>
<td class="text-end">{{ opcacheinfo.overview.start_time|date('d.m.Y H:i:s') }}</td> <td class="text-end">{{ opcacheinfo.overview.start_time|date('d.m.Y H:i:s') }}</td>
</tr> </tr>
<tr> <tr>
<th class="fw-bold" scope="row">{{ lng('opcacheinfo.lastreset') }}</th> <th class="fw-bold" scope="row">{{ lng('opcacheinfo.lastreset') }}</th>
<td class="text-end"> <td class="text-end">
{% if opcacheinfo.overview.last_restart_time > 0 %} {% if opcacheinfo.overview.last_restart_time > 0 %}
{{ opcacheinfo.overview.last_restart_time|date('d.m.Y H:i:s') }} {{ opcacheinfo.overview.last_restart_time|date('d.m.Y H:i:s') }}
{% else %} {% else %}
{{ lng('panel.never') }} {{ lng('panel.never') }}
{% endif %} {% endif %}
</td> </td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
</div> </div>
<div class="card table-responsive"> <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">
<tbody> <tbody>
<tr> <tr>
<th class="text-center" scope="row">{{ lng('opcacheinfo.funcsavail') }}</th> <th class="text-center" scope="row">{{ lng('opcacheinfo.funcsavail') }}</th>
</tr> </tr>
{% for funcs in opcacheinfo.functions %} {% for funcs in opcacheinfo.functions %}
<tr> <tr>
<td>{{ funcs }}</td> <td>{{ funcs }}</td>
</tr> </tr>
{% endfor %} {% endfor %}
</tbody> </tbody>
</table> </table>
</div> </div>
@@ -183,29 +208,29 @@
<div class="card table-responsive"> <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">
<tbody> <tbody>
<tr>
<th class="text-center" colspan="2" scope="row">{{ lng('opcacheinfo.runtimeconf') }}</th>
</tr>
{% for directive in opcacheinfo.directives %}
<tr> <tr>
<th class="text-center" colspan="2" scope="row">{{ lng('opcacheinfo.runtimeconf') }}</th> <th class="fw-bold" scope="row">{{ directive.k }}</th>
<td class="text-end">
{% if directive.v is iterable %}
{% for vval in directive.v %}
{% if vval is iterable %}
{% for val2 in vval %}
{{ val2|raw }}<br>
{% endfor %}
{% else %}
{{ vval|raw }}<br>
{% endif %}
{% endfor %}
{% else %}
{{ directive.v|raw }}
{% endif %}
</td>
</tr> </tr>
{% for directive in opcacheinfo.directives %} {% endfor %}
<tr>
<th class="fw-bold" scope="row">{{ directive.k }}</th>
<td class="text-end">
{% if directive.v is iterable %}
{% for vval in directive.v %}
{% if vval is iterable %}
{% for val2 in vval %}
{{ val2|raw }}<br>
{% endfor %}
{% else %}
{{ vval|raw }}<br>
{% endif %}
{% endfor %}
{% else %}
{{ directive.v|raw }}
{% endif %}
</td>
</tr>
{% endfor %}
</tbody> </tbody>
</table> </table>
</div> </div>

2
templates/Froxlor/table/macros.html.twig
View File

@@ -1,5 +1,5 @@
{% macro progressbar(data) %} {% macro progressbar(data) %}
<div class="progress progress-thin"> <div class="progress progress-thin" role="progressbar" aria-valuenow="{{ data.percent }}">
<div class="progress-bar {{ data.style }}" style="width: {{ data.percent }}%;"></div> <div class="progress-bar {{ data.style }}" style="width: {{ data.percent }}%;"></div>
</div> </div>
<div class="text-end small"> <div class="text-end small">

65
templates/Froxlor/user/dashboard-item.html.twig
View File

@@ -1,31 +1,38 @@
{% macro ditem(lngstr, available, used, assigned = null, formatbytes = false, byte_usage = null) %} {% macro ditem(lngstr, available, used, assigned = null, formatbytes = false, byte_usage = null) %}
<div class="col border-end border-bottom p-3"> <div class="col border-end border-bottom p-3">
<div class="row mb-1"> <div class="row mb-1">
<div class="col text-truncate">{{ lng(lngstr) }}{% if byte_usage %} <small>({{ byte_usage|formatBytes }})</small>{% endif %}</div> <div class="col text-truncate">{{ lng(lngstr) }}{% if byte_usage %} <small>({{ byte_usage|formatBytes }}
<div class="col-auto"> )</small>{% endif %}</div>
<small>{% if formatbytes %}{{ used|formatBytes }}{% else %}{{ used }}{% endif %}/{% if available < 0 %}{{ lng('panel.unlimited') }}{% else %}{% if formatbytes %}{{ available|formatBytes }}{% else %}{{ available }}{% endif %}{% endif %}</small> <div class="col-auto">
</div> <small>{% if formatbytes %}{{ used|formatBytes }}{% else %}{{ used }}{% endif %}
</div> /{% if available < 0 %}{{ lng('panel.unlimited') }}{% else %}{% if formatbytes %}{{ available|formatBytes }}{% else %}{{ available }}{% endif %}{% endif %}</small>
<div class="progress progress-thin my-auto"> </div>
{% set usageperc = 1 %} </div>
{% if available > 0 %} {% set usageperc = 1 %}
{% set usageperc = (used / available) * 100|round %} {% if available > 0 %}
{% endif %} {% set usageperc = (used / available) * 100|round %}
<div {% endif %}
class="progress-bar{% if available < 0 %} bg-secondary{% elseif usageperc >= 75 and usageperc < 90 %} bg-warning{% elseif usageperc >= 90 %} bg-danger{% endif %}" <div class="progress progress-thin my-auto"
role="progressbar" role="progressbar"
style="width: {% if available < 0 %}100{% else %}{{ usageperc }}{% endif %}%;" aria-valuenow="{% if available < 0 %}100{% else %}{{ used }}{% endif %}"
aria-valuenow="{% if available < 0 %}100{% else %}{{ used }}{% endif %}" aria-valuemin="0"
aria-valuemin="0" aria-valuemax="{% if available < 0 %}100{% else %}{{ available }}{% endif %}"
aria-valuemax="{% if available < 0 %}100{% else %}{{ available }}{% endif %}"></div> >
</div> <div
{% if assigned is not empty %} class="progress-bar{% if available < 0 %} bg-secondary{% elseif usageperc >= 75 and usageperc < 90 %} bg-warning{% elseif usageperc >= 90 %} bg-danger{% endif %}"
<div class="progress progress-thin mt-2 my-auto"> style="width: {% if available < 0 %}100{% else %}{{ usageperc }}{% endif %}%;"
<div class="progress-bar bg-primary" role="progressbar" ></div>
style="width:{% if available > 0 %}{{ (assigned / available) * 100|round }}{% else %}1{% endif %}%;" </div>
aria-valuenow="{{ assigned }}" aria-valuemin="0" {% if assigned is not empty %}
aria-valuemax="{{ available }}"></div> <div class="progress progress-thin mt-2 my-auto"
</div> role="progressbar"
{% endif %} aria-valuenow="{{ assigned }}"
</div> aria-valuemin="0"
aria-valuemax="{{ available }}"
>
<div class="progress-bar bg-primary"
style="width:{% if available > 0 %}{{ (assigned / available) * 100|round }}{% else %}1{% endif %}%;"></div>
</div>
{% endif %}
</div>
{% endmacro %} {% endmacro %}