UNPKG

@lobehub/ui

Version:

Lobe UI is an open-source UI component library for building AIGC web apps

github.com/lobehub/lobe-ui

lobehub/lobe-ui

1 lines • 4.66 kB
1
{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/ColorPicker/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nimport { focusRing } from '@/base-ui/focusRing';\n\nconst checker = (color: string) => `\n background-image:\n linear-gradient(45deg, ${color} 25%, transparent 25%, transparent 75%, ${color} 75%),\n linear-gradient(45deg, ${color} 25%, transparent 25%, transparent 75%, ${color} 75%);\n background-position: 0 0, 4px 4px;\n background-size: 8px 8px;\n`;\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n alphaField: css`\n flex: none;\n width: 76px;\n `,\n alphaTrack: css`\n height: 10px;\n border-radius: 999px;\n\n background-image:\n linear-gradient(to right, transparent, var(--lobe-color-picker-alpha)),\n linear-gradient(\n 45deg,\n ${cssVar.colorFillSecondary} 25%,\n transparent 25%,\n transparent 75%,\n ${cssVar.colorFillSecondary} 75%\n ),\n linear-gradient(\n 45deg,\n ${cssVar.colorFillSecondary} 25%,\n transparent 25%,\n transparent 75%,\n ${cssVar.colorFillSecondary} 75%\n );\n background-position:\n 0 0,\n 0 0,\n 4px 4px;\n background-size:\n 100% 100%,\n 8px 8px,\n 8px 8px;\n `,\n hexRow: css`\n display: flex;\n gap: 6px;\n\n & > * {\n min-width: 0;\n }\n `,\n hidden: css`\n background: transparent !important;\n `,\n hueTrack: css`\n height: 10px;\n border-radius: 999px;\n background: linear-gradient(to right, #f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00);\n `,\n panel: css`\n display: flex;\n flex-direction: column;\n gap: 14px;\n width: 240px;\n `,\n preset: css`\n ${focusRing};\n cursor: pointer;\n\n width: 22px;\n height: 22px;\n padding: 0;\n border: 0;\n border-radius: 50%;\n\n &[aria-pressed='true'] {\n box-shadow:\n 0 0 0 2px ${cssVar.colorBgElevated},\n 0 0 0 4px ${cssVar.colorText};\n }\n `,\n presets: css`\n display: flex;\n flex-wrap: wrap;\n gap: 8px;\n\n padding-block-start: 14px;\n border-block-start: 1px solid ${cssVar.colorBorderSecondary};\n `,\n saturation: css`\n ${focusRing};\n touch-action: none;\n cursor: crosshair;\n\n position: relative;\n\n height: 164px;\n border-radius: 12px;\n `,\n swatch: css`\n ${checker(cssVar.colorFillSecondary)};\n overflow: hidden;\n display: inline-flex;\n flex: none;\n\n border-radius: 50%;\n\n box-shadow: inset 0 0 0 1px ${cssVar.colorFillSecondary};\n\n & > span {\n flex: 1;\n }\n `,\n swatchButton: css`\n ${focusRing};\n cursor: pointer;\n\n display: inline-flex;\n align-items: center;\n justify-content: center;\n\n width: 32px;\n height: 32px;\n padding: 0;\n border: 0;\n border-radius: 50%;\n\n background: none;\n\n &:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n }\n `,\n textTrigger: css`\n cursor: pointer;\n width: auto;\n `,\n thumb: css`\n position: absolute;\n\n box-sizing: border-box;\n width: 18px;\n height: 18px;\n margin-block: -9px 0;\n margin-inline: -9px 0;\n border: 3px solid #fff;\n border-radius: 50%;\n\n box-shadow:\n 0 0 0 1px rgb(0 0 0 / 12%),\n 0 2px 6px rgb(0 0 0 / 25%);\n `,\n sliderThumb: css`\n width: 18px !important;\n height: 18px !important;\n border: 3px solid #fff !important;\n\n background: transparent !important;\n box-shadow:\n 0 0 0 1px rgb(0 0 0 / 12%),\n 0 2px 6px rgb(0 0 0 / 25%) !important;\n `,\n summary: css`\n display: flex;\n gap: 12px;\n align-items: center;\n `,\n value: css`\n font-family: ${cssVar.fontFamilyCode};\n font-size: 20px;\n font-weight: 600;\n line-height: 1.2;\n `,\n}));\n"],"mappings":";;;AAIA,MAAM,WAAW,UAAkB;;6BAEN,MAAM,0CAA0C,MAAM;6BACtD,MAAM,0CAA0C,MAAM;;;;AAKnF,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,YAAY,GAAG;;;;CAIf,YAAY,GAAG;;;;;;;;UAQP,OAAO,mBAAmB;;;UAG1B,OAAO,mBAAmB;;;;UAI1B,OAAO,mBAAmB;;;UAG1B,OAAO,mBAAmB;;;;;;;;;;;CAWlC,QAAQ,GAAG;;;;;;;;CAQX,QAAQ,GAAG;;;CAGX,UAAU,GAAG;;;;;CAKb,OAAO,GAAG;;;;;;CAMV,QAAQ,GAAG;MACP,UAAU;;;;;;;;;;;oBAWI,OAAO,gBAAgB;oBACvB,OAAO,UAAU;;;CAGnC,SAAS,GAAG;;;;;;oCAMsB,OAAO,qBAAqB;;CAE9D,YAAY,GAAG;MACX,UAAU;;;;;;;;;CASd,QAAQ,GAAG;MACP,QAAQ,OAAO,kBAAkB,EAAE;;;;;;;kCAOP,OAAO,mBAAmB;;;;;;CAM1D,cAAc,GAAG;MACb,UAAU;;;;;;;;;;;;;;;;;;;;CAoBd,aAAa,GAAG;;;;CAIhB,OAAO,GAAG;;;;;;;;;;;;;;;CAeV,aAAa,GAAG;;;;;;;;;;CAUhB,SAAS,GAAG;;;;;CAKZ,OAAO,GAAG;mBACO,OAAO,eAAe;;;;;AAKzC,EAAE"}