26 lines
1.4 KiB
CSS
26 lines
1.4 KiB
CSS
/* === Modal === */
|
|
.modal-overlay {
|
|
position: fixed; top: 0; left: 0; width: 100%; height: 100%;
|
|
background: rgba(0,0,0,0.85); z-index: 100; display: flex;
|
|
align-items: flex-end; justify-content: center; animation: fadeIn 0.2s;
|
|
}
|
|
.modal-content {
|
|
background: var(--surface); padding: 20px; border-radius: 16px 16px 0 0;
|
|
width: 100%; max-width: 500px; max-height: 85vh; overflow-y: auto; animation: slideUp 0.25s;
|
|
}
|
|
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
|
|
@keyframes slideUp { from { transform: translateY(100%); } to { transform: translateY(0); } }
|
|
|
|
.modal-title { margin-bottom: 16px; }
|
|
.field-group { margin-bottom: 14px; }
|
|
.field-group label { display: block; font-size: 0.85rem; color: var(--text-secondary); margin-bottom: 6px; }
|
|
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
|
|
.field-row-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
|
|
|
|
/* === Autocomplete === */
|
|
.autocomplete-list { background: var(--surface-2); border: 1px solid var(--border); border-radius: 8px; max-height: 200px; overflow-y: auto; margin-top: 6px; }
|
|
.autocomplete-item { padding: 12px 14px; cursor: pointer; border-bottom: 1px solid var(--border); font-size: 0.95rem; }
|
|
.autocomplete-item:last-child { border-bottom: none; }
|
|
.autocomplete-item:active { background: var(--surface); }
|
|
.autocomplete-item .freq { float: right; font-size: 0.75rem; color: var(--text-secondary); }
|