refine Semi UI access evidence inspector
This commit is contained in:
@@ -6953,6 +6953,67 @@ button, a { -webkit-tap-highlight-color: transparent; }
|
||||
.v2-access-inspector-summary .v2-access-connection span { display: none; }
|
||||
.v2-access-inspector-summary .v2-access-connection-tag.semi-tag { flex: 0 0 auto; }
|
||||
|
||||
.v2-access-inspector-summary-grid {
|
||||
display: grid;
|
||||
grid-template-columns: 1.25fr 1fr 1fr;
|
||||
border-bottom: 1px solid var(--v2-border);
|
||||
background: #fff;
|
||||
padding: 8px 12px;
|
||||
}
|
||||
.v2-access-inspector-summary-grid > span {
|
||||
display: grid;
|
||||
min-width: 0;
|
||||
align-content: center;
|
||||
gap: 4px;
|
||||
padding: 3px 9px;
|
||||
}
|
||||
.v2-access-inspector-summary-grid > span:first-child { padding-left: 0; }
|
||||
.v2-access-inspector-summary-grid > span + span { border-left: 1px solid #e8edf3; }
|
||||
.v2-access-inspector-summary-grid small {
|
||||
color: #8592a3;
|
||||
font-size: 9px;
|
||||
line-height: 1.2;
|
||||
}
|
||||
.v2-access-inspector-summary-grid strong {
|
||||
overflow: hidden;
|
||||
color: #3c4e65;
|
||||
font-size: 10px;
|
||||
line-height: 1.35;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.v2-access-protocol-heading {
|
||||
display: flex;
|
||||
min-height: 45px;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
border-bottom: 1px solid #e6ebf2;
|
||||
background: #f7f9fc;
|
||||
padding: 8px 13px 7px;
|
||||
}
|
||||
.v2-access-protocol-heading > span {
|
||||
display: grid;
|
||||
min-width: 0;
|
||||
gap: 2px;
|
||||
}
|
||||
.v2-access-protocol-heading strong {
|
||||
color: #34475e;
|
||||
font-size: 12px;
|
||||
}
|
||||
.v2-access-protocol-heading small {
|
||||
overflow: hidden;
|
||||
color: #8794a5;
|
||||
font-size: 9px;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.v2-access-protocol-heading .semi-tag {
|
||||
min-height: 22px;
|
||||
flex: 0 0 auto;
|
||||
border-radius: 999px;
|
||||
font-size: 9px;
|
||||
}
|
||||
.v2-access-protocol-details.semi-card-group {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr;
|
||||
@@ -6995,6 +7056,56 @@ button, a { -webkit-tap-highlight-color: transparent; }
|
||||
border: 1px solid currentColor;
|
||||
background: transparent;
|
||||
}
|
||||
.v2-access-protocol-glance {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: 1px;
|
||||
background: #edf1f5;
|
||||
}
|
||||
.v2-access-protocol-glance > span {
|
||||
display: grid;
|
||||
min-width: 0;
|
||||
min-height: 45px;
|
||||
align-content: center;
|
||||
gap: 3px;
|
||||
background: #fff;
|
||||
padding: 6px 11px;
|
||||
}
|
||||
.v2-access-protocol-glance small {
|
||||
color: #8793a4;
|
||||
font-size: 9px;
|
||||
line-height: 1.2;
|
||||
}
|
||||
.v2-access-protocol-glance strong,
|
||||
.v2-access-protocol-glance .v2-access-time {
|
||||
overflow: hidden;
|
||||
color: #405269;
|
||||
font-size: 10px;
|
||||
font-weight: 650;
|
||||
line-height: 1.25;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.v2-access-protocol-glance .is-danger strong { color: var(--v2-red); }
|
||||
.v2-access-protocol-toggle.semi-button {
|
||||
width: 100%;
|
||||
min-height: 38px;
|
||||
justify-content: space-between;
|
||||
border-top: 1px solid #e9eef4;
|
||||
border-radius: 0;
|
||||
color: #54708e;
|
||||
padding: 0 11px;
|
||||
font-size: 10px;
|
||||
font-weight: 650;
|
||||
}
|
||||
.v2-access-protocol-toggle .semi-icon {
|
||||
transition: transform .18s ease;
|
||||
}
|
||||
.v2-access-protocol-toggle.is-expanded .semi-icon { transform: rotate(180deg); }
|
||||
.v2-access-protocol-expanded {
|
||||
border-top: 1px solid #e9eef4;
|
||||
background: #fbfcfe;
|
||||
}
|
||||
.v2-access-protocol-descriptions.semi-descriptions { padding: 7px 11px 3px; }
|
||||
.v2-access-protocol-descriptions .semi-descriptions-item {
|
||||
min-height: 31px;
|
||||
@@ -7032,6 +7143,24 @@ button, a { -webkit-tap-highlight-color: transparent; }
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
}
|
||||
.v2-access-protocol-missing {
|
||||
display: grid;
|
||||
min-height: 62px;
|
||||
align-content: center;
|
||||
gap: 4px;
|
||||
background: #fbfcfd;
|
||||
padding: 9px 11px;
|
||||
}
|
||||
.v2-access-protocol-missing span {
|
||||
color: #627188;
|
||||
font-size: 10px;
|
||||
font-weight: 650;
|
||||
}
|
||||
.v2-access-protocol-missing small {
|
||||
color: #909bab;
|
||||
font-size: 9px;
|
||||
line-height: 1.4;
|
||||
}
|
||||
.v2-access-loading {
|
||||
position: absolute;
|
||||
z-index: 4;
|
||||
@@ -7066,11 +7195,14 @@ button, a { -webkit-tap-highlight-color: transparent; }
|
||||
}
|
||||
|
||||
@media (max-width: 680px) {
|
||||
.v2-access-inspector-summary.semi-descriptions { padding: 8px 12px 6px; }
|
||||
.v2-access-inspector-summary .semi-descriptions-item { min-height: 44px; }
|
||||
.v2-access-inspector-summary .semi-descriptions-item-th { width: 80px; }
|
||||
.v2-access-inspector-summary .semi-descriptions-key,
|
||||
.v2-access-inspector-summary .semi-descriptions-value { font-size: 11px; }
|
||||
.v2-access-inspector-summary-grid { min-height: 68px; }
|
||||
.v2-access-inspector-summary-grid > span { padding-inline: 8px; }
|
||||
.v2-access-inspector-summary-grid small { font-size: 10px; }
|
||||
.v2-access-inspector-summary-grid strong { font-size: 11px; }
|
||||
.v2-access-protocol-heading { min-height: 44px; padding-inline: 12px; }
|
||||
.v2-access-protocol-heading strong { font-size: 13px; }
|
||||
.v2-access-protocol-heading small,
|
||||
.v2-access-protocol-heading .semi-tag { font-size: 10px; }
|
||||
.v2-access-protocol-details.semi-card-group {
|
||||
display: flex;
|
||||
overflow-x: auto;
|
||||
@@ -7086,6 +7218,14 @@ button, a { -webkit-tap-highlight-color: transparent; }
|
||||
}
|
||||
.v2-access-protocol-detail > .semi-card-header { min-height: 44px; }
|
||||
.v2-access-protocol-detail > .semi-card-header .semi-card-header-wrapper-title strong { font-size: 13px; }
|
||||
.v2-access-protocol-glance > span { min-height: 43px; padding-inline: 10px; }
|
||||
.v2-access-protocol-glance small,
|
||||
.v2-access-protocol-glance strong,
|
||||
.v2-access-protocol-glance .v2-access-time,
|
||||
.v2-access-protocol-missing span { font-size: 11px; }
|
||||
.v2-access-protocol-toggle.semi-button { min-height: 42px; font-size: 11px; }
|
||||
.v2-access-protocol-missing { min-height: 66px; }
|
||||
.v2-access-protocol-missing small { font-size: 10px; }
|
||||
.v2-access-protocol-descriptions .semi-descriptions-item { min-height: 34px; }
|
||||
.v2-access-protocol-descriptions .semi-descriptions-key,
|
||||
.v2-access-protocol-descriptions .semi-descriptions-value,
|
||||
|
||||
Reference in New Issue
Block a user