Files
notifications-admin/app/assets/stylesheets/components/fullscreen-table.scss

147 lines
2.3 KiB
SCSS

.fullscreen {
&-content {
background: $white;
z-index: 10;
overflow-y: hidden;
box-sizing: border-box;
margin: 0 0 $gutter 0;
padding: 0 0 0 0;
overflow: hidden;
border-bottom: 1px solid $border-colour;
.table {
margin-bottom: 0;
tr:last-child {
td {
border-bottom: 1px solid $white;
}
}
}
th,
.table-field-error-label,
.table-field-center-aligned {
white-space: nowrap;
}
}
&-right-shadow {
position: absolute;
top: 0;
right: 0;
width: 4px;
height: 100%;
z-index: 200;
&.visible {
&.with-transition {
transition: box-shadow 0.6s ease-out;
}
box-shadow: inset -1px 0 0 0 $border-colour, inset -3px 0 0 0 rgba($border-colour, 0.2);
}
}
&-scrollable-table {
overflow-x: auto;
overflow-y: hidden;
.table-field-heading-first,
.table-field-index {
display: none;
}
.table-field-center-aligned {
position: relative;
z-index: 150;
background: $white;
}
&::-webkit-scrollbar {
-webkit-appearance: none;
}
&::-webkit-scrollbar:horizontal {
height: 11px;
background-color: $white;
}
&::-webkit-scrollbar-thumb {
border-radius: 8px;
border: 2px solid $white;
background-color: rgba(0, 0, 0, .5);
}
&::-webkit-scrollbar-track {
background-color: $white;
border-radius: 8px;
}
}
&-fixed-table {
position: absolute;
top: 0;
overflow: hidden;
.table-field-heading {
visibility: hidden;
}
.table-field-center-aligned {
width: 0;
position: relative;
z-index: 100;
visibility: hidden;
}
.table-field-heading-first,
.table-field-index {
transition: none;
position: relative;
z-index: 200;
background: $white;
}
}
&-scrolled-table {
padding-bottom: 20px;
.table-field-heading-first,
.table-field-index {
transition: box-shadow 0.3s ease-in-out;
box-shadow: 1px 0 0 0 $border-colour, 3px 0 0 0 rgba($border-colour, 0.2);
}
}
&-shim {
width: 100%;
position: relative;
z-index: 9;
margin-bottom: 30px;
pointer-events: none;
& + .table-show-more-link {
margin-top: -28px;
}
}
}