| | |
| | .api-container { |
| | display: flex; |
| | flex-direction: column; |
| | gap: 20px; |
| | padding: 15px; |
| | } |
| |
|
| | .api-model-select, |
| | .api-input-group { |
| | display: flex; |
| | flex-direction: column; |
| | gap: 8px; |
| | } |
| |
|
| | .api-keys-container { |
| | display: flex; |
| | flex-direction: column; |
| | gap: 15px; |
| | } |
| |
|
| | .api-key-input { |
| | display: flex; |
| | flex-direction: column; |
| | gap: 8px; |
| | } |
| |
|
| | .api-key-input input { |
| | padding: 8px; |
| | border: 1px solid #5f3737; |
| | border-radius: 4px; |
| | } |
| |
|
| | label { |
| | color: #5f3737; |
| | font-weight: bold; |
| | } |
| |
|
| | select { |
| | padding: 8px; |
| | border: 1px solid #5f3737; |
| | border-radius: 4px; |
| | background-color: white; |
| | } |
| |
|
| | .api-submit-btn { |
| | padding: 10px; |
| | background-color: #5f3737; |
| | color: white; |
| | border: none; |
| | border-radius: 4px; |
| | cursor: pointer; |
| | transition: background-color 0.3s; |
| | } |
| |
|
| | .api-submit-btn:hover { |
| | background-color: #7a4747; |
| | } |
| |
|
| | .api-key-input .toggle-visibility { |
| | position: absolute; |
| | right: 10px; |
| | top: 50%; |
| | transform: translateY(-50%); |
| | cursor: pointer; |
| | color: #5f3737; |
| | } |
| |
|
| | |
| | .api-container label h3 { |
| | margin: 0; |
| | display: inline-block; |
| | } |
| |
|
| | .api-submit-btn h3 { |
| | margin: 0; |
| | } |
| |
|
| | |
| | .api-container label { |
| | margin-bottom: 0; |
| | } |
| |
|
| | |
| | .api-container label h3 { |
| | vertical-align: middle; |
| | line-height: normal; |
| | } |
| |
|
| | |
| | .api-container > label + select, |
| | .api-container > label + input { |
| | margin-top: 5px; |
| | } |