norma-library/dist/esm/components/UncontrolledTable/styles.js

Olos/Norma-DS. Design System based on Material UI, developed with TypeScript and Styled Components to create reusable and consistent components in web applications.

import { __makeTemplateObject } from "tslib";
import { breakpoints } from '../../utils/styledBreakpoints';
import styled from 'styled-components';
export var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: #fff;\n"], ["\n  background-color: #fff;\n"])));
export var Table = styled.table(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: table;\n  width: 100%;\n  border-collapse: collapse;\n  border-spacing: 0;\n  min-width: 650px;\n  border: none;\n"], ["\n  display: table;\n  width: 100%;\n  border-collapse: collapse;\n  border-spacing: 0;\n  min-width: 650px;\n  border: none;\n"])));
var StickyStyles = function (top) { return "\n  position: sticky;\n  top: ".concat(top, "px;\n  z-index: 1;\n  background: #fff;\n"); };
export var Thead = styled.thead(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: table-header-group;\n  ", ";\n"], ["\n  display: table-header-group;\n  ", ";\n"])), function (props) { return props.$sticky && StickyStyles(props.$stickyTopP || 0); });
export var TableRow = styled.tr(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  color: inherit;\n  display: table-row;\n  vertical-align: middle;\n  outline: 0;\n"], ["\n  color: inherit;\n  display: table-row;\n  vertical-align: middle;\n  outline: 0;\n"])));
export var Th = styled.th(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  font-weight: 500;\n  font-size: 0.875rem;\n  line-height: 1.5rem;\n  letter-spacing: 0.01071em;\n  display: table-cell;\n  vertical-align: inherit;\n  border-bottom: 1px solid rgba(224, 224, 224, 1);\n  text-align: left;\n  padding: 16px;\n  ", ";\n  color: rgba(0, 0, 0, 0.87);\n  color: #666666;\n  font-size: 0.875rem;\n  font-weight: 700;\n"], ["\n  font-weight: 500;\n  font-size: 0.875rem;\n  line-height: 1.5rem;\n  letter-spacing: 0.01071em;\n  display: table-cell;\n  vertical-align: inherit;\n  border-bottom: 1px solid rgba(224, 224, 224, 1);\n  text-align: left;\n  padding: 16px;\n  ", ";\n  color: rgba(0, 0, 0, 0.87);\n  color: #666666;\n  font-size: 0.875rem;\n  font-weight: 700;\n"])), breakpoints({
    cssProp: 'padding',
    cssPropUnits: 'px',
    values: [{ 1440: 8 }],
    mediaQueryType: 'max-width',
}));
export var ColumnContent = styled.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  gap: 5px;\n"], ["\n  display: flex;\n  align-items: center;\n  gap: 5px;\n"])));
export var TextColumn = styled.span(templateObject_7 || (templateObject_7 = __makeTemplateObject([""], [""])));
export var IconFilterDialog = styled.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  height: 20px;\n  width: 20px;\n"], ["\n  height: 20px;\n  width: 20px;\n"])));
export var FilterDialog = styled.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  position: absolute;\n  padding: 10px 0;\n  margin: 6px 0px 0 0;\n  width: max-content;\n  background: #fff;\n  box-shadow: 0px 3px 6px #00000029;\n  border: 1px solid #e0e0e0;\n  z-index: 99;\n"], ["\n  position: absolute;\n  padding: 10px 0;\n  margin: 6px 0px 0 0;\n  width: max-content;\n  background: #fff;\n  box-shadow: 0px 3px 6px #00000029;\n  border: 1px solid #e0e0e0;\n  z-index: 99;\n"])));
export var ListFilterDialog = styled.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  .label {\n    margin: 0 0 8px 0;\n    color: #666666;\n    font-size: 14px;\n    font-weight: 400;\n    text-align: left;\n  }\n  .select {\n    border: 1px solid #e0e0e0;\n    padding: 8px 12px;\n  }\n"], ["\n  display: flex;\n  flex-direction: column;\n  .label {\n    margin: 0 0 8px 0;\n    color: #666666;\n    font-size: 14px;\n    font-weight: 400;\n    text-align: left;\n  }\n  .select {\n    border: 1px solid #e0e0e0;\n    padding: 8px 12px;\n  }\n"])));
export var OptionFilterDialog = styled.div(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  display: flex;\n  gap: 16px;\n  align-items: center;\n  padding: 6px 15px;\n  cursor: pointer;\n  &:hover {\n    background: rgba(0, 0, 0, 0.04);\n  }\n  .icon {\n    color: #666;\n  }\n  .rotate {\n    rotate: 180deg;\n  }\n  div {\n    width: 20px;\n    height: 20px;\n  }\n  p {\n    margin: 0;\n    color: #666666;\n    font-size: 16px;\n    font-weight: 400;\n  }\n"], ["\n  display: flex;\n  gap: 16px;\n  align-items: center;\n  padding: 6px 15px;\n  cursor: pointer;\n  &:hover {\n    background: rgba(0, 0, 0, 0.04);\n  }\n  .icon {\n    color: #666;\n  }\n  .rotate {\n    rotate: 180deg;\n  }\n  div {\n    width: 20px;\n    height: 20px;\n  }\n  p {\n    margin: 0;\n    color: #666666;\n    font-size: 16px;\n    font-weight: 400;\n  }\n"])));
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11;
//# sourceMappingURL=styles.js.map