Files
ST-Amily2-Chat-Optimisation…/assets/style.css
2025-08-03 16:58:53 +08:00

493 lines
14 KiB
CSS
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
#amily2_drawer_content .flex-container {
width: 100%; height: 100%; display: flex; flex-direction: column;
}
#amily2_chat_optimiser {
width: 100%;
flex-grow: 1;
overflow-y: auto;
padding: 15px 20px;
box-sizing: border-box;
}
#auth_panel { background: linear-gradient(135deg, #1a237e, #4a148c); padding: 20px; border-radius: 12px; margin-bottom: 20px; }
#auth_panel .auth-header { text-align: center; margin-bottom: 20px; }
#auth_panel .auth-title { font-size: 1.8rem; background: linear-gradient(to right, #ff9800, #ff5722); -webkit-background-clip: text; background-clip: text; color: transparent; }
#auth_panel .auth-subtitle { color: #ccc; margin-top: 5px; }
#auth_panel .auth-code-input { display: flex; margin-bottom: 15px; }
#auth_panel #amily2_auth_code { flex: 1; padding: 10px; border-radius: 8px 0 0 8px; border: 1px solid #7e57c2; background: rgba(0,0,0,0.2); color: white; }
#auth_panel #auth_submit { padding: 10px 15px; border: none; background: #7e57c2; color: white; border-radius: 0 8px 8px 0; cursor: pointer; }
#auth_panel .auth-footer { text-align: center; font-size: 0.8em; color: #999; }
.auth-status { padding: 10px; border-radius: 8px; text-align: center; margin-top: 15px; }
.auth-status.valid { background-color: rgba(76, 175, 80, 0.2); border: 1px solid #4CAF50; }
.auth-status.expired { background-color: rgba(244, 67, 54, 0.2); border: 1px solid #f44336; }
.amily2-header {
display: flex;
justify-content: space-between;
align-items: flex-start; /* 修改为顶部对齐 */
padding: 0 5px;
}
.main-toggle { margin: 0; }
.main-toggle label { font-size: 1.2em; }
.update-section {
position: relative;
display: flex; /* 使用flex布局来垂直居中 */
align-items: center;
min-height: 50px; /* 设置一个最小高度,与左侧开关区域对齐 */
}
#amily2_update_button { background: none; border: 1px solid rgba(255,255,255,0.2); padding: 5px 8px; }
#amily2_update_button:hover { background: rgba(255,255,255,0.1); }
.update-indicator {
position: absolute; top: -3px; right: -3px; width: 10px; height: 10px;
background-color: #ff4d4d; border-radius: 50%; border: 1px solid #1e1e1e;
}
hr.header-divider { border: none; border-top: 1px solid rgba(255,255,255,0.1); margin: 0 0 10px 0; }
.settings-group {
border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 8px;
padding: 15px; margin: 0; display: flex; flex-direction: column; gap: 15px;
}
.settings-group legend {
font-size: 1.1em; font-weight: bold; color: #eee; padding: 0 10px; margin-left: 10px;
}
.settings-group legend > i { margin-right: 8px; color: #7e57c2; }
.settings-group legend > i.fa-palette {
color: #ff9800;
}
#amily2_chat_optimiser .settings-group {
margin-bottom: 20px;
}
#amily2_chat_optimiser .settings-group:last-child {
margin-bottom: 0;
}
.toggle-switch {
position: relative; display: inline-block; width: 50px; height: 26px;
}
.toggle-switch input { opacity: 0; width: 0; height: 0; }
.slider {
position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0;
background-color: #333; border-radius: 26px; transition: .4s;
}
.slider:before {
position: absolute; content: ""; height: 20px; width: 20px; left: 3px; bottom: 3px;
background-color: white; border-radius: 50%; transition: .4s;
}
input:checked + .slider { background-color: #7e57c2; }
input:checked + .slider:before { transform: translateX(24px); }
.radio-toggle-group {
display: flex; border: 1px solid #555; border-radius: 8px; overflow: hidden;
}
.radio-toggle-group input[type="radio"] { display: none; }
.radio-toggle-group label {
flex: 1; text-align: center; padding: 8px 10px; cursor: pointer;
background-color: #333; color: #ccc; transition: all 0.3s ease;
border-left: 1px solid #555; margin: 0 !important;
}
.radio-toggle-group label:first-of-type { border-left: none; }
.radio-toggle-group input[type="radio"]:checked + label {
background-color: #7e57c2; color: white; font-weight: bold;
}
.control-pair-container {
display: flex; justify-content: space-around; align-items: center; gap: 20px;
}
.control-pair-container .amily2_settings_block {
flex: 1; display: flex; flex-direction: column; align-items: center; gap: 10px;
}
.control-pair-container .amily2_settings_block label:first-of-type { margin-bottom: 0; }
.amily2_settings_block { display: flex; flex-direction: column; gap: 8px; }
.amily2_settings_block label { font-weight: bold; color: #ddd; }
.amily2_settings_block .notes {
font-size: 0.8em; color: #aaa; opacity: 0.9; font-style: italic;
align-self: flex-start; padding-left: 5px;
}
.control-pair-container .amily2_settings_block .notes { align-self: center; }
.label-with-button {
display: flex;
justify-content: space-between;
align-items: center;
}
.prompt-editor-area {
display: flex;
flex-direction: row;
align-items: flex-start;
gap: 10px;
}
.prompt-editor-area textarea {
flex-grow: 1;
resize: vertical;
}
.editor-buttons-panel {
display: flex;
flex-direction: row;
gap: 10px;
}
.editor-buttons-panel .menu_button {
margin: 0;
}
.editor_maximize {
color: #ccc;
cursor: pointer;
padding: 4px;
border-radius: 4px;
transition: background-color 0.2s, color 0.2s;
}
.editor_maximize:hover {
background-color: rgba(255, 255, 255, 0.1);
color: white;
}
.amily2_lore_config_wrapper {
display: flex;
gap: 15px;
}
.amily2_lore_config_section {
flex: 1;
display: flex;
flex-direction: column;
gap: 15px;
}
.amily2_vertical_divider {
width: 1px;
background-color: rgba(255, 255, 255, 0.2);
align-self: stretch;
}
#amily2_save_lore_settings {
width: 100%;
background: linear-gradient(135deg, #7e57c2, #5e35b1);
border: 1px solid #4527a0;
}
#amily2_save_lore_settings:hover {
background: linear-gradient(135deg, #5e35b1, #7e57c2);
box-shadow: 0 0 8px rgba(126, 87, 194, 0.6);
}
#amily2_lore_save_status {
color: #66bb6a;
font-weight: bold;
opacity: 0;
transition: opacity 0.5s ease-in-out;
padding-top: 5px;
}
hr { border: none; border-top: 1px solid rgba(255,255,255,0.1); margin: 0; }
.text_pole, select { width: 100%; box-sizing: border-box; }
.button-pair { flex-direction: row; justify-content: space-between; gap: 15px; }
.button-pair .menu_button { flex-grow: 1; }
.flex-container .primary { background-color: #2196F3; }
.flex-container .accent { background-color: #FF5722; }
#amily2_drawer_icon.closedIcon { opacity: 0.5; }
#amily2_drawer_icon.openIcon { opacity: 1; }
#amily2_drawer_icon.interactable:hover { opacity: 1; }
#amily2_optimization_enabled:checked + .slider {
background: linear-gradient(to right, #28a745, #20c997);
box-shadow: 0 0 10px rgba(40, 167, 69, 0.7);
}
#amily2_summarization_enabled:checked + .slider {
background: linear-gradient(to right, #007bff, #17a2b8);
box-shadow: 0 0 10px rgba(0, 123, 255, 0.7);
}
#amily2_icon_location_topbar:checked + label {
background: linear-gradient(135deg, #0d6efd, #0dcaf0);
color: white;
font-weight: bold;
box-shadow: inset 0 0 8px rgba(255, 255, 255, 0.5), 0 0 12px rgba(13, 110, 253, 0.6);
transform: translateY(-2px);
border-color: #0dcaf0;
}
#amily2_icon_location_extensions:checked + label {
background: linear-gradient(135deg, #ffc107, #fd7e14);
color: #492000;
font-weight: bold;
text-shadow: 0 0 1px rgba(255,255,255,0.7);
box-shadow: inset 0 0 8px rgba(255, 255, 255, 0.6), 0 0 12px rgba(255, 193, 7, 0.6);
transform: translateY(-2px);
border-color: #ffc107;
}
.radio-toggle-group label {
transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
#amily2_mode_intercept:checked + label {
background: linear-gradient(135deg, #00bfa5, #00acc1);
color: white;
text-shadow: 0 0 3px rgba(0,0,0,0.4);
box-shadow: inset 0 0 8px rgba(255, 255, 255, 0.4), 0 0 10px rgba(0, 191, 165, 0.6);
transform: translateY(-2px);
}
#amily2_mode_refresh:checked + label {
background: linear-gradient(135deg, #3f51b5, #2196f3);
color: white;
text-shadow: 0 0 3px rgba(0,0,0,0.4);
box-shadow: inset 0 0 8px rgba(255, 255, 255, 0.4), 0 0 10px rgba(63, 81, 181, 0.6);
transform: translateY(-2px);
}
#amily2_refresh_models {
background: linear-gradient(to right, #2196F3, #1976D2);
border: 1px solid #1565C0;
transition: all 0.3s ease;
}
#amily2_refresh_models:hover {
background: linear-gradient(to right, #1976D2, #2196F3);
box-shadow: 0 0 8px rgba(33, 150, 243, 0.7);
transform: scale(1.03);
}
#amily2_unified_restore_button.secondary {
background: linear-gradient(to right, #ffb300, #fb8c00);
border: 1px solid #f57c00;
color: #4d2c00;
transition: all 0.3s ease;
}
#amily2_unified_restore_button.secondary:hover {
background: linear-gradient(to right, #fb8c00, #ffb300);
box-shadow: 0 0 8px rgba(255, 179, 0, 0.7);
transform: scale(1.03);
}
.amily2-header {
display: flex;
justify-content: space-between;
align-items: center;
padding-bottom: 5px;
}
.header-actions-group {
display: flex;
flex-direction: column;
align-items: flex-end; /* 保持右对齐 */
gap: 10px; /* 增加间距以匹配左侧 */
}
.additional-features-section {
width: 100%;
}
.secret-chamber-button {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
padding: 6px 10px;
font-size: 14px;
font-weight: bold;
color: var(--text_color);
background-color: var(--background_secondary);
border: 1px solid var(--border_color);
border-radius: 8px;
cursor: pointer;
transition: all 0.2s ease-in-out;
}
.secret-chamber-button i {
margin-right: 8px;
}
.secret-chamber-button:hover {
background-color: var(--background_tertiary);
border-color: var(--text_color_half);
color: var(--primary_color);
}
.amily2-header .main-toggle label {
font-size: 15px;
}
#amily2_additional_features_panel {
display: none;
}
.amily2-panel-visible {
display: flex !important;
flex-direction: column;
flex-grow: 1;
gap: 15px;
}
.manual-command-block {
display: flex;
flex-direction: row;
align-items: center;
gap: 8px;
}
.manual-command-block label {
flex-shrink: 0;
margin-right: 5px;
}
.manual-command-block .manual-input {
width: 80px;
padding: 6px;
text-align: center;
border: 1px solid var(--border_color);
background-color: var(--background_secondary);
color: var(--text_color);
border-radius: 5px;
}
.manual-command-block .manual-command-divider {
font-weight: bold;
color: var(--text_color_half);
}
.manual-command-block .menu_button {
flex-grow: 1;
margin: 0;
}
#amily2_unhide_all_button {
width: 42px;
height: 42px;
padding: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 2px;
background: linear-gradient(135deg, #28a745, #20c997);
border: 1px solid #198754;
color: white;
font-weight: bold;
text-shadow: 0 0 2px rgba(0,0,0,0.3);
transition: all 0.3s ease;
border-radius: 8px;
}
#amily2_unhide_all_button:hover {
background: linear-gradient(135deg, #20c997, #28a745);
box-shadow: 0 0 10px rgba(40, 167, 69, 0.7);
transform: translateY(-2px);
border-color: #1a9c5c;
}
#amily2_unhide_all_button {
font-size: 13px;
line-height: 1.2;
}
#amily2_unhide_all_button i {
font-size: 16px;
margin: 0;
}
#amily2_unhide_all_button span {
font-size: 9px;
font-weight: normal;
}
/* 左侧容器:垂直布局 */
.header-left-panel {
display: flex; /* 弹性布局 */
flex-direction: column; /* 垂直排列 */
align-items: flex-start;/* 左对齐 */
gap: 10px; /* 内部元素间距 */
}
/* 翰林院入口容器 (简化无背景) */
.rag-palace-entry-container {
width: auto; /* 自适应宽度 */
}
/* 翰林院按钮 - 与内阁密室一致 */
#amily2_open_rag_palace {
/* 完全复用内阁密室的样式 */
background: none !important;
border: none !important;
box-shadow: none !important;
padding: 0;
font-size: 14px;
color: var(--SmartThemeBodyColor);
}
/* 确保所有可切换面板表现一致 */
#rag_palace_panel {
display: none;
}
.amily2-panel-visible {
display: flex;
flex-direction: column;
flex-grow: 1;
}
/* === Styles for Content Exclusion Modal === */
.opt-exclusion-rule-row {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 10px;
}
.opt-exclusion-rule-row input[type="text"] {
flex-grow: 1;
}
/* Specific styles for the delete button in the exclusion rule modal */
.delete-rule-btn.danger_button {
background: linear-gradient(135deg, #e74c3c, #c0392b);
border: 1px solid #a93226;
color: white;
border-radius: 50%;
width: 24px;
height: 24px;
line-height: 1; /* Adjusted for better vertical centering of '×' */
text-align: center;
padding: 0;
flex-shrink: 0;
transition: all 0.2s ease-in-out;
}
.delete-rule-btn.danger_button:hover {
background: linear-gradient(135deg, #ec7063, #e74c3c);
box-shadow: 0 0 8px rgba(231, 76, 60, 0.7);
transform: scale(1.05);
}
.amily2-add-rule-btn {
width: auto;
padding: 8px 16px;
background: linear-gradient(135deg, #2ecc71, #27ae60);
border: 1px solid #229954;
color: white;
font-weight: bold;
}
.amily2-add-rule-btn:hover {
background: linear-gradient(135deg, #58d68d, #2ecc71);
box-shadow: 0 0 10px rgba(46, 204, 113, 0.7);
}