UNPKG

@adobe/coral-spectrum

Version:

Coral Spectrum is a JavaScript library of Web Components following Spectrum design patterns.

1,346 lines (1,332 loc) 91.3 kB
/** * Copyright 2019 Adobe. All rights reserved. * This file is licensed to you under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. You may obtain a copy * of the License at http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software distributed under * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS * OF ANY KIND, either express or implied. See the License for the specific language * governing permissions and limitations under the License. */ .coral-Table { border-collapse: separate; border-spacing: 0; } .coral-Table-sortedIcon { display: none; margin-left: 10px; vertical-align: middle; transition: transform 130ms ease-in-out; } .coral-Table-headerCell { box-sizing: border-box; text-align: left; font-size: 11px; font-weight: 700; line-height: 1.3; min-height: 12px; letter-spacing: 0.06em; text-transform: uppercase; padding: 10px 16px; transition: color 130ms ease-in-out; cursor: default; outline: 0; border-radius: 0px; } .coral-Table-headerCell.is-sortable { cursor: pointer; } .coral-Table-headerCell.is-sorted-asc .coral-Table-sortedIcon, .coral-Table-headerCell.is-sorted-desc .coral-Table-sortedIcon { display: inline-block; margin-top: -2px; } .coral-Table-headerCell.is-sorted-asc .coral-Table-sortedIcon { transform: rotateZ(180deg); } .coral-Table-cell--alignCenter { text-align: center; } .coral-Table-cell--alignRight { text-align: right; } .coral-Table-body.is-drop-target::before, .coral-Table-row.is-drop-target::before { content: ''; position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 1; } .coral-Table-body { position: relative; border-width: 1px; border-radius: 4px; overflow: auto; vertical-align: top; } .coral-Table:not(.coral-Table--quiet) tbody.coral-Table-body { border-width: 1px; border-radius: 4px; } .coral-Table:not(.coral-Table--quiet) tbody.coral-Table-body .coral-Table-row:first-child .coral-Table-cell:first-child { border-top-left-radius: 4px; } .coral-Table:not(.coral-Table--quiet) tbody.coral-Table-body .coral-Table-row:first-child .coral-Table-cell:last-child { border-top-right-radius: 4px; } .coral-Table:not(.coral-Table--quiet) tbody.coral-Table-body .coral-Table-row:last-child .coral-Table-cell:first-child { border-bottom-left-radius: 4px; } .coral-Table:not(.coral-Table--quiet) tbody.coral-Table-body .coral-Table-row:last-child .coral-Table-cell:last-child { border-bottom-right-radius: 4px; } .coral-Table-cell { box-sizing: border-box; font-size: 14px; font-weight: 400; line-height: 1.5; padding: 14px 16px; min-height: 20px; } .coral-Table-cell, .coral-Table-headerCell { position: relative; } .coral-Table-cell.focus-ring, .coral-Table-cell.is-focused, .coral-Table-headerCell.focus-ring, .coral-Table-headerCell.is-focused { outline: none; } .coral-Table-cell.focus-ring::before, .coral-Table-cell.is-focused::before, .coral-Table-headerCell.focus-ring::before, .coral-Table-headerCell.is-focused::before { content: ''; z-index: 1; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border-radius: 3px; } .coral-Table-headerCell.focus-ring::before, .coral-Table-headerCell.is-focused::before { top: 1px; right: 1px; bottom: 1px; left: 1px; } .coral-Table-cell--divider { border-right-width: 1px; } .coral-Table-row { position: relative; cursor: pointer; transition: background-color 130ms ease-in-out; } .coral-Table-row:focus { outline: 0; } .coral-Table > .coral-Table-body > .coral-Table-row:last-of-type { border-bottom-style: none; } .coral-Table--quiet .coral-Table-body { border-radius: 0px; } .coral-Table--quiet .coral-Table-body.is-drop-target::before, .coral-Table--quiet .coral-Table-row.is-drop-target::before { border-radius: 4px; } .coral-Table-checkboxCell { padding-right: 8px; padding-top: 0px; padding-bottom: 0px; vertical-align: middle; } .coral-Table-checkbox { vertical-align: super; } .coral--large .coral-Table-sortedIcon { margin-left: 13px; transition: transform 130ms ease-in-out; } .coral--large .coral-Table-headerCell { font-size: 13px; font-weight: 700; line-height: 1.3; min-height: 15px; letter-spacing: 0.06em; padding: 10px 20px; transition: color 130ms ease-in-out; border-radius: 0px; } .coral--large .coral-Table-headerCell.is-sorted-asc .coral-Table-sortedIcon, .coral--large .coral-Table-headerCell.is-sorted-desc .coral-Table-sortedIcon { margin-top: -2px; } .coral--large .coral-Table-body { border-width: 1px; border-radius: 5px; vertical-align: top; } .coral--large .coral-Table:not(.coral-Table--quiet) tbody.coral-Table-body { border-width: 1px; border-radius: 5px; } .coral--large .coral-Table:not(.coral-Table--quiet) tbody.coral-Table-body .coral-Table-row:first-child .coral-Table-cell:first-child { border-top-left-radius: 5px; } .coral--large .coral-Table:not(.coral-Table--quiet) tbody.coral-Table-body .coral-Table-row:first-child .coral-Table-cell:last-child { border-top-right-radius: 5px; } .coral--large .coral-Table:not(.coral-Table--quiet) tbody.coral-Table-body .coral-Table-row:last-child .coral-Table-cell:first-child { border-bottom-left-radius: 5px; } .coral--large .coral-Table:not(.coral-Table--quiet) tbody.coral-Table-body .coral-Table-row:last-child .coral-Table-cell:last-child { border-bottom-right-radius: 5px; } .coral--large .coral-Table-cell { font-size: 17px; font-weight: 400; line-height: 1.5; padding: 18px 20px; min-height: 24px; } .coral--large .coral-Table-cell.focus-ring::before, .coral--large .coral-Table-cell.is-focused::before, .coral--large .coral-Table-headerCell.focus-ring::before, .coral--large .coral-Table-headerCell.is-focused::before { border-radius: 4px; } .coral--large .coral-Table-headerCell.focus-ring::before, .coral--large .coral-Table-headerCell.is-focused::before { top: 1px; right: 1px; bottom: 1px; left: 1px; } .coral--large .coral-Table-cell--divider { border-right-width: 1px; } .coral--large .coral-Table-row { transition: background-color 130ms ease-in-out; } .coral--large .coral-Table--quiet .coral-Table-body { border-radius: 0px; } .coral--large .coral-Table--quiet .coral-Table-body.is-drop-target::before, .coral--large .coral-Table--quiet .coral-Table-row.is-drop-target::before { border-radius: 5px; } .coral--large .coral-Table-checkboxCell { padding-right: 10px; vertical-align: middle; } .coral--light .coral-Table-headerCell { color: rgb(110, 110, 110); background-color: transparent; } .coral--light .coral-Table-headerCell.is-sortable .coral-Table-sortedIcon { color: rgb(142, 142, 142); } .coral--light .coral-Table-headerCell.is-sortable:hover { color: rgb(44, 44, 44); } .coral--light .coral-Table-headerCell.is-sortable:hover .coral-Table-sortedIcon { color: rgb(44, 44, 44); } .coral--light .coral-Table-headerCell.is-sortable.focus-ring, .coral--light .coral-Table-headerCell.is-sortable.is-focused,.coral--light .coral-Table-headerCell.is-sortable.focus-ring .coral-Table-sortedIcon, .coral--light .coral-Table-headerCell.is-sortable.is-focused .coral-Table-sortedIcon { color: rgb(44, 44, 44); } .coral--light .coral-Table-headerCell.is-sortable:active { color: rgb(44, 44, 44); } .coral--light .coral-Table-headerCell.is-sortable:active .coral-Table-sortedIcon { color: rgb(44, 44, 44); } .coral--light .coral-Table-cell.focus-ring::before, .coral--light .coral-Table-cell.is-focused::before, .coral--light .coral-Table-headerCell.focus-ring::before, .coral--light .coral-Table-headerCell.is-focused::before { box-shadow: inset 0 0 0 2px rgb(38, 128, 235); } .coral--light .coral-Table-body { border-style: solid; border-color: rgb(225, 225, 225); background-color: rgb(255, 255, 255); } .coral--light .coral-Table-body.is-drop-target { border-color: rgb(38, 128, 235); box-shadow: 0 0 0 1px rgb(38, 128, 235); } .coral--light .coral-Table-body.is-drop-target::before { background-color: rgba(20,115,230,0.1); } .coral--light tbody.coral-Table-body { border: none; } .coral--light tbody.coral-Table-body .coral-Table-row { border-top: none; } .coral--light tbody.coral-Table-body .coral-Table-cell { border-top: 1px solid rgb(225, 225, 225); } .coral--light tbody.coral-Table-body .coral-Table-row .coral-Table-cell:first-child { border-left: 1px solid rgb(225, 225, 225); } .coral--light tbody.coral-Table-body .coral-Table-row .coral-Table-cell:last-child { border-right: 1px solid rgb(225, 225, 225); } .coral--light tbody.coral-Table-body .coral-Table-row:last-child .coral-Table-cell { border-bottom: 1px solid rgb(225, 225, 225); } .coral--light .coral-Table-row { border-bottom: 1px solid rgb(225, 225, 225); background-color: transparent; } .coral--light .coral-Table-row:hover { background-color: rgba(44,44,44,0.06); } .coral--light .coral-Table-row.focus-ring, .coral--light .coral-Table-row.is-focused { background-color: rgba(44,44,44,0.06); } .coral--light .coral-Table-row:active { background-color: rgba(44,44,44,0.1); } .coral--light .coral-Table-row.is-selected { background-color: rgba(20,115,230,0.1); } .coral--light .coral-Table-row.is-selected:hover { background-color: rgba(20,115,230,0.2); } .coral--light .coral-Table-row.is-selected.focus-ring, .coral--light .coral-Table-row.is-selected.is-focused { background-color: rgba(20,115,230,0.2); } .coral--light .coral-Table-row.is-drop-target::before { box-shadow: inset 0 0 0 2px rgb(38, 128, 235); background-color: rgba(20,115,230,0.1); } .coral--light .coral-Table-cell { color: rgb(75, 75, 75); background-color: transparent; } .coral--light .coral-Table-cell--divider { border-right-style: solid; border-right-color: rgb(225, 225, 225); } .coral--light .coral-Table--quiet .coral-Table-body { border-width: 1px 0; background-color: transparent; } .coral--light .coral-Table--quiet .coral-Table-body.is-drop-target { box-shadow: none; border-color: transparent; } .coral--light .coral-Table--quiet .coral-Table-body.is-drop-target::before { box-shadow: inset 0 0 0 2px rgb(38, 128, 235); } .coral--light .coral-Table--quiet .coral-Table-row { background-color: transparent; } .coral--light .coral-Table--quiet .coral-Table-row:hover { background-color: rgba(44,44,44,0.06); } .coral--light .coral-Table--quiet .coral-Table-row.focus-ring, .coral--light .coral-Table--quiet .coral-Table-row.is-focused { background-color: rgba(44,44,44,0.06); } .coral--light .coral-Table--quiet .coral-Table-row:active { background-color: rgba(44,44,44,0.1); } .coral--light .coral-Table--quiet .coral-Table-row.is-selected { background-color: rgba(20,115,230,0.1); } .coral--light .coral-Table--quiet .coral-Table-row.is-selected:hover { background-color: rgba(20,115,230,0.2); } .coral--light .coral-Table--quiet .coral-Table-row.is-selected.focus-ring, .coral--light .coral-Table--quiet .coral-Table-row.is-selected.is-focused { background-color: rgba(20,115,230,0.2); } .coral--light .coral-Table--quiet tbody.coral-Table-body .coral-Table-row .coral-Table-cell:first-child, .coral--light .coral-Table--quiet tbody.coral-Table-body .coral-Table-row .coral-Table-cell:last-child { border-left: none; border-right: none; } .coral--lightest .coral-Table-headerCell { color: rgb(116, 116, 116); background-color: transparent; } .coral--lightest .coral-Table-headerCell.is-sortable .coral-Table-sortedIcon { color: rgb(149, 149, 149); } .coral--lightest .coral-Table-headerCell.is-sortable:hover { color: rgb(50, 50, 50); } .coral--lightest .coral-Table-headerCell.is-sortable:hover .coral-Table-sortedIcon { color: rgb(50, 50, 50); } .coral--lightest .coral-Table-headerCell.is-sortable.focus-ring, .coral--lightest .coral-Table-headerCell.is-sortable.is-focused,.coral--lightest .coral-Table-headerCell.is-sortable.focus-ring .coral-Table-sortedIcon, .coral--lightest .coral-Table-headerCell.is-sortable.is-focused .coral-Table-sortedIcon { color: rgb(50, 50, 50); } .coral--lightest .coral-Table-headerCell.is-sortable:active { color: rgb(50, 50, 50); } .coral--lightest .coral-Table-headerCell.is-sortable:active .coral-Table-sortedIcon { color: rgb(50, 50, 50); } .coral--lightest .coral-Table-cell.focus-ring::before, .coral--lightest .coral-Table-cell.is-focused::before, .coral--lightest .coral-Table-headerCell.focus-ring::before, .coral--lightest .coral-Table-headerCell.is-focused::before { box-shadow: inset 0 0 0 2px rgb(55, 142, 240); } .coral--lightest .coral-Table-body { border-style: solid; border-color: rgb(234, 234, 234); background-color: rgb(255, 255, 255); } .coral--lightest .coral-Table-body.is-drop-target { border-color: rgb(55, 142, 240); box-shadow: 0 0 0 1px rgb(55, 142, 240); } .coral--lightest .coral-Table-body.is-drop-target::before { background-color: rgba(38,128,235,0.1); } .coral--lightest tbody.coral-Table-body { border: none; } .coral--lightest tbody.coral-Table-body .coral-Table-row { border-top: none; } .coral--lightest tbody.coral-Table-body .coral-Table-cell { border-top: 1px solid rgb(234, 234, 234); } .coral--lightest tbody.coral-Table-body .coral-Table-row .coral-Table-cell:first-child { border-left: 1px solid rgb(234, 234, 234); } .coral--lightest tbody.coral-Table-body .coral-Table-row .coral-Table-cell:last-child { border-right: 1px solid rgb(234, 234, 234); } .coral--lightest tbody.coral-Table-body .coral-Table-row:last-child .coral-Table-cell { border-bottom: 1px solid rgb(234, 234, 234); } .coral--lightest .coral-Table-row { border-bottom: 1px solid rgb(234, 234, 234); background-color: transparent; } .coral--lightest .coral-Table-row:hover { background-color: rgba(50,50,50,0.06); } .coral--lightest .coral-Table-row.focus-ring, .coral--lightest .coral-Table-row.is-focused { background-color: rgba(50,50,50,0.06); } .coral--lightest .coral-Table-row:active { background-color: rgba(50,50,50,0.1); } .coral--lightest .coral-Table-row.is-selected { background-color: rgba(38,128,235,0.1); } .coral--lightest .coral-Table-row.is-selected:hover { background-color: rgba(38,128,235,0.2); } .coral--lightest .coral-Table-row.is-selected.focus-ring, .coral--lightest .coral-Table-row.is-selected.is-focused { background-color: rgba(38,128,235,0.2); } .coral--lightest .coral-Table-row.is-drop-target::before { box-shadow: inset 0 0 0 2px rgb(55, 142, 240); background-color: rgba(38,128,235,0.1); } .coral--lightest .coral-Table-cell { color: rgb(80, 80, 80); background-color: transparent; } .coral--lightest .coral-Table-cell--divider { border-right-style: solid; border-right-color: rgb(234, 234, 234); } .coral--lightest .coral-Table--quiet .coral-Table-body { border-width: 1px 0; background-color: transparent; } .coral--lightest .coral-Table--quiet .coral-Table-body.is-drop-target { box-shadow: none; border-color: transparent; } .coral--lightest .coral-Table--quiet .coral-Table-body.is-drop-target::before { box-shadow: inset 0 0 0 2px rgb(55, 142, 240); } .coral--lightest .coral-Table--quiet .coral-Table-row { background-color: transparent; } .coral--lightest .coral-Table--quiet .coral-Table-row:hover { background-color: rgba(50,50,50,0.06); } .coral--lightest .coral-Table--quiet .coral-Table-row.focus-ring, .coral--lightest .coral-Table--quiet .coral-Table-row.is-focused { background-color: rgba(50,50,50,0.06); } .coral--lightest .coral-Table--quiet .coral-Table-row:active { background-color: rgba(50,50,50,0.1); } .coral--lightest .coral-Table--quiet .coral-Table-row.is-selected { background-color: rgba(38,128,235,0.1); } .coral--lightest .coral-Table--quiet .coral-Table-row.is-selected:hover { background-color: rgba(38,128,235,0.2); } .coral--lightest .coral-Table--quiet .coral-Table-row.is-selected.focus-ring, .coral--lightest .coral-Table--quiet .coral-Table-row.is-selected.is-focused { background-color: rgba(38,128,235,0.2); } .coral--lightest .coral-Table--quiet tbody.coral-Table-body .coral-Table-row .coral-Table-cell:first-child, .coral--lightest .coral-Table--quiet tbody.coral-Table-body .coral-Table-row .coral-Table-cell:last-child { border-left: none; border-right: none; } .coral--dark .coral-Table-headerCell { color: rgb(185, 185, 185); background-color: transparent; } .coral--dark .coral-Table-headerCell.is-sortable .coral-Table-sortedIcon { color: rgb(144, 144, 144); } .coral--dark .coral-Table-headerCell.is-sortable:hover { color: rgb(255, 255, 255); } .coral--dark .coral-Table-headerCell.is-sortable:hover .coral-Table-sortedIcon { color: rgb(255, 255, 255); } .coral--dark .coral-Table-headerCell.is-sortable.focus-ring, .coral--dark .coral-Table-headerCell.is-sortable.is-focused,.coral--dark .coral-Table-headerCell.is-sortable.focus-ring .coral-Table-sortedIcon, .coral--dark .coral-Table-headerCell.is-sortable.is-focused .coral-Table-sortedIcon { color: rgb(255, 255, 255); } .coral--dark .coral-Table-headerCell.is-sortable:active { color: rgb(255, 255, 255); } .coral--dark .coral-Table-headerCell.is-sortable:active .coral-Table-sortedIcon { color: rgb(255, 255, 255); } .coral--dark .coral-Table-cell.focus-ring::before, .coral--dark .coral-Table-cell.is-focused::before, .coral--dark .coral-Table-headerCell.focus-ring::before, .coral--dark .coral-Table-headerCell.is-focused::before { box-shadow: inset 0 0 0 2px rgb(38, 128, 235); } .coral--dark .coral-Table-body { border-style: solid; border-color: rgb(74, 74, 74); background-color: rgb(37, 37, 37); } .coral--dark .coral-Table-body.is-drop-target { border-color: rgb(38, 128, 235); box-shadow: 0 0 0 1px rgb(38, 128, 235); } .coral--dark .coral-Table-body.is-drop-target::before { background-color: rgba(55,142,240,0.15); } .coral--dark tbody.coral-Table-body { border: none; } .coral--dark tbody.coral-Table-body .coral-Table-row { border-top: none; } .coral--dark tbody.coral-Table-body .coral-Table-cell { border-top: 1px solid rgb(74, 74, 74); } .coral--dark tbody.coral-Table-body .coral-Table-row .coral-Table-cell:first-child { border-left: 1px solid rgb(74, 74, 74); } .coral--dark tbody.coral-Table-body .coral-Table-row .coral-Table-cell:last-child { border-right: 1px solid rgb(74, 74, 74); } .coral--dark tbody.coral-Table-body .coral-Table-row:last-child .coral-Table-cell { border-bottom: 1px solid rgb(74, 74, 74); } .coral--dark .coral-Table-row { border-bottom: 1px solid rgb(74, 74, 74); background-color: transparent; } .coral--dark .coral-Table-row:hover { background-color: rgba(255,255,255,0.07); } .coral--dark .coral-Table-row.focus-ring, .coral--dark .coral-Table-row.is-focused { background-color: rgba(255,255,255,0.07); } .coral--dark .coral-Table-row:active { background-color: rgba(255,255,255,0.1); } .coral--dark .coral-Table-row.is-selected { background-color: rgba(55,142,240,0.15); } .coral--dark .coral-Table-row.is-selected:hover { background-color: rgba(55,142,240,0.25); } .coral--dark .coral-Table-row.is-selected.focus-ring, .coral--dark .coral-Table-row.is-selected.is-focused { background-color: rgba(55,142,240,0.25); } .coral--dark .coral-Table-row.is-drop-target::before { box-shadow: inset 0 0 0 2px rgb(38, 128, 235); background-color: rgba(55,142,240,0.15); } .coral--dark .coral-Table-cell { color: rgb(227, 227, 227); background-color: transparent; } .coral--dark .coral-Table-cell--divider { border-right-style: solid; border-right-color: rgb(74, 74, 74); } .coral--dark .coral-Table--quiet .coral-Table-body { border-width: 1px 0; background-color: transparent; } .coral--dark .coral-Table--quiet .coral-Table-body.is-drop-target { box-shadow: none; border-color: transparent; } .coral--dark .coral-Table--quiet .coral-Table-body.is-drop-target::before { box-shadow: inset 0 0 0 2px rgb(38, 128, 235); } .coral--dark .coral-Table--quiet .coral-Table-row { background-color: transparent; } .coral--dark .coral-Table--quiet .coral-Table-row:hover { background-color: rgba(255,255,255,0.07); } .coral--dark .coral-Table--quiet .coral-Table-row.focus-ring, .coral--dark .coral-Table--quiet .coral-Table-row.is-focused { background-color: rgba(255,255,255,0.07); } .coral--dark .coral-Table--quiet .coral-Table-row:active { background-color: rgba(255,255,255,0.1); } .coral--dark .coral-Table--quiet .coral-Table-row.is-selected { background-color: rgba(55,142,240,0.15); } .coral--dark .coral-Table--quiet .coral-Table-row.is-selected:hover { background-color: rgba(55,142,240,0.25); } .coral--dark .coral-Table--quiet .coral-Table-row.is-selected.focus-ring, .coral--dark .coral-Table--quiet .coral-Table-row.is-selected.is-focused { background-color: rgba(55,142,240,0.25); } .coral--dark .coral-Table--quiet tbody.coral-Table-body .coral-Table-row .coral-Table-cell:first-child, .coral--dark .coral-Table--quiet tbody.coral-Table-body .coral-Table-row .coral-Table-cell:last-child { border-left: none; border-right: none; } .coral--darkest .coral-Table-headerCell { color: rgb(162, 162, 162); background-color: transparent; } .coral--darkest .coral-Table-headerCell.is-sortable .coral-Table-sortedIcon { color: rgb(124, 124, 124); } .coral--darkest .coral-Table-headerCell.is-sortable:hover { color: rgb(239, 239, 239); } .coral--darkest .coral-Table-headerCell.is-sortable:hover .coral-Table-sortedIcon { color: rgb(239, 239, 239); } .coral--darkest .coral-Table-headerCell.is-sortable.focus-ring, .coral--darkest .coral-Table-headerCell.is-sortable.is-focused,.coral--darkest .coral-Table-headerCell.is-sortable.focus-ring .coral-Table-sortedIcon, .coral--darkest .coral-Table-headerCell.is-sortable.is-focused .coral-Table-sortedIcon { color: rgb(239, 239, 239); } .coral--darkest .coral-Table-headerCell.is-sortable:active { color: rgb(239, 239, 239); } .coral--darkest .coral-Table-headerCell.is-sortable:active .coral-Table-sortedIcon { color: rgb(239, 239, 239); } .coral--darkest .coral-Table-cell.focus-ring::before, .coral--darkest .coral-Table-cell.is-focused::before, .coral--darkest .coral-Table-headerCell.focus-ring::before, .coral--darkest .coral-Table-headerCell.is-focused::before { box-shadow: inset 0 0 0 2px rgb(20, 115, 230); } .coral--darkest .coral-Table-body { border-style: solid; border-color: rgb(57, 57, 57); background-color: rgb(8, 8, 8); } .coral--darkest .coral-Table-body.is-drop-target { border-color: rgb(20, 115, 230); box-shadow: 0 0 0 1px rgb(20, 115, 230); } .coral--darkest .coral-Table-body.is-drop-target::before { background-color: rgba(38,128,235,0.2); } .coral--darkest tbody.coral-Table-body { border: none; } .coral--darkest tbody.coral-Table-body .coral-Table-row { border-top: none; } .coral--darkest tbody.coral-Table-body .coral-Table-cell { border-top: 1px solid rgb(57, 57, 57); } .coral--darkest tbody.coral-Table-body .coral-Table-row .coral-Table-cell:first-child { border-left: 1px solid rgb(57, 57, 57); } .coral--darkest tbody.coral-Table-body .coral-Table-row .coral-Table-cell:last-child { border-right: 1px solid rgb(57, 57, 57); } .coral--darkest tbody.coral-Table-body .coral-Table-row:last-child .coral-Table-cell { border-bottom: 1px solid rgb(57, 57, 57); } .coral--darkest .coral-Table-row { border-bottom: 1px solid rgb(57, 57, 57); background-color: transparent; } .coral--darkest .coral-Table-row:hover { background-color: rgba(239,239,239,0.08); } .coral--darkest .coral-Table-row.focus-ring, .coral--darkest .coral-Table-row.is-focused { background-color: rgba(239,239,239,0.08); } .coral--darkest .coral-Table-row:active { background-color: rgba(239,239,239,0.15); } .coral--darkest .coral-Table-row.is-selected { background-color: rgba(38,128,235,0.2); } .coral--darkest .coral-Table-row.is-selected:hover { background-color: rgba(38,128,235,0.3); } .coral--darkest .coral-Table-row.is-selected.focus-ring, .coral--darkest .coral-Table-row.is-selected.is-focused { background-color: rgba(38,128,235,0.3); } .coral--darkest .coral-Table-row.is-drop-target::before { box-shadow: inset 0 0 0 2px rgb(20, 115, 230); background-color: rgba(38,128,235,0.2); } .coral--darkest .coral-Table-cell { color: rgb(200, 200, 200); background-color: transparent; } .coral--darkest .coral-Table-cell--divider { border-right-style: solid; border-right-color: rgb(57, 57, 57); } .coral--darkest .coral-Table--quiet .coral-Table-body { border-width: 1px 0; background-color: transparent; } .coral--darkest .coral-Table--quiet .coral-Table-body.is-drop-target { box-shadow: none; border-color: transparent; } .coral--darkest .coral-Table--quiet .coral-Table-body.is-drop-target::before { box-shadow: inset 0 0 0 2px rgb(20, 115, 230); } .coral--darkest .coral-Table--quiet .coral-Table-row { background-color: transparent; } .coral--darkest .coral-Table--quiet .coral-Table-row:hover { background-color: rgba(239,239,239,0.08); } .coral--darkest .coral-Table--quiet .coral-Table-row.focus-ring, .coral--darkest .coral-Table--quiet .coral-Table-row.is-focused { background-color: rgba(239,239,239,0.08); } .coral--darkest .coral-Table--quiet .coral-Table-row:active { background-color: rgba(239,239,239,0.15); } .coral--darkest .coral-Table--quiet .coral-Table-row.is-selected { background-color: rgba(38,128,235,0.2); } .coral--darkest .coral-Table--quiet .coral-Table-row.is-selected:hover { background-color: rgba(38,128,235,0.3); } .coral--darkest .coral-Table--quiet .coral-Table-row.is-selected.focus-ring, .coral--darkest .coral-Table--quiet .coral-Table-row.is-selected.is-focused { background-color: rgba(38,128,235,0.3); } .coral--darkest .coral-Table--quiet tbody.coral-Table-body .coral-Table-row .coral-Table-cell:first-child, .coral--darkest .coral-Table--quiet tbody.coral-Table-body .coral-Table-row .coral-Table-cell:last-child { border-left: none; border-right: none; } .coral-Table-row { cursor: inherit; } .coral-Table-head .coral-Table-row, .coral-Table-foot .coral-Table-row { background: transparent; } .coral-Table:not(.coral-Table--hover) .coral-Table-row:hover { background-color: inherit; } .coral-Table--hover .coral-Table-body .coral-Table-row { cursor: pointer; } .coral-Table--bordered .coral-Table-body .coral-Table-row .coral-Table-cell { border-right: 1px solid; } /* Base */ table[is="coral-table"] { visibility: hidden; } table[is="coral-table"].is-ready { visibility: visible; } ._coral-Table { border-collapse: separate; border-spacing: 0; width: 100%; } ._coral-Table-headerCell { text-align: left; font-size: 11px; font-weight: 700; line-height: 12px; letter-spacing: 0.06em; text-transform: uppercase; padding: 4px 16px; transition: color 130ms cubic-bezier(.45, 0, .40, 1); height: 26px; } ._coral-Table-cell { font-size: 14px; transition: background-color 130ms cubic-bezier(.45, 0, .40, 1); padding: 4px 16px; height: 48px; box-sizing: border-box; } ._coral-Table-head ._coral-Table-row:not(:first-of-type) ._coral-Table-cell { border-top: 1px solid; } ._coral-Table-head ._coral-Table-row:not(:first-of-type) ._coral-Table-headerCell { border-top: 1px solid; } ._coral-Table-body ._coral-Table-cell { border-top: 1px solid; } ._coral-Table-body ._coral-Table-cell:first-of-type { border-left: 1px solid; } ._coral-Table-body ._coral-Table-cell:last-of-type { border-right: 1px solid; } ._coral-Table-body ._coral-Table-row:first-of-type ._coral-Table-cell { border-top: 1px solid; } ._coral-Table-body ._coral-Table-row:first-of-type ._coral-Table-cell:first-of-type { border-top-left-radius: 4px; } ._coral-Table-body ._coral-Table-row:first-of-type ._coral-Table-cell:last-of-type { border-top-right-radius: 4px; } ._coral-Table-body ._coral-Table-row:last-of-type ._coral-Table-cell { border-bottom: 1px solid; } ._coral-Table-body ._coral-Table-row:last-of-type ._coral-Table-cell:first-of-type { border-bottom-left-radius: 4px; } ._coral-Table-body ._coral-Table-row:last-of-type ._coral-Table-cell:last-of-type { border-bottom-right-radius: 4px; } /* END Base */ /* Template */ ._coral-Table-wrapper { display: block; overflow: hidden; } ._coral-Table-wrapper.is-unselectable { user-select: none; } ._coral-Table-wrapper.is-disabled ._coral-Table-head { pointer-events: none; } ._coral-Table-wrapper.is-disabled ._coral-Table-head ._coral-Table-headerCell,._coral-Table-wrapper.is-disabled ._coral-Table-head ._coral-Table-headerCell coral-table-headercell-content { cursor: auto; user-select: initial; } ._coral-Table-wrapper.is-disabled ._coral-Table-head ._coral-Table-headerCell coral-table-headercell-content:before, ._coral-Table-wrapper.is-disabled ._coral-Table-head ._coral-Table-headerCell coral-table-headercell-content:after { visibility: hidden; } ._coral-Table-wrapper.is-disabled ._coral-Table-wrapper-container { border: none; } ._coral-Table-wrapper-container { overflow: auto; } /* END Template*/ /* #fixedWith */ ._coral-Table-column[fixedwidth] { width: 1px; } ._coral-Table-headerCell[fixedwidth] { white-space: nowrap; } /* END #fixedWidth */ /* #divider */ ._coral-Table-divider--cell._coral-Table-head ._coral-Table-cell:not(:last-of-type) { border-right: 1px solid; } ._coral-Table-divider--cell._coral-Table-head ._coral-Table-headerCell:not(:last-of-type) { border-right: 1px solid; } ._coral-Table-divider--cell._coral-Table-body ._coral-Table-cell:not(:last-of-type) { border-right: 1px solid; } ._coral-Table-divider--column._coral-Table-head ._coral-Table-row:not(:first-of-type) ._coral-Table-cell, ._coral-Table-divider--column._coral-Table-head ._coral-Table-row:not(:first-of-type) ._coral-Table-headerCell { border-top: none; } ._coral-Table-divider--column._coral-Table-head ._coral-Table-cell:not(:last-of-type) { border-right: 1px solid; } ._coral-Table-divider--column._coral-Table-head ._coral-Table-headerCell:not(:last-of-type) { border-right: 1px solid; } ._coral-Table-divider--column._coral-Table-body ._coral-Table-row:not(:first-of-type) ._coral-Table-cell { border-top: none; } ._coral-Table-divider--column._coral-Table-body ._coral-Table-cell:not(:last-of-type) { border-right: 1px solid; } ._coral-Table-divider--none._coral-Table-head ._coral-Table-cell, ._coral-Table-divider--none._coral-Table-head ._coral-Table-headerCell { border-top: none; } ._coral-Table-divider--none._coral-Table-body ._coral-Table-row:not(:first-of-type) ._coral-Table-cell { border-top: none; } /* END #divider */ /* #sticky */ ._coral-Table-wrapper--sticky { position: relative; } ._coral-Table-wrapper--sticky ._coral-Table-wrapper-container { border: 1px solid; border-radius: 4px; } ._coral-Table-wrapper--sticky ._coral-Table { margin-top: -1px; } ._coral-Table-wrapper--sticky ._coral-Table-body ._coral-Table-cell:first-of-type { border-left: none; } ._coral-Table-wrapper--sticky ._coral-Table-body ._coral-Table-cell:last-of-type { border-right: none; } ._coral-Table-wrapper--sticky ._coral-Table-body ._coral-Table-row:first-of-type ._coral-Table-cell { border-radius: 0; border-top: none; } ._coral-Table-wrapper--sticky ._coral-Table-body ._coral-Table-row:last-of-type ._coral-Table-cell { border-radius: 0; border-bottom: none; } ._coral-Table-wrapper--sticky ._coral-Table-head[sticky]._coral-Table-divider--row coral-table-headercell-content { border-top: 1px solid; } ._coral-Table-wrapper--sticky ._coral-Table-head[sticky]._coral-Table-divider--column coral-table-headercell-content { border-right: 1px solid; } ._coral-Table-wrapper--sticky ._coral-Table-head[sticky]._coral-Table-divider--cell coral-table-headercell-content { border-top: 1px solid; border-right: 1px solid; } ._coral-Table-wrapper--sticky ._coral-Table-head[sticky] ._coral-Table-row:first-child coral-table-headercell-content { border-top: none; } ._coral-Table-wrapper--sticky ._coral-Table-head[sticky] ._coral-Table-headerCell { height: 0.5px; line-height: 0; padding-top: 0; padding-bottom: 0; border-top: none; overflow: hidden; } ._coral-Table-wrapper--sticky ._coral-Table-head[sticky] ._coral-Table-headerCell:last-of-type coral-table-headercell-content { border-right: none; } ._coral-Table-wrapper--sticky ._coral-Table-head[sticky] coral-table-headercell-content { display: block; position: absolute; box-sizing: border-box; line-height: 12px; min-height: 34px; padding: 4px 16px; margin-left: -16px; } /* END #sticky */ /* #sortable */ ._coral-Table-headerCell[sortable] { cursor: pointer; user-select: none; } ._coral-Table-headerCell[sortable] coral-table-headercell-content { position: relative; cursor: pointer; } ._coral-Table-headerCell[sortable] coral-table-headercell-content:after { content: ''; background-size: 10px 10px; background-position: 50%; background-repeat: no-repeat; position: absolute; height: 10px; width: 10px; padding-left: 8px; margin-left: 8px; margin-top: 1px; transition: transform 130ms cubic-bezier(.45, 0, .40, 1); } ._coral-Table-headerCell[sortable][sortabledirection="descending"] coral-table-headercell-content:after { transform: rotateZ(180deg); } /* END #sortable */ /* #selectable */ ._coral-Table-wrapper[selectable] ._coral-Table-row[coral-table-rowselect]:not([disabled]):hover ._coral-Table-cell { cursor: pointer; } ._coral-Table-wrapper[selectable] ._coral-Table-row.is-selected[coral-table-rowselect] { cursor: pointer; } ._coral-Table-row[selectable] ._coral-Table-cell[coral-table-cellselect] { cursor: pointer; } ._coral-Table-row[selectable] ._coral-Table-cell[coral-table-cellselect] coral-checkbox { pointer-events: none; } ._coral-Table-cell--check { white-space: nowrap; } ._coral-Table-cell--check coral-checkbox[coral-table-rowselect] { margin-right: 0; } ._coral-Table-cell--check coral-checkbox[coral-table-rowselect] + img { height: 24px; width: 24px; object-fit: cover; vertical-align: middle; margin-top: 4px; margin-left: 8px; } ._coral-Table-cell--check coral-checkbox[coral-table-rowselect] + coral-icon { height: 32px; width: 24px; margin-left: 8px; } table[is="coral-table"]:not([selectable]) td[is="coral-table-cell"] [coral-table-select], table[is="coral-table"]:not([selectable]) th[is="coral-table-headercell"] [coral-table-select], table[is="coral-table"]:not([selectable]) td[is="coral-table-cell"] [coral-table-rowselect], table[is="coral-table"]:not([selectable]) th[is="coral-table-headercell"] [coral-table-rowselect] { display: none; } table[is="coral-table"]:not([selectable]) td[is="coral-table-cell"] [coral-table-rowselect] + img, table[is="coral-table"]:not([selectable]) th[is="coral-table-headercell"] [coral-table-rowselect] + img, table[is="coral-table"]:not([selectable]) td[is="coral-table-cell"] [coral-table-rowselect] + coral-icon, table[is="coral-table"]:not([selectable]) th[is="coral-table-headercell"] [coral-table-rowselect] + coral-icon { margin: 0; } tr[is="coral-table-row"]:not([selectable]) td[is="coral-table-cell"] [coral-table-cellselect], tr[is="coral-table-row"]:not([selectable]) th[is="coral-table-headercell"] [coral-table-cellselect] { display: none; } table[is="coral-table"].is-layouting thead[is="coral-table-head"][sticky] coral-checkbox[coral-table-select] { display: none; } thead[is="coral-table-head"][sticky] coral-checkbox[coral-table-select] { position: relative; top: -4px; } /* END #selectable */ /* #variant */ ._coral-Table-wrapper--quiet ._coral-Table-body ._coral-Table-row:first-of-type ._coral-Table-cell:first-of-type { border-top-left-radius: 0; } ._coral-Table-wrapper--quiet ._coral-Table-body ._coral-Table-row:first-of-type ._coral-Table-cell:last-of-type { border-top-right-radius: 0; } ._coral-Table-wrapper--quiet ._coral-Table-body ._coral-Table-row:last-of-type ._coral-Table-cell:first-of-type { border-bottom-left-radius: 0; } ._coral-Table-wrapper--quiet ._coral-Table-body ._coral-Table-row:last-of-type ._coral-Table-cell:last-of-type { border-bottom-right-radius: 0; } ._coral-Table-wrapper--quiet._coral-Table-wrapper--sticky ._coral-Table-wrapper-container { border-radius: 0; } ._coral-Table-wrapper--quiet._coral-Table-wrapper--sticky ._coral-Table-body ._coral-Table-row:first-of-type ._coral-Table-cell { border-top: none; } ._coral-Table-wrapper--quiet._coral-Table-wrapper--sticky ._coral-Table-body ._coral-Table-row:last-of-type ._coral-Table-cell { border-bottom: none; } /* END #variant */ /* #lockable */ ._coral-Table-wrapper[lockable] ._coral-Table-row [coral-table-rowlock] { visibility: hidden; } ._coral-Table-wrapper[lockable] ._coral-Table-row[locked] ._coral-Table-headerCell [coral-table-rowlock], ._coral-Table-wrapper[lockable] ._coral-Table-row[locked] ._coral-Table-cell [coral-table-rowlock] { visibility: visible; } ._coral-Table-wrapper[lockable] ._coral-Table-row:hover [coral-table-rowlock] { visibility: visible; } ._coral-Table-wrapper[lockable] ._coral-Table-row:hover:not(.is-selected) ._coral-Table-cell { cursor: pointer; } table[is="coral-table"]:not([lockable]) td[is="coral-table-cell"] [coral-table-rowlock], table[is="coral-table"]:not([lockable]) th[is="coral-table-headercell"] [coral-table-rowlock] { display: none; } /* END #lockable */ /* #orderable */ ._coral-Table-headerCell.is-dragging, ._coral-Table-row.is-dragging, ._coral-Table-headerCell.is-before, ._coral-Table-row.is-before, ._coral-Table-headerCell.is-after, ._coral-Table-row.is-after { position: relative; -ms-touch-action: none; touch-action: none; user-select: none; } ._coral-Table-headerCell.is-dragging, ._coral-Table-row.is-dragging { z-index: 10; } ._coral-Table-row.is-dragging ._coral-Table-cell, ._coral-Table-row.is-dragging ._coral-Table-headerCell { border-radius: 0 !important; } ._coral-Table-row--placeholder { visibility: hidden; } ._coral-Table-wrapper.is-draggedFirstItem ._coral-Table-body ._coral-Table-row:nth-of-type(2) ._coral-Table-cell:first-of-type { border-top-left-radius: 4px; } ._coral-Table-wrapper.is-draggedFirstItem ._coral-Table-body ._coral-Table-row:nth-of-type(2) ._coral-Table-cell:last-of-type { border-top-right-radius: 4px; } ._coral-Table-wrapper.is-sorted ._coral-Table-row [coral-table-roworder] { visibility: hidden; } ._coral-Table-wrapper:not(._coral-Table-wrapper--sticky) ._coral-Table-row--placeholder { visibility: visible; } ._coral-Table-wrapper:not(._coral-Table-wrapper--sticky) ._coral-Table-row--placeholder ._coral-Table-cell, ._coral-Table-wrapper:not(._coral-Table-wrapper--sticky) ._coral-Table-row--placeholder ._coral-Table-headerCell { text-indent: -1000px; } ._coral-Table-wrapper:not(._coral-Table-wrapper--sticky).is-draggedLastItem ._coral-Table-body ._coral-Table-row:nth-last-of-type(2) ._coral-Table-cell { border-bottom: 1px solid; } ._coral-Table-wrapper:not(._coral-Table-wrapper--sticky).is-draggedLastItem ._coral-Table-body ._coral-Table-row:nth-last-of-type(2) ._coral-Table-cell:first-of-type { border-bottom-left-radius: 4px; } ._coral-Table-wrapper:not(._coral-Table-wrapper--sticky).is-draggedLastItem ._coral-Table-body ._coral-Table-row:nth-last-of-type(2) ._coral-Table-cell:last-of-type { border-bottom-right-radius: 4px; } ._coral-Table-wrapper--sticky ._coral-Table-headerCell[orderable] { position: static; } ._coral-Table-wrapper--sticky.is-draggedFirstItem ._coral-Table-body ._coral-Table-row:nth-of-type(2) ._coral-Table-cell { border-top: none; } [coral-table-roworder]:not(:disabled):not(.is-disabled) { cursor: move; cursor: -webkit-grab; cursor: grab; -ms-touch-action: none; touch-action: none; user-select: none; } [coral-table-roworder]:not(:disabled):not(.is-disabled):active { cursor: move !important; cursor: -webkit-grabbing !important; cursor: grabbing !important; } ._coral-Table-headerCell[orderable] { position: relative; } ._coral-Table-headerCell[orderable] coral-table-headercell-content { position: relative; } ._coral-Table-headerCell[orderable] coral-table-headercell-content:before { content: ''; background-size: 12px 12px; background-position: 50% 50%; background-repeat: no-repeat; position: absolute; height: 100%; width: 12px; margin-left: -12px; top: 0; cursor: move; cursor: -webkit-grab; cursor: grab; } ._coral-Table-headerCell[orderable].is-dragging coral-table-headercell-content:before, ._coral-Table-headerCell[orderable] coral-table-headercell-content.is-dragging:before { cursor: move !important; cursor: -webkit-grabbing !important; cursor: grabbing !important; } table[is="coral-table"]:not([orderable]) td[is="coral-table-cell"] [coral-table-roworder], table[is="coral-table"]:not([orderable]) th[is="coral-table-headercell"] [coral-table-roworder] { display: none; } /* END #orderable */ /* #a11y */ ._coral-Table-headerCell:focus, ._coral-Table-headerCell.is-focused, ._coral-Table-headerCell coral-table-headercell-content:focus, ._coral-Table-headerCell coral-table-headercell-content.is-focused { outline: none; } ._coral-Table-row:focus, ._coral-Table-row.is-focused { outline: none; } ._coral-Table-row:focus ._coral-Table-cell:first-of-type, ._coral-Table-row.is-focused ._coral-Table-cell:first-of-type { position: relative; } ._coral-Table-row:focus ._coral-Table-cell:first-of-type:after { content: ""; position: absolute; top: 0; right: 0; left: 0; height: 100%; width: 100%; border-left: 2px solid; box-sizing: border-box; } ._coral-Table-row.is-focused ._coral-Table-cell:first-of-type:after { content: ""; position: absolute; top: 0; right: 0; left: 0; height: 100%; width: 100%; border-left: 2px solid; box-sizing: border-box; } /* END #a11y */ .coral--large ._coral-Table-headerCell { font-size: 13px; } .coral--large ._coral-Table-cell { font-size: 17px; } .coral--light .coral-Table--hover .coral-Table-head .coral-Table-row:hover { background-color: transparent; } .coral--light .coral-Table--bordered .coral-Table-body .coral-Table-row .coral-Table-cell { border-right-color: rgb(225, 225, 225); } .coral--light ._coral-Table-headerCell { color: rgb(110, 110, 110); } .coral--light ._coral-Table-cell { background-color: rgb(255, 255, 255); color: rgb(34, 34, 34); } .coral--light ._coral-Table-head ._coral-Table-row:not(:first-of-type) ._coral-Table-cell { border-top-color: rgb(225, 225, 225); } .coral--light ._coral-Table-head ._coral-Table-row:not(:first-of-type) ._coral-Table-headerCell { border-top-color: rgb(225, 225, 225); } .coral--light ._coral-Table-body ._coral-Table-cell { border-top-color: rgb(225, 225, 225); } .coral--light ._coral-Table-body ._coral-Table-cell:first-of-type { border-left-color: rgb(225, 225, 225); } .coral--light ._coral-Table-body ._coral-Table-cell:last-of-type { border-right-color: rgb(225, 225, 225); } .coral--light ._coral-Table-body ._coral-Table-row:first-of-type ._coral-Table-cell { border-top-color: rgb(225, 225, 225); } .coral--light ._coral-Table-body ._coral-Table-row:last-of-type ._coral-Table-cell { border-bottom-color: rgb(225, 225, 225); } .coral--light ._coral-Table-divider--cell._coral-Table-head ._coral-Table-cell:not(:last-of-type) { border-right-color: rgb(225, 225, 225); } .coral--light ._coral-Table-divider--cell._coral-Table-head ._coral-Table-headerCell:not(:last-of-type) { border-right-color: rgb(225, 225, 225); } .coral--light ._coral-Table-divider--cell._coral-Table-body ._coral-Table-cell:not(:last-of-type) { border-right-color: rgb(225, 225, 225); } .coral--light ._coral-Table-divider--column._coral-Table-head ._coral-Table-cell:not(:last-of-type) { border-right-color: rgb(225, 225, 225); } .coral--light ._coral-Table-divider--column._coral-Table-head ._coral-Table-headerCell:not(:last-of-type) { border-right-color: rgb(225, 225, 225); } .coral--light ._coral-Table-divider--column._coral-Table-body ._coral-Table-cell:not(:last-of-type) { border-right-color: rgb(225, 225, 225); } .coral--light ._coral-Table-wrapper--sticky ._coral-Table-wrapper-container { border-color: rgb(225, 225, 225); } .coral--light ._coral-Table-wrapper--sticky ._coral-Table-head[sticky] ._coral-Table-row:last-of-type ._coral-Table-headerCell { border-top: none; } .coral--light ._coral-Table-wrapper--sticky ._coral-Table-head[sticky]._coral-Table-divider--row coral-table-headercell-content { border-top-color: rgb(225, 225, 225); } .coral--light ._coral-Table-wrapper--sticky ._coral-Table-head[sticky]._coral-Table-divider--column coral-table-headercell-content { border-right-color: rgb(225, 225, 225); } .coral--light ._coral-Table-wrapper--sticky ._coral-Table-head[sticky]._coral-Table-divider--cell coral-table-headercell-content { border-top-color: rgb(225, 225, 225); border-right-color: rgb(225, 225, 225); } .coral--light ._coral-Table-wrapper--quiet ._coral-Table-cell { background: transparent; } .coral--light ._coral-Table-wrapper--quiet ._coral-Table-body ._coral-Table-cell:first-of-type { border-left-color: transparent; } .coral--light ._coral-Table-wrapper--quiet ._coral-Table-body ._coral-Table-cell:last-of-type { border-right-color: transparent; } .coral--light ._coral-Table-wrapper--quiet._coral-Table-wrapper--sticky ._coral-Table-wrapper-container { border-left-color: transparent; border-right-color: transparent; } .coral--light ._coral-Table-wrapper--quiet ._coral-Table-row[selectable] ._coral-Table-cell[coral-table-cellselect]:hover { background-color: rgba(44,44,44,0.06); } .coral--light ._coral-Table-wrapper--quiet._coral-Table-wrapper[lockable] ._coral-Table-row:hover:not(.is-selected) ._coral-Table-cell { background-color: rgba(44,44,44,0.06); } .coral--light ._coral-Table-headerCell[sortable]:hover { color: rgb(37, 37, 37); } .coral--light ._coral-Table-headerCell[sortable][sortabledirection="default"]:hover coral-table-headercell-content:after { background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 10'%3E%3Cstyle%3Epath %7B fill: %236e6e6e%3B %7D%3C/style%3E%3Cpath d='M8,4.00848a.99994.99994,0,0,1-1.707.70709L5,3.42267V9.00055A.99948.99948,0,0,1,4.00049,10h-.001A.99948.99948,0,0,1,3,9.00055V3.42267L1.707,4.71558A.99994.99994,0,1,1,.293,3.30139L3.251.34326c.01379-.0155.01855-.03552.03345-.05035A.997.997,0,0,1,3.99146,0l.00415.00079L3.99951,0h.001l.00391.00079L4.00854,0a.997.997,0,0,1,.707.29291c.01489.01483.01965.03485.03345.05035L7.707,3.30139A.99669.99669,0,0,1,8,4.00848Z'/%3E%3C/svg%3E"); } .coral--light ._coral-Table-headerCell[sortable][sortabledirection="ascending"] coral-table-headercell-content:after { background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 10'%3E%3Cstyle%3Epath %7B fill: %236e6e6e%3B %7D%3C/style%3E%3Cpath d='M8,4.00848a.99994.99994,0,0,1-1.707.70709L5,3.42267V9.00055A.99948.99948,0,0,1,4.00049,10h-.001A.99948.99948,0,0,1,3,9.00055V3.42267L1.707,4.71558A.99994.99994,0,1,1,.293,3.30139L3.251.34326c.01379-.0155.01855-.03552.03345-.05035A.997.997,0,0,1,3.99146,0l.00415.00079L3.99951,0h.001l.00391.00079L4.00854,0a.997.997,0,0,1,.707.29291c.01489.01483.01965.03485.03345.05035L7.707,3.30139A.99669.99669,0,0,1,8,4.00848Z'/%3E%3C/svg%3E"); } .coral--light ._coral-Table-headerCell[sortable][sortabledirection="ascending"]:hover coral-table-headercell-content:after { background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 10'%3E%3Cstyle%3Epath %7B fill: %232c2c2c%3B %7D%3C/style%3E%3Cpath d='M8,4.00848a.99994.99994,0,0,1-1.707.70709L5,3.42267V9.00055A.99948.99948,0,0,1,4.00049,10h-.001A.99948.99948,0,0,1,3,9.00055V3.42267L1.707,4.71558A.99994.99994,0,1,1,.293,3.30139L3.251.34326c.01379-.0155.01855-.03552.03345-.05035A.997.997,0,0,1,3.99146,0l.00415.00079L3.99951,0h.001l.00391.00079L4.00854,0a.997.997,0,0,1,.707.29291c.01489.01483.01965.03485.03345.05035L7.707,3.30139A.99669.99669,0,0,1,8,4.00848Z'/%3E%3C/svg%3E"); } .coral--light ._coral-Table-headerCell[sortable][sortabledirection="descending"] coral-table-headercell-content:after { background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 10'%3E%3Cstyle%3Epath %7B fill: %236e6e6e%3B %7D%3C/style%3E%3Cpath d='M8,4.00848a.99994.99994,0,0,1-1.707.70709L5,3.42267V9.00055A.99948.99948,0,0,1,4.00049,10h-.001A.99948.99948,0,0,1,3,9.00055V3.42267L1.707,4.71558A.99994.99994,0,1,1,.293,3.30139L3.251.34326c.01379-.0155.01855-.03552.03345-.05035A.997.997,0,0,1,3.99146,0l.00415.