replace deprecated text-muted css class with bootstrap-5.3's text-body-secondary

Signed-off-by: Michael Kaufmann <d00p@froxlor.org>

lib/Froxlor/UI/Callbacks/Style.php

@@ -77,8 +77,7 @@ class Style
 		$row_css = '';
 		if ((int)$attributes['fields']['deactivated'] == 1) {
 			$row_css = 'bg-info text-light';
-		} elseif (
+		} elseif ($attributes['fields']['loginfail_count'] >= Settings::Get('login.maxloginattempts')
-			$attributes['fields']['loginfail_count'] >= Settings::Get('login.maxloginattempts')
 			&& $attributes['fields']['lastlogin_fail'] > (time() - Settings::Get('login.deactivatetime'))
 		) {
 			$row_css = 'bg-warning';

templates/Froxlor/install/index.html.twig

@@ -74,7 +74,7 @@
 						</p>
 
 						{% if preflight.criticals %}
-							<p class="text-muted">{{ lng('install.critical_error') }}</p>
+							<p class="text-body-secondary">{{ lng('install.critical_error') }}</p>
 							<ul>
 								{% for ctype, critical in preflight.criticals %}
 									{% if ctype == 'wrong_ownership' %}
@@ -94,7 +94,7 @@
 						{% endif %}
 
 						{% if preflight.suggestions %}
-							<p class="text-muted">{{ lng('install.suggestions') }}</p>
+							<p class="text-body-secondary">{{ lng('install.suggestions') }}</p>
 							<ul>
 								{% for ctype, suggestion in preflight.suggestions %}
 									{% if ctype == 'missing_extensions' %}

templates/Froxlor/install/update.html.twig

@@ -6,7 +6,7 @@
 			<i class="fa-solid fa-download me-1"></i>
 			{{ lng('update.update') }}
 		</h5>
-		<span class="text-muted">{{ lng('update.description') }}</span>
+		<span class="text-body-secondary">{{ lng('update.description') }}</span>
 	</div>
 {% endblock %}
 

templates/Froxlor/login/fpwd.html.twig

@@ -42,7 +42,7 @@
 					</div>
 
 					<div class="card-footer">
-						<a class="card-link text-muted" href="index.php">
+						<a class="card-link text-body-secondary" href="index.php">
 							<i class="fa-solid fa-angles-left"></i>
 							{{ lng('login.backtologin') }}</a>
 					</div>

templates/Froxlor/login/login.html.twig

@@ -44,7 +44,7 @@
 
 					{% if get_setting('panel.allow_preset') == '1' %}
 						<div class="card-footer">
-							<a class="card-link text-muted" href="index.php?action=forgotpwd">{{ lng('login.forgotpwd') }}</a>
+							<a class="card-link text-body-secondary" href="index.php?action=forgotpwd">{{ lng('login.forgotpwd') }}</a>
 						</div>
 					{% endif %}
 				</div>

templates/Froxlor/login/rpwd.html.twig

@@ -34,7 +34,7 @@
 					</div>
 
 					<div class="card-footer">
-						<a class="card-link text-muted" href="index.php">
+						<a class="card-link text-body-secondary" href="index.php">
 							<i class="fa-solid fa-angles-left"></i>
 							{{ lng('login.backtologin') }}</a>
 					</div>

templates/Froxlor/misc/version_top.html.twig

@@ -1,5 +1,5 @@
 {% import "Froxlor/misc/version_popover.html.twig" as vc %}
-<span id="ucheck" class="nav-link {% if isnewerversion == 0 and aucheck < 0 %}text-muted{% elseif isnewerversion == 0 %}text-success{% else %}text-warning{% endif %}"
+<span id="ucheck" class="nav-link {% if isnewerversion == 0 and aucheck < 0 %}text-body-secondary{% elseif isnewerversion == 0 %}text-success{% else %}text-warning{% endif %}"
 	  data-bs-container="body" data-bs-toggle="popover" data-bs-placement="bottom" data-bs-trigger="hover focus click" data-bs-html="true"
 	  data-bs-content="{{ vc.vpopover(isnewerversion, additional_info, full_version, dbversion, channel, last_update_check, message) }}"
 >

templates/Froxlor/settings/configuration.html.twig

@@ -5,7 +5,7 @@
 		<i class="fa-solid fa-wrench"></i>
 		{{ lng('admin.configfiles.serverconfiguration') }}
 	</h5>
-	<span class="text-muted">{{ lng('admin.configfiles.description') }}</span>
+	<span class="text-body-secondary">{{ lng('admin.configfiles.description') }}</span>
 {% endblock %}
 
 {% block actions %}

templates/Froxlor/settings/index.html.twig

@@ -7,7 +7,7 @@
 		{% if fields._group is defined %} » {{ fields._group.title|raw }}
 		{% endif %}
 	</h5>
-	<span class="text-muted">{{ lng('admin.serversettings_desc') }}</span>
+	<span class="text-body-secondary">{{ lng('admin.serversettings_desc') }}</span>
 {% endblock %}
 
 {% block actions %}
@@ -47,7 +47,7 @@
 							</div>
 							{% if not field.activated %}
 								<div class="position-absolute top-0 end-0 p-1">
-									<span class="badge text-muted" style="background: #eee">{{ lng('panel.not_activated') }}</span>
+									<span class="badge text-body-secondary" style="background: #eee">{{ lng('panel.not_activated') }}</span>
 								</div>
 							{% endif %}
 						</div>

templates/Froxlor/src/js/components/search.js

@@ -16,7 +16,7 @@ $(function() {
 		}
 		// Show notification for short search query
 		if (query.length && query.length < 3) {
-			dropdown.html('<li class="list-group-item text-muted py-1">Please enter more than 2 characters</li>');
+			dropdown.html('<li class="list-group-item text-body-secondary py-1">Please enter more than 2 characters</li>');
 			dropdown.parent().show();
 			return;
 		}
@@ -31,7 +31,7 @@ $(function() {
 			success: data => {
 				// Show notification if we got no results
 				if (Object.keys(data).length === 0) {
-					dropdown.html('<li class="list-group-item text-muted py-1">Nothing found!</li>');
+					dropdown.html('<li class="list-group-item text-body-secondary py-1">Nothing found!</li>');
 					dropdown.parent().show();
 					return;
 				}
@@ -40,7 +40,7 @@ $(function() {
 				dropdown.html('');
 				dropdown.parent().show();
 				Object.keys(data).forEach(key => {
-					dropdown.append('<li class="list-group-item text-muted text-capitalize fw-bold py-1 border-bottom">' + key + '</li>');
+					dropdown.append('<li class="list-group-item text-body-secondary text-capitalize fw-bold py-1 border-bottom">' + key + '</li>');
 					data[key].forEach(item => {
 						dropdown.append('<li class="list-group-item mt-1"><a href="' + item.href + '" tabindex="2" class="text-decoration-none">' + item.title + '</a></li>');
 					});
@@ -48,7 +48,7 @@ $(function() {
 			},
 			error: function (a, b) {
 				console.log(a, b);
-				dropdown.html('<li class="list-group-item text-muted py-1">Whoops we got some errors!</li>');
+				dropdown.html('<li class="list-group-item text-body-secondary py-1">Whoops we got some errors!</li>');
 				dropdown.parent().show();
 			}
 		});

templates/Froxlor/src/scss/components/_card.scss

@@ -14,11 +14,11 @@
 	}
 
 	&.deactivated {
-		@extend .text-muted;
+		@extend .text-body-secondary;
 		background: lighten($light-bg, 3%);
 
 		i {
-			@extend .text-muted;
+			@extend .text-body-secondary;
 		}
 	}
 }

templates/Froxlor/src/scss/components/_dropdown.scss

@@ -5,7 +5,7 @@
 				width: 1rem;
 				margin-right: 1rem;
 				text-align: center;
-				color: $text-muted;
+				color: $body-secondary-color;
 			}
 		}
 	}

templates/Froxlor/src/scss/components/_footer.scss

@@ -2,7 +2,7 @@ footer {
 	@extend .small;
 
 	a {
-		@extend .text-muted;
+		@extend .text-body-secondary;
 		@extend .text-decoration-none;
 	}
 

templates/Froxlor/user/form.html.twig

@@ -11,7 +11,7 @@
 				{{ formdata.title }}
 			</h5>
 			{% if formdata.description is not empty %}
-				<span class="text-muted">{{ formdata.description }}</span>
+				<span class="text-body-secondary">{{ formdata.description }}</span>
 			{% endif %}
 		</div>
 	{% endif %}

templates/Froxlor/user/table.html.twig

@@ -15,7 +15,7 @@
 			{% endif %}
 		</h5>
 		{% if listing.description is not empty %}
-			<span class="text-muted mt-2">{{ listing.description }}</span>
+			<span class="text-body-secondary mt-2">{{ listing.description }}</span>
 		{% endif %}
 	{% endif %}
 

templates/Froxlor/user/traffic.html.twig

@@ -7,7 +7,7 @@
 			<i class="fa-solid fa-chart-area me-1"></i>
 			{{ lng('admin.traffic') }}
 		</h5>
-		<span class="text-muted">{{ lng('admin.traffic_sub') }}</span>
+		<span class="text-body-secondary">{{ lng('admin.traffic_sub') }}</span>
 	</div>
 
 {% endblock %}

templates/Froxlor/userarea.html.twig

@@ -30,7 +30,7 @@
 			<div class="order-0 order-md-1 d-flex flex-grow-0 flex-md-grow-1" id="navbar">
 				<ul class="navbar-nav ms-md-auto me-3 me-lg-5">
 					<a class="nav-link d-md-none" data-bs-toggle="collapse" href="#collapseSearch" role="button" aria-expanded="false" aria-controls="collapseSearch">
-						<i class="fa-solid fa-search text-muted"></i>
+						<i class="fa-solid fa-search text-body-secondary"></i>
 					</a>
 					{% if call_static('\\Froxlor\\CurrentUser', 'getField', ['switched_user']) is not empty and call_static('\\Froxlor\\CurrentUser', 'getField', ['switched_user']) is iterable %}
 						<a class="nav-link text-success" href="{{ linker({'section': 'index', 'action': 'suback'}) }}">
@@ -79,7 +79,7 @@
 			<div class="order-1 order-md-0 collapse navbar-collapse" id="collapseSearch">
 				<form class="ms-3 mt-3 ms-lg-5 my-md-0" id="search" method="post">
 					<div class="d-flex align-items-center">
-						<i class="fa-solid fa-search text-muted"></i>
+						<i class="fa-solid fa-search text-body-secondary"></i>
 						<input tabindex="1" class="search-input" title="search" type="search" placeholder="{{ lng('panel.search') }}...">
 					</div>
 					<div class="search-results-box p-2 shadow" style="display:none;">