Add routing priority reminder to services section

Introduces a visual reminder in the services section explaining routing rule precedence. Includes new styles for the reminder component, with support for both light and dark themes.
This commit is contained in:
xixu-me committed 2025-07-14 11:15:05 +08:00
1 parent fc4bca0812
commit d5b0eaba33
2 files changed
+56

No files matched your search

+11
View File
@@ -83,6 +83,17 @@
<h2><i class="fas fa-list"></i> Services</h2> <h2><i class="fas fa-list"></i> Services</h2>
</div> </div>
<div class="card-content"> <div class="card-content">
<div class="routing-priority-reminder">
<i class="fas fa-exclamation-triangle warning-icon"></i>
<div class="content">
<strong>Routing Priority:</strong>
<span>
Routing rules are matched in order from top to bottom, with the
rule at the top of the list taking precedence over the rules
below it.
</span>
</div>
</div>
<div class="services-controls"> <div class="services-controls">
<div class="search-container"> <div class="search-container">
<div class="search-input-wrapper"> <div class="search-input-wrapper">
+45
View File
@@ -1042,3 +1042,48 @@ body::before {
transform: scale(1.05) translateY(0px); transform: scale(1.05) translateY(0px);
transition: all 0.1s ease; transition: all 0.1s ease;
} }
/* Routing Priority Reminder Styles */
.routing-priority-reminder {
background: linear-gradient(
135deg,
rgba(245, 158, 11, 0.1) 0%,
rgba(249, 115, 22, 0.1) 100%
);
border: 1px solid rgba(245, 158, 11, 0.3);
border-radius: 12px;
padding: 1rem;
margin-bottom: 1.5rem;
display: flex;
align-items: flex-start;
gap: 0.75rem;
}
.routing-priority-reminder .warning-icon {
color: rgba(245, 158, 11, 0.9);
margin-top: 0.125rem;
font-size: 1.1rem;
}
.routing-priority-reminder .content {
flex: 1;
}
.routing-priority-reminder .content strong {
color: var(--text-primary);
font-weight: 600;
}
.routing-priority-reminder .content span {
color: var(--text-secondary);
margin-left: 0.5rem;
}
[data-theme="dark"] .routing-priority-reminder {
background: linear-gradient(
135deg,
rgba(245, 158, 11, 0.15) 0%,
rgba(249, 115, 22, 0.15) 100%
);
border-color: rgba(245, 158, 11, 0.4);
}