mirror of
https://github.com/router-for-me/Cli-Proxy-API-Management-Center.git
synced 2026-02-03 11:20:50 +08:00
feat(app.js, i18n, index.html, styles.css): enhance auth file management with search and pagination controls
- Implemented search functionality for auth files, allowing users to filter by name, type, or provider. - Added pagination controls to manage the display of auth files, improving navigation through large datasets. - Updated internationalization strings to support new search and pagination features in both English and Chinese. - Enhanced styles for the auth file toolbar, search input, and pagination controls for better user experience.
This commit is contained in:
112
styles.css
112
styles.css
@@ -1630,6 +1630,93 @@ input:checked+.slider:before {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
/* 认证文件工具栏 */
|
||||
.auth-file-toolbar {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 18px;
|
||||
align-items: flex-end;
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
.auth-file-search-group {
|
||||
flex: 1;
|
||||
min-width: 240px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.auth-file-search-group label,
|
||||
.auth-file-page-size label {
|
||||
font-weight: 600;
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
.auth-file-search {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border: 1px solid var(--border-primary);
|
||||
border-radius: 10px;
|
||||
padding: 0 12px;
|
||||
background: var(--bg-secondary);
|
||||
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.03);
|
||||
}
|
||||
|
||||
[data-theme="dark"] .auth-file-search {
|
||||
background: var(--bg-tertiary);
|
||||
box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.04);
|
||||
}
|
||||
|
||||
.auth-file-search i {
|
||||
color: var(--text-tertiary);
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.auth-file-search input {
|
||||
border: none;
|
||||
background: transparent;
|
||||
color: var(--text-primary);
|
||||
width: 100%;
|
||||
padding: 10px 0;
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
|
||||
.auth-file-search input:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.auth-file-page-size {
|
||||
min-width: 180px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.page-size-input {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
border: 1px solid var(--border-primary);
|
||||
border-radius: 10px;
|
||||
padding: 8px 12px;
|
||||
background: var(--bg-quaternary);
|
||||
}
|
||||
|
||||
.page-size-input input {
|
||||
width: 80px;
|
||||
padding: 6px 8px;
|
||||
border: 1px solid var(--border-secondary);
|
||||
border-radius: 6px;
|
||||
background: var(--bg-primary);
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
.page-size-input span {
|
||||
font-size: 0.9rem;
|
||||
color: var(--text-tertiary);
|
||||
}
|
||||
|
||||
/* 认证文件筛选按钮 */
|
||||
.auth-file-filter {
|
||||
display: flex;
|
||||
@@ -2873,6 +2960,31 @@ input:checked+.slider:before {
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
.api-key-input-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.api-key-input-group {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.api-key-input-group .api-key-value-input {
|
||||
flex: 2;
|
||||
}
|
||||
|
||||
.api-key-input-group .api-key-proxy-input {
|
||||
flex: 1;
|
||||
min-width: 180px;
|
||||
}
|
||||
|
||||
.api-key-input-group .api-key-remove-btn {
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
.header-input-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
Reference in New Issue
Block a user