Files
cc-switch/src/renderer/components/AddProviderModal.css
farion1231 7ffd03e039 添加供应商编辑功能和密码显示切换
- 为供应商列表添加启用和编辑按钮
- 创建EditProviderModal组件支持编辑供应商信息
- 实现updateProvider API接口
- 为API Key输入框添加密码显示/隐藏功能,使用SVG图标
- 更新预设供应商配置为YesCode和PackyCode
- 移除model字段,简化供应商配置
2025-08-05 09:51:41 +08:00

170 lines
2.5 KiB
CSS

.modal-overlay {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.5);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
}
.modal-content {
background: white;
border-radius: 8px;
padding: 2rem;
width: 90%;
max-width: 500px;
max-height: 90vh;
overflow-y: auto;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
position: relative;
z-index: 1001;
}
.modal-content h2 {
margin-bottom: 1.5rem;
color: #2c3e50;
}
.presets {
margin-bottom: 1.5rem;
padding-bottom: 1.5rem;
border-bottom: 1px solid #ecf0f1;
}
.presets label {
display: block;
margin-bottom: 0.5rem;
color: #555;
font-size: 0.9rem;
}
.preset-buttons {
display: flex;
gap: 0.5rem;
}
.preset-btn {
padding: 0.375rem 0.75rem;
border: 1px solid #3498db;
background: white;
color: #3498db;
border-radius: 4px;
cursor: pointer;
font-size: 0.85rem;
transition: all 0.2s;
}
.preset-btn:hover {
background: #3498db;
color: white;
}
.form-group {
margin-bottom: 1.25rem;
}
.form-group label {
display: block;
margin-bottom: 0.5rem;
color: #555;
font-weight: 500;
}
.form-group input {
width: 100%;
padding: 0.625rem;
border: 1px solid #ddd;
border-radius: 4px;
font-size: 0.95rem;
transition: border-color 0.2s;
position: relative;
z-index: 1;
background: white;
}
.form-group input:focus {
outline: none;
border-color: #3498db;
}
.form-actions {
display: flex;
gap: 1rem;
justify-content: flex-end;
margin-top: 2rem;
}
.cancel-btn,
.submit-btn {
padding: 0.625rem 1.25rem;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 0.95rem;
transition: all 0.2s;
}
.cancel-btn {
background: #ecf0f1;
color: #555;
}
.cancel-btn:hover {
background: #bdc3c7;
}
.submit-btn {
background: #27ae60;
color: white;
}
.submit-btn:hover {
background: #229954;
}
.password-input-wrapper {
position: relative;
display: flex;
align-items: center;
}
.password-input-wrapper input {
padding-right: 2.5rem;
}
.password-toggle {
position: absolute;
right: 0.5rem;
top: 50%;
transform: translateY(-50%);
padding: 0.375rem;
background: none;
border: none;
cursor: pointer;
color: #7f8c8d;
transition: color 0.2s;
display: flex;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
z-index: 2;
}
.password-toggle svg {
width: 20px;
height: 20px;
stroke-width: 2;
}
.password-toggle:hover {
color: #3498db;
}
.password-toggle:focus {
outline: none;
}