diff --git a/admin-web/static/index.html b/admin-web/static/index.html index e187059..60749ea 100644 --- a/admin-web/static/index.html +++ b/admin-web/static/index.html @@ -400,6 +400,6 @@ - + diff --git a/admin-web/static/styles.css b/admin-web/static/styles.css index 1587edf..e7a0a00 100644 --- a/admin-web/static/styles.css +++ b/admin-web/static/styles.css @@ -1202,6 +1202,76 @@ td small { font-size: 12px; } +@media (max-width: 1180px) { + .keys-table { + min-width: 0; + table-layout: auto; + } + + .keys-table, + .keys-table thead, + .keys-table tbody, + .keys-table tr, + .keys-table th, + .keys-table td { + display: block; + width: 100%; + } + + .keys-table thead { + display: none; + } + + .keys-table tr { + margin-bottom: 12px; + border: 1px solid var(--line); + border-radius: 8px; + background: var(--panel); + overflow: hidden; + } + + .keys-table tr:last-child { + margin-bottom: 0; + } + + .keys-table td { + display: grid; + grid-template-columns: 132px minmax(0, 1fr); + gap: 12px; + width: 100% !important; + border-bottom: 1px solid var(--line); + } + + .keys-table td::before { + content: attr(data-label); + color: var(--muted); + font-size: 12px; + font-weight: 800; + text-transform: uppercase; + } + + .keys-table tr:last-child td, + .keys-table td:last-child { + border-bottom: 0; + } + + .keys-table td code { + max-width: 100%; + white-space: nowrap; + } + + .keys-table .mini-actions, + .keys-table .action-buttons { + justify-content: stretch; + flex-wrap: wrap; + } + + .keys-table .mini-actions button, + .keys-table .action-buttons button { + flex: 1 1 130px; + } +} + @media (max-width: 1280px) { .service-grid { grid-template-columns: repeat(3, minmax(150px, 1fr));