@lytejs/ui
Version:
257 lines (249 loc) • 8.52 kB
JavaScript
import React from 'react';
import { styled } from '@linaria/react';
var Demo = function Demo() {
return /*#__PURE__*/React.createElement("span", null, "Lit ae UI");
};
var Demo2 = function Demo2() {
return /*#__PURE__*/React.createElement("span", null, "Cos sUI");
};
var StyledHeader = /*#__PURE__*/styled("header")({
name: "StyledHeader",
"class": "s1bplu98"
});
var StyledFooter = /*#__PURE__*/styled("footer")({
name: "StyledFooter",
"class": "spaxmdu"
});
var StyledMain = /*#__PURE__*/styled("article")({
name: "StyledMain",
"class": "s16fxgjj"
});
var StyledBody = /*#__PURE__*/styled("section")({
name: "StyledBody",
"class": "s1ffwdq6"
});
var ThreeRowLayout = function ThreeRowLayout(_ref) {
var children = _ref.children,
className = _ref.className;
return /*#__PURE__*/React.createElement(StyledMain, {
className: className
}, children);
};
ThreeRowLayout.Header = StyledHeader;
ThreeRowLayout.Footer = StyledFooter;
ThreeRowLayout.Body = StyledBody; // import React, { ReactElement, ReactNode } from 'react';
// import { StyledFooter, StyledHeader, StyledMain, StyledBody } from './styled';
// ThreeRowLayout.Header = ({ children, className }: { children: ReactNode; className?: string }): ReactElement => {
// return <StyledHeader className={className}>{children}</StyledHeader>;
// };
// ThreeRowLayout.Footer = ({ children, className }: { children: ReactNode; className?: string }): ReactElement => {
// return <StyledFooter className={className}>{children}</StyledFooter>;
// };
// ThreeRowLayout.Body = ({ children, className }: { children: ReactNode | ReactElement[]; className?: string }): ReactElement => {
// return <StyledBody className={className}>{children}</StyledBody>;
// };
var themeColors = {
primaryDark: '#152370',
primaryLight: '#EFF1FC',
primaryHighlight: '#8090E7',
secondaryHighlight: '#CFD5F6',
primaryButton: '#7335CB',
textLight: '#4253A9',
surface: '#FCFCFF',
surfaceLight: '#fff',
surfaceDark: '#F7F8FE',
danger: '#E95432',
selection: '#12C8B2',
lightPurple: '#DAC9F1',
success: '#39C521',
borderBottomHighligh: '#12c8b2',
infoYellow: '#fff3d2'
};
var themeFonts = {
family: {
primary: 'Inter',
styledHeading: 'Lato',
heading: 'Lato'
},
size: {
extraSmall: '0.8rem',
evenSmaller: '1rem',
small: '1.2rem',
base: '1.4rem',
big: '1.6rem',
bigger: '1.8rem',
giant: '2rem',
evenBigger: '2.1rem',
lead: '2.4rem',
morelead: '2.8rem',
massive: '3.5rem',
gigantic: '4.0rem',
huge: '4.8rem'
},
lineHeight: {
heading: '6.4rem',
subHeading: '2.4rem',
pageTitle: '3.2rem',
small: '1.6rem',
huge: '6.4rem',
bigger: '2.4rem',
lead: '3.2rem'
},
weight: {
base: '400',
bold: '600',
heading: '700',
bolder: '700'
}
};
var themeLayouts = {
margin: {
small: '1.5rem 0',
regular: '2.4rem',
heading: '2.4rem',
lead: '1.5rem',
menu: '2.2rem 0',
formTitle: '0'
},
padding: {
majorButton: '1.6rem 2.4rem',
input: '1.6rem',
inputNumber: '1.3rem'
},
border: {
input: "solid 0.1rem"
},
borderRadius: {
small: '0.4rem'
},
zIndex: {
// antd dropdown is 1050
header: 1000,
headerDropdown: 2001,
modal: 3000,
drawer: 3000,
drawerDropdown: 3001,
dateDropdown: 3002
}
};
var theme = {
colors: themeColors,
fonts: themeFonts,
layouts: themeLayouts,
borderRadius: '0.4rem',
borderWidth: '0.2rem'
};
var MixinText12 = "\n\tfont-size: " + theme.fonts.size.small + ";\n\tcolor: " + theme.colors.primaryDark + ";\n";
var MixinText14 = "\n\tfont-size: " + theme.fonts.size.base + ";\n\tcolor: " + theme.colors.primaryDark + ";\n";
var MixinText16 = "\n\tfont-size: " + theme.fonts.size.big + ";\n\tcolor: " + theme.colors.primaryDark + ";\n";
var MixinText18 = "\n\tfont-size: " + theme.fonts.size.bigger + ";\n\tcolor: " + theme.colors.primaryDark + ";\n";
var MixinText20 = "\n\tfont-size: 2rem;\n\tcolor: " + theme.colors.primaryDark + ";\n";
var MixinText22 = "\n\tfont-size: 2.2rem;\n\tcolor: " + theme.colors.primaryDark + ";\n";
var MixinText24 = "\n\tfont-size: 2.4rem;\n\tcolor: " + theme.colors.primaryDark + ";\n";
var MixinText28 = "\n\tfont-size: 2.8rem;\n\tcolor: " + theme.colors.primaryDark + ";\n";
var MixinBoldText12 = "\n\t" + MixinText12 + "\n\tfont-weight: 500;\n";
var MixinBoldText14 = "\n\t" + MixinText14 + "\n\tfont-weight: 600;\n";
var MixinBoldText16 = "\n\t" + MixinText16 + "\n\tfont-weight: 600;\n";
var MixinBoldText18 = "\n\t" + MixinText18 + "\n\tfont-weight: 600;\n";
var MixinBoldText20 = "\n\t" + MixinText20 + "\n\tfont-weight: 600;\n";
var MixinBoldText22 = "\n\t" + MixinText22 + "\n\tfont-weight: 600;\n";
var MixinBoldText24 = "\n\t" + MixinText24 + "\n\tfont-weight: 600;\n";
var MixinBoldText28 = "\n\t" + MixinText28 + "\n\tfont-weight: 600;\n";
var MixinHeading20 = "\n\t" + MixinText20 + "\n\tfont-family: " + theme.fonts.family.heading + ";\n\tfont-weight: 500;\n";
var MixinHeading22 = "\n\t" + MixinText22 + "\n\tfont-family: " + theme.fonts.family.heading + ";\n\tfont-weight: 500;\n";
var MixinHeading24 = "\n\t" + MixinText24 + "\n\tfont-family: " + theme.fonts.family.heading + ";\n\tfont-weight: 500;\n";
var MixinHeading28 = "\n\t" + MixinText28 + "\n\tfont-family: " + theme.fonts.family.heading + ";\n\tfont-weight: 500;\n";
var StyledText12 = /*#__PURE__*/styled("span")({
name: "StyledText12",
"class": "sn43i66"
});
var StyledText14 = /*#__PURE__*/styled("span")({
name: "StyledText14",
"class": "s1litvwm"
});
var StyledText16 = /*#__PURE__*/styled("span")({
name: "StyledText16",
"class": "szk2h8o"
});
var StyledText18 = /*#__PURE__*/styled("span")({
name: "StyledText18",
"class": "sdu39ga"
});
var StyledText20 = /*#__PURE__*/styled("span")({
name: "StyledText20",
"class": "sbzbgyz"
});
var StyledText22 = /*#__PURE__*/styled("span")({
name: "StyledText22",
"class": "sbnfdd6"
});
var StyledText24 = /*#__PURE__*/styled("span")({
name: "StyledText24",
"class": "s1k299ti"
});
var StyledText28 = /*#__PURE__*/styled("span")({
name: "StyledText28",
"class": "sniwmtp"
});
var StyledBoldText12 = /*#__PURE__*/styled("strong")({
name: "StyledBoldText12",
"class": "ssavygj"
});
var StyledBoldText14 = /*#__PURE__*/styled("strong")({
name: "StyledBoldText14",
"class": "s128ct3s"
});
var StyledBoldText16 = /*#__PURE__*/styled("strong")({
name: "StyledBoldText16",
"class": "s15o8vv4"
});
var StyledBoldText18 = /*#__PURE__*/styled("strong")({
name: "StyledBoldText18",
"class": "s6n5fen"
});
var StyledBoldText20 = /*#__PURE__*/styled("strong")({
name: "StyledBoldText20",
"class": "smd38d8"
});
var StyledBoldText22 = /*#__PURE__*/styled("strong")({
name: "StyledBoldText22",
"class": "s1g2z5cd"
});
var StyledBoldText24 = /*#__PURE__*/styled("strong")({
name: "StyledBoldText24",
"class": "s1kuwzwt"
});
var StyledBoldText28 = /*#__PURE__*/styled("strong")({
name: "StyledBoldText28",
"class": "s1ysgbug"
});
var StyledHeading20 = /*#__PURE__*/styled("h6")({
name: "StyledHeading20",
"class": "sy8ln1a"
});
var StyledHeading22 = /*#__PURE__*/styled("h5")({
name: "StyledHeading22",
"class": "s8lbr7s"
});
var StyledHeading24 = /*#__PURE__*/styled("h5")({
name: "StyledHeading24",
"class": "sf2t5ag"
});
var StyledHeading28 = /*#__PURE__*/styled("h3")({
name: "StyledHeading28",
"class": "s1j2yyuq"
});
var StyledParagraph12 = /*#__PURE__*/styled("p")({
name: "StyledParagraph12",
"class": "scqpbud"
});
var StyledParagraph14 = /*#__PURE__*/styled("p")({
name: "StyledParagraph14",
"class": "s8gd5oo"
});
var StyledParagraph16 = /*#__PURE__*/styled("p")({
name: "StyledParagraph16",
"class": "s191ywgq"
});
export { Demo, Demo2, MixinBoldText12, MixinBoldText14, MixinBoldText16, MixinBoldText18, MixinBoldText20, MixinBoldText22, MixinBoldText24, MixinBoldText28, MixinHeading20, MixinHeading22, MixinHeading24, MixinHeading28, MixinText12, MixinText14, MixinText16, MixinText18, MixinText20, MixinText22, MixinText24, MixinText28, StyledBoldText12, StyledBoldText14, StyledBoldText16, StyledBoldText18, StyledBoldText20, StyledBoldText22, StyledBoldText24, StyledBoldText28, StyledHeading20, StyledHeading22, StyledHeading24, StyledHeading28, StyledParagraph12, StyledParagraph14, StyledParagraph16, StyledText12, StyledText14, StyledText16, StyledText18, StyledText20, StyledText22, StyledText24, StyledText28, ThreeRowLayout };
//# sourceMappingURL=index.js.map