feat: refine api key permissions and admin routes
This commit is contained in:
@@ -285,6 +285,11 @@
|
||||
gap: 14px;
|
||||
}
|
||||
|
||||
.accessEditorStack {
|
||||
display: grid;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.accessPermissionPanel .shCardContent {
|
||||
display: grid;
|
||||
gap: 12px;
|
||||
@@ -388,6 +393,95 @@
|
||||
min-width: 900px;
|
||||
}
|
||||
|
||||
.apiKeyTable {
|
||||
border: 1px solid var(--border-subtle);
|
||||
border-radius: var(--radius-md);
|
||||
background: var(--surface);
|
||||
}
|
||||
|
||||
.apiKeyTable .shTableRow {
|
||||
grid-template-columns: minmax(170px, 1.05fr) minmax(210px, 1.25fr) minmax(150px, 0.9fr) minmax(150px, 0.9fr) minmax(150px, 0.9fr) minmax(96px, 0.55fr) minmax(150px, 0.9fr) minmax(74px, 0.4fr);
|
||||
min-width: 1160px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.apiKeyNameCell,
|
||||
.apiKeySecretCell {
|
||||
display: grid;
|
||||
min-width: 0;
|
||||
gap: 3px;
|
||||
}
|
||||
|
||||
.apiKeyNameCell strong,
|
||||
.apiKeyNameCell small,
|
||||
.apiKeySecretCell code {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.apiKeyNameCell strong {
|
||||
color: var(--text-strong);
|
||||
font-size: var(--font-size-sm);
|
||||
font-weight: var(--font-weight-semibold);
|
||||
}
|
||||
|
||||
.apiKeyNameCell small {
|
||||
color: var(--text-soft);
|
||||
font-size: var(--font-size-xs);
|
||||
}
|
||||
|
||||
.apiKeySecretCell {
|
||||
grid-template-columns: minmax(0, 1fr) 30px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.apiKeySecretCell code {
|
||||
min-width: 0;
|
||||
color: var(--text-normal);
|
||||
font-family: var(--font-mono);
|
||||
font-size: var(--font-size-xs);
|
||||
}
|
||||
|
||||
.apiKeyPolicyButton {
|
||||
display: inline-flex;
|
||||
max-width: 100%;
|
||||
min-height: 30px;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
padding: 0 9px;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: var(--control-radius);
|
||||
background: var(--surface);
|
||||
color: var(--text-normal);
|
||||
font-size: var(--font-size-xs);
|
||||
font-weight: var(--font-weight-medium);
|
||||
}
|
||||
|
||||
.apiKeyPolicyButton span {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.apiKeyCreateDialogBody {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.apiKeyPolicyDialog {
|
||||
width: min(1120px, 100%);
|
||||
}
|
||||
|
||||
.apiKeyPolicyDialogBody {
|
||||
grid-template-columns: 1fr;
|
||||
background: var(--surface-subtle);
|
||||
}
|
||||
|
||||
.apiKeyPolicyDialog .accessTreeBox {
|
||||
min-height: 360px;
|
||||
max-height: min(480px, calc(100vh - 360px));
|
||||
}
|
||||
|
||||
.tenantTable .shTableRow {
|
||||
grid-template-columns: minmax(210px, 1.35fr) minmax(110px, 0.7fr) minmax(150px, 0.9fr) minmax(110px, 0.7fr) minmax(90px, 0.55fr) minmax(86px, 0.5fr);
|
||||
min-width: 880px;
|
||||
@@ -1314,7 +1408,9 @@
|
||||
.runtimePolicyFormBody,
|
||||
.runtimePolicyRows,
|
||||
.accessPermissionGrid,
|
||||
.accessTreeToolbar {
|
||||
.accessTreeToolbar,
|
||||
.apiKeyCreateDialogBody,
|
||||
.apiKeyPolicyDialogBody {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
|
||||
@@ -346,6 +346,16 @@
|
||||
box-shadow: 0 -1px 0 rgba(16, 24, 40, 0.02);
|
||||
}
|
||||
|
||||
.shPopoverContent {
|
||||
z-index: 80;
|
||||
overflow: hidden;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: var(--radius-lg);
|
||||
background: var(--popover);
|
||||
color: var(--popover-foreground);
|
||||
box-shadow: var(--shadow-dialog);
|
||||
}
|
||||
|
||||
.shInput,
|
||||
.shTextarea {
|
||||
width: 100%;
|
||||
@@ -517,6 +527,150 @@
|
||||
.shBadgeWarning { background: #fbf4e8; color: #8a6116; }
|
||||
.shBadgeDestructive { background: #fff3f3; color: #b42318; }
|
||||
|
||||
.shCalendar {
|
||||
padding: 10px;
|
||||
background: var(--surface);
|
||||
}
|
||||
|
||||
.shCalendarRoot,
|
||||
.shCalendarMonths,
|
||||
.shCalendarMonth,
|
||||
.shCalendarWeeks {
|
||||
display: grid;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.shCalendarCaption {
|
||||
position: relative;
|
||||
display: flex;
|
||||
min-height: 32px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.shCalendarCaptionLabel {
|
||||
color: var(--text-strong);
|
||||
font-size: var(--font-size-sm);
|
||||
font-weight: var(--font-weight-semibold);
|
||||
}
|
||||
|
||||
.shCalendarNav {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.shCalendarNavButton {
|
||||
display: grid;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
place-items: center;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: var(--control-radius);
|
||||
background: var(--surface);
|
||||
color: var(--text-normal);
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
.shCalendarNavButton:hover {
|
||||
background: var(--accent);
|
||||
}
|
||||
|
||||
.shCalendarChevronIcon {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.shCalendarGrid {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
.shCalendarWeekdays,
|
||||
.shCalendarWeek {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(7, 32px);
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.shCalendarWeekday {
|
||||
display: grid;
|
||||
height: 26px;
|
||||
place-items: center;
|
||||
color: var(--text-soft);
|
||||
font-size: var(--font-size-xs);
|
||||
font-weight: var(--font-weight-medium);
|
||||
}
|
||||
|
||||
.shCalendarDay {
|
||||
display: grid;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
place-items: center;
|
||||
}
|
||||
|
||||
.shCalendarDayButton {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
border: 0;
|
||||
border-radius: var(--control-radius);
|
||||
background: transparent;
|
||||
color: var(--text-normal);
|
||||
font-size: var(--font-size-sm);
|
||||
}
|
||||
|
||||
.shCalendarDayButton:hover {
|
||||
background: var(--accent);
|
||||
}
|
||||
|
||||
.shCalendarDayOutside .shCalendarDayButton {
|
||||
color: var(--text-faint);
|
||||
}
|
||||
|
||||
.shCalendarDayDisabled .shCalendarDayButton {
|
||||
cursor: not-allowed;
|
||||
color: var(--text-faint);
|
||||
opacity: 0.45;
|
||||
}
|
||||
|
||||
.shCalendarDayToday .shCalendarDayButton {
|
||||
border: 1px solid var(--ring);
|
||||
}
|
||||
|
||||
.shCalendarDaySelected .shCalendarDayButton {
|
||||
background: var(--primary);
|
||||
color: var(--primary-foreground);
|
||||
}
|
||||
|
||||
.shCalendarDayHidden {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.dateTimePickerTrigger {
|
||||
width: 100%;
|
||||
justify-content: flex-start;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.dateTimePickerTrigger[data-empty="true"] {
|
||||
color: var(--text-soft);
|
||||
}
|
||||
|
||||
.dateTimePickerPopover {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.dateTimePickerFooter {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr) 34px;
|
||||
gap: 10px;
|
||||
align-items: end;
|
||||
padding: 10px;
|
||||
border-top: 1px solid var(--border);
|
||||
background: var(--surface);
|
||||
}
|
||||
|
||||
.shTable {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user