woocommerce/plugins/woocommerce-admin/client/components/table/style.scss

117 lines
1.9 KiB
SCSS

/** @format */
.woocommerce-table {
.woocommerce-card__body {
padding: 0;
padding-bottom: $gap;
}
.woocommerce-card__action,
.woocommerce-card__menu {
justify-self: flex-end;
}
}
.woocommerce-table__caption {
@include font-size( 24 );
text-align: left;
}
.woocommerce-table__table {
overflow-x: auto;
margin-bottom: $gap;
table {
border-collapse: collapse;
width: 100%;
}
}
.woocommerce-table__header,
.woocommerce-table__item {
padding: $gap $gap-large;
border-bottom: 1px solid $core-grey-light-500;
text-align: left;
}
.woocommerce-table__header,
th.woocommerce-table__item {
font-weight: bold;
white-space: nowrap;
}
.woocommerce-table__header {
padding: $gap-smaller $gap-large;
background-color: #f8f9fa;
border-bottom: 1px solid $core-grey-light-700;
& + .woocommerce-table__header {
border-left: 1px solid $core-grey-light-700;
}
.components-button.is-button {
padding: $gap-smaller $gap $gap-smaller 0;
height: auto;
width: 100%;
vertical-align: middle;
line-height: 1;
border: none;
background: transparent;
box-shadow: none !important;
// @todo Add interactive styles
&:hover {
box-shadow: none !important;
}
&:active {
box-shadow: none !important;
}
}
&.is-sortable {
padding: 0;
.gridicon {
visibility: hidden;
margin-left: $gap-smallest;
}
&.is-sorted .components-button,
.components-button:hover,
.components-button:focus {
.gridicon {
visibility: visible;
}
}
}
}
.woocommerce-table__summary {
margin: $gap 0;
text-align: center;
}
.woocommerce-table__summary-item {
display: inline-block;
margin-bottom: 0;
.woocommerce-table__summary-label,
.woocommerce-table__summary-value {
display: inline-block;
}
.woocommerce-table__summary-label {
margin-left: $gap-smallest;
}
.woocommerce-table__summary-value {
font-weight: 600;
}
& + .woocommerce-table__summary-item:before {
content: '/';
margin: 0 $gap-smallest;
}
}