• Home
• com.github.gwtmaterialdesign
• gwt-material-themes
• 2.8.3
• source code
• datatable.dark.css

×

Project download

Many resources are needed to download a project. Please understand that we have to compensate our server costs. Thank you in advance.
Project price only 1 $

You can buy this project and download/modify it how often you want.

gwt.material.design.themes.dark.css.datatable.dark.css Maven / Gradle / Ivy

/** Dark Mode **/
section.table-container .top-panel,
.table-container, .table-body,
table.table thead tr th,
table.table tfoot {
  background-color: #424242;
  border-top: 2px solid #4a4a4a;
  color: #ffffff; }

table.table tbody td {
  color: #ffffff; }

table.table tbody tr.data-row:hover {
  background-color: rgba(255, 255, 255, 0.2);
  color: #ffffff; }

table.table tbody tr.data-row td.hover {
  background-color: rgba(255, 255, 255, 0.2);
  color: #ffffff; }

table.table tbody tr.data-row:hover {
  background-color: rgba(255, 255, 255, 0.2); }

.table-container .top-panel {
  border-bottom: 2px solid #4a4a4a; }

table.table thead {
  border-bottom: 1px solid #4a4a4a !important; }

table.table tbody tr.data-row {
  border-bottom: 1px solid #4a4a4a; }

table.table tbody tr.selected,
table.table tbody tr.selected td {
  background-color: rgba(255, 255, 255, 0.04) !important; }

table.striped > tbody > tr:nth-child(odd) {
  background-color: #4a4a4a; }

table.table tbody tr.subheader {
  background-color: #424242;
  border-bottom: 1px solid #525252;
  color: #ffffff; }

table.table tbody > div {
  background: transparent !important; }

table.table thead tr th.sortable:hover,
table.table thead tr th,
table.table thead th.selected {
  color: rgba(255, 255, 255, 0.52); }

table.table tbody tr.expansion td div .content {
  background-color: #4a4a4a; }

table.table tbody tr.expansion td div.expanded {
  border-bottom: none; }

/** Frozen **/
table.striped > tbody > tr:nth-child(odd) td.frozen-col {
  background-color: #4a4a4a !important; }

table tr td.frozen-col {
  border-bottom: 1px solid #4a4a4a !important; }

table tr.selected td.frozen-col {
  background: #4f4f4f !important; }

.inner-shadow {
  -moz-box-shadow: inset 18px 0 20px -20px #272727;
  -webkit-box-shadow: inset 18px 0 20px -20px #272727;
  box-shadow: inset 18px 0 20px -20px #272727; }

table tr.stickyExclude {
  height: 2px;
  background-color: transparent !important; }

/** Data Pager **/
.data-pager .input-field .select-wrapper input.select-dropdown,
.data-pager .num-page-panel .input-field input[type=number] {
  color: #ffffff;
  border-bottom: 1px solid #818181; }

.table-container .data-pager {
  border: none; }

.data-pager .action-page-panel i.disabled {
  background: #424242 !important;
  color: rgba(153, 153, 153, 0.2) !important; }

.data-pager .action-page-panel i {
  color: rgba(255, 255, 255, 0.6); }

.data-pager .action-page-panel i:hover {
  color: white; }

@media only screen and (max-width: 520px), (max-device-width: 519px) and (min-device-width: 0px) {
  table.table tbody {
    background: #292929; }
  .selection-none table.table tbody tr.data-row, table.table tbody tr.data-row {
    background: #424242; }
  table.table tbody td {
    border-top: 1px solid #4a4a4a; }
  table.table .cell {
    color: #ffffff; }
  tr.data-row td:before {
    color: rgba(255, 255, 255, 0.52); }
  table.table tbody tr.data-row.selected,
  .selection-none table.table tbody tr.data-row, table.table tbody tr.data-row,
  table.table tbody tr.data-row:hover, table.table tbody tr.selected td, table.table tbody tr.selected td.hover {
    background-color: rgba(255, 255, 255, 0.04) !important; }
  tbody tr td#colex #expand {
    background: #292929; }
  table.table tbody tr.data-row #col0:not([data-title]) {
    background: #414141; } }

/** Focusable Datatable **/
table.table tbody tr.subheader.focus-visible,
table.table tbody tr.data-row.focus-visible {
  background-color: rgba(255, 255, 255, 0.2) !important; }

table.table thead tr th.sortable.focus-visible {
  color: rgba(255, 255, 255, 0.87); }

table.table tr.loading-row .content-placeholder {
  background: -webkit-gradient(linear, left top, right top, color-stop(8%, #454545), color-stop(18%, #555555), color-stop(33%, #444444));
  background: -webkit-linear-gradient(left, #454545 8%, #555555 18%, #444444 33%);
  background: linear-gradient(to right, #454545 8%, #555555 18%, #444444 33%); }

/** Dark Mode **/
section.table-container .top-panel,
.table-container, .table-body,
table.table thead tr th,
table.table tfoot {
  background-color: #424242;
  border-top: 1px solid #4a4a4a;
  color: #ffffff; }

table.table tbody td {
  color: #ffffff; }

table.table tbody tr.data-row:hover {
  background-color: rgba(255, 255, 255, 0.2);
  color: #ffffff; }

table.table tbody tr.data-row td.hover {
  background-color: rgba(255, 255, 255, 0.2);
  color: #ffffff; }

table.table tbody tr.data-row:hover {
  background-color: rgba(255, 255, 255, 0.2); }

.table-container .top-panel {
  border-bottom: 2px solid #4a4a4a; }

table.table thead {
  border-bottom: 1px solid #4a4a4a !important; }

table.table tbody tr.data-row {
  border-bottom: 1px solid #4a4a4a; }

table.table tbody tr.selected,
table.table tbody tr.selected td {
  background-color: rgba(255, 255, 255, 0.04) !important; }

table.striped > tbody > tr:nth-child(odd) {
  background-color: #4a4a4a; }

table.table tbody tr.subheader {
  background-color: #424242;
  border-bottom: 1px solid #525252;
  color: #ffffff; }

table.table tbody > div {
  background: transparent !important; }

table.table thead tr th.sortable:hover,
table.table thead tr th,
table.table thead th.selected {
  color: rgba(255, 255, 255, 0.52); }

table.table tbody tr.expansion td div .content {
  background-color: #4a4a4a; }

table.table tbody tr.expansion td div.expanded {
  border-bottom: none; }

/** Frozen **/
table.striped > tbody > tr:nth-child(odd) td.frozen-col {
  background-color: #4a4a4a !important; }

table tr td.frozen-col {
  border-bottom: 1px solid #4a4a4a !important; }

table tr.selected td.frozen-col {
  background: #4f4f4f !important; }

.inner-shadow {
  -moz-box-shadow: inset 18px 0 20px -20px #272727;
  -webkit-box-shadow: inset 18px 0 20px -20px #272727;
  box-shadow: inset 18px 0 20px -20px #272727; }

table tr.stickyExclude {
  height: 2px;
  background-color: transparent !important; }

/** Data Pager **/
.data-pager .input-field .select-wrapper input.select-dropdown,
.data-pager .num-page-panel .input-field input[type=number] {
  color: #ffffff;
  border-bottom: 1px solid #818181; }

.table-container .data-pager {
  border: none; }

.data-pager .action-page-panel i.disabled {
  background: #424242 !important;
  color: rgba(153, 153, 153, 0.2) !important; }

.data-pager .action-page-panel i {
  color: rgba(255, 255, 255, 0.6); }

.data-pager .action-page-panel i:hover {
  color: white; }

@media only screen and (max-width: 520px), (max-device-width: 519px) and (min-device-width: 0px) {
  table.table tbody {
    background: #292929; }
  .selection-none table.table tbody tr.data-row, table.table tbody tr.data-row {
    background: #424242; }
  table.table tbody td {
    border-top: 1px solid #4a4a4a; }
  table.table .cell {
    color: #ffffff; }
  tr.data-row td:before {
    color: rgba(255, 255, 255, 0.52); }
  table.table tbody tr.data-row.selected,
  .selection-none table.table tbody tr.data-row, table.table tbody tr.data-row,
  table.table tbody tr.data-row:hover, table.table tbody tr.selected td, table.table tbody tr.selected td.hover {
    background-color: rgba(255, 255, 255, 0.04) !important; }
  tbody tr td#colex #expand {
    background: #292929; }
  table.table tbody tr.data-row #col0:not([data-title]) {
    background: #414141; } }

/** Focusable Datatable **/
table.table tbody tr.subheader.focus-visible,
table.table tbody tr.data-row.focus-visible {
  background-color: rgba(255, 255, 255, 0.2) !important; }

table.table thead tr th.sortable.focus-visible {
  color: rgba(255, 255, 255, 0.87); }

table.table tr.loading-row .content-placeholder {
  background: -webkit-gradient(linear, left top, right top, color-stop(8%, #454545), color-stop(18%, #555555), color-stop(33%, #444444));
  background: -webkit-linear-gradient(left, #454545 8%, #555555 18%, #444444 33%);
  background: linear-gradient(to right, #454545 8%, #555555 18%, #444444 33%); }

/** Disabled Row **/
tr.disabled *,
tr.subheader.disabled,
tr.subheader.disabled * {
  background: #4a4a4a !important; }

/** XScroll**/
.x-scroll {
  background: #424242; }