fix(ui): stack upload form vertically on mobile to prevent button text cutoff
This commit is contained in:
@@ -130,7 +130,7 @@ code { background: var(--bg); padding: .15rem .4rem; border-radius: 4px; font-si
|
|||||||
.detail-img { width: 100%; max-width: 400px; border-radius: 8px; border: 1px solid var(--border); }
|
.detail-img { width: 100%; max-width: 400px; border-radius: 8px; border: 1px solid var(--border); }
|
||||||
.detail-img.placeholder { display: flex; align-items: center; justify-content: center; height: 200px; background: var(--bg); color: var(--text-muted); font-size: .95rem; }
|
.detail-img.placeholder { display: flex; align-items: center; justify-content: center; height: 200px; background: var(--bg); color: var(--text-muted); font-size: .95rem; }
|
||||||
.upload-form { margin-top: .5rem; display: flex; gap: .5rem; align-items: center; }
|
.upload-form { margin-top: .5rem; display: flex; gap: .5rem; align-items: center; }
|
||||||
.upload-form input[type="file"] { font-size: .85rem; min-width: 0; flex: 1; }
|
.upload-form input[type="file"] { font-size: .85rem; min-width: 0; max-width: 260px; }
|
||||||
.upload-form .btn { white-space: nowrap; flex-shrink: 0; }
|
.upload-form .btn { white-space: nowrap; flex-shrink: 0; }
|
||||||
.detail-meta dl { display: grid; grid-template-columns: auto 1fr; gap: .3rem 1rem; }
|
.detail-meta dl { display: grid; grid-template-columns: auto 1fr; gap: .3rem 1rem; }
|
||||||
.detail-meta dt { font-weight: 600; font-size: .85rem; color: var(--text-muted); }
|
.detail-meta dt { font-weight: 600; font-size: .85rem; color: var(--text-muted); }
|
||||||
@@ -146,4 +146,6 @@ code { background: var(--bg); padding: .15rem .4rem; border-radius: 4px; font-si
|
|||||||
@media (max-width: 640px) {
|
@media (max-width: 640px) {
|
||||||
.detail-grid { grid-template-columns: 1fr; }
|
.detail-grid { grid-template-columns: 1fr; }
|
||||||
.card-grid { grid-template-columns: 1fr; }
|
.card-grid { grid-template-columns: 1fr; }
|
||||||
|
.upload-form { flex-direction: column; align-items: stretch; }
|
||||||
|
.upload-form input[type="file"] { max-width: none; }
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user