@ovine/core
Version:
Build flexible admin system with json.
105 lines (103 loc) • 2.07 kB
JavaScript
import { css } from 'styled-components';
import { breakpoints } from "../../../constants";
export const crudCss = ({ ns, colors }) => css `
.lib-crud {
&>.${ns}Form {
padding-bottom: 6px;
}
}
.lib-crud-table {
td {
vertical-align: middle;
.${ns}Button {
&--link {
height: auto;
text-decoration: none;
/* span {
color: ${colors.linkHover};
} */
}
}
.${ns}Select {
min-height: auto;
}
}
.${ns}OperationField {
.${ns}Button {
&--link {
padding: 0;
.${ns}Button-icon {
padding: 5px;
}
}
}
}
}
.${ns}Crud-body {
margin-bottom: 0;
}
/* @media (min-width: ${breakpoints.md}px) {
.lib-crud {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
height: calc(100% - 15px);
.${ns}Table-checkCell {
width: 20px;
}
& > .${ns}Form {
flex: 0 0 auto;
margin-bottom: 10px;
}
& > .${ns}Table {
flex: 1 0 auto;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
margin-bottom: 0;
.${ns}Table {
&-content {
height: 100%;
}
&-headToolbar {
flex: 0 0 auto;
}
&-footToolbar {
flex: 0 0 auto;
}
&-contentWrap {
flex: 1 0 auto;
}
}
}
}
.lib-crud-table {
height: 100%;
thead,
tbody {
tr {
table-layout: fixed;
display: table;
width: 100%;
box-sizing: content-box;
}
}
thead {
border-bottom: 1px solid ${colors.border};
tr {
background-color: transparent;
}
}
tbody {
display: block;
overflow-y: scroll;
height: 100%;
}
tr {
&:first-child {
border-top: 0;
}
}
}
} */
`;