153 lines
3.3 KiB
SCSS
153 lines
3.3 KiB
SCSS
@import 'mixins_and_variables_and_functions';
|
|
|
|
.incident-management-list {
|
|
.new-alert {
|
|
background-color: var(--green-50, $green-50);
|
|
}
|
|
|
|
// these styles need to be deleted once GlTable component looks in GitLab same as in @gitlab/ui
|
|
table {
|
|
color: var(--gray-500, $gray-500);
|
|
|
|
tbody {
|
|
tr:not(.b-table-busy-slot):not(.b-table-empty-row) {
|
|
&:hover {
|
|
@include gl-border-t-double;
|
|
|
|
td {
|
|
@include gl-border-b-initial;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
tr {
|
|
&:focus {
|
|
@include gl-outline-none;
|
|
}
|
|
|
|
td,
|
|
th {
|
|
@include gl-py-5;
|
|
@include gl-outline-none;
|
|
@include gl-relative;
|
|
}
|
|
|
|
th {
|
|
@include gl-bg-transparent;
|
|
@include gl-font-weight-bold;
|
|
color: var(--gray-400, $gray-400);
|
|
|
|
|
|
&[aria-sort='none']:hover {
|
|
background-image: url('data:image/svg+xml, %3csvg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="4 0 8 16"%3e %3cpath style="fill: %23BABABA;" fill-rule="evenodd" d="M11.707085,11.7071 L7.999975,15.4142 L4.292875,11.7071 C3.902375,11.3166 3.902375, 10.6834 4.292875,10.2929 C4.683375,9.90237 5.316575,9.90237 5.707075,10.2929 L6.999975, 11.5858 L6.999975,2 C6.999975,1.44771 7.447695,1 7.999975,1 C8.552255,1 8.999975,1.44771 8.999975,2 L8.999975,11.5858 L10.292865,10.2929 C10.683395 ,9.90237 11.316555,9.90237 11.707085,10.2929 C12.097605,10.6834 12.097605,11.3166 11.707085,11.7071 Z"/%3e %3c/svg%3e');
|
|
}
|
|
}
|
|
}
|
|
|
|
@include media-breakpoint-up(md) {
|
|
tr {
|
|
&:last-child {
|
|
td {
|
|
@include gl-border-0;
|
|
}
|
|
}
|
|
}
|
|
|
|
.sortable-cell {
|
|
padding-left: calc(0.75rem + 0.65em);
|
|
}
|
|
}
|
|
}
|
|
|
|
@include media-breakpoint-down(sm) {
|
|
table {
|
|
tr {
|
|
@include gl-border-t-0;
|
|
|
|
.table-col {
|
|
min-height: 68px;
|
|
}
|
|
|
|
&:hover {
|
|
background-color: var(--white, $white);
|
|
@include gl-border-none;
|
|
}
|
|
|
|
th,
|
|
td {
|
|
@include gl-pt-6;
|
|
}
|
|
}
|
|
|
|
&.alert-management-table {
|
|
.table-col {
|
|
&:last-child {
|
|
background-color: var(--gray-10, $gray-10);
|
|
|
|
&::before {
|
|
content: none !important;
|
|
}
|
|
|
|
div:not(.dropdown-title) {
|
|
width: 100% !important;
|
|
padding: 0 !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.b-table-empty-row {
|
|
td {
|
|
@include gl-border-b-0;
|
|
|
|
div {
|
|
text-align: unset !important;
|
|
}
|
|
}
|
|
}
|
|
|
|
.b-table-busy-slot {
|
|
td {
|
|
@include gl-border-b-0;
|
|
|
|
div {
|
|
text-align: center !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.gl-tabs-nav {
|
|
@include gl-border-b-0;
|
|
|
|
.gl-tab-nav-item {
|
|
color: var(--gray-500, $gray-500);
|
|
|
|
> .gl-tab-counter-badge {
|
|
@include gl-reset-color;
|
|
@include gl-font-sm;
|
|
background-color: var(--gray-50, $gray-50);
|
|
}
|
|
}
|
|
}
|
|
|
|
@include media-breakpoint-down(xs) {
|
|
.list-header {
|
|
@include gl-flex-direction-column-reverse;
|
|
}
|
|
|
|
.create-incident-button {
|
|
@include gl-w-full;
|
|
}
|
|
}
|
|
|
|
.integration-list {
|
|
.b-table-empty-row {
|
|
td {
|
|
@include gl-px-0;
|
|
}
|
|
}
|
|
}
|
|
}
|