@lobehub/ui
Version:
Lobe UI is an open-source UI component library for building AIGC web apps
1 lines • 3.88 kB
Source Map (JSON)
{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/awesome/LandingHero/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nimport { accentGradient } from '@/awesome/landingTokens';\n\nconst splitStack = '@media (max-width: 860px)';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n accent: css`\n background: ${accentGradient};\n background-clip: text;\n\n -webkit-text-fill-color: transparent;\n `,\n actions: css`\n justify-content: center;\n margin-block-start: 36px;\n\n [data-layout='split'] & {\n justify-content: flex-start;\n }\n `,\n aside: css`\n display: flex;\n justify-content: center;\n min-inline-size: 0;\n\n > * {\n inline-size: 100%;\n }\n `,\n badge: css`\n display: inline-flex;\n gap: 6px;\n align-items: center;\n\n margin-block-end: 24px;\n padding-block: 4px;\n padding-inline: 12px;\n border: 1px solid ${cssVar.colorBorderSecondary};\n border-radius: 999px;\n\n font-size: ${cssVar.fontSizeSM};\n color: ${cssVar.colorTextSecondary};\n\n background: color-mix(in srgb, ${cssVar.colorBgContainer} 70%, transparent);\n backdrop-filter: blur(8px);\n\n a {\n color: inherit;\n text-decoration: none;\n }\n\n a:hover {\n color: ${cssVar.colorText};\n }\n `,\n content: css`\n position: relative;\n z-index: 1;\n\n display: flex;\n flex-direction: column;\n align-items: center;\n\n inline-size: 100%;\n `,\n description: css`\n max-inline-size: 36rem;\n margin-block: 20px 0;\n margin-inline: 0;\n\n font-size: clamp(16px, 2vw, 19px);\n line-height: 1.6;\n color: ${cssVar.colorTextSecondary};\n text-wrap: balance;\n `,\n intro: css`\n display: flex;\n flex-direction: column;\n align-items: center;\n min-inline-size: 0;\n\n [data-layout='split'] & {\n align-items: flex-start;\n text-align: start;\n }\n\n ${splitStack} {\n [data-layout='split'] & {\n align-items: center;\n text-align: center;\n }\n }\n `,\n main: css`\n display: flex;\n flex-direction: column;\n align-items: center;\n inline-size: 100%;\n\n [data-layout='split'] & {\n display: grid;\n grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);\n gap: clamp(32px, 5vw, 64px);\n align-items: center;\n }\n\n ${splitStack} {\n [data-layout='split'] & {\n grid-template-columns: minmax(0, 1fr);\n gap: 48px;\n }\n }\n `,\n extra: css`\n display: flex;\n flex-direction: column;\n gap: 40px;\n align-items: center;\n\n inline-size: 100%;\n margin-block-start: 48px;\n `,\n root: css`\n position: relative;\n\n display: flex;\n flex-direction: column;\n align-items: center;\n\n padding-block: clamp(72px, 13vh, 128px) clamp(40px, 7vh, 72px);\n\n text-align: center;\n\n &[data-layout='split'] {\n padding-block-start: clamp(56px, 10vh, 104px);\n }\n `,\n title: css`\n margin: 0;\n\n font-size: clamp(44px, 8vw, 84px);\n font-weight: 900;\n line-height: 1.02;\n color: ${cssVar.colorText};\n text-wrap: balance;\n letter-spacing: -0.045em;\n\n [data-layout='split'] & {\n font-size: clamp(44px, 6vw, 72px);\n }\n `,\n}));\n"],"mappings":";;;AAIA,MAAM,aAAa;AAEnB,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,QAAQ,GAAG;kBACK,eAAe;;;;;CAK/B,SAAS,GAAG;;;;;;;;CAQZ,OAAO,GAAG;;;;;;;;;CASV,OAAO,GAAG;;;;;;;;wBAQY,OAAO,qBAAqB;;;iBAGnC,OAAO,WAAW;aACtB,OAAO,mBAAmB;;qCAEF,OAAO,iBAAiB;;;;;;;;;eAS9C,OAAO,UAAU;;;CAG9B,SAAS,GAAG;;;;;;;;;;CAUZ,aAAa,GAAG;;;;;;;aAOL,OAAO,mBAAmB;;;CAGrC,OAAO,GAAG;;;;;;;;;;;MAWN,WAAW;;;;;;;CAOf,MAAM,GAAG;;;;;;;;;;;;;MAaL,WAAW;;;;;;;CAOf,OAAO,GAAG;;;;;;;;;CASV,MAAM,GAAG;;;;;;;;;;;;;;;CAeT,OAAO,GAAG;;;;;;aAMC,OAAO,UAAU;;;;;;;;AAQ9B,EAAE"}