Make risk policy cards responsive with auto-fit grid layout.
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
@@ -2512,6 +2512,14 @@ html[data-theme="light"] .journal-detail-img-thumb {
|
|||||||
/* ── 风控说明页 ── */
|
/* ── 风控说明页 ── */
|
||||||
.risk-policy-page {
|
.risk-policy-page {
|
||||||
margin-top: 12px;
|
margin-top: 12px;
|
||||||
|
width: 100%;
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.risk-policy-page .settings-card--risk {
|
||||||
|
width: 100%;
|
||||||
|
min-width: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
.settings-page--grid {
|
.settings-page--grid {
|
||||||
@@ -2758,16 +2766,20 @@ html[data-theme="light"] .journal-detail-img-thumb {
|
|||||||
|
|
||||||
.settings-risk-sections {
|
.settings-risk-sections {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
|
||||||
gap: 10px;
|
gap: 10px;
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
|
align-items: start;
|
||||||
|
container-type: inline-size;
|
||||||
}
|
}
|
||||||
|
|
||||||
.settings-subcard {
|
.settings-subcard {
|
||||||
padding: 10px 12px;
|
padding: 10px 12px;
|
||||||
min-width: 0;
|
min-width: 0;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
.settings-subcard-title {
|
.settings-subcard-title {
|
||||||
@@ -2778,15 +2790,37 @@ html[data-theme="light"] .journal-detail-img-thumb {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.settings-kv--compact .settings-kv-row {
|
.settings-kv--compact .settings-kv-row {
|
||||||
grid-template-columns: 8em 1fr;
|
grid-template-columns: minmax(7em, auto) minmax(0, 1fr);
|
||||||
|
gap: 6px 12px;
|
||||||
padding: 4px 0;
|
padding: 4px 0;
|
||||||
font-size: 0.75rem;
|
font-size: 0.75rem;
|
||||||
|
align-items: start;
|
||||||
|
}
|
||||||
|
|
||||||
|
@container (max-width: 420px) {
|
||||||
|
.settings-risk-sections .settings-kv--compact .settings-kv-row {
|
||||||
|
grid-template-columns: minmax(0, 1fr);
|
||||||
|
gap: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.settings-risk-sections .settings-kv--compact .settings-kv-row dd {
|
||||||
|
margin-bottom: 6px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 720px) {
|
@media (max-width: 720px) {
|
||||||
.settings-risk-sections {
|
.settings-risk-sections {
|
||||||
grid-template-columns: minmax(0, 1fr);
|
grid-template-columns: minmax(0, 1fr);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.settings-kv--compact .settings-kv-row {
|
||||||
|
grid-template-columns: minmax(0, 1fr);
|
||||||
|
gap: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.settings-kv--compact .settings-kv-row dd {
|
||||||
|
margin-bottom: 6px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.settings-section {
|
.settings-section {
|
||||||
|
|||||||
Reference in New Issue
Block a user