@fangxinyan/lumina 0.6.18 → 0.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{Alert-HVPI6L4V.css → Alert-DJ3K7N7L.css} +9 -9
- package/dist/Alert.cjs +5 -3
- package/dist/Alert.d.cts +2 -2
- package/dist/Alert.d.ts +2 -2
- package/dist/Alert.js +4 -2
- package/dist/{AppShell-FZCD4C56.css → AppShell-OWJRJ4ZD.css} +57 -22
- package/dist/AppShell.cjs +8 -5
- package/dist/AppShell.d.cts +19 -16
- package/dist/AppShell.d.ts +19 -16
- package/dist/AppShell.js +4 -1
- package/dist/{AutoComplete-4YZBMW4E.css → AutoComplete-PNCYHU2T.css} +8 -8
- package/dist/AutoComplete.cjs +9 -6
- package/dist/AutoComplete.d.cts +2 -1
- package/dist/AutoComplete.d.ts +2 -1
- package/dist/AutoComplete.js +8 -5
- package/dist/Avatar-YBU2YZTW.css +48 -0
- package/dist/Avatar.cjs +4 -2
- package/dist/Avatar.d.cts +6 -2
- package/dist/Avatar.d.ts +6 -2
- package/dist/Avatar.js +3 -1
- package/dist/Badge-DBWJEV4C.css +22 -0
- package/dist/Badge.cjs +4 -2
- package/dist/Badge.d.cts +6 -2
- package/dist/Badge.d.ts +6 -2
- package/dist/Badge.js +3 -1
- package/dist/{Button-TUMZUQLI.css → Button-ILNZUX2N.css} +28 -21
- package/dist/Button.cjs +6 -4
- package/dist/Button.d.cts +2 -14
- package/dist/Button.d.ts +2 -14
- package/dist/Button.js +4 -2
- package/dist/{Calendar-I6NHCXIB.css → Calendar-QJ5HWEJQ.css} +26 -26
- package/dist/Calendar.cjs +5 -3
- package/dist/Calendar.d.cts +8 -4
- package/dist/Calendar.d.ts +8 -4
- package/dist/Calendar.js +4 -2
- package/dist/Card-VPMTWAWZ.css +98 -0
- package/dist/Card.cjs +7 -3
- package/dist/Card.d.cts +8 -4
- package/dist/Card.d.ts +8 -4
- package/dist/Card.js +6 -2
- package/dist/Cascader-YBVDK6DC.css +168 -0
- package/dist/Cascader.cjs +9 -6
- package/dist/Cascader.d.cts +21 -3
- package/dist/Cascader.d.ts +21 -3
- package/dist/Cascader.js +8 -5
- package/dist/Checkbox-IHFML4FV.css +50 -0
- package/dist/Checkbox.cjs +5 -3
- package/dist/Checkbox.d.cts +10 -2
- package/dist/Checkbox.d.ts +10 -2
- package/dist/Checkbox.js +4 -2
- package/dist/{Collapse-UNBHEPYP.css → Collapse-BTSBHBSY.css} +12 -7
- package/dist/Collapse.cjs +5 -3
- package/dist/Collapse.d.cts +2 -2
- package/dist/Collapse.d.ts +2 -2
- package/dist/Collapse.js +4 -2
- package/dist/{ColorPicker-LPG6QPYF.css → ColorPicker-GRZOKR5O.css} +17 -32
- package/dist/ColorPicker.cjs +9 -3
- package/dist/ColorPicker.d.cts +7 -11
- package/dist/ColorPicker.d.ts +7 -11
- package/dist/ColorPicker.js +8 -2
- package/dist/{CommandPalette-RTKWNH2D.css → CommandPalette-GHTX7AAA.css} +22 -23
- package/dist/CommandPalette.cjs +8 -5
- package/dist/CommandPalette.d.cts +5 -28
- package/dist/CommandPalette.d.ts +5 -28
- package/dist/CommandPalette.js +7 -4
- package/dist/{ContextMenu-WRR2SSWL.css → ContextMenu-NG524Y2P.css} +17 -17
- package/dist/ContextMenu.cjs +5 -2
- package/dist/ContextMenu.d.cts +2 -19
- package/dist/ContextMenu.d.ts +2 -19
- package/dist/ContextMenu.js +4 -1
- package/dist/{DatePicker-VDVSIARF.css → DatePicker-ZSFDXAYD.css} +4 -4
- package/dist/DatePicker.cjs +11 -8
- package/dist/DatePicker.d.cts +4 -7
- package/dist/DatePicker.d.ts +4 -7
- package/dist/DatePicker.js +10 -7
- package/dist/{DateTimePicker-DRX7XA74.css → DateTimePicker-EWSISVIF.css} +17 -17
- package/dist/DateTimePicker.cjs +11 -8
- package/dist/DateTimePicker.d.cts +4 -8
- package/dist/DateTimePicker.d.ts +4 -8
- package/dist/DateTimePicker.js +10 -7
- package/dist/{Divider-RPQCVH3J.css → Divider-OI2BXPBU.css} +10 -10
- package/dist/Divider.cjs +4 -2
- package/dist/Divider.d.cts +2 -2
- package/dist/Divider.d.ts +2 -2
- package/dist/Divider.js +3 -1
- package/dist/{Drawer-7KICRM4L.css → Drawer-VCXAXWV6.css} +30 -17
- package/dist/Drawer.cjs +6 -3
- package/dist/Drawer.d.cts +25 -3
- package/dist/Drawer.d.ts +25 -3
- package/dist/Drawer.js +5 -2
- package/dist/{Empty-CZTRZMZQ.css → Empty-U5CBLCAL.css} +5 -5
- package/dist/Empty.cjs +4 -2
- package/dist/Empty.d.cts +2 -2
- package/dist/Empty.d.ts +2 -2
- package/dist/Empty.js +3 -1
- package/dist/{Form-NGCQWTMZ.css → Form-DNEDZRJA.css} +7 -7
- package/dist/Form.cjs +7 -4
- package/dist/Form.d.cts +4 -3
- package/dist/Form.d.ts +4 -3
- package/dist/Form.js +4 -1
- package/dist/Icon-HJSUVW4O.css +12 -0
- package/dist/Icon.cjs +51 -49
- package/dist/Icon.d.cts +8 -8
- package/dist/Icon.d.ts +8 -8
- package/dist/Icon.js +3 -1
- package/dist/{Image-NISJRUWX.css → Image-CZJPPURT.css} +25 -23
- package/dist/Image.cjs +10 -7
- package/dist/Image.d.cts +5 -24
- package/dist/Image.d.ts +5 -24
- package/dist/Image.js +6 -3
- package/dist/{Input-7GDPGP3E.css → Input-ZUASNDXM.css} +15 -15
- package/dist/Input.cjs +7 -5
- package/dist/Input.d.cts +2 -1
- package/dist/Input.d.ts +2 -1
- package/dist/Input.js +5 -3
- package/dist/{InputNumber-VXQIWLQC.css → InputNumber-6NHBMRT4.css} +7 -7
- package/dist/InputNumber.cjs +7 -5
- package/dist/InputNumber.d.cts +2 -1
- package/dist/InputNumber.d.ts +2 -1
- package/dist/InputNumber.js +6 -4
- package/dist/List-6BQIFAIT.css +42 -0
- package/dist/List.cjs +4 -2
- package/dist/List.d.cts +2 -2
- package/dist/List.d.ts +2 -2
- package/dist/List.js +3 -1
- package/dist/{Message-H222YGR6.css → Message-OTZWQTQ5.css} +13 -13
- package/dist/Message.cjs +9 -6
- package/dist/Message.d.cts +18 -2
- package/dist/Message.d.ts +18 -2
- package/dist/Message.js +5 -2
- package/dist/{Modal-ZFWNFEA5.css → Modal-UI2FXNDR.css} +29 -18
- package/dist/Modal.cjs +7 -4
- package/dist/Modal.d.cts +13 -2
- package/dist/Modal.d.ts +13 -2
- package/dist/Modal.js +6 -3
- package/dist/Pagination-POJTWMYR.css +70 -0
- package/dist/Pagination.cjs +11 -8
- package/dist/Pagination.d.cts +2 -2
- package/dist/Pagination.d.ts +2 -2
- package/dist/Pagination.js +10 -7
- package/dist/{Popover-Y3LDCJPW.css → Popover-LCXLR3EU.css} +13 -14
- package/dist/Popover.cjs +6 -3
- package/dist/Popover.d.cts +3 -10
- package/dist/Popover.d.ts +3 -10
- package/dist/Popover.js +5 -2
- package/dist/Progress-33WE2NI7.css +90 -0
- package/dist/Progress.cjs +4 -2
- package/dist/Progress.d.cts +4 -2
- package/dist/Progress.d.ts +4 -2
- package/dist/Progress.js +3 -1
- package/dist/{Radio-IQKASYDF.css → Radio-RL7232MZ.css} +21 -13
- package/dist/Radio.cjs +5 -3
- package/dist/Radio.d.cts +18 -5
- package/dist/Radio.d.ts +18 -5
- package/dist/Radio.js +3 -1
- package/dist/{Select-YZ2NUJSX.css → Select-TU37MAHZ.css} +64 -40
- package/dist/Select.cjs +10 -7
- package/dist/Select.d.cts +28 -3
- package/dist/Select.d.ts +28 -3
- package/dist/Select.js +9 -6
- package/dist/{Skeleton-CVWH2VWN.css → Skeleton-FMFE3BRI.css} +9 -4
- package/dist/Skeleton.cjs +4 -2
- package/dist/Skeleton.d.cts +2 -4
- package/dist/Skeleton.d.ts +2 -4
- package/dist/Skeleton.js +3 -1
- package/dist/Slider-FZ5MI4X2.css +145 -0
- package/dist/Slider.cjs +4 -2
- package/dist/Slider.d.cts +6 -5
- package/dist/Slider.d.ts +6 -5
- package/dist/Slider.js +3 -1
- package/dist/{Spin-GONGPV4Q.css → Spin-F5YIEENO.css} +15 -9
- package/dist/Spin.cjs +4 -2
- package/dist/Spin.d.cts +2 -2
- package/dist/Spin.d.ts +2 -2
- package/dist/Spin.js +3 -1
- package/dist/{Splitter-DHNOY4NC.css → Splitter-IQ3PFIKK.css} +4 -4
- package/dist/Splitter.cjs +4 -2
- package/dist/Splitter.d.cts +18 -12
- package/dist/Splitter.d.ts +18 -12
- package/dist/Splitter.js +3 -1
- package/dist/{StatusBar-FJKEEPXU.css → StatusBar-TCGR3LXP.css} +23 -9
- package/dist/StatusBar.cjs +5 -3
- package/dist/StatusBar.d.cts +5 -17
- package/dist/StatusBar.d.ts +5 -17
- package/dist/StatusBar.js +3 -1
- package/dist/{Surface-UDDN3DGL.css → Surface-CTN775GD.css} +10 -10
- package/dist/Surface.cjs +6 -5
- package/dist/Surface.d.cts +10 -1
- package/dist/Surface.d.ts +10 -1
- package/dist/Surface.js +4 -3
- package/dist/{Switch-COAQIOMH.css → Switch-TATU3LPB.css} +16 -8
- package/dist/Switch.cjs +4 -2
- package/dist/Switch.d.cts +10 -4
- package/dist/Switch.d.ts +10 -4
- package/dist/Switch.js +3 -1
- package/dist/{Table-IWHIIGRJ.css → Table-KB6EEBDJ.css} +105 -53
- package/dist/Table.cjs +14 -10
- package/dist/Table.d.cts +38 -3
- package/dist/Table.d.ts +38 -3
- package/dist/Table.js +13 -9
- package/dist/{TablePro-3NGWERWT.css → TablePro-WYE6TXWJ.css} +5 -5
- package/dist/TablePro.cjs +15 -11
- package/dist/TablePro.d.cts +1 -0
- package/dist/TablePro.d.ts +1 -0
- package/dist/TablePro.js +14 -10
- package/dist/{Tabs-X5U5PCPV.css → Tabs-FB2AMBWL.css} +24 -10
- package/dist/Tabs.cjs +4 -2
- package/dist/Tabs.d.cts +8 -2
- package/dist/Tabs.d.ts +8 -2
- package/dist/Tabs.js +3 -1
- package/dist/Tag-5GIZLRAH.css +42 -0
- package/dist/Tag.cjs +5 -3
- package/dist/Tag.d.cts +2 -2
- package/dist/Tag.d.ts +2 -2
- package/dist/Tag.js +4 -2
- package/dist/{Textarea-YHWKHIFE.css → Textarea-ZGHBZNLX.css} +10 -10
- package/dist/Textarea.cjs +6 -4
- package/dist/Textarea.d.cts +2 -4
- package/dist/Textarea.d.ts +2 -4
- package/dist/Textarea.js +4 -2
- package/dist/Theme-CLedeJ_C.d.ts +193 -0
- package/dist/Theme-uQq2B0Yk.d.cts +193 -0
- package/dist/Theme.cjs +57 -11
- package/dist/Theme.d.cts +26 -145
- package/dist/Theme.d.ts +26 -145
- package/dist/Theme.js +3 -1
- package/dist/{ThemePanel-TEHB2JCQ.css → ThemePanel-EHNAS4RN.css} +52 -52
- package/dist/ThemePanel.cjs +17 -15
- package/dist/ThemePanel.d.cts +3 -13
- package/dist/ThemePanel.d.ts +3 -13
- package/dist/ThemePanel.js +14 -12
- package/dist/{TimePicker-ZBJOXH3U.css → TimePicker-WJ3FSK6A.css} +17 -17
- package/dist/TimePicker.cjs +10 -7
- package/dist/TimePicker.d.cts +2 -8
- package/dist/TimePicker.d.ts +2 -8
- package/dist/TimePicker.js +9 -6
- package/dist/{Timeline-CRFZ3I2W.css → Timeline-FUFO2UGY.css} +28 -13
- package/dist/Timeline.cjs +5 -3
- package/dist/Timeline.d.cts +2 -7
- package/dist/Timeline.d.ts +2 -7
- package/dist/Timeline.js +4 -2
- package/dist/{Tooltip-5FSPJWLX.css → Tooltip-2EUNTOTW.css} +3 -3
- package/dist/Tooltip.cjs +6 -3
- package/dist/Tooltip.d.cts +2 -2
- package/dist/Tooltip.d.ts +2 -2
- package/dist/Tooltip.js +5 -2
- package/dist/{Typography-32QQLD4F.css → Typography-CQ2OZXQH.css} +105 -42
- package/dist/Typography.cjs +11 -8
- package/dist/Typography.d.cts +12 -36
- package/dist/Typography.d.ts +12 -36
- package/dist/Typography.js +6 -3
- package/dist/chunk-2A4GYSN4.js +294 -0
- package/dist/{chunk-QMX67CVT.cjs → chunk-2AUXUZ3Z.cjs} +56 -31
- package/dist/chunk-2BIOTRQC.js +40 -0
- package/dist/{chunk-A6O25EP2.js → chunk-2HIN5NFM.js} +14 -6
- package/dist/{chunk-I7TOBKJO.js → chunk-3DKFS44V.js} +84 -23
- package/dist/{chunk-X5MYHDEQ.cjs → chunk-3EMWDDWK.cjs} +372 -117
- package/dist/chunk-3F424R5P.js +143 -0
- package/dist/chunk-3IZZBM56.js +269 -0
- package/dist/{chunk-DUFRASGO.js → chunk-3QXP2ZNP.js} +18 -23
- package/dist/{chunk-5QEI7GGA.cjs → chunk-434Y2JVW.cjs} +60 -27
- package/dist/{chunk-SOCYOUGM.js → chunk-4SKHRPDH.js} +168 -64
- package/dist/{chunk-R3DTXVP2.js → chunk-5AXNUX3J.js} +8 -5
- package/dist/chunk-5CZA33BK.cjs +229 -0
- package/dist/{chunk-6K5YI4ZE.js → chunk-62VV5COT.js} +16 -6
- package/dist/{chunk-2FOC3D6X.js → chunk-63RSKQID.js} +23 -7
- package/dist/chunk-6DKPJ5LV.cjs +294 -0
- package/dist/{chunk-OTSDPQPV.js → chunk-6RQJXSWN.js} +50 -30
- package/dist/{chunk-V5KUC5VH.cjs → chunk-77HU7JWK.cjs} +40 -13
- package/dist/chunk-7QAVPVMW.js +180 -0
- package/dist/chunk-7VLAHOA7.cjs +191 -0
- package/dist/chunk-ALAG4ZUH.js +72 -0
- package/dist/chunk-ARUN2DMD.js +39 -0
- package/dist/chunk-AUO2YYHB.js +248 -0
- package/dist/{chunk-6MEOLYNQ.js → chunk-AURYNA6G.js} +6 -5
- package/dist/chunk-BIPOXOHP.cjs +287 -0
- package/dist/{chunk-BVQOJKRX.js → chunk-BKW5PXEO.js} +115 -72
- package/dist/chunk-DRDDQCDD.js +322 -0
- package/dist/chunk-DU2DSERH.js +190 -0
- package/dist/chunk-DURKCGEM.js +496 -0
- package/dist/{chunk-PSQ3HNZP.cjs → chunk-E66PSVBU.cjs} +106 -19
- package/dist/chunk-EAUB6FEN.js +262 -0
- package/dist/chunk-EE5KXDRK.cjs +1223 -0
- package/dist/chunk-EE7IJ3MB.js +1 -0
- package/dist/chunk-EUTK2ZRJ.cjs +61 -0
- package/dist/{chunk-HSAJUEO7.cjs → chunk-F7WUCOBP.cjs} +150 -86
- package/dist/{chunk-YB3IWIOJ.cjs → chunk-FJB3243S.cjs} +18 -23
- package/dist/chunk-FKCPSVC4.cjs +188 -0
- package/dist/chunk-FMUHLIHB.cjs +94 -0
- package/dist/chunk-FY73C7JK.js +520 -0
- package/dist/{chunk-6EOSMK34.cjs → chunk-G5LCOBOT.cjs} +20 -1
- package/dist/{chunk-5ERD3W24.cjs → chunk-GFKWSDD6.cjs} +18 -8
- package/dist/{chunk-T2O4DTDE.cjs → chunk-GTFP7HA3.cjs} +58 -32
- package/dist/chunk-HQFKXTX6.js +60 -0
- package/dist/{chunk-V5SQOZPF.js → chunk-HQNDVNTQ.js} +38 -20
- package/dist/chunk-HSDMJUB6.cjs +319 -0
- package/dist/chunk-HVPUGYBY.js +166 -0
- package/dist/chunk-HYHBCHFM.cjs +167 -0
- package/dist/chunk-HYJSMFZA.cjs +2 -0
- package/dist/chunk-I4YPBAQ5.js +163 -0
- package/dist/chunk-IJDM2U3B.js +100 -0
- package/dist/chunk-J5UEQ3ZQ.js +226 -0
- package/dist/chunk-JBS353O4.cjs +248 -0
- package/dist/{chunk-IPSNC5VZ.js → chunk-JHM7MN3G.js} +15 -7
- package/dist/{chunk-6Q76VLCE.cjs → chunk-JKUXA3U6.cjs} +50 -30
- package/dist/{chunk-D7GK6H6V.js → chunk-K5HGHOG7.js} +50 -21
- package/dist/chunk-KATJAJUU.js +78 -0
- package/dist/chunk-KCDOC3HS.cjs +100 -0
- package/dist/{chunk-M4NJTJKV.cjs → chunk-LDX6Q6RK.cjs} +8 -5
- package/dist/chunk-LEDESWNL.js +83 -0
- package/dist/chunk-LG62MPMU.cjs +213 -0
- package/dist/{chunk-7NTTRKNT.js → chunk-LJVQQEME.js} +54 -28
- package/dist/{chunk-FDZG27IG.js → chunk-LQMOYVQF.js} +57 -32
- package/dist/{chunk-P2OQTJZP.cjs → chunk-MCDW3VKZ.cjs} +17 -6
- package/dist/{chunk-BT2RXFT4.cjs → chunk-MUZQWIMR.cjs} +121 -78
- package/dist/chunk-NRJXZPZR.cjs +351 -0
- package/dist/chunk-O6G3F5L4.js +311 -0
- package/dist/{chunk-3VSHGM54.js → chunk-OLYSSZHP.js} +126 -68
- package/dist/{chunk-A4Z7PLHV.cjs → chunk-PIJV2FHO.cjs} +135 -77
- package/dist/{chunk-L6GIV5DQ.cjs → chunk-PJFYIXBX.cjs} +40 -22
- package/dist/{chunk-NXBFEIUX.cjs → chunk-PNKNZREC.cjs} +266 -130
- package/dist/{chunk-FYSXJXNW.js → chunk-PQOBBASY.js} +10 -9
- package/dist/chunk-Q565GDVK.cjs +205 -0
- package/dist/{chunk-FDUQPAQE.cjs → chunk-Q5HLC56A.cjs} +122 -28
- package/dist/chunk-QDCPVI3S.cjs +333 -0
- package/dist/{chunk-ZR4IMROK.js → chunk-QDMFXRPI.js} +122 -28
- package/dist/chunk-QDY56GGO.js +234 -0
- package/dist/{chunk-4KDABJSY.cjs → chunk-QNQSNVCU.cjs} +86 -25
- package/dist/chunk-QYPA77OI.cjs +55 -0
- package/dist/{chunk-BW76ENTW.cjs → chunk-RERMZNF3.cjs} +10 -9
- package/dist/chunk-RMGFRAZ2.cjs +270 -0
- package/dist/chunk-RPO7657K.js +228 -0
- package/dist/chunk-RR7KWH26.cjs +122 -0
- package/dist/chunk-SF7BPXDJ.cjs +518 -0
- package/dist/chunk-STQDKMS5.cjs +288 -0
- package/dist/{chunk-HG6YS4I7.js → chunk-SXLRWYQQ.js} +71 -24
- package/dist/{chunk-SW2HMNCA.cjs → chunk-T4RR6NVU.cjs} +17 -9
- package/dist/{chunk-6SPMHY54.js → chunk-TSL3F2K3.js} +20 -2
- package/dist/{chunk-BNY2NVTL.cjs → chunk-TYZ6L7E6.cjs} +48 -28
- package/dist/{chunk-MOZ52KN6.js → chunk-U3SG2YT2.js} +39 -12
- package/dist/{chunk-POU3W5J3.cjs → chunk-U5YYOOLC.cjs} +13 -6
- package/dist/chunk-UE4HFGJ6.js +264 -0
- package/dist/chunk-ULTDRMGN.js +1175 -0
- package/dist/{chunk-6HF6UF73.js → chunk-UQI4R32R.js} +368 -113
- package/dist/{chunk-MWEHU7YO.cjs → chunk-VA3JWOAB.cjs} +172 -68
- package/dist/chunk-VQEMMJHC.js +33 -0
- package/dist/{chunk-S2ZGXBUH.cjs → chunk-VVRXNGYL.cjs} +218 -42
- package/dist/{chunk-JMFHL7GN.cjs → chunk-VX6MZO4K.cjs} +100 -22
- package/dist/{chunk-4ACCOYBY.cjs → chunk-WHBKQZU5.cjs} +24 -8
- package/dist/{chunk-UGAN4BBW.js → chunk-WMISXERU.js} +262 -126
- package/dist/{chunk-MYW7LNB2.cjs → chunk-WROF2PVG.cjs} +40 -21
- package/dist/{chunk-5VOUUQF5.js → chunk-Y22PTPA7.js} +145 -81
- package/dist/chunk-Y2MT6PI6.js +207 -0
- package/dist/chunk-YAYSXZZZ.cjs +82 -0
- package/dist/{chunk-6LN4VVX7.js → chunk-YBGMTQ2V.js} +48 -28
- package/dist/{chunk-TYLDISRK.js → chunk-YKHIIC7M.js} +13 -6
- package/dist/{chunk-3VXGZ3SJ.js → chunk-YPMQC5HX.js} +57 -24
- package/dist/{chunk-UWL6DRZW.cjs → chunk-YUJ7Z6N2.cjs} +74 -27
- package/dist/{chunk-LEMMFFEY.cjs → chunk-ZEYK37VW.cjs} +15 -7
- package/dist/{chunk-ES7AWMNH.cjs → chunk-ZHVR4YPB.cjs} +6 -5
- package/dist/{chunk-MPOO5VPW.cjs → chunk-ZYIE3BH7.cjs} +50 -21
- package/dist/componentThemeTypes-Jt4B5aU8.d.cts +77 -0
- package/dist/componentThemeTypes-Jt4B5aU8.d.ts +77 -0
- package/dist/index.cjs +253 -206
- package/dist/index.d.cts +11 -9
- package/dist/index.d.ts +11 -9
- package/dist/index.js +56 -53
- package/dist/styles.css +1663 -695
- package/dist/{tokens-RYJ3DFTU.css → tokens-CEJVVA3G.css} +10 -0
- package/dist/tokens.css +10 -0
- package/docs/llms/appshell.md +9 -6
- package/docs/llms/autocomplete.md +8 -2
- package/docs/llms/avatar.md +2 -0
- package/docs/llms/badge.md +2 -0
- package/docs/llms/calendar.md +7 -2
- package/docs/llms/card.md +20 -1
- package/docs/llms/cascader.md +27 -5
- package/docs/llms/checkbox.md +13 -0
- package/docs/llms/collapse.md +13 -5
- package/docs/llms/colorpicker.md +4 -3
- package/docs/llms/commandpalette.md +10 -2
- package/docs/llms/contextmenu.md +14 -2
- package/docs/llms/datepicker.md +7 -0
- package/docs/llms/datetimepicker.md +7 -0
- package/docs/llms/drawer.md +27 -4
- package/docs/llms/form.md +5 -2
- package/docs/llms/icon.md +25 -1
- package/docs/llms/image.md +3 -3
- package/docs/llms/list.md +11 -0
- package/docs/llms/message.md +31 -8
- package/docs/llms/modal.md +20 -8
- package/docs/llms/pagination.md +12 -4
- package/docs/llms/popover.md +11 -1
- package/docs/llms/progress.md +1 -0
- package/docs/llms/radio.md +13 -0
- package/docs/llms/select.md +48 -2
- package/docs/llms/sidebar.md +24 -0
- package/docs/llms/slider.md +5 -2
- package/docs/llms/splitter.md +17 -3
- package/docs/llms/switch.md +13 -0
- package/docs/llms/table.md +7 -8
- package/docs/llms/tablepro.md +23 -1
- package/docs/llms/tabs.md +21 -0
- package/docs/llms/theme.md +83 -28
- package/docs/llms/themepanel.md +1 -0
- package/docs/llms/titlebar.md +1 -0
- package/docs/llms/tooltip.md +7 -2
- package/docs/llms/typography.md +27 -3
- package/docs/llms/windowcontrols.md +11 -3
- package/docs/llms.md +2 -2
- package/package.json +212 -2
- package/dist/Avatar-TNPOHVY5.css +0 -40
- package/dist/Badge-DPGLV3D3.css +0 -22
- package/dist/Card-W3ATFUJW.css +0 -77
- package/dist/Cascader-ANEQUPMI.css +0 -150
- package/dist/Checkbox-EDNPZRIP.css +0 -42
- package/dist/List-LSMU5QAC.css +0 -26
- package/dist/Pagination-YSZSNFHG.css +0 -68
- package/dist/Progress-CZNXCYGW.css +0 -80
- package/dist/Slider-UM2IZZBH.css +0 -127
- package/dist/Tag-G2XWAL7A.css +0 -42
- package/dist/chunk-262ED6WQ.cjs +0 -88
- package/dist/chunk-4HJBF4GY.js +0 -218
- package/dist/chunk-4TTRHEGM.cjs +0 -217
- package/dist/chunk-5A6KSYWA.cjs +0 -67
- package/dist/chunk-5MOYKVB7.js +0 -192
- package/dist/chunk-7IO3EOHN.cjs +0 -200
- package/dist/chunk-7QXP6DXC.cjs +0 -129
- package/dist/chunk-AAPZLBHQ.js +0 -165
- package/dist/chunk-ARUPS7JH.js +0 -66
- package/dist/chunk-ATUPFAPZ.cjs +0 -76
- package/dist/chunk-CFZVWY5N.js +0 -178
- package/dist/chunk-DSLYWX4O.js +0 -25
- package/dist/chunk-E22OIVYP.js +0 -349
- package/dist/chunk-FQJY4D3T.cjs +0 -47
- package/dist/chunk-GNV6W4BN.js +0 -495
- package/dist/chunk-HBO7ZDEQ.js +0 -29
- package/dist/chunk-I777JTTG.js +0 -150
- package/dist/chunk-IOAOG5L7.js +0 -191
- package/dist/chunk-IOUAZYK2.cjs +0 -116
- package/dist/chunk-IZHH6CVY.js +0 -123
- package/dist/chunk-JFL2WMJZ.js +0 -106
- package/dist/chunk-KMPFESEV.js +0 -41
- package/dist/chunk-KYV75JPQ.js +0 -147
- package/dist/chunk-N7OQNSII.cjs +0 -145
- package/dist/chunk-P64NPZBG.js +0 -113
- package/dist/chunk-PKNRTFNE.cjs +0 -526
- package/dist/chunk-PU7VXDAS.js +0 -64
- package/dist/chunk-RFI5R42I.cjs +0 -138
- package/dist/chunk-RR2BKV65.js +0 -39
- package/dist/chunk-RSSOX4RQ.cjs +0 -240
- package/dist/chunk-RZEFKXL3.cjs +0 -104
- package/dist/chunk-S7IHWY24.js +0 -81
- package/dist/chunk-SOQ56ZI2.cjs +0 -49
- package/dist/chunk-TBNPJPYG.cjs +0 -61
- package/dist/chunk-TJECLLN4.js +0 -344
- package/dist/chunk-ULUD3FED.cjs +0 -138
- package/dist/chunk-UW57F3UO.cjs +0 -371
- package/dist/chunk-VA2I7ZAL.cjs +0 -190
- package/dist/chunk-VS3I5OKA.cjs +0 -214
- package/dist/chunk-WMGMIE2D.js +0 -113
- package/dist/chunk-X7XP6GEI.cjs +0 -63
- package/dist/chunk-XCXUGHDF.js +0 -91
- package/dist/chunk-YAFDVNXT.js +0 -27
- package/dist/chunk-ZD3L4V3H.js +0 -54
- package/dist/chunk-ZTCRD2FL.js +0 -45
package/dist/styles.css
CHANGED
|
@@ -126,6 +126,15 @@
|
|
|
126
126
|
--dur: 220ms;
|
|
127
127
|
--dur-slow: 360ms;
|
|
128
128
|
}
|
|
129
|
+
/* 尊重系统的减少动态效果偏好,同时保持组件状态切换事件可完成。 */
|
|
130
|
+
@media (prefers-reduced-motion: reduce) {
|
|
131
|
+
:root,
|
|
132
|
+
[data-theme] {
|
|
133
|
+
--dur-fast: 0.01ms;
|
|
134
|
+
--dur: 0.01ms;
|
|
135
|
+
--dur-slow: 0.01ms;
|
|
136
|
+
}
|
|
137
|
+
}
|
|
129
138
|
/* Explicit light reset for scoped ThemeProvider instances.
|
|
130
139
|
:root already has these defaults, but nested [data-theme="light"] must not
|
|
131
140
|
inherit a dark or custom parent surface. */
|
|
@@ -259,8 +268,19 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
259
268
|
@keyframes fadeIn { from { opacity: 0; } }
|
|
260
269
|
@keyframes menuIn { from { opacity: 0; transform: translateY(-4px); } }
|
|
261
270
|
/* Components — order mirrors the original monolithic components.css section order. */
|
|
271
|
+
.named-icon.spinning > svg {
|
|
272
|
+
animation: spin 0.9s linear infinite;
|
|
273
|
+
}
|
|
274
|
+
svg[data-lumina-icon-color],
|
|
275
|
+
.named-icon[data-lumina-icon-color] {
|
|
276
|
+
color: var(--lmn-icon-fg, var(--fg));
|
|
277
|
+
}
|
|
278
|
+
@media (prefers-reduced-motion: reduce) {
|
|
279
|
+
.named-icon.spinning > svg { animation: none; }
|
|
280
|
+
}
|
|
262
281
|
/* ============ Button ============ */
|
|
263
282
|
.btn {
|
|
283
|
+
--button-bg: var(--lmn-button-bg, var(--bg));
|
|
264
284
|
display: inline-flex;
|
|
265
285
|
align-items: center;
|
|
266
286
|
justify-content: center;
|
|
@@ -272,9 +292,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
272
292
|
font-size: var(--fs-md);
|
|
273
293
|
font-weight: 500;
|
|
274
294
|
font-family: inherit;
|
|
275
|
-
color: var(--fg);
|
|
276
|
-
background: var(--bg);
|
|
277
|
-
box-shadow: var(--neu-shadow-control);
|
|
295
|
+
color: var(--lmn-button-fg, var(--fg));
|
|
296
|
+
background: var(--button-bg);
|
|
297
|
+
box-shadow: var(--lmn-button-neu-shadow-control, var(--neu-shadow-control));
|
|
278
298
|
cursor: pointer;
|
|
279
299
|
user-select: none;
|
|
280
300
|
white-space: nowrap;
|
|
@@ -305,40 +325,42 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
305
325
|
overflow: visible;
|
|
306
326
|
}
|
|
307
327
|
.btn.primary {
|
|
308
|
-
|
|
309
|
-
|
|
328
|
+
--button-bg: color-mix(in oklch, var(--lmn-button-accent-soft, var(--accent-soft)) 62%, var(--lmn-button-bg, var(--bg)));
|
|
329
|
+
color: var(--lmn-button-accent-ink, var(--accent-ink));
|
|
330
|
+
background: var(--button-bg);
|
|
310
331
|
font-weight: 600;
|
|
311
332
|
}
|
|
312
333
|
.btn.ghost {
|
|
313
334
|
background: transparent;
|
|
314
335
|
box-shadow: none;
|
|
315
|
-
color: var(--fg-muted);
|
|
336
|
+
color: var(--lmn-button-fg-muted, var(--fg-muted));
|
|
316
337
|
}
|
|
317
|
-
.btn.danger { color: var(--danger); }
|
|
338
|
+
.btn.danger { color: var(--lmn-button-danger, var(--danger)); }
|
|
318
339
|
.btn:hover {
|
|
319
|
-
|
|
340
|
+
background: var(--lmn-button-hover-background, var(--button-bg));
|
|
341
|
+
box-shadow: var(--lmn-button-neu-shadow-panel, var(--neu-shadow-panel));
|
|
320
342
|
}
|
|
321
343
|
.btn.ghost:hover {
|
|
322
|
-
background: var(--bg);
|
|
344
|
+
background: var(--lmn-button-hover-background, var(--lmn-button-bg, var(--bg)));
|
|
323
345
|
border-color: transparent;
|
|
324
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
325
|
-
color: var(--fg);
|
|
346
|
+
box-shadow: var(--lmn-button-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
347
|
+
color: var(--lmn-button-fg, var(--fg));
|
|
326
348
|
}
|
|
327
349
|
.btn.danger:hover {
|
|
328
|
-
color: var(--danger);
|
|
350
|
+
color: var(--lmn-button-danger, var(--danger));
|
|
329
351
|
}
|
|
330
352
|
.btn:active,
|
|
331
353
|
.btn.pressed {
|
|
332
|
-
box-shadow: var(--neu-shadow-inset-strong);
|
|
354
|
+
box-shadow: var(--lmn-button-neu-shadow-inset-strong, var(--neu-shadow-inset-strong));
|
|
333
355
|
}
|
|
334
356
|
.btn.ghost:active,
|
|
335
357
|
.btn.ghost.pressed {
|
|
336
|
-
background: var(--bg);
|
|
337
|
-
color: var(--fg);
|
|
358
|
+
background: var(--lmn-button-bg, var(--bg));
|
|
359
|
+
color: var(--lmn-button-fg, var(--fg));
|
|
338
360
|
}
|
|
339
361
|
.btn.danger:active,
|
|
340
362
|
.btn.danger.pressed {
|
|
341
|
-
color: var(--danger);
|
|
363
|
+
color: var(--lmn-button-danger, var(--danger));
|
|
342
364
|
}
|
|
343
365
|
.btn.icon { width: var(--ctrl-h); padding: 0; }
|
|
344
366
|
.btn.sm { height: var(--ctrl-h-sm); padding: 0 var(--ctrl-pad-x-sm); font-size: var(--fs-sm); border-radius: var(--r-sm); }
|
|
@@ -347,17 +369,17 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
347
369
|
.btn.lg.icon { width: var(--ctrl-h-lg); padding: 0; }
|
|
348
370
|
.btn.block { width: 100%; flex-shrink: 1; }
|
|
349
371
|
.btn[disabled], .btn.disabled, .btn:disabled {
|
|
350
|
-
color: var(--fg-subtle);
|
|
372
|
+
color: var(--lmn-button-fg-subtle, var(--fg-subtle));
|
|
351
373
|
cursor: not-allowed;
|
|
352
374
|
border-color: transparent;
|
|
353
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
375
|
+
box-shadow: var(--lmn-button-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
354
376
|
transform: none;
|
|
355
377
|
}
|
|
356
378
|
.btn[disabled]:hover, .btn:disabled:hover, .btn.disabled:hover {
|
|
357
|
-
color: var(--fg-subtle);
|
|
358
|
-
background: var(--bg);
|
|
379
|
+
color: var(--lmn-button-fg-subtle, var(--fg-subtle));
|
|
380
|
+
background: var(--lmn-button-bg, var(--bg));
|
|
359
381
|
border-color: transparent;
|
|
360
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
382
|
+
box-shadow: var(--lmn-button-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
361
383
|
transform: none;
|
|
362
384
|
}
|
|
363
385
|
.btn.loading { cursor: wait; }
|
|
@@ -369,6 +391,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
369
391
|
animation: spin 0.8s linear infinite;
|
|
370
392
|
display: inline-block;
|
|
371
393
|
}
|
|
394
|
+
@media (prefers-reduced-motion: reduce) {
|
|
395
|
+
.btn .spinner { animation: none; }
|
|
396
|
+
}
|
|
372
397
|
/* ============ Input ============ */
|
|
373
398
|
.input-shell {
|
|
374
399
|
display: inline-flex;
|
|
@@ -378,7 +403,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
378
403
|
}
|
|
379
404
|
.input-count {
|
|
380
405
|
font-size: var(--fs-xs);
|
|
381
|
-
color: var(--fg-subtle);
|
|
406
|
+
color: var(--lmn-input-fg-subtle, var(--fg-subtle));
|
|
382
407
|
font-variant-numeric: tabular-nums;
|
|
383
408
|
text-align: right;
|
|
384
409
|
}
|
|
@@ -390,19 +415,19 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
390
415
|
height: var(--ctrl-h);
|
|
391
416
|
padding: 0 var(--ctrl-pad-x);
|
|
392
417
|
border-radius: var(--r-md);
|
|
393
|
-
background: var(--bg);
|
|
394
|
-
box-shadow: var(--neu-shadow-inset);
|
|
418
|
+
background: var(--lmn-input-bg, var(--bg));
|
|
419
|
+
box-shadow: var(--lmn-input-neu-shadow-inset, var(--neu-shadow-inset));
|
|
395
420
|
transition: box-shadow var(--dur) var(--ease);
|
|
396
421
|
gap: 8px;
|
|
397
422
|
}
|
|
398
423
|
.input-wrap.sm { height: var(--field-h-sm); padding: 0 var(--ctrl-pad-x-sm); border-radius: var(--r-sm); gap: 6px; }
|
|
399
424
|
.input-wrap.lg { height: var(--field-h-lg); padding: 0 var(--ctrl-pad-x); border-radius: var(--r-lg); gap: 10px; }
|
|
400
|
-
.input-wrap:focus-within { box-shadow: var(--neu-shadow-inset), 0 0 0 2px var(--accent-glow); }
|
|
401
|
-
.input-wrap.invalid { box-shadow: var(--neu-shadow-inset), 0 0 0 2px color-mix(in oklch, var(--danger) 30%, transparent); }
|
|
425
|
+
.input-wrap:focus-within { box-shadow: var(--lmn-input-neu-shadow-inset, var(--neu-shadow-inset)), 0 0 0 2px var(--lmn-input-accent-glow, var(--accent-glow)); }
|
|
426
|
+
.input-wrap.invalid { box-shadow: var(--lmn-input-neu-shadow-inset, var(--neu-shadow-inset)), 0 0 0 2px color-mix(in oklch, var(--lmn-input-danger, var(--danger)) 30%, transparent); }
|
|
402
427
|
.input-wrap.disabled { opacity: 0.6; cursor: not-allowed; }
|
|
403
428
|
.input-wrap .lead,
|
|
404
429
|
.input-wrap .trail {
|
|
405
|
-
color: var(--fg-subtle);
|
|
430
|
+
color: var(--lmn-input-fg-subtle, var(--fg-subtle));
|
|
406
431
|
flex-shrink: 0;
|
|
407
432
|
display: inline-flex;
|
|
408
433
|
align-items: center;
|
|
@@ -418,13 +443,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
418
443
|
}
|
|
419
444
|
.input-wrap .lead.interactive,
|
|
420
445
|
.input-wrap .trail.interactive { cursor: pointer; pointer-events: auto; }
|
|
421
|
-
.input-wrap .trail:hover { color: var(--fg); }
|
|
446
|
+
.input-wrap .trail:hover { color: var(--lmn-input-fg, var(--fg)); }
|
|
422
447
|
.input-wrap .lead:not(.interactive),
|
|
423
448
|
.input-wrap .trail:not(.interactive) { pointer-events: none; }
|
|
424
449
|
.input-wrap .input-affix {
|
|
425
450
|
display: inline-flex;
|
|
426
451
|
align-items: center;
|
|
427
|
-
color: var(--fg-muted);
|
|
452
|
+
color: var(--lmn-input-fg-muted, var(--fg-muted));
|
|
428
453
|
font-size: var(--fs-md);
|
|
429
454
|
white-space: nowrap;
|
|
430
455
|
user-select: none;
|
|
@@ -439,20 +464,20 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
439
464
|
width: 18px;
|
|
440
465
|
height: 18px;
|
|
441
466
|
border-radius: 999px;
|
|
442
|
-
color: var(--fg-subtle);
|
|
467
|
+
color: var(--lmn-input-fg-subtle, var(--fg-subtle));
|
|
443
468
|
background: transparent;
|
|
444
469
|
cursor: pointer;
|
|
445
470
|
flex-shrink: 0;
|
|
446
471
|
transition: color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease);
|
|
447
472
|
}
|
|
448
473
|
.input-wrap .input-clear:hover {
|
|
449
|
-
color: var(--fg);
|
|
450
|
-
background: var(--bg-sunken);
|
|
474
|
+
color: var(--lmn-input-fg, var(--fg));
|
|
475
|
+
background: var(--lmn-input-bg-sunken, var(--bg-sunken));
|
|
451
476
|
}
|
|
452
477
|
.input-password-toggle {
|
|
453
478
|
border: none;
|
|
454
479
|
background: transparent;
|
|
455
|
-
color: var(--fg-subtle);
|
|
480
|
+
color: var(--lmn-input-fg-subtle, var(--fg-subtle));
|
|
456
481
|
padding: 0;
|
|
457
482
|
display: inline-flex;
|
|
458
483
|
align-items: center;
|
|
@@ -461,7 +486,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
461
486
|
font-family: inherit;
|
|
462
487
|
flex-shrink: 0;
|
|
463
488
|
}
|
|
464
|
-
.input-password-toggle:hover { color: var(--fg); }
|
|
489
|
+
.input-password-toggle:hover { color: var(--lmn-input-fg, var(--fg)); }
|
|
465
490
|
.input-wrap > .input {
|
|
466
491
|
flex: 1;
|
|
467
492
|
min-width: 0;
|
|
@@ -471,15 +496,105 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
471
496
|
border: none;
|
|
472
497
|
background: transparent;
|
|
473
498
|
box-shadow: none;
|
|
474
|
-
color: var(--fg);
|
|
499
|
+
color: var(--lmn-input-fg, var(--fg));
|
|
475
500
|
font-size: var(--fs-md);
|
|
476
501
|
font-family: inherit;
|
|
477
502
|
outline: none;
|
|
478
503
|
}
|
|
479
504
|
.input-wrap.sm > .input { font-size: var(--fs-sm); }
|
|
480
505
|
.input-wrap.lg > .input { font-size: var(--fs-lg); }
|
|
481
|
-
.input-wrap > .input::placeholder { color: var(--fg-subtle); }
|
|
506
|
+
.input-wrap > .input::placeholder { color: var(--lmn-input-fg-subtle, var(--fg-subtle)); }
|
|
482
507
|
.input-wrap.disabled > .input { cursor: not-allowed; }
|
|
508
|
+
/* ============ InputNumber ============ */
|
|
509
|
+
.ipn-steppers {
|
|
510
|
+
display: inline-flex;
|
|
511
|
+
flex-direction: column;
|
|
512
|
+
align-self: stretch;
|
|
513
|
+
margin: 4px -6px 4px 6px;
|
|
514
|
+
width: 16px;
|
|
515
|
+
border-left: 1px solid var(--lmn-input-divider, var(--divider));
|
|
516
|
+
overflow: hidden;
|
|
517
|
+
border-top-right-radius: calc(var(--r-md) - 4px);
|
|
518
|
+
border-bottom-right-radius: calc(var(--r-md) - 4px);
|
|
519
|
+
}
|
|
520
|
+
.input-wrap.sm .ipn-steppers { margin: 3px -4px 3px 6px; width: 14px; }
|
|
521
|
+
.input-wrap.lg .ipn-steppers { margin: 5px -6px 5px 8px; width: 18px; }
|
|
522
|
+
.ipn-step {
|
|
523
|
+
flex: 1;
|
|
524
|
+
display: inline-flex;
|
|
525
|
+
align-items: center;
|
|
526
|
+
justify-content: center;
|
|
527
|
+
padding: 0;
|
|
528
|
+
border: none;
|
|
529
|
+
background: transparent;
|
|
530
|
+
color: var(--lmn-input-fg-subtle, var(--fg-subtle));
|
|
531
|
+
cursor: pointer;
|
|
532
|
+
transition: color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease);
|
|
533
|
+
}
|
|
534
|
+
.ipn-step.up:not(.down) { border-bottom: 1px solid var(--lmn-input-divider, var(--divider)); }
|
|
535
|
+
.ipn-step.up { border-bottom: 1px solid var(--lmn-input-divider, var(--divider)); }
|
|
536
|
+
.ipn-step:hover:not(:disabled) {
|
|
537
|
+
color: var(--lmn-input-accent-ink, var(--accent-ink));
|
|
538
|
+
background: var(--lmn-input-bg-sunken, var(--bg-sunken));
|
|
539
|
+
}
|
|
540
|
+
.ipn-step:active:not(:disabled) {
|
|
541
|
+
color: var(--lmn-input-accent, var(--accent));
|
|
542
|
+
}
|
|
543
|
+
.ipn-step:disabled {
|
|
544
|
+
cursor: not-allowed;
|
|
545
|
+
opacity: 0.35;
|
|
546
|
+
}
|
|
547
|
+
/* ============ AutoComplete ============ */
|
|
548
|
+
.autocomplete {
|
|
549
|
+
display: inline-block;
|
|
550
|
+
width: 100%;
|
|
551
|
+
position: relative;
|
|
552
|
+
}
|
|
553
|
+
.autocomplete-panel {
|
|
554
|
+
z-index: 1500;
|
|
555
|
+
background: var(--lmn-auto-complete-bg, var(--bg));
|
|
556
|
+
border-radius: var(--r-md);
|
|
557
|
+
box-shadow: var(--lmn-auto-complete-neu-shadow-float, var(--neu-shadow-float));
|
|
558
|
+
padding: 6px;
|
|
559
|
+
max-height: 280px;
|
|
560
|
+
overflow-y: auto;
|
|
561
|
+
animation: menuIn var(--dur) var(--ease);
|
|
562
|
+
display: flex;
|
|
563
|
+
flex-direction: column;
|
|
564
|
+
gap: 1px;
|
|
565
|
+
}
|
|
566
|
+
.autocomplete-item {
|
|
567
|
+
display: flex;
|
|
568
|
+
align-items: center;
|
|
569
|
+
width: 100%;
|
|
570
|
+
padding: 8px 10px;
|
|
571
|
+
border: none;
|
|
572
|
+
background: transparent;
|
|
573
|
+
box-shadow: none;
|
|
574
|
+
color: var(--lmn-auto-complete-fg, var(--fg));
|
|
575
|
+
font: inherit;
|
|
576
|
+
font-size: 13px;
|
|
577
|
+
text-align: left;
|
|
578
|
+
border-radius: var(--r-sm);
|
|
579
|
+
cursor: pointer;
|
|
580
|
+
transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease),
|
|
581
|
+
box-shadow var(--dur-fast) var(--ease);
|
|
582
|
+
}
|
|
583
|
+
.autocomplete-item:disabled {
|
|
584
|
+
color: var(--lmn-auto-complete-fg-subtle, var(--fg-subtle));
|
|
585
|
+
cursor: not-allowed;
|
|
586
|
+
}
|
|
587
|
+
.autocomplete-item.active:not(:disabled) {
|
|
588
|
+
background: var(--lmn-auto-complete-bg, var(--bg));
|
|
589
|
+
color: var(--lmn-auto-complete-accent-ink, var(--accent-ink));
|
|
590
|
+
box-shadow: var(--lmn-auto-complete-neu-shadow-inset, var(--neu-shadow-inset));
|
|
591
|
+
}
|
|
592
|
+
.autocomplete-empty {
|
|
593
|
+
padding: 16px 12px;
|
|
594
|
+
text-align: center;
|
|
595
|
+
color: var(--lmn-auto-complete-fg-subtle, var(--fg-subtle));
|
|
596
|
+
font-size: 13px;
|
|
597
|
+
}
|
|
483
598
|
/* ============ Textarea ============ */
|
|
484
599
|
.textarea-shell {
|
|
485
600
|
display: inline-flex;
|
|
@@ -489,7 +604,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
489
604
|
}
|
|
490
605
|
.textarea-count {
|
|
491
606
|
font-size: 11px;
|
|
492
|
-
color: var(--fg-subtle);
|
|
607
|
+
color: var(--lmn-textarea-fg-subtle, var(--fg-subtle));
|
|
493
608
|
font-variant-numeric: tabular-nums;
|
|
494
609
|
text-align: right;
|
|
495
610
|
}
|
|
@@ -504,14 +619,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
504
619
|
width: 18px;
|
|
505
620
|
height: 18px;
|
|
506
621
|
border-radius: 999px;
|
|
507
|
-
color: var(--fg-subtle);
|
|
622
|
+
color: var(--lmn-textarea-fg-subtle, var(--fg-subtle));
|
|
508
623
|
background: transparent;
|
|
509
624
|
cursor: pointer;
|
|
510
625
|
transition: color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease);
|
|
511
626
|
}
|
|
512
627
|
.textarea-wrap .textarea-clear:hover {
|
|
513
|
-
color: var(--fg);
|
|
514
|
-
background: var(--bg-sunken);
|
|
628
|
+
color: var(--lmn-textarea-fg, var(--fg));
|
|
629
|
+
background: var(--lmn-textarea-bg-sunken, var(--bg-sunken));
|
|
515
630
|
}
|
|
516
631
|
.textarea {
|
|
517
632
|
width: 100%;
|
|
@@ -519,9 +634,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
519
634
|
padding: 12px 14px;
|
|
520
635
|
border: none;
|
|
521
636
|
border-radius: var(--r-md);
|
|
522
|
-
background: var(--bg);
|
|
523
|
-
box-shadow: var(--neu-shadow-inset);
|
|
524
|
-
color: var(--fg);
|
|
637
|
+
background: var(--lmn-textarea-bg, var(--bg));
|
|
638
|
+
box-shadow: var(--lmn-textarea-neu-shadow-inset, var(--neu-shadow-inset));
|
|
639
|
+
color: var(--lmn-textarea-fg, var(--fg));
|
|
525
640
|
font-size: 13px;
|
|
526
641
|
font-family: inherit;
|
|
527
642
|
line-height: 1.55;
|
|
@@ -529,9 +644,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
529
644
|
outline: none;
|
|
530
645
|
transition: box-shadow var(--dur) var(--ease);
|
|
531
646
|
}
|
|
532
|
-
.textarea:focus { box-shadow: var(--neu-shadow-inset), 0 0 0 2px var(--accent-glow); }
|
|
533
|
-
.textarea.invalid { box-shadow: var(--neu-shadow-inset), 0 0 0 2px color-mix(in oklch, var(--danger) 30%, transparent); }
|
|
534
|
-
.textarea::placeholder { color: var(--fg-subtle); }
|
|
647
|
+
.textarea:focus { box-shadow: var(--lmn-textarea-neu-shadow-inset, var(--neu-shadow-inset)), 0 0 0 2px var(--lmn-textarea-accent-glow, var(--accent-glow)); }
|
|
648
|
+
.textarea.invalid { box-shadow: var(--lmn-textarea-neu-shadow-inset, var(--neu-shadow-inset)), 0 0 0 2px color-mix(in oklch, var(--lmn-textarea-danger, var(--danger)) 30%, transparent); }
|
|
649
|
+
.textarea::placeholder { color: var(--lmn-textarea-fg-subtle, var(--fg-subtle)); }
|
|
535
650
|
/* ============ Switch ============ */
|
|
536
651
|
.switch {
|
|
537
652
|
--w: 46px;
|
|
@@ -540,11 +655,19 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
540
655
|
align-items: center;
|
|
541
656
|
gap: 10px;
|
|
542
657
|
font-size: 13px;
|
|
543
|
-
color: var(--fg);
|
|
658
|
+
color: var(--lmn-switch-fg, var(--fg));
|
|
544
659
|
cursor: pointer;
|
|
545
660
|
user-select: none;
|
|
546
661
|
}
|
|
547
662
|
.switch.disabled { opacity: 0.5; cursor: not-allowed; }
|
|
663
|
+
.switch-native {
|
|
664
|
+
position: absolute;
|
|
665
|
+
width: 1px;
|
|
666
|
+
height: 1px;
|
|
667
|
+
opacity: 0;
|
|
668
|
+
pointer-events: none;
|
|
669
|
+
}
|
|
670
|
+
.switch:focus-within .switch-track { outline: 2px solid var(--lmn-switch-accent, var(--accent)); outline-offset: 2px; }
|
|
548
671
|
.switch-track {
|
|
549
672
|
position: relative;
|
|
550
673
|
width: var(--w);
|
|
@@ -552,8 +675,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
552
675
|
border: none;
|
|
553
676
|
padding: 0;
|
|
554
677
|
border-radius: 999px;
|
|
555
|
-
background: var(--bg);
|
|
556
|
-
box-shadow: var(--neu-shadow-inset);
|
|
678
|
+
background: var(--lmn-switch-bg, var(--bg));
|
|
679
|
+
box-shadow: var(--lmn-switch-neu-shadow-inset, var(--neu-shadow-inset));
|
|
557
680
|
cursor: inherit;
|
|
558
681
|
flex-shrink: 0;
|
|
559
682
|
transition: all var(--dur) var(--ease);
|
|
@@ -571,15 +694,15 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
571
694
|
width: calc(var(--h) - 6px);
|
|
572
695
|
height: calc(var(--h) - 6px);
|
|
573
696
|
border-radius: 999px;
|
|
574
|
-
background: var(--bg-raised);
|
|
575
|
-
box-shadow: var(--neu-shadow-control);
|
|
697
|
+
background: var(--lmn-switch-bg-raised, var(--bg-raised));
|
|
698
|
+
box-shadow: var(--lmn-switch-neu-shadow-control, var(--neu-shadow-control));
|
|
576
699
|
transition: all var(--dur) var(--ease);
|
|
577
700
|
z-index: 1;
|
|
578
701
|
}
|
|
579
702
|
.switch.on .switch-thumb {
|
|
580
703
|
transform: translateX(calc(var(--w) - var(--h)));
|
|
581
|
-
background: var(--accent);
|
|
582
|
-
box-shadow: 0 2px 8px var(--accent-glow), 0 0 0 1px color-mix(in oklch, var(--accent) 40%, transparent);
|
|
704
|
+
background: var(--lmn-switch-accent, var(--accent));
|
|
705
|
+
box-shadow: 0 2px 8px var(--lmn-switch-accent-glow, var(--accent-glow)), 0 0 0 1px color-mix(in oklch, var(--lmn-switch-accent, var(--accent)) 40%, transparent);
|
|
583
706
|
}
|
|
584
707
|
/* Inline content (checkedChildren / unCheckedChildren) */
|
|
585
708
|
.switch-inner {
|
|
@@ -617,7 +740,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
617
740
|
.switch-inner-off {
|
|
618
741
|
right: 8px;
|
|
619
742
|
left: calc(var(--h) - 2px);
|
|
620
|
-
color: var(--fg-muted);
|
|
743
|
+
color: var(--lmn-switch-fg-muted, var(--fg-muted));
|
|
621
744
|
opacity: 1;
|
|
622
745
|
transform: translateX(0);
|
|
623
746
|
}
|
|
@@ -633,37 +756,45 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
633
756
|
cursor: pointer;
|
|
634
757
|
user-select: none;
|
|
635
758
|
font-size: 13px;
|
|
636
|
-
color: var(--fg);
|
|
759
|
+
color: var(--lmn-checkbox-fg, var(--fg));
|
|
637
760
|
}
|
|
638
761
|
.checkbox.disabled { opacity: 0.5; cursor: not-allowed; }
|
|
762
|
+
.checkbox-native {
|
|
763
|
+
position: absolute;
|
|
764
|
+
width: 1px;
|
|
765
|
+
height: 1px;
|
|
766
|
+
opacity: 0;
|
|
767
|
+
pointer-events: none;
|
|
768
|
+
}
|
|
769
|
+
.checkbox:focus-within .checkbox-box { outline: 2px solid var(--lmn-checkbox-accent, var(--accent)); outline-offset: 2px; }
|
|
639
770
|
.checkbox-box {
|
|
640
771
|
width: 20px; height: 20px;
|
|
641
772
|
border: none;
|
|
642
773
|
padding: 0;
|
|
643
774
|
border-radius: 7px;
|
|
644
|
-
background: var(--bg);
|
|
645
|
-
box-shadow: var(--neu-shadow-inset);
|
|
775
|
+
background: var(--lmn-checkbox-bg, var(--bg));
|
|
776
|
+
box-shadow: var(--lmn-checkbox-neu-shadow-inset, var(--neu-shadow-inset));
|
|
646
777
|
display: grid;
|
|
647
778
|
place-items: center;
|
|
648
779
|
flex-shrink: 0;
|
|
649
780
|
cursor: inherit;
|
|
650
|
-
color: var(--bg);
|
|
781
|
+
color: var(--lmn-checkbox-bg, var(--bg));
|
|
651
782
|
transition: all var(--dur) var(--ease);
|
|
652
783
|
}
|
|
653
784
|
.checkbox-box svg { opacity: 0; transform: scale(0.6); transition: all var(--dur) var(--ease); }
|
|
654
785
|
.checkbox.checked .checkbox-box {
|
|
655
|
-
background: var(--accent);
|
|
656
|
-
box-shadow: var(--neu-shadow-control), 0 2px 8px var(--accent-glow);
|
|
786
|
+
background: var(--lmn-checkbox-accent, var(--accent));
|
|
787
|
+
box-shadow: var(--lmn-checkbox-neu-shadow-control, var(--neu-shadow-control)), 0 2px 8px var(--lmn-checkbox-accent-glow, var(--accent-glow));
|
|
657
788
|
}
|
|
658
789
|
.checkbox.checked .checkbox-box svg { opacity: 1; transform: scale(1); }
|
|
659
790
|
.checkbox.indeterminate .checkbox-box {
|
|
660
|
-
background: var(--accent);
|
|
661
|
-
box-shadow: var(--neu-shadow-control), 0 2px 8px var(--accent-glow);
|
|
791
|
+
background: var(--lmn-checkbox-accent, var(--accent));
|
|
792
|
+
box-shadow: var(--lmn-checkbox-neu-shadow-control, var(--neu-shadow-control)), 0 2px 8px var(--lmn-checkbox-accent-glow, var(--accent-glow));
|
|
662
793
|
}
|
|
663
794
|
.checkbox.indeterminate .checkbox-box::after {
|
|
664
795
|
content: "";
|
|
665
796
|
width: 10px; height: 2px;
|
|
666
|
-
background: var(--bg);
|
|
797
|
+
background: var(--lmn-checkbox-bg, var(--bg));
|
|
667
798
|
border-radius: 2px;
|
|
668
799
|
}
|
|
669
800
|
.checkbox.indeterminate .checkbox-box svg { display: none; }
|
|
@@ -675,24 +806,32 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
675
806
|
cursor: pointer;
|
|
676
807
|
user-select: none;
|
|
677
808
|
font-size: 13px;
|
|
678
|
-
color: var(--fg);
|
|
809
|
+
color: var(--lmn-radio-fg, var(--fg));
|
|
679
810
|
}
|
|
680
811
|
.radio.disabled { opacity: 0.5; cursor: not-allowed; }
|
|
812
|
+
.radio-native {
|
|
813
|
+
position: absolute;
|
|
814
|
+
width: 1px;
|
|
815
|
+
height: 1px;
|
|
816
|
+
opacity: 0;
|
|
817
|
+
pointer-events: none;
|
|
818
|
+
}
|
|
819
|
+
.radio:focus-within .radio-dot { outline: 2px solid var(--lmn-radio-accent, var(--accent)); outline-offset: 2px; }
|
|
681
820
|
.radio-dot {
|
|
682
821
|
width: 20px; height: 20px;
|
|
683
822
|
border: none;
|
|
684
823
|
padding: 0;
|
|
685
824
|
border-radius: 999px;
|
|
686
|
-
background: var(--bg);
|
|
687
|
-
box-shadow: var(--neu-shadow-inset);
|
|
825
|
+
background: var(--lmn-radio-bg, var(--bg));
|
|
826
|
+
box-shadow: var(--lmn-radio-neu-shadow-inset, var(--neu-shadow-inset));
|
|
688
827
|
cursor: inherit;
|
|
689
828
|
position: relative;
|
|
690
829
|
flex-shrink: 0;
|
|
691
830
|
transition: all var(--dur) var(--ease);
|
|
692
831
|
}
|
|
693
832
|
.radio.checked .radio-dot {
|
|
694
|
-
background: var(--accent);
|
|
695
|
-
box-shadow: var(--neu-shadow-control), 0 2px 8px var(--accent-glow);
|
|
833
|
+
background: var(--lmn-radio-accent, var(--accent));
|
|
834
|
+
box-shadow: var(--lmn-radio-neu-shadow-control, var(--neu-shadow-control)), 0 2px 8px var(--lmn-radio-accent-glow, var(--accent-glow));
|
|
696
835
|
}
|
|
697
836
|
.radio.checked .radio-dot::after {
|
|
698
837
|
content: "";
|
|
@@ -701,7 +840,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
701
840
|
transform: translate(-50%, -50%);
|
|
702
841
|
width: 8px; height: 8px;
|
|
703
842
|
border-radius: 999px;
|
|
704
|
-
background: var(--bg);
|
|
843
|
+
background: var(--lmn-radio-bg, var(--bg));
|
|
705
844
|
}
|
|
706
845
|
.radio-group { display: flex; gap: 14px; }
|
|
707
846
|
.radio-group.vertical { flex-direction: column; gap: 10px; }
|
|
@@ -711,8 +850,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
711
850
|
display: inline-flex;
|
|
712
851
|
padding: 4px;
|
|
713
852
|
border-radius: var(--r-md);
|
|
714
|
-
background: var(--bg);
|
|
715
|
-
box-shadow: var(--neu-shadow-inset);
|
|
853
|
+
background: var(--lmn-radio-bg, var(--bg));
|
|
854
|
+
box-shadow: var(--lmn-radio-neu-shadow-inset, var(--neu-shadow-inset));
|
|
716
855
|
gap: 2px;
|
|
717
856
|
flex-wrap: nowrap;
|
|
718
857
|
}
|
|
@@ -722,14 +861,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
722
861
|
height: 32px;
|
|
723
862
|
padding: 6px 14px;
|
|
724
863
|
border-radius: calc(var(--r-md) - 4px);
|
|
725
|
-
color: var(--fg-muted);
|
|
864
|
+
color: var(--lmn-radio-fg-muted, var(--fg-muted));
|
|
726
865
|
font-size: 12px;
|
|
727
866
|
gap: 6px;
|
|
728
867
|
transition: all var(--dur-fast) var(--ease);
|
|
729
868
|
}
|
|
730
|
-
.radio-group.segmented .radio:hover { color: var(--fg); }
|
|
869
|
+
.radio-group.segmented .radio:hover { color: var(--lmn-radio-fg, var(--fg)); }
|
|
731
870
|
.radio-group.segmented .radio.checked {
|
|
732
|
-
color: var(--accent-ink);
|
|
871
|
+
color: var(--lmn-radio-accent-ink, var(--accent-ink));
|
|
733
872
|
font-weight: 600;
|
|
734
873
|
}
|
|
735
874
|
.radio-group.segmented .radio-dot { display: none; }
|
|
@@ -743,8 +882,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
743
882
|
bottom: 4px;
|
|
744
883
|
left: 0;
|
|
745
884
|
border-radius: calc(var(--r-md) - 4px);
|
|
746
|
-
background: var(--bg);
|
|
747
|
-
box-shadow: var(--neu-shadow-control);
|
|
885
|
+
background: var(--lmn-radio-bg, var(--bg));
|
|
886
|
+
box-shadow: var(--lmn-radio-neu-shadow-control, var(--neu-shadow-control));
|
|
748
887
|
pointer-events: none;
|
|
749
888
|
transition:
|
|
750
889
|
transform var(--dur-slow) var(--ease),
|
|
@@ -782,16 +921,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
782
921
|
width: 100%;
|
|
783
922
|
height: 10px;
|
|
784
923
|
border-radius: 999px;
|
|
785
|
-
background: var(--bg);
|
|
786
|
-
box-shadow: var(--neu-shadow-inset);
|
|
924
|
+
background: var(--lmn-slider-bg, var(--bg));
|
|
925
|
+
box-shadow: var(--lmn-slider-neu-shadow-inset, var(--neu-shadow-inset));
|
|
787
926
|
touch-action: none;
|
|
788
927
|
z-index: 1;
|
|
789
928
|
}
|
|
790
929
|
.slider-fill {
|
|
791
930
|
position: absolute;
|
|
792
931
|
top: 0; bottom: 0;
|
|
793
|
-
background: linear-gradient(90deg, color-mix(in oklch, var(--accent) 70%, white), var(--accent));
|
|
794
|
-
box-shadow: 0 0 12px var(--accent-glow);
|
|
932
|
+
background: linear-gradient(90deg, color-mix(in oklch, var(--lmn-slider-accent, var(--accent)) 70%, white), var(--lmn-slider-accent, var(--accent)));
|
|
933
|
+
box-shadow: 0 0 12px var(--lmn-slider-accent-glow, var(--accent-glow));
|
|
795
934
|
border-radius: 999px;
|
|
796
935
|
transition: left var(--dur-fast) var(--ease), right var(--dur-fast) var(--ease);
|
|
797
936
|
pointer-events: none;
|
|
@@ -801,8 +940,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
801
940
|
top: 50%;
|
|
802
941
|
width: 22px; height: 22px;
|
|
803
942
|
border-radius: 999px;
|
|
804
|
-
background: var(--bg-raised);
|
|
805
|
-
box-shadow: var(--neu-shadow-control);
|
|
943
|
+
background: var(--lmn-slider-bg-raised, var(--bg-raised));
|
|
944
|
+
box-shadow: var(--lmn-slider-neu-shadow-control, var(--neu-shadow-control));
|
|
806
945
|
transform: translate(-50%, -50%);
|
|
807
946
|
transition: all var(--dur-fast) var(--ease);
|
|
808
947
|
display: grid; place-items: center;
|
|
@@ -814,29 +953,29 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
814
953
|
content: "";
|
|
815
954
|
width: 6px; height: 6px;
|
|
816
955
|
border-radius: 999px;
|
|
817
|
-
background: var(--slider-thumb-color, var(--accent));
|
|
956
|
+
background: var(--slider-thumb-color, var(--lmn-slider-accent, var(--accent)));
|
|
818
957
|
}
|
|
819
958
|
.slider-thumb:focus-visible {
|
|
820
|
-
box-shadow: var(--neu-shadow-control), 0 0 0 3px var(--accent-glow);
|
|
959
|
+
box-shadow: var(--lmn-slider-neu-shadow-control, var(--neu-shadow-control)), 0 0 0 3px var(--lmn-slider-accent-glow, var(--accent-glow));
|
|
821
960
|
}
|
|
822
961
|
.slider:hover .slider-thumb { transform: translate(-50%, -50%) scale(1.08); }
|
|
823
962
|
.slider-value {
|
|
824
963
|
font-family: var(--font-mono);
|
|
825
964
|
font-size: 12px;
|
|
826
|
-
color: var(--accent-ink);
|
|
965
|
+
color: var(--lmn-slider-accent-ink, var(--accent-ink));
|
|
827
966
|
flex-shrink: 0;
|
|
828
967
|
white-space: nowrap;
|
|
829
968
|
}
|
|
830
969
|
/* Tone variants */
|
|
831
|
-
.slider.success .slider-thumb { --slider-thumb-color: var(--success); }
|
|
832
|
-
.slider.success .slider-fill { background: linear-gradient(90deg, color-mix(in oklch, var(--success) 70%, white), var(--success)); box-shadow: 0 0 10px color-mix(in oklch, var(--success) 35%, transparent); }
|
|
833
|
-
.slider.success .slider-thumb:focus-visible { box-shadow: var(--neu-shadow-control), 0 0 0 3px color-mix(in oklch, var(--success) 35%, transparent); }
|
|
834
|
-
.slider.warning .slider-thumb { --slider-thumb-color: var(--warning); }
|
|
835
|
-
.slider.warning .slider-fill { background: linear-gradient(90deg, color-mix(in oklch, var(--warning) 70%, white), var(--warning)); box-shadow: 0 0 10px color-mix(in oklch, var(--warning) 35%, transparent); }
|
|
836
|
-
.slider.warning .slider-thumb:focus-visible { box-shadow: var(--neu-shadow-control), 0 0 0 3px color-mix(in oklch, var(--warning) 35%, transparent); }
|
|
837
|
-
.slider.danger .slider-thumb { --slider-thumb-color: var(--danger); }
|
|
838
|
-
.slider.danger .slider-fill { background: linear-gradient(90deg, color-mix(in oklch, var(--danger) 70%, white), var(--danger)); box-shadow: 0 0 10px color-mix(in oklch, var(--danger) 35%, transparent); }
|
|
839
|
-
.slider.danger .slider-thumb:focus-visible { box-shadow: var(--neu-shadow-control), 0 0 0 3px color-mix(in oklch, var(--danger) 35%, transparent); }
|
|
970
|
+
.slider.success .slider-thumb { --slider-thumb-color: var(--lmn-slider-success, var(--success)); }
|
|
971
|
+
.slider.success .slider-fill { background: linear-gradient(90deg, color-mix(in oklch, var(--lmn-slider-success, var(--success)) 70%, white), var(--lmn-slider-success, var(--success))); box-shadow: 0 0 10px color-mix(in oklch, var(--lmn-slider-success, var(--success)) 35%, transparent); }
|
|
972
|
+
.slider.success .slider-thumb:focus-visible { box-shadow: var(--lmn-slider-neu-shadow-control, var(--neu-shadow-control)), 0 0 0 3px color-mix(in oklch, var(--lmn-slider-success, var(--success)) 35%, transparent); }
|
|
973
|
+
.slider.warning .slider-thumb { --slider-thumb-color: var(--lmn-slider-warning, var(--warning)); }
|
|
974
|
+
.slider.warning .slider-fill { background: linear-gradient(90deg, color-mix(in oklch, var(--lmn-slider-warning, var(--warning)) 70%, white), var(--lmn-slider-warning, var(--warning))); box-shadow: 0 0 10px color-mix(in oklch, var(--lmn-slider-warning, var(--warning)) 35%, transparent); }
|
|
975
|
+
.slider.warning .slider-thumb:focus-visible { box-shadow: var(--lmn-slider-neu-shadow-control, var(--neu-shadow-control)), 0 0 0 3px color-mix(in oklch, var(--lmn-slider-warning, var(--warning)) 35%, transparent); }
|
|
976
|
+
.slider.danger .slider-thumb { --slider-thumb-color: var(--lmn-slider-danger, var(--danger)); }
|
|
977
|
+
.slider.danger .slider-fill { background: linear-gradient(90deg, color-mix(in oklch, var(--lmn-slider-danger, var(--danger)) 70%, white), var(--lmn-slider-danger, var(--danger))); box-shadow: 0 0 10px color-mix(in oklch, var(--lmn-slider-danger, var(--danger)) 35%, transparent); }
|
|
978
|
+
.slider.danger .slider-thumb:focus-visible { box-shadow: var(--lmn-slider-neu-shadow-control, var(--neu-shadow-control)), 0 0 0 3px color-mix(in oklch, var(--lmn-slider-danger, var(--danger)) 35%, transparent); }
|
|
840
979
|
/* Marks */
|
|
841
980
|
.slider-marks {
|
|
842
981
|
position: absolute;
|
|
@@ -846,6 +985,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
846
985
|
pointer-events: none;
|
|
847
986
|
}
|
|
848
987
|
.slider-mark {
|
|
988
|
+
border: 0;
|
|
989
|
+
padding: 0;
|
|
990
|
+
background: transparent;
|
|
991
|
+
font: inherit;
|
|
849
992
|
position: absolute;
|
|
850
993
|
transform: translateX(-50%);
|
|
851
994
|
display: inline-flex;
|
|
@@ -854,33 +997,47 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
854
997
|
gap: 4px;
|
|
855
998
|
pointer-events: auto;
|
|
856
999
|
cursor: pointer;
|
|
857
|
-
color: var(--fg-subtle);
|
|
1000
|
+
color: var(--lmn-slider-fg-subtle, var(--fg-subtle));
|
|
858
1001
|
font-size: 11px;
|
|
859
1002
|
user-select: none;
|
|
860
1003
|
}
|
|
861
1004
|
.slider-mark-dot {
|
|
862
1005
|
width: 6px; height: 6px;
|
|
863
1006
|
border-radius: 999px;
|
|
864
|
-
background: var(--bg);
|
|
865
|
-
box-shadow: var(--neu-shadow-inset);
|
|
1007
|
+
background: var(--lmn-slider-bg, var(--bg));
|
|
1008
|
+
box-shadow: var(--lmn-slider-neu-shadow-inset, var(--neu-shadow-inset));
|
|
866
1009
|
position: absolute;
|
|
867
1010
|
top: -12px;
|
|
868
1011
|
left: 50%;
|
|
869
1012
|
transform: translateX(-50%);
|
|
870
1013
|
z-index: 1;
|
|
871
1014
|
}
|
|
872
|
-
.slider-mark.active .slider-mark-dot { background: var(--accent); box-shadow: 0 0 6px var(--accent-glow); }
|
|
873
|
-
.slider.success .slider-mark.active .slider-mark-dot { background: var(--success); box-shadow: 0 0 6px color-mix(in oklch, var(--success) 35%, transparent); }
|
|
874
|
-
.slider.warning .slider-mark.active .slider-mark-dot { background: var(--warning); box-shadow: 0 0 6px color-mix(in oklch, var(--warning) 35%, transparent); }
|
|
875
|
-
.slider.danger .slider-mark.active .slider-mark-dot { background: var(--danger); box-shadow: 0 0 6px color-mix(in oklch, var(--danger) 35%, transparent); }
|
|
1015
|
+
.slider-mark.active .slider-mark-dot { background: var(--lmn-slider-accent, var(--accent)); box-shadow: 0 0 6px var(--lmn-slider-accent-glow, var(--accent-glow)); }
|
|
1016
|
+
.slider.success .slider-mark.active .slider-mark-dot { background: var(--lmn-slider-success, var(--success)); box-shadow: 0 0 6px color-mix(in oklch, var(--lmn-slider-success, var(--success)) 35%, transparent); }
|
|
1017
|
+
.slider.warning .slider-mark.active .slider-mark-dot { background: var(--lmn-slider-warning, var(--warning)); box-shadow: 0 0 6px color-mix(in oklch, var(--lmn-slider-warning, var(--warning)) 35%, transparent); }
|
|
1018
|
+
.slider.danger .slider-mark.active .slider-mark-dot { background: var(--lmn-slider-danger, var(--danger)); box-shadow: 0 0 6px color-mix(in oklch, var(--lmn-slider-danger, var(--danger)) 35%, transparent); }
|
|
876
1019
|
.slider-mark-label { white-space: nowrap; }
|
|
877
|
-
.slider-mark.
|
|
878
|
-
|
|
1020
|
+
.slider-mark.edge-start {
|
|
1021
|
+
transform: none;
|
|
1022
|
+
align-items: flex-start;
|
|
1023
|
+
}
|
|
1024
|
+
.slider-mark.edge-start .slider-mark-dot {
|
|
1025
|
+
left: 0;
|
|
1026
|
+
}
|
|
1027
|
+
.slider-mark.edge-end {
|
|
1028
|
+
transform: translateX(-100%);
|
|
1029
|
+
align-items: flex-end;
|
|
1030
|
+
}
|
|
1031
|
+
.slider-mark.edge-end .slider-mark-dot {
|
|
1032
|
+
left: 100%;
|
|
1033
|
+
}
|
|
1034
|
+
.slider-mark.active .slider-mark-label { color: var(--lmn-slider-accent-ink, var(--accent-ink)); font-weight: 500; }
|
|
1035
|
+
.slider-mark:hover .slider-mark-label { color: var(--lmn-slider-fg, var(--fg)); }
|
|
879
1036
|
.slider.disabled .slider-mark { pointer-events: none; }
|
|
880
1037
|
/* ============ Progress ============ */
|
|
881
1038
|
.progress {
|
|
882
|
-
--progress-fill: var(--accent);
|
|
883
|
-
--progress-fill-glow: var(--accent-glow);
|
|
1039
|
+
--progress-fill: var(--lmn-progress-accent, var(--accent));
|
|
1040
|
+
--progress-fill-glow: var(--lmn-progress-accent-glow, var(--accent-glow));
|
|
884
1041
|
--progress-inset: 2px;
|
|
885
1042
|
width: 100%;
|
|
886
1043
|
display: flex;
|
|
@@ -890,22 +1047,22 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
890
1047
|
.progress.sm { --progress-inset: 1px; }
|
|
891
1048
|
.progress.lg { --progress-inset: 2px; }
|
|
892
1049
|
.progress.success {
|
|
893
|
-
--progress-fill: var(--success);
|
|
894
|
-
--progress-fill-glow: color-mix(in oklch, var(--success) 35%, transparent);
|
|
1050
|
+
--progress-fill: var(--lmn-progress-success, var(--success));
|
|
1051
|
+
--progress-fill-glow: color-mix(in oklch, var(--lmn-progress-success, var(--success)) 35%, transparent);
|
|
895
1052
|
}
|
|
896
1053
|
.progress.warning {
|
|
897
|
-
--progress-fill: var(--warning);
|
|
898
|
-
--progress-fill-glow: color-mix(in oklch, var(--warning) 35%, transparent);
|
|
1054
|
+
--progress-fill: var(--lmn-progress-warning, var(--warning));
|
|
1055
|
+
--progress-fill-glow: color-mix(in oklch, var(--lmn-progress-warning, var(--warning)) 35%, transparent);
|
|
899
1056
|
}
|
|
900
1057
|
.progress.danger {
|
|
901
|
-
--progress-fill: var(--danger);
|
|
902
|
-
--progress-fill-glow: color-mix(in oklch, var(--danger) 35%, transparent);
|
|
1058
|
+
--progress-fill: var(--lmn-progress-danger, var(--danger));
|
|
1059
|
+
--progress-fill-glow: color-mix(in oklch, var(--lmn-progress-danger, var(--danger)) 35%, transparent);
|
|
903
1060
|
}
|
|
904
1061
|
.progress-label {
|
|
905
1062
|
display: flex;
|
|
906
1063
|
justify-content: space-between;
|
|
907
1064
|
font-size: 12px;
|
|
908
|
-
color: var(--fg-muted);
|
|
1065
|
+
color: var(--lmn-progress-fg-muted, var(--fg-muted));
|
|
909
1066
|
}
|
|
910
1067
|
.progress-label .v { font-family: var(--font-mono); }
|
|
911
1068
|
.progress-track {
|
|
@@ -916,10 +1073,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
916
1073
|
box-sizing: border-box;
|
|
917
1074
|
background: linear-gradient(
|
|
918
1075
|
180deg,
|
|
919
|
-
color-mix(in oklch, var(--bg) 88%, var(--shadow-light)),
|
|
920
|
-
color-mix(in oklch, var(--bg) 92%, var(--shadow-dark))
|
|
1076
|
+
color-mix(in oklch, var(--lmn-progress-bg, var(--bg)) 88%, var(--lmn-progress-shadow-light, var(--shadow-light))),
|
|
1077
|
+
color-mix(in oklch, var(--lmn-progress-bg, var(--bg)) 92%, var(--lmn-progress-shadow-dark, var(--shadow-dark)))
|
|
921
1078
|
);
|
|
922
|
-
box-shadow: var(--neu-shadow-inset);
|
|
1079
|
+
box-shadow: var(--lmn-progress-neu-shadow-inset, var(--neu-shadow-inset));
|
|
923
1080
|
overflow: hidden;
|
|
924
1081
|
position: relative;
|
|
925
1082
|
}
|
|
@@ -931,15 +1088,15 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
931
1088
|
border-radius: inherit;
|
|
932
1089
|
background: linear-gradient(
|
|
933
1090
|
180deg,
|
|
934
|
-
color-mix(in oklch, var(--progress-fill) 68%, var(--shadow-light)) 0%,
|
|
1091
|
+
color-mix(in oklch, var(--progress-fill) 68%, var(--lmn-progress-shadow-light, var(--shadow-light))) 0%,
|
|
935
1092
|
var(--progress-fill) 55%,
|
|
936
|
-
color-mix(in oklch, var(--progress-fill) 84%, var(--shadow-dark)) 100%
|
|
1093
|
+
color-mix(in oklch, var(--progress-fill) 84%, var(--lmn-progress-shadow-dark, var(--shadow-dark))) 100%
|
|
937
1094
|
);
|
|
938
1095
|
box-shadow:
|
|
939
|
-
inset 1px 1px 2px color-mix(in oklch, var(--progress-fill) 18%, var(--shadow-dark)),
|
|
940
|
-
inset -1px -1px 2px color-mix(in oklch, var(--progress-fill) 14%, var(--shadow-light)),
|
|
941
|
-
1px 1px 4px color-mix(in oklch, var(--progress-fill) 16%, var(--shadow-dark)),
|
|
942
|
-
-1px -1px 4px color-mix(in oklch, var(--progress-fill) 10%, var(--shadow-light)),
|
|
1096
|
+
inset 1px 1px 2px color-mix(in oklch, var(--progress-fill) 18%, var(--lmn-progress-shadow-dark, var(--shadow-dark))),
|
|
1097
|
+
inset -1px -1px 2px color-mix(in oklch, var(--progress-fill) 14%, var(--lmn-progress-shadow-light, var(--shadow-light))),
|
|
1098
|
+
1px 1px 4px color-mix(in oklch, var(--progress-fill) 16%, var(--lmn-progress-shadow-dark, var(--shadow-dark))),
|
|
1099
|
+
-1px -1px 4px color-mix(in oklch, var(--progress-fill) 10%, var(--lmn-progress-shadow-light, var(--shadow-light))),
|
|
943
1100
|
0 0 10px var(--progress-fill-glow);
|
|
944
1101
|
transition: width var(--dur-slow) var(--ease), box-shadow var(--dur) var(--ease);
|
|
945
1102
|
overflow: hidden;
|
|
@@ -951,12 +1108,22 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
951
1108
|
border-radius: inherit;
|
|
952
1109
|
background: linear-gradient(
|
|
953
1110
|
180deg,
|
|
954
|
-
color-mix(in oklch, var(--shadow-light) 72%, transparent) 0%,
|
|
955
|
-
color-mix(in oklch, var(--shadow-light) 28%, transparent) 38%,
|
|
1111
|
+
color-mix(in oklch, var(--lmn-progress-shadow-light, var(--shadow-light)) 72%, transparent) 0%,
|
|
1112
|
+
color-mix(in oklch, var(--lmn-progress-shadow-light, var(--shadow-light)) 28%, transparent) 38%,
|
|
956
1113
|
transparent 70%
|
|
957
1114
|
);
|
|
958
1115
|
pointer-events: none;
|
|
959
1116
|
}
|
|
1117
|
+
.progress.indeterminate .progress-bar {
|
|
1118
|
+
animation: progress-indeterminate 1.4s var(--ease) infinite;
|
|
1119
|
+
}
|
|
1120
|
+
@keyframes progress-indeterminate {
|
|
1121
|
+
from { transform: translateX(-120%); }
|
|
1122
|
+
to { transform: translateX(320%); }
|
|
1123
|
+
}
|
|
1124
|
+
@media (prefers-reduced-motion: reduce) {
|
|
1125
|
+
.progress.indeterminate .progress-bar { animation: none; }
|
|
1126
|
+
}
|
|
960
1127
|
/* ============ Tag ============ */
|
|
961
1128
|
.tag {
|
|
962
1129
|
display: inline-flex;
|
|
@@ -967,20 +1134,20 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
967
1134
|
border-radius: var(--r-pill);
|
|
968
1135
|
font-size: 11px;
|
|
969
1136
|
font-weight: 500;
|
|
970
|
-
background: var(--bg);
|
|
971
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
972
|
-
color: var(--fg-muted);
|
|
973
|
-
}
|
|
974
|
-
.tag.accent { color: var(--accent-ink); }
|
|
975
|
-
.tag.info { color: var(--info); }
|
|
976
|
-
.tag.success { color: var(--success); }
|
|
977
|
-
.tag.warning { color: var(--warning); }
|
|
978
|
-
.tag.danger { color: var(--danger); }
|
|
979
|
-
.tag.solid { background: var(--accent); color: var(--bg); box-shadow: 0 2px 6px var(--accent-glow); }
|
|
980
|
-
.tag.solid.info { background: var(--info); color: var(--bg); box-shadow: 0 2px 6px color-mix(in oklch, var(--info) 35%, transparent); }
|
|
981
|
-
.tag.solid.success { background: var(--success); color: var(--bg); box-shadow: 0 2px 6px color-mix(in oklch, var(--success) 35%, transparent); }
|
|
982
|
-
.tag.solid.warning { background: var(--warning); color: var(--bg); box-shadow: 0 2px 6px color-mix(in oklch, var(--warning) 35%, transparent); }
|
|
983
|
-
.tag.solid.danger { background: var(--danger); color: var(--bg); box-shadow: 0 2px 6px color-mix(in oklch, var(--danger) 35%, transparent); }
|
|
1137
|
+
background: var(--lmn-tag-bg, var(--bg));
|
|
1138
|
+
box-shadow: var(--lmn-tag-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
1139
|
+
color: var(--lmn-tag-fg-muted, var(--fg-muted));
|
|
1140
|
+
}
|
|
1141
|
+
.tag.accent { color: var(--lmn-tag-accent-ink, var(--accent-ink)); }
|
|
1142
|
+
.tag.info { color: var(--lmn-tag-info, var(--info)); }
|
|
1143
|
+
.tag.success { color: var(--lmn-tag-success, var(--success)); }
|
|
1144
|
+
.tag.warning { color: var(--lmn-tag-warning, var(--warning)); }
|
|
1145
|
+
.tag.danger { color: var(--lmn-tag-danger, var(--danger)); }
|
|
1146
|
+
.tag.solid { background: var(--lmn-tag-accent, var(--accent)); color: var(--lmn-tag-bg, var(--bg)); box-shadow: 0 2px 6px var(--lmn-tag-accent-glow, var(--accent-glow)); }
|
|
1147
|
+
.tag.solid.info { background: var(--lmn-tag-info, var(--info)); color: var(--lmn-tag-bg, var(--bg)); box-shadow: 0 2px 6px color-mix(in oklch, var(--lmn-tag-info, var(--info)) 35%, transparent); }
|
|
1148
|
+
.tag.solid.success { background: var(--lmn-tag-success, var(--success)); color: var(--lmn-tag-bg, var(--bg)); box-shadow: 0 2px 6px color-mix(in oklch, var(--lmn-tag-success, var(--success)) 35%, transparent); }
|
|
1149
|
+
.tag.solid.warning { background: var(--lmn-tag-warning, var(--warning)); color: var(--lmn-tag-bg, var(--bg)); box-shadow: 0 2px 6px color-mix(in oklch, var(--lmn-tag-warning, var(--warning)) 35%, transparent); }
|
|
1150
|
+
.tag.solid.danger { background: var(--lmn-tag-danger, var(--danger)); color: var(--lmn-tag-bg, var(--bg)); box-shadow: 0 2px 6px color-mix(in oklch, var(--lmn-tag-danger, var(--danger)) 35%, transparent); }
|
|
984
1151
|
.tag.borderless { background: transparent; box-shadow: none; }
|
|
985
1152
|
.tag .dot { width: 6px; height: 6px; border-radius: 999px; background: currentColor; }
|
|
986
1153
|
.tag .tag-ico {
|
|
@@ -997,8 +1164,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
997
1164
|
height: 1em;
|
|
998
1165
|
object-fit: contain;
|
|
999
1166
|
}
|
|
1000
|
-
.tag .x { cursor: pointer; color: var(--fg-subtle); margin-left: 2px; display: inline-flex; }
|
|
1001
|
-
.tag .x:hover { color: var(--fg); }
|
|
1167
|
+
.tag .x { cursor: pointer; color: var(--lmn-tag-fg-subtle, var(--fg-subtle)); margin-left: 2px; display: inline-flex; }
|
|
1168
|
+
.tag .x:hover { color: var(--lmn-tag-fg, var(--fg)); }
|
|
1002
1169
|
/* ============ Badge ============ */
|
|
1003
1170
|
.badge {
|
|
1004
1171
|
display: inline-flex;
|
|
@@ -1008,17 +1175,17 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1008
1175
|
border-radius: 999px;
|
|
1009
1176
|
font-size: 10px;
|
|
1010
1177
|
font-weight: 700;
|
|
1011
|
-
background: var(--danger);
|
|
1012
|
-
color: var(--bg);
|
|
1013
|
-
box-shadow: 0 1px 4px color-mix(in oklch, var(--shadow-dark) 35%, transparent);
|
|
1178
|
+
background: var(--lmn-badge-danger, var(--danger));
|
|
1179
|
+
color: var(--lmn-badge-bg, var(--bg));
|
|
1180
|
+
box-shadow: 0 1px 4px color-mix(in oklch, var(--lmn-badge-shadow-dark, var(--shadow-dark)) 35%, transparent);
|
|
1014
1181
|
font-variant-numeric: tabular-nums;
|
|
1015
1182
|
}
|
|
1016
1183
|
.badge.dot { min-width: 10px; height: 10px; padding: 0; }
|
|
1017
|
-
.badge.accent { background: var(--accent); box-shadow: 0 1px 4px var(--accent-glow); }
|
|
1018
|
-
.badge.info { background: var(--info); box-shadow: 0 1px 4px color-mix(in oklch, var(--info) 35%, transparent); }
|
|
1019
|
-
.badge.success { background: var(--success); box-shadow: 0 1px 4px color-mix(in oklch, var(--success) 35%, transparent); }
|
|
1020
|
-
.badge.warning { background: var(--warning); box-shadow: 0 1px 4px color-mix(in oklch, var(--warning) 35%, transparent); }
|
|
1021
|
-
.badge.neutral { background: var(--fg-muted); box-shadow: 0 1px 4px color-mix(in oklch, var(--shadow-dark) 35%, transparent); }
|
|
1184
|
+
.badge.accent { background: var(--lmn-badge-accent, var(--accent)); box-shadow: 0 1px 4px var(--lmn-badge-accent-glow, var(--accent-glow)); }
|
|
1185
|
+
.badge.info { background: var(--lmn-badge-info, var(--info)); box-shadow: 0 1px 4px color-mix(in oklch, var(--lmn-badge-info, var(--info)) 35%, transparent); }
|
|
1186
|
+
.badge.success { background: var(--lmn-badge-success, var(--success)); box-shadow: 0 1px 4px color-mix(in oklch, var(--lmn-badge-success, var(--success)) 35%, transparent); }
|
|
1187
|
+
.badge.warning { background: var(--lmn-badge-warning, var(--warning)); box-shadow: 0 1px 4px color-mix(in oklch, var(--lmn-badge-warning, var(--warning)) 35%, transparent); }
|
|
1188
|
+
.badge.neutral { background: var(--lmn-badge-fg-muted, var(--fg-muted)); box-shadow: 0 1px 4px color-mix(in oklch, var(--lmn-badge-shadow-dark, var(--shadow-dark)) 35%, transparent); }
|
|
1022
1189
|
.badge-wrap { position: relative; display: inline-block; }
|
|
1023
1190
|
.badge-wrap > .badge { position: absolute; top: -4px; right: -4px; }
|
|
1024
1191
|
/* ============ Avatar ============ */
|
|
@@ -1026,11 +1193,11 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1026
1193
|
--size: 40px;
|
|
1027
1194
|
width: var(--size); height: var(--size);
|
|
1028
1195
|
border-radius: 999px;
|
|
1029
|
-
background: var(--bg);
|
|
1030
|
-
box-shadow: var(--neu-shadow-control);
|
|
1196
|
+
background: var(--lmn-avatar-bg, var(--bg));
|
|
1197
|
+
box-shadow: var(--lmn-avatar-neu-shadow-control, var(--neu-shadow-control));
|
|
1031
1198
|
display: grid; place-items: center;
|
|
1032
1199
|
overflow: hidden;
|
|
1033
|
-
color: var(--accent-ink);
|
|
1200
|
+
color: var(--lmn-avatar-accent-ink, var(--accent-ink));
|
|
1034
1201
|
font-weight: 600;
|
|
1035
1202
|
font-size: calc(var(--size) / 2.6);
|
|
1036
1203
|
position: relative;
|
|
@@ -1050,23 +1217,31 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1050
1217
|
width: 25%; height: 25%;
|
|
1051
1218
|
min-width: 8px; min-height: 8px;
|
|
1052
1219
|
border-radius: 999px;
|
|
1053
|
-
background: var(--success);
|
|
1054
|
-
box-shadow: 0 0 0 2px var(--bg);
|
|
1220
|
+
background: var(--lmn-avatar-success, var(--success));
|
|
1221
|
+
box-shadow: 0 0 0 2px var(--lmn-avatar-bg, var(--bg));
|
|
1222
|
+
}
|
|
1223
|
+
.avatar-status.online { background: var(--lmn-avatar-success, var(--success)); }
|
|
1224
|
+
.avatar-status.busy { background: var(--lmn-avatar-danger, var(--danger)); }
|
|
1225
|
+
.avatar-status.away { background: var(--lmn-avatar-warning, var(--warning)); }
|
|
1226
|
+
.avatar-status.offline { background: var(--lmn-avatar-fg-subtle, var(--fg-subtle)); }
|
|
1227
|
+
.avatar-status-label {
|
|
1228
|
+
position: absolute;
|
|
1229
|
+
width: 1px;
|
|
1230
|
+
height: 1px;
|
|
1231
|
+
overflow: hidden;
|
|
1232
|
+
clip: rect(0, 0, 0, 0);
|
|
1233
|
+
white-space: nowrap;
|
|
1055
1234
|
}
|
|
1056
|
-
.avatar-status.online { background: var(--success); }
|
|
1057
|
-
.avatar-status.busy { background: var(--danger); }
|
|
1058
|
-
.avatar-status.away { background: var(--warning); }
|
|
1059
|
-
.avatar-status.offline { background: var(--fg-subtle); }
|
|
1060
1235
|
.avatar-group { display: inline-flex; }
|
|
1061
|
-
.avatar-group .avatar { border: 3px solid var(--bg); box-sizing: content-box; }
|
|
1236
|
+
.avatar-group .avatar { border: 3px solid var(--lmn-avatar-bg, var(--bg)); box-sizing: content-box; }
|
|
1062
1237
|
.avatar-group .avatar + .avatar { margin-left: -12px; }
|
|
1063
1238
|
/* ============ Divider ============ */
|
|
1064
1239
|
.divider {
|
|
1065
1240
|
height: 1px;
|
|
1066
|
-
background: var(--divider);
|
|
1241
|
+
background: var(--lmn-divider-divider, var(--divider));
|
|
1067
1242
|
margin: var(--gap-4) 0;
|
|
1068
1243
|
border-radius: 999px;
|
|
1069
|
-
box-shadow: 0 1px 0 var(--shadow-light);
|
|
1244
|
+
box-shadow: 0 1px 0 var(--lmn-divider-shadow-light, var(--shadow-light));
|
|
1070
1245
|
}
|
|
1071
1246
|
.divider.vertical {
|
|
1072
1247
|
width: 1px;
|
|
@@ -1077,7 +1252,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1077
1252
|
.divider.sunken {
|
|
1078
1253
|
background: transparent;
|
|
1079
1254
|
height: 2px;
|
|
1080
|
-
box-shadow: var(--neu-shadow-inset);
|
|
1255
|
+
box-shadow: var(--lmn-divider-neu-shadow-inset, var(--neu-shadow-inset));
|
|
1081
1256
|
}
|
|
1082
1257
|
.divider.sunken.vertical {
|
|
1083
1258
|
width: 2px;
|
|
@@ -1085,33 +1260,33 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1085
1260
|
}
|
|
1086
1261
|
.divider.sunken:has(.divider-label) { background: transparent; box-shadow: none; }
|
|
1087
1262
|
.divider.sunken:has(.divider-label)::before,
|
|
1088
|
-
.divider.sunken:has(.divider-label)::after { height: 2px; background: transparent; box-shadow: var(--neu-shadow-inset); }
|
|
1263
|
+
.divider.sunken:has(.divider-label)::after { height: 2px; background: transparent; box-shadow: var(--lmn-divider-neu-shadow-inset, var(--neu-shadow-inset)); }
|
|
1089
1264
|
/* ---- Dashed variant ---- */
|
|
1090
1265
|
.divider.dashed {
|
|
1091
1266
|
background: transparent;
|
|
1092
1267
|
box-shadow: none;
|
|
1093
|
-
border-top: 1px dashed var(--divider);
|
|
1268
|
+
border-top: 1px dashed var(--lmn-divider-divider, var(--divider));
|
|
1094
1269
|
border-radius: 0;
|
|
1095
1270
|
height: 0;
|
|
1096
1271
|
}
|
|
1097
1272
|
.divider.dashed.vertical {
|
|
1098
1273
|
width: 0;
|
|
1099
1274
|
border-top: none;
|
|
1100
|
-
border-left: 1px dashed var(--divider);
|
|
1275
|
+
border-left: 1px dashed var(--lmn-divider-divider, var(--divider));
|
|
1101
1276
|
}
|
|
1102
1277
|
.divider.dashed:has(.divider-label) { border-top: none; }
|
|
1103
1278
|
.divider.dashed:has(.divider-label)::before,
|
|
1104
1279
|
.divider.dashed:has(.divider-label)::after {
|
|
1105
1280
|
background: transparent;
|
|
1106
1281
|
box-shadow: none;
|
|
1107
|
-
border-top: 1px dashed var(--divider);
|
|
1282
|
+
border-top: 1px dashed var(--lmn-divider-divider, var(--divider));
|
|
1108
1283
|
height: 0;
|
|
1109
1284
|
border-radius: 0;
|
|
1110
1285
|
}
|
|
1111
1286
|
.divider-label {
|
|
1112
1287
|
display: flex; align-items: center; gap: 12px;
|
|
1113
1288
|
height: auto; background: transparent; box-shadow: none;
|
|
1114
|
-
font-size: 11px; color: var(--fg-subtle);
|
|
1289
|
+
font-size: 11px; color: var(--lmn-divider-fg-subtle, var(--fg-subtle));
|
|
1115
1290
|
text-transform: uppercase; letter-spacing: 0.1em;
|
|
1116
1291
|
}
|
|
1117
1292
|
.divider:has(.divider-label) {
|
|
@@ -1127,9 +1302,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1127
1302
|
content: "";
|
|
1128
1303
|
flex: 1;
|
|
1129
1304
|
height: 1px;
|
|
1130
|
-
background: var(--divider);
|
|
1305
|
+
background: var(--lmn-divider-divider, var(--divider));
|
|
1131
1306
|
border-radius: 999px;
|
|
1132
|
-
box-shadow: 0 1px 0 var(--shadow-light);
|
|
1307
|
+
box-shadow: 0 1px 0 var(--lmn-divider-shadow-light, var(--shadow-light));
|
|
1133
1308
|
}
|
|
1134
1309
|
/* ---- Label orientation ---- */
|
|
1135
1310
|
.divider.orient-left::before { flex: 0 0 var(--gap-4); }
|
|
@@ -1139,12 +1314,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1139
1314
|
/* center is default (both flex: 1) */
|
|
1140
1315
|
/* ============ Card ============ */
|
|
1141
1316
|
.card {
|
|
1142
|
-
--card-bg: var(--bg);
|
|
1143
|
-
--card-loading-bg: color-mix(in srgb, var(--bg) 72%, var(--bg-sunken));
|
|
1317
|
+
--card-bg: var(--lmn-card-bg, var(--bg));
|
|
1318
|
+
--card-loading-bg: color-mix(in srgb, var(--lmn-card-bg, var(--bg)) 72%, var(--lmn-card-bg-sunken, var(--bg-sunken)));
|
|
1144
1319
|
background: var(--card-bg);
|
|
1320
|
+
color: var(--lmn-card-fg, var(--fg));
|
|
1145
1321
|
border-radius: var(--r-lg);
|
|
1146
|
-
box-shadow: var(--neu-shadow-panel);
|
|
1322
|
+
box-shadow: var(--lmn-card-neu-shadow-panel, var(--neu-shadow-panel));
|
|
1147
1323
|
padding: var(--gap-5);
|
|
1324
|
+
position: relative;
|
|
1148
1325
|
}
|
|
1149
1326
|
.card.fill {
|
|
1150
1327
|
display: flex;
|
|
@@ -1152,34 +1329,52 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1152
1329
|
min-height: 0;
|
|
1153
1330
|
height: 100%;
|
|
1154
1331
|
}
|
|
1155
|
-
.card.flat { box-shadow: var(--neu-shadow-subtle); }
|
|
1156
|
-
.card.sunken { box-shadow: var(--neu-shadow-inset-strong); }
|
|
1332
|
+
.card.flat { box-shadow: var(--lmn-card-neu-shadow-subtle, var(--neu-shadow-subtle)); }
|
|
1333
|
+
.card.sunken { box-shadow: var(--lmn-card-neu-shadow-inset-strong, var(--neu-shadow-inset-strong)); }
|
|
1157
1334
|
.card.pad-none { padding: 0; }
|
|
1158
1335
|
.card.pad-sm { padding: var(--gap-3); }
|
|
1159
1336
|
.card.pad-lg { padding: var(--gap-6); }
|
|
1160
1337
|
.card.hoverable {
|
|
1161
|
-
cursor: pointer;
|
|
1162
1338
|
transition: box-shadow var(--dur) var(--ease), transform var(--dur) var(--ease);
|
|
1163
1339
|
}
|
|
1340
|
+
.card.interactive { cursor: pointer; }
|
|
1341
|
+
.card.interactive.disabled { cursor: not-allowed; opacity: 0.68; }
|
|
1164
1342
|
.card.hoverable:hover {
|
|
1165
1343
|
transform: translateY(-3px);
|
|
1166
|
-
box-shadow: var(--neu-shadow-lift);
|
|
1344
|
+
box-shadow: var(--lmn-card-neu-shadow-lift, var(--neu-shadow-lift));
|
|
1345
|
+
}
|
|
1346
|
+
.card.hoverable.flat:hover { box-shadow: var(--lmn-card-neu-shadow-control, var(--neu-shadow-control)); }
|
|
1347
|
+
.card.hoverable.sunken:hover { box-shadow: var(--lmn-card-neu-shadow-panel, var(--neu-shadow-panel)); }
|
|
1348
|
+
.card-interactive-control.btn {
|
|
1349
|
+
position: absolute;
|
|
1350
|
+
width: 1px;
|
|
1351
|
+
height: 1px;
|
|
1352
|
+
min-width: 0;
|
|
1353
|
+
padding: 0;
|
|
1354
|
+
margin: -1px;
|
|
1355
|
+
border-radius: inherit;
|
|
1356
|
+
overflow: hidden;
|
|
1357
|
+
clip: rect(0 0 0 0);
|
|
1358
|
+
clip-path: inset(50%);
|
|
1359
|
+
white-space: nowrap;
|
|
1360
|
+
}
|
|
1361
|
+
.card:has(> .card-interactive-control:focus-visible) {
|
|
1362
|
+
box-shadow: var(--lmn-card-neu-shadow-panel, var(--neu-shadow-panel)), 0 0 0 2px var(--lmn-card-accent-glow, var(--accent-glow));
|
|
1167
1363
|
}
|
|
1168
|
-
.card.hoverable.flat:hover { box-shadow: var(--neu-shadow-control); }
|
|
1169
|
-
.card.hoverable.sunken:hover { box-shadow: var(--neu-shadow-panel); }
|
|
1170
1364
|
.card-head {
|
|
1171
1365
|
display: flex; align-items: flex-start; justify-content: space-between;
|
|
1172
1366
|
gap: var(--gap-3); margin-bottom: var(--gap-4);
|
|
1173
1367
|
}
|
|
1174
1368
|
.card-titles { display: flex; flex-direction: column; gap: 2px; }
|
|
1175
1369
|
.card-title { font-size: 15px; font-weight: 600; }
|
|
1176
|
-
.card-desc { font-size: 12px; color: var(--fg-muted); }
|
|
1370
|
+
.card-desc { font-size: 12px; color: var(--lmn-card-fg-muted, var(--fg-muted)); }
|
|
1177
1371
|
.card-actions { display: flex; gap: 6px; }
|
|
1178
1372
|
.card-body {
|
|
1179
1373
|
font-size: 13px;
|
|
1180
1374
|
min-width: 0;
|
|
1181
1375
|
position: relative;
|
|
1182
1376
|
}
|
|
1377
|
+
.card-body-content { display: contents; }
|
|
1183
1378
|
.card-body.body-stack {
|
|
1184
1379
|
display: flex;
|
|
1185
1380
|
flex-direction: column;
|
|
@@ -1206,9 +1401,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1206
1401
|
place-items: center;
|
|
1207
1402
|
background: var(--card-loading-bg);
|
|
1208
1403
|
box-shadow:
|
|
1209
|
-
inset calc(var(--shadow-inset-offset) * 0.45) calc(var(--shadow-inset-offset) * 0.45) calc(var(--shadow-inset-blur) * 0.45) color-mix(in oklch, var(--shadow-dark) 55%, transparent),
|
|
1210
|
-
inset calc(var(--shadow-inset-offset) * -0.45) calc(var(--shadow-inset-offset) * -0.45) calc(var(--shadow-inset-blur) * 0.45) color-mix(in oklch, var(--shadow-light) 72%, transparent);
|
|
1211
|
-
color: var(--fg-muted);
|
|
1404
|
+
inset calc(var(--lmn-card-shadow-inset-offset, var(--shadow-inset-offset)) * 0.45) calc(var(--lmn-card-shadow-inset-offset, var(--shadow-inset-offset)) * 0.45) calc(var(--lmn-card-shadow-inset-blur, var(--shadow-inset-blur)) * 0.45) color-mix(in oklch, var(--lmn-card-shadow-dark, var(--shadow-dark)) 55%, transparent),
|
|
1405
|
+
inset calc(var(--lmn-card-shadow-inset-offset, var(--shadow-inset-offset)) * -0.45) calc(var(--lmn-card-shadow-inset-offset, var(--shadow-inset-offset)) * -0.45) calc(var(--lmn-card-shadow-inset-blur, var(--shadow-inset-blur)) * 0.45) color-mix(in oklch, var(--lmn-card-shadow-light, var(--shadow-light)) 72%, transparent);
|
|
1406
|
+
color: var(--lmn-card-fg-muted, var(--fg-muted));
|
|
1212
1407
|
z-index: 1;
|
|
1213
1408
|
}
|
|
1214
1409
|
/* ============ Surface ============ */
|
|
@@ -1216,21 +1411,21 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1216
1411
|
position: relative;
|
|
1217
1412
|
box-sizing: border-box;
|
|
1218
1413
|
min-width: 0;
|
|
1219
|
-
color: var(--fg);
|
|
1220
|
-
background: var(--bg);
|
|
1414
|
+
color: var(--lmn-surface-fg, var(--fg));
|
|
1415
|
+
background: var(--lmn-surface-bg, var(--bg));
|
|
1221
1416
|
border-radius: var(--r-lg);
|
|
1222
1417
|
}
|
|
1223
|
-
.surface.tone-raised { background: var(--bg-raised); }
|
|
1224
|
-
.surface.tone-sunken { background: var(--bg-sunken); }
|
|
1418
|
+
.surface.tone-raised { background: var(--lmn-surface-bg-raised, var(--bg-raised)); }
|
|
1419
|
+
.surface.tone-sunken { background: var(--lmn-surface-bg-sunken, var(--bg-sunken)); }
|
|
1225
1420
|
.surface.tone-accent {
|
|
1226
|
-
color: var(--accent-ink);
|
|
1227
|
-
background: var(--accent-soft);
|
|
1421
|
+
color: var(--lmn-surface-accent-ink, var(--accent-ink));
|
|
1422
|
+
background: var(--lmn-surface-accent-soft, var(--accent-soft));
|
|
1228
1423
|
}
|
|
1229
1424
|
.surface.plain { box-shadow: none; }
|
|
1230
|
-
.surface.raised { box-shadow: var(--neu-shadow-panel); }
|
|
1231
|
-
.surface.sunken { box-shadow: var(--neu-shadow-inset-strong); }
|
|
1232
|
-
.surface.floating { box-shadow: var(--neu-shadow-float); }
|
|
1233
|
-
.surface.bordered { border: 1px solid var(--border); }
|
|
1425
|
+
.surface.raised { box-shadow: var(--lmn-surface-neu-shadow-panel, var(--neu-shadow-panel)); }
|
|
1426
|
+
.surface.sunken { box-shadow: var(--lmn-surface-neu-shadow-inset-strong, var(--neu-shadow-inset-strong)); }
|
|
1427
|
+
.surface.floating { box-shadow: var(--lmn-surface-neu-shadow-float, var(--neu-shadow-float)); }
|
|
1428
|
+
.surface.bordered { border: 1px solid var(--lmn-surface-border, var(--border)); }
|
|
1234
1429
|
.surface.pad-none { padding: 0; }
|
|
1235
1430
|
.surface.pad-sm { padding: var(--gap-3); }
|
|
1236
1431
|
.surface.pad-md { padding: var(--gap-5); }
|
|
@@ -1249,14 +1444,22 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1249
1444
|
.surface > *:last-child { margin-bottom: 0; }
|
|
1250
1445
|
/* ============ Tabs ============ */
|
|
1251
1446
|
.tabs { display: flex; flex-direction: column; gap: var(--gap-3); }
|
|
1447
|
+
.tabs.fill {
|
|
1448
|
+
flex: 1 1 auto;
|
|
1449
|
+
width: 100%;
|
|
1450
|
+
height: 100%;
|
|
1451
|
+
min-width: 0;
|
|
1452
|
+
min-height: 0;
|
|
1453
|
+
}
|
|
1252
1454
|
.tabs-nav {
|
|
1253
1455
|
display: inline-flex;
|
|
1254
1456
|
padding: 5px;
|
|
1255
1457
|
border-radius: var(--r-md);
|
|
1256
|
-
background: var(--bg);
|
|
1257
|
-
box-shadow: var(--neu-shadow-inset);
|
|
1458
|
+
background: var(--lmn-tabs-bg, var(--bg));
|
|
1459
|
+
box-shadow: var(--lmn-tabs-neu-shadow-inset, var(--neu-shadow-inset));
|
|
1258
1460
|
gap: 2px;
|
|
1259
1461
|
align-self: flex-start;
|
|
1462
|
+
flex-shrink: 0;
|
|
1260
1463
|
}
|
|
1261
1464
|
.tabs-nav .tab {
|
|
1262
1465
|
padding: 8px 16px;
|
|
@@ -1266,18 +1469,18 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1266
1469
|
font-size: 12px;
|
|
1267
1470
|
font-weight: 500;
|
|
1268
1471
|
font-family: inherit;
|
|
1269
|
-
color: var(--fg-muted);
|
|
1472
|
+
color: var(--lmn-tabs-fg-muted, var(--fg-muted));
|
|
1270
1473
|
cursor: pointer;
|
|
1271
1474
|
display: inline-flex;
|
|
1272
1475
|
align-items: center;
|
|
1273
1476
|
gap: 6px;
|
|
1274
1477
|
transition: all var(--dur-fast) var(--ease);
|
|
1275
1478
|
}
|
|
1276
|
-
.tabs-nav .tab:hover { color: var(--fg); }
|
|
1479
|
+
.tabs-nav .tab:hover { color: var(--lmn-tabs-fg, var(--fg)); }
|
|
1277
1480
|
.tabs-nav .tab.active {
|
|
1278
|
-
color: var(--accent-ink);
|
|
1279
|
-
background: var(--bg);
|
|
1280
|
-
box-shadow: var(--neu-shadow-control);
|
|
1481
|
+
color: var(--lmn-tabs-accent-ink, var(--accent-ink));
|
|
1482
|
+
background: var(--lmn-tabs-bg, var(--bg));
|
|
1483
|
+
box-shadow: var(--lmn-tabs-neu-shadow-control, var(--neu-shadow-control));
|
|
1281
1484
|
font-weight: 600;
|
|
1282
1485
|
}
|
|
1283
1486
|
.tabs-nav .tab[disabled] { opacity: 0.4; cursor: not-allowed; }
|
|
@@ -1287,7 +1490,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1287
1490
|
background: transparent;
|
|
1288
1491
|
box-shadow: none;
|
|
1289
1492
|
border-radius: 0;
|
|
1290
|
-
border-bottom: 1px solid var(--divider);
|
|
1493
|
+
border-bottom: 1px solid var(--lmn-tabs-divider, var(--divider));
|
|
1291
1494
|
align-self: stretch;
|
|
1292
1495
|
}
|
|
1293
1496
|
.tabs.line .tabs-nav .tab,
|
|
@@ -1302,8 +1505,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1302
1505
|
.tabs.line .tabs-nav .tab.active::after,
|
|
1303
1506
|
.tabs.underline .tabs-nav .tab.active::after {
|
|
1304
1507
|
content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px;
|
|
1305
|
-
background: var(--accent); border-radius: 999px;
|
|
1306
|
-
box-shadow: 0 0 8px var(--accent-glow);
|
|
1508
|
+
background: var(--lmn-tabs-accent, var(--accent)); border-radius: 999px;
|
|
1509
|
+
box-shadow: 0 0 8px var(--lmn-tabs-accent-glow, var(--accent-glow));
|
|
1307
1510
|
}
|
|
1308
1511
|
/* Centered nav — works for pill / segmented (self-align) and line (flex-center) */
|
|
1309
1512
|
.tabs.centered .tabs-nav { align-self: center; }
|
|
@@ -1312,12 +1515,18 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1312
1515
|
.tabs.centered.line .tabs-nav .tab,
|
|
1313
1516
|
.tabs.centered.underline .tabs-nav .tab { margin-right: 11px; margin-left: 11px; }
|
|
1314
1517
|
.tabs-content { padding: var(--gap-2) 0; }
|
|
1518
|
+
.tabs.fill .tabs-content {
|
|
1519
|
+
flex: 1 1 auto;
|
|
1520
|
+
min-width: 0;
|
|
1521
|
+
min-height: 0;
|
|
1522
|
+
overflow: auto;
|
|
1523
|
+
}
|
|
1315
1524
|
/* ============ Collapse ============ */
|
|
1316
1525
|
.collapse { display: flex; flex-direction: column; gap: 10px; }
|
|
1317
1526
|
.collapse-item {
|
|
1318
|
-
background: var(--bg);
|
|
1527
|
+
background: var(--lmn-collapse-bg, var(--bg));
|
|
1319
1528
|
border-radius: var(--r-md);
|
|
1320
|
-
box-shadow: var(--neu-shadow-control);
|
|
1529
|
+
box-shadow: var(--lmn-collapse-neu-shadow-control, var(--neu-shadow-control));
|
|
1321
1530
|
overflow: hidden;
|
|
1322
1531
|
}
|
|
1323
1532
|
.collapse.ghost .collapse-item {
|
|
@@ -1338,7 +1547,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1338
1547
|
font-size: 13px;
|
|
1339
1548
|
font-weight: 500;
|
|
1340
1549
|
font-family: inherit;
|
|
1341
|
-
color: var(--fg);
|
|
1550
|
+
color: var(--lmn-collapse-fg, var(--fg));
|
|
1342
1551
|
text-align: left;
|
|
1343
1552
|
}
|
|
1344
1553
|
.collapse.small .collapse-head { padding: 10px 14px; font-size: 12px; }
|
|
@@ -1349,7 +1558,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1349
1558
|
max-height: 0;
|
|
1350
1559
|
overflow: hidden;
|
|
1351
1560
|
transition: max-height var(--dur) var(--ease);
|
|
1352
|
-
color: var(--fg-muted);
|
|
1561
|
+
color: var(--lmn-collapse-fg-muted, var(--fg-muted));
|
|
1353
1562
|
font-size: 13px;
|
|
1354
1563
|
}
|
|
1355
1564
|
.collapse-body-inner { padding: 0 18px 16px; }
|
|
@@ -1357,14 +1566,19 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1357
1566
|
.collapse.large .collapse-body-inner { padding: 0 22px 20px; }
|
|
1358
1567
|
.collapse-chev {
|
|
1359
1568
|
transition: transform var(--dur) var(--ease), color var(--dur) var(--ease);
|
|
1360
|
-
color: var(--fg-subtle);
|
|
1569
|
+
color: var(--lmn-collapse-fg-subtle, var(--fg-subtle));
|
|
1361
1570
|
display: inline-flex;
|
|
1362
1571
|
border-radius: var(--r-xs);
|
|
1363
1572
|
padding: 2px;
|
|
1364
1573
|
}
|
|
1574
|
+
button.collapse-chev {
|
|
1575
|
+
border: 0;
|
|
1576
|
+
background: transparent;
|
|
1577
|
+
font: inherit;
|
|
1578
|
+
}
|
|
1365
1579
|
.collapse-chev.clickable { cursor: pointer; }
|
|
1366
|
-
.collapse-chev.clickable:hover { color: var(--fg); background: var(--bg); box-shadow: var(--neu-shadow-subtle); }
|
|
1367
|
-
.collapse-item.open .collapse-chev { transform: rotate(180deg); color: var(--accent); }
|
|
1580
|
+
.collapse-chev.clickable:hover { color: var(--lmn-collapse-fg, var(--fg)); background: var(--lmn-collapse-bg, var(--bg)); box-shadow: var(--lmn-collapse-neu-shadow-subtle, var(--neu-shadow-subtle)); }
|
|
1581
|
+
.collapse-item.open .collapse-chev { transform: rotate(180deg); color: var(--lmn-collapse-accent, var(--accent)); }
|
|
1368
1582
|
/* ============ Select ============ */
|
|
1369
1583
|
.select {
|
|
1370
1584
|
position: relative;
|
|
@@ -1380,14 +1594,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1380
1594
|
padding: 0 36px 0 var(--ctrl-pad-x);
|
|
1381
1595
|
border: none;
|
|
1382
1596
|
border-radius: var(--r-md);
|
|
1383
|
-
background: var(--bg);
|
|
1384
|
-
box-shadow: var(--neu-shadow-control);
|
|
1597
|
+
background: var(--lmn-select-bg, var(--bg));
|
|
1598
|
+
box-shadow: var(--lmn-select-neu-shadow-control, var(--neu-shadow-control));
|
|
1385
1599
|
display: inline-flex;
|
|
1386
1600
|
align-items: center;
|
|
1387
1601
|
gap: 8px;
|
|
1388
1602
|
font-size: var(--fs-md);
|
|
1389
1603
|
font-family: inherit;
|
|
1390
|
-
color: var(--fg);
|
|
1604
|
+
color: var(--lmn-select-fg, var(--fg));
|
|
1391
1605
|
cursor: pointer;
|
|
1392
1606
|
transition: all var(--dur-fast) var(--ease);
|
|
1393
1607
|
position: relative;
|
|
@@ -1431,25 +1645,25 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1431
1645
|
height: 18px;
|
|
1432
1646
|
}
|
|
1433
1647
|
.select.invalid .select-trigger {
|
|
1434
|
-
box-shadow: var(--neu-shadow-control), 0 0 0 2px color-mix(in oklch, var(--danger) 30%, transparent);
|
|
1648
|
+
box-shadow: var(--lmn-select-neu-shadow-control, var(--neu-shadow-control)), 0 0 0 2px color-mix(in oklch, var(--lmn-select-danger, var(--danger)) 30%, transparent);
|
|
1435
1649
|
}
|
|
1436
1650
|
.select.invalid.open .select-trigger {
|
|
1437
|
-
box-shadow: var(--neu-shadow-inset), 0 0 0 2px color-mix(in oklch, var(--danger) 30%, transparent);
|
|
1651
|
+
box-shadow: var(--lmn-select-neu-shadow-inset, var(--neu-shadow-inset)), 0 0 0 2px color-mix(in oklch, var(--lmn-select-danger, var(--danger)) 30%, transparent);
|
|
1438
1652
|
}
|
|
1439
1653
|
.select.sm .select-trigger { height: var(--ctrl-h-sm); padding: 0 32px 0 var(--ctrl-pad-x-sm); font-size: var(--fs-sm); border-radius: var(--r-sm); }
|
|
1440
1654
|
.select.lg .select-trigger { height: var(--field-h-lg); padding: 0 36px 0 var(--ctrl-pad-x); font-size: var(--fs-lg); border-radius: var(--r-lg); }
|
|
1441
|
-
.select-trigger:hover { color: var(--accent-ink); }
|
|
1442
|
-
.select.open .select-trigger { box-shadow: var(--neu-shadow-inset); color: var(--accent-ink); }
|
|
1443
|
-
.select-trigger .placeholder { color: var(--fg-subtle); }
|
|
1655
|
+
.select-trigger:hover { color: var(--lmn-select-accent-ink, var(--accent-ink)); }
|
|
1656
|
+
.select.open .select-trigger { box-shadow: var(--lmn-select-neu-shadow-inset, var(--neu-shadow-inset)); color: var(--lmn-select-accent-ink, var(--accent-ink)); }
|
|
1657
|
+
.select-trigger .placeholder { color: var(--lmn-select-fg-subtle, var(--fg-subtle)); }
|
|
1444
1658
|
.select-caret {
|
|
1445
1659
|
position: absolute;
|
|
1446
1660
|
right: 12px; top: 50%;
|
|
1447
1661
|
transform: translateY(-50%);
|
|
1448
|
-
color: var(--fg-subtle);
|
|
1662
|
+
color: var(--lmn-select-fg-subtle, var(--fg-subtle));
|
|
1449
1663
|
transition: transform var(--dur) var(--ease);
|
|
1450
1664
|
flex-shrink: 0;
|
|
1451
1665
|
}
|
|
1452
|
-
.select.open .select-caret { transform: translateY(-50%) rotate(180deg); color: var(--accent); }
|
|
1666
|
+
.select.open .select-caret { transform: translateY(-50%) rotate(180deg); color: var(--lmn-select-accent, var(--accent)); }
|
|
1453
1667
|
/* Multi-select trigger: variable height, tags inside, vertically centered */
|
|
1454
1668
|
.select.multi .select-trigger {
|
|
1455
1669
|
height: auto;
|
|
@@ -1486,25 +1700,28 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1486
1700
|
width: 20px;
|
|
1487
1701
|
height: 20px;
|
|
1488
1702
|
border-radius: 999px;
|
|
1489
|
-
background: var(--bg);
|
|
1490
|
-
|
|
1703
|
+
background: var(--lmn-select-bg, var(--bg));
|
|
1704
|
+
border: none;
|
|
1705
|
+
padding: 0;
|
|
1706
|
+
font: inherit;
|
|
1707
|
+
box-shadow: var(--lmn-select-neu-shadow-control, var(--neu-shadow-control));
|
|
1491
1708
|
display: inline-grid;
|
|
1492
1709
|
place-items: center;
|
|
1493
1710
|
cursor: pointer;
|
|
1494
|
-
color: var(--fg-subtle);
|
|
1711
|
+
color: var(--lmn-select-fg-subtle, var(--fg-subtle));
|
|
1495
1712
|
opacity: 0;
|
|
1496
1713
|
transition: all var(--dur-fast) var(--ease);
|
|
1497
1714
|
z-index: 1;
|
|
1498
1715
|
}
|
|
1499
1716
|
.select:hover .select-clear { opacity: 1; }
|
|
1500
|
-
.select-clear:hover { color: var(--accent-ink); box-shadow: var(--neu-shadow-inset); }
|
|
1717
|
+
.select-clear:hover { color: var(--lmn-select-accent-ink, var(--accent-ink)); box-shadow: var(--lmn-select-neu-shadow-inset, var(--neu-shadow-inset)); }
|
|
1501
1718
|
/* Multi-select menu: leading checkbox per item */
|
|
1502
1719
|
.menu-check {
|
|
1503
1720
|
width: 16px;
|
|
1504
1721
|
height: 16px;
|
|
1505
1722
|
border-radius: 5px;
|
|
1506
|
-
background: var(--bg);
|
|
1507
|
-
box-shadow: var(--neu-shadow-inset);
|
|
1723
|
+
background: var(--lmn-select-bg, var(--bg));
|
|
1724
|
+
box-shadow: var(--lmn-select-neu-shadow-inset, var(--neu-shadow-inset));
|
|
1508
1725
|
display: inline-grid;
|
|
1509
1726
|
place-items: center;
|
|
1510
1727
|
flex-shrink: 0;
|
|
@@ -1512,15 +1729,15 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1512
1729
|
transition: all var(--dur-fast) var(--ease);
|
|
1513
1730
|
}
|
|
1514
1731
|
.menu-check.on {
|
|
1515
|
-
background: var(--accent);
|
|
1516
|
-
box-shadow: var(--neu-shadow-control), 0 1px 4px var(--accent-glow);
|
|
1732
|
+
background: var(--lmn-select-accent, var(--accent));
|
|
1733
|
+
box-shadow: var(--lmn-select-neu-shadow-control, var(--neu-shadow-control)), 0 1px 4px var(--lmn-select-accent-glow, var(--accent-glow));
|
|
1517
1734
|
}
|
|
1518
1735
|
/* Menu search — flush with menu, single subtle separator (no nested frame) */
|
|
1519
1736
|
.menu-search {
|
|
1520
1737
|
display: block;
|
|
1521
1738
|
padding: 4px 2px 8px;
|
|
1522
1739
|
margin: -2px -2px 4px;
|
|
1523
|
-
border-bottom: 1px solid var(--divider);
|
|
1740
|
+
border-bottom: 1px solid var(--lmn-select-divider, var(--divider));
|
|
1524
1741
|
}
|
|
1525
1742
|
.menu-search .input-wrap { width: 100%; }
|
|
1526
1743
|
/* Menu state (loading / empty) */
|
|
@@ -1532,28 +1749,38 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1532
1749
|
gap: 10px;
|
|
1533
1750
|
padding: 26px 12px;
|
|
1534
1751
|
font-size: var(--fs-sm);
|
|
1535
|
-
color: var(--fg-muted);
|
|
1752
|
+
color: var(--lmn-select-fg-muted, var(--fg-muted));
|
|
1536
1753
|
}
|
|
1537
1754
|
.menu-state .menu-state-ico {
|
|
1538
1755
|
width: 40px;
|
|
1539
1756
|
height: 40px;
|
|
1540
1757
|
border-radius: var(--r-md);
|
|
1541
|
-
background: var(--bg);
|
|
1542
|
-
box-shadow: var(--neu-shadow-inset);
|
|
1758
|
+
background: var(--lmn-select-bg, var(--bg));
|
|
1759
|
+
box-shadow: var(--lmn-select-neu-shadow-inset, var(--neu-shadow-inset));
|
|
1543
1760
|
display: grid;
|
|
1544
1761
|
place-items: center;
|
|
1545
|
-
color: var(--fg-subtle);
|
|
1762
|
+
color: var(--lmn-select-fg-subtle, var(--fg-subtle));
|
|
1546
1763
|
}
|
|
1547
1764
|
.menu-state .menu-state-ico .spinner {
|
|
1548
1765
|
width: 16px;
|
|
1549
1766
|
height: 16px;
|
|
1550
1767
|
display: inline-block;
|
|
1551
1768
|
border-radius: 999px;
|
|
1552
|
-
border: 2px solid var(--accent);
|
|
1553
|
-
border-color: var(--accent);
|
|
1769
|
+
border: 2px solid var(--lmn-select-accent, var(--accent));
|
|
1770
|
+
border-color: var(--lmn-select-accent, var(--accent));
|
|
1554
1771
|
border-right-color: transparent;
|
|
1555
1772
|
animation: spin 0.8s linear infinite;
|
|
1556
1773
|
}
|
|
1774
|
+
.select-value-custom {
|
|
1775
|
+
overflow: hidden;
|
|
1776
|
+
}
|
|
1777
|
+
.select-value-custom > * {
|
|
1778
|
+
min-width: 0;
|
|
1779
|
+
max-width: 100%;
|
|
1780
|
+
}
|
|
1781
|
+
@media (prefers-reduced-motion: reduce) {
|
|
1782
|
+
.menu-state .menu-state-ico .spinner { animation: none; }
|
|
1783
|
+
}
|
|
1557
1784
|
/* Option body — supports description line under label */
|
|
1558
1785
|
.menu-item-body {
|
|
1559
1786
|
flex: 1;
|
|
@@ -1563,6 +1790,11 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1563
1790
|
min-width: 0;
|
|
1564
1791
|
text-align: left;
|
|
1565
1792
|
}
|
|
1793
|
+
.menu-item-custom {
|
|
1794
|
+
flex: 1;
|
|
1795
|
+
min-width: 0;
|
|
1796
|
+
text-align: left;
|
|
1797
|
+
}
|
|
1566
1798
|
.menu-item-label {
|
|
1567
1799
|
white-space: nowrap;
|
|
1568
1800
|
overflow: hidden;
|
|
@@ -1570,31 +1802,36 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1570
1802
|
}
|
|
1571
1803
|
.menu-item-desc {
|
|
1572
1804
|
font-size: var(--fs-xs);
|
|
1573
|
-
color: var(--fg-subtle);
|
|
1805
|
+
color: var(--lmn-select-fg-subtle, var(--fg-subtle));
|
|
1574
1806
|
white-space: nowrap;
|
|
1575
1807
|
overflow: hidden;
|
|
1576
1808
|
text-overflow: ellipsis;
|
|
1577
1809
|
}
|
|
1578
|
-
.menu-item.active .menu-item-desc { color: color-mix(in oklch, var(--accent-ink) 70%, var(--fg-subtle)); }
|
|
1810
|
+
.menu-item.active .menu-item-desc { color: color-mix(in oklch, var(--lmn-select-accent-ink, var(--accent-ink)) 70%, var(--lmn-select-fg-subtle, var(--fg-subtle))); }
|
|
1579
1811
|
/* Keyboard / hover highlight — soft raised pill */
|
|
1580
1812
|
.menu-item.highlight:not([disabled]) {
|
|
1581
|
-
background: var(--bg);
|
|
1582
|
-
box-shadow: var(--neu-shadow-control);
|
|
1583
|
-
color: var(--accent-ink);
|
|
1813
|
+
background: var(--lmn-select-bg, var(--bg));
|
|
1814
|
+
box-shadow: var(--lmn-select-neu-shadow-control, var(--neu-shadow-control));
|
|
1815
|
+
color: var(--lmn-select-accent-ink, var(--accent-ink));
|
|
1584
1816
|
}
|
|
1585
1817
|
.menu-item[disabled] {
|
|
1586
1818
|
opacity: 0.45;
|
|
1587
1819
|
cursor: not-allowed;
|
|
1588
1820
|
}
|
|
1589
1821
|
.menu {
|
|
1590
|
-
background: var(--bg);
|
|
1822
|
+
background: var(--lmn-select-bg, var(--bg));
|
|
1591
1823
|
border-radius: var(--r-md);
|
|
1592
|
-
box-shadow: var(--neu-shadow-float);
|
|
1824
|
+
box-shadow: var(--lmn-select-neu-shadow-float, var(--neu-shadow-float));
|
|
1593
1825
|
padding: 6px;
|
|
1594
1826
|
min-width: 180px;
|
|
1827
|
+
max-width: calc(100vw - 16px);
|
|
1595
1828
|
z-index: 1000;
|
|
1596
1829
|
animation: menuIn var(--dur) var(--ease);
|
|
1597
|
-
|
|
1830
|
+
overflow: hidden;
|
|
1831
|
+
}
|
|
1832
|
+
.menu-options {
|
|
1833
|
+
display: flex;
|
|
1834
|
+
flex-direction: column;
|
|
1598
1835
|
overflow-y: auto;
|
|
1599
1836
|
}
|
|
1600
1837
|
.menu-item {
|
|
@@ -1602,7 +1839,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1602
1839
|
border-radius: var(--r-sm);
|
|
1603
1840
|
font-size: var(--fs-md);
|
|
1604
1841
|
cursor: pointer;
|
|
1605
|
-
color: var(--fg);
|
|
1842
|
+
color: var(--lmn-select-fg, var(--fg));
|
|
1606
1843
|
display: flex;
|
|
1607
1844
|
align-items: center;
|
|
1608
1845
|
gap: 10px;
|
|
@@ -1613,20 +1850,83 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1613
1850
|
width: 100%;
|
|
1614
1851
|
text-align: left;
|
|
1615
1852
|
}
|
|
1616
|
-
.menu-item:hover { background: var(--bg); box-shadow: var(--neu-shadow-subtle); color: var(--accent-ink); }
|
|
1617
|
-
.menu-item.active { color: var(--accent-ink); font-weight: 500; }
|
|
1618
|
-
.menu-item .tick { margin-left: auto; color: var(--accent); opacity: 0; }
|
|
1853
|
+
.menu-item:hover { background: var(--lmn-select-bg, var(--bg)); box-shadow: var(--lmn-select-neu-shadow-subtle, var(--neu-shadow-subtle)); color: var(--lmn-select-accent-ink, var(--accent-ink)); }
|
|
1854
|
+
.menu-item.active { color: var(--lmn-select-accent-ink, var(--accent-ink)); font-weight: 500; }
|
|
1855
|
+
.menu-item .tick { margin-left: auto; color: var(--lmn-select-accent, var(--accent)); opacity: 0; }
|
|
1619
1856
|
.menu-item.active .tick { opacity: 1; }
|
|
1620
|
-
.menu-item.danger { color: var(--danger); }
|
|
1621
|
-
.menu-separator { height: 1px; background: var(--divider); margin: 6px 4px; }
|
|
1857
|
+
.menu-item.danger { color: var(--lmn-select-danger, var(--danger)); }
|
|
1858
|
+
.menu-separator { height: 1px; background: var(--lmn-select-divider, var(--divider)); margin: 6px 4px; }
|
|
1622
1859
|
.menu-group-label {
|
|
1623
1860
|
font-size: 10px;
|
|
1624
1861
|
font-weight: 600;
|
|
1625
1862
|
text-transform: uppercase;
|
|
1626
1863
|
letter-spacing: 0.08em;
|
|
1627
|
-
color: var(--fg-subtle);
|
|
1864
|
+
color: var(--lmn-select-fg-subtle, var(--fg-subtle));
|
|
1628
1865
|
padding: 8px 12px 4px;
|
|
1629
1866
|
}
|
|
1867
|
+
/* ============ Form ============ */
|
|
1868
|
+
.lumina-form { display: flex; flex-direction: column; gap: 18px; }
|
|
1869
|
+
.lumina-form.layout-inline {
|
|
1870
|
+
flex-direction: row;
|
|
1871
|
+
flex-wrap: wrap;
|
|
1872
|
+
align-items: flex-start;
|
|
1873
|
+
gap: 12px;
|
|
1874
|
+
}
|
|
1875
|
+
.lumina-form.layout-inline .form-item { flex: 0 0 auto; }
|
|
1876
|
+
.form-item {
|
|
1877
|
+
display: flex;
|
|
1878
|
+
flex-direction: column;
|
|
1879
|
+
gap: 6px;
|
|
1880
|
+
min-width: 0;
|
|
1881
|
+
}
|
|
1882
|
+
.lumina-form.layout-horizontal .form-item {
|
|
1883
|
+
flex-direction: row;
|
|
1884
|
+
align-items: flex-start;
|
|
1885
|
+
gap: 12px;
|
|
1886
|
+
}
|
|
1887
|
+
.lumina-form.layout-horizontal .form-item-label {
|
|
1888
|
+
flex: 0 0 auto;
|
|
1889
|
+
min-width: 96px;
|
|
1890
|
+
padding-top: 10px;
|
|
1891
|
+
text-align: right;
|
|
1892
|
+
}
|
|
1893
|
+
.lumina-form.layout-horizontal .form-item-control { flex: 1; min-width: 0; }
|
|
1894
|
+
.form-item-label {
|
|
1895
|
+
font-size: 13px;
|
|
1896
|
+
font-weight: 500;
|
|
1897
|
+
color: var(--lmn-form-fg, var(--fg));
|
|
1898
|
+
padding-left: 2px;
|
|
1899
|
+
display: inline-flex;
|
|
1900
|
+
align-items: center;
|
|
1901
|
+
gap: 4px;
|
|
1902
|
+
}
|
|
1903
|
+
.form-item-required {
|
|
1904
|
+
color: var(--lmn-form-danger, var(--danger));
|
|
1905
|
+
font-weight: 600;
|
|
1906
|
+
margin-right: 2px;
|
|
1907
|
+
}
|
|
1908
|
+
.form-item-control { min-width: 0; }
|
|
1909
|
+
.form-item-error {
|
|
1910
|
+
font-size: 12px;
|
|
1911
|
+
color: var(--lmn-form-danger, var(--danger));
|
|
1912
|
+
padding-left: 2px;
|
|
1913
|
+
animation: fadeIn var(--dur-fast) var(--ease);
|
|
1914
|
+
}
|
|
1915
|
+
.form-item-help {
|
|
1916
|
+
font-size: 12px;
|
|
1917
|
+
color: var(--lmn-form-fg-subtle, var(--fg-subtle));
|
|
1918
|
+
padding-left: 2px;
|
|
1919
|
+
}
|
|
1920
|
+
.form-item-extra {
|
|
1921
|
+
font-size: 11.5px;
|
|
1922
|
+
color: var(--lmn-form-fg-subtle, var(--fg-subtle));
|
|
1923
|
+
padding-left: 2px;
|
|
1924
|
+
opacity: 0.85;
|
|
1925
|
+
}
|
|
1926
|
+
.form-item.has-error .input-wrap,
|
|
1927
|
+
.form-item.has-error .select-trigger {
|
|
1928
|
+
box-shadow: var(--lmn-form-neu-shadow-inset, var(--neu-shadow-inset)), 0 0 0 2px color-mix(in oklch, var(--lmn-form-danger, var(--danger)) 30%, transparent);
|
|
1929
|
+
}
|
|
1630
1930
|
/* ============ Modal ============ */
|
|
1631
1931
|
.modal-overlay {
|
|
1632
1932
|
position: fixed;
|
|
@@ -1642,15 +1942,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1642
1942
|
display: none;
|
|
1643
1943
|
}
|
|
1644
1944
|
.modal {
|
|
1645
|
-
background: var(--bg);
|
|
1945
|
+
background: var(--lmn-modal-bg, var(--bg));
|
|
1646
1946
|
border-radius: var(--r-xl);
|
|
1647
|
-
box-shadow: var(--neu-shadow-float);
|
|
1947
|
+
box-shadow: var(--lmn-modal-neu-shadow-float, var(--neu-shadow-float));
|
|
1648
1948
|
padding: var(--gap-6);
|
|
1649
1949
|
width: min(480px, 92vw);
|
|
1650
1950
|
animation: modalIn var(--dur-slow) var(--ease);
|
|
1651
1951
|
max-height: 86vh;
|
|
1652
1952
|
display: flex;
|
|
1653
1953
|
flex-direction: column;
|
|
1954
|
+
--overlay-shadow-safe-area: calc(var(--lmn-modal-shadow-offset, var(--shadow-offset)) + var(--lmn-modal-shadow-blur, var(--shadow-blur)));
|
|
1654
1955
|
}
|
|
1655
1956
|
@keyframes modalIn {
|
|
1656
1957
|
from { opacity: 0; transform: translateY(8px) scale(0.97); }
|
|
@@ -1660,7 +1961,6 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1660
1961
|
align-items: flex-start;
|
|
1661
1962
|
justify-content: space-between;
|
|
1662
1963
|
gap: var(--gap-3);
|
|
1663
|
-
margin-bottom: var(--gap-3);
|
|
1664
1964
|
}
|
|
1665
1965
|
.modal-titles {
|
|
1666
1966
|
display: flex;
|
|
@@ -1668,20 +1968,31 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1668
1968
|
gap: 4px;
|
|
1669
1969
|
}
|
|
1670
1970
|
.modal-title { font-size: 17px; font-weight: 600; }
|
|
1671
|
-
.modal-desc { font-size: 13px; color: var(--fg-muted); }
|
|
1971
|
+
.modal-desc { font-size: 13px; color: var(--lmn-modal-fg-muted, var(--fg-muted)); }
|
|
1672
1972
|
.modal-body {
|
|
1673
|
-
|
|
1674
|
-
|
|
1973
|
+
min-width: 0;
|
|
1974
|
+
min-height: 0;
|
|
1975
|
+
margin-inline: calc(var(--gap-6) * -1);
|
|
1976
|
+
padding: var(--overlay-shadow-safe-area);
|
|
1977
|
+
color: var(--lmn-modal-fg-muted, var(--fg-muted));
|
|
1675
1978
|
font-size: 13px;
|
|
1676
1979
|
line-height: 1.6;
|
|
1677
1980
|
flex: 1;
|
|
1678
1981
|
overflow-y: auto;
|
|
1679
1982
|
}
|
|
1983
|
+
.modal-body:first-child {
|
|
1984
|
+
margin-top: calc(var(--gap-6) * -1);
|
|
1985
|
+
}
|
|
1986
|
+
.modal-body:last-child {
|
|
1987
|
+
margin-bottom: calc(var(--gap-6) * -1);
|
|
1988
|
+
}
|
|
1989
|
+
.modal-body.inset-none {
|
|
1990
|
+
padding: 0;
|
|
1991
|
+
}
|
|
1680
1992
|
.modal-foot {
|
|
1681
1993
|
display: flex;
|
|
1682
1994
|
gap: 10px;
|
|
1683
1995
|
justify-content: flex-end;
|
|
1684
|
-
margin-top: var(--gap-4);
|
|
1685
1996
|
}
|
|
1686
1997
|
.modal-close {
|
|
1687
1998
|
width: 28px; height: 28px;
|
|
@@ -1690,14 +2001,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1690
2001
|
border-radius: var(--r-sm);
|
|
1691
2002
|
display: grid;
|
|
1692
2003
|
place-items: center;
|
|
1693
|
-
color: var(--fg-subtle);
|
|
2004
|
+
color: var(--lmn-modal-fg-subtle, var(--fg-subtle));
|
|
1694
2005
|
cursor: pointer;
|
|
1695
2006
|
transition: all var(--dur-fast) var(--ease);
|
|
1696
2007
|
}
|
|
1697
2008
|
.modal-close:hover {
|
|
1698
|
-
color: var(--fg);
|
|
1699
|
-
background: var(--bg);
|
|
1700
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
2009
|
+
color: var(--lmn-modal-fg, var(--fg));
|
|
2010
|
+
background: var(--lmn-modal-bg, var(--bg));
|
|
2011
|
+
box-shadow: var(--lmn-modal-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
1701
2012
|
}
|
|
1702
2013
|
.modal-static-body {
|
|
1703
2014
|
display: flex;
|
|
@@ -1711,16 +2022,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1711
2022
|
display: inline-grid;
|
|
1712
2023
|
place-items: center;
|
|
1713
2024
|
flex-shrink: 0;
|
|
1714
|
-
background: var(--bg);
|
|
1715
|
-
box-shadow: var(--neu-shadow-inset);
|
|
1716
|
-
color: var(--accent);
|
|
2025
|
+
background: var(--lmn-modal-bg, var(--bg));
|
|
2026
|
+
box-shadow: var(--lmn-modal-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2027
|
+
color: var(--lmn-modal-accent, var(--accent));
|
|
1717
2028
|
}
|
|
1718
|
-
.modal-static-icon.success { color: var(--success); }
|
|
1719
|
-
.modal-static-icon.warning { color: var(--warning); }
|
|
1720
|
-
.modal-static-icon.error { color: var(--danger); }
|
|
2029
|
+
.modal-static-icon.success { color: var(--lmn-modal-success, var(--success)); }
|
|
2030
|
+
.modal-static-icon.warning { color: var(--lmn-modal-warning, var(--warning)); }
|
|
2031
|
+
.modal-static-icon.error { color: var(--lmn-modal-danger, var(--danger)); }
|
|
1721
2032
|
.modal-static-content {
|
|
1722
2033
|
min-width: 0;
|
|
1723
|
-
color: var(--fg-muted);
|
|
2034
|
+
color: var(--lmn-modal-fg-muted, var(--fg-muted));
|
|
1724
2035
|
}
|
|
1725
2036
|
/* ============ Drawer ============ */
|
|
1726
2037
|
.drawer-overlay {
|
|
@@ -1736,15 +2047,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1736
2047
|
}
|
|
1737
2048
|
.drawer {
|
|
1738
2049
|
position: fixed;
|
|
1739
|
-
background: var(--bg);
|
|
2050
|
+
background: var(--lmn-drawer-bg, var(--bg));
|
|
1740
2051
|
padding: var(--gap-5);
|
|
1741
2052
|
z-index: 151;
|
|
1742
|
-
overflow
|
|
2053
|
+
overflow: hidden;
|
|
1743
2054
|
display: flex;
|
|
1744
2055
|
flex-direction: column;
|
|
1745
|
-
--
|
|
1746
|
-
--drawer-shadow-
|
|
1747
|
-
--drawer-shadow-
|
|
2056
|
+
--overlay-shadow-safe-area: calc(var(--lmn-drawer-shadow-offset, var(--shadow-offset)) + var(--lmn-drawer-shadow-blur, var(--shadow-blur)));
|
|
2057
|
+
--drawer-shadow-offset: calc(var(--lmn-drawer-shadow-offset, var(--shadow-offset)) * 4 * var(--shadow-float-scale));
|
|
2058
|
+
--drawer-shadow-blur: calc(var(--lmn-drawer-shadow-blur, var(--shadow-blur)) * 3.75 * var(--shadow-float-scale));
|
|
2059
|
+
--drawer-shadow-spread: calc(var(--lmn-drawer-shadow-offset, var(--shadow-offset)) * -3.3 * var(--shadow-float-scale));
|
|
1748
2060
|
}
|
|
1749
2061
|
.drawer.hidden {
|
|
1750
2062
|
display: none;
|
|
@@ -1753,25 +2065,25 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1753
2065
|
top: 0; right: 0; bottom: 0;
|
|
1754
2066
|
width: min(420px, 92vw);
|
|
1755
2067
|
animation: drawerInRight var(--dur-slow) var(--ease);
|
|
1756
|
-
box-shadow: calc(var(--drawer-shadow-offset) * -1) 0 var(--drawer-shadow-blur) var(--drawer-shadow-spread) var(--shadow-dark);
|
|
2068
|
+
box-shadow: calc(var(--drawer-shadow-offset) * -1) 0 var(--drawer-shadow-blur) var(--drawer-shadow-spread) var(--lmn-drawer-shadow-dark, var(--shadow-dark));
|
|
1757
2069
|
}
|
|
1758
2070
|
.drawer.left {
|
|
1759
2071
|
top: 0; left: 0; bottom: 0;
|
|
1760
2072
|
width: min(420px, 92vw);
|
|
1761
2073
|
animation: drawerInLeft var(--dur-slow) var(--ease);
|
|
1762
|
-
box-shadow: var(--drawer-shadow-offset) 0 var(--drawer-shadow-blur) var(--drawer-shadow-spread) var(--shadow-dark);
|
|
2074
|
+
box-shadow: var(--drawer-shadow-offset) 0 var(--drawer-shadow-blur) var(--drawer-shadow-spread) var(--lmn-drawer-shadow-dark, var(--shadow-dark));
|
|
1763
2075
|
}
|
|
1764
2076
|
.drawer.top {
|
|
1765
2077
|
top: 0; left: 0; right: 0;
|
|
1766
2078
|
height: min(320px, 80vh);
|
|
1767
2079
|
animation: drawerInTop var(--dur-slow) var(--ease);
|
|
1768
|
-
box-shadow: 0 var(--drawer-shadow-offset) var(--drawer-shadow-blur) var(--drawer-shadow-spread) var(--shadow-dark);
|
|
2080
|
+
box-shadow: 0 var(--drawer-shadow-offset) var(--drawer-shadow-blur) var(--drawer-shadow-spread) var(--lmn-drawer-shadow-dark, var(--shadow-dark));
|
|
1769
2081
|
}
|
|
1770
2082
|
.drawer.bottom {
|
|
1771
2083
|
bottom: 0; left: 0; right: 0;
|
|
1772
2084
|
height: min(320px, 80vh);
|
|
1773
2085
|
animation: drawerInBottom var(--dur-slow) var(--ease);
|
|
1774
|
-
box-shadow: 0 calc(var(--drawer-shadow-offset) * -1) var(--drawer-shadow-blur) var(--drawer-shadow-spread) var(--shadow-dark);
|
|
2086
|
+
box-shadow: 0 calc(var(--drawer-shadow-offset) * -1) var(--drawer-shadow-blur) var(--drawer-shadow-spread) var(--lmn-drawer-shadow-dark, var(--shadow-dark));
|
|
1775
2087
|
}
|
|
1776
2088
|
@keyframes drawerInRight { from { transform: translateX( 20px); opacity: 0; } }
|
|
1777
2089
|
@keyframes drawerInLeft { from { transform: translateX(-20px); opacity: 0; } }
|
|
@@ -1782,9 +2094,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1782
2094
|
align-items: center;
|
|
1783
2095
|
justify-content: space-between;
|
|
1784
2096
|
gap: var(--gap-3);
|
|
1785
|
-
margin-bottom: var(--gap-4);
|
|
1786
2097
|
padding-bottom: var(--gap-4);
|
|
1787
|
-
border-bottom: 1px solid var(--divider);
|
|
2098
|
+
border-bottom: 1px solid var(--lmn-drawer-divider, var(--divider));
|
|
1788
2099
|
}
|
|
1789
2100
|
.drawer-head-right {
|
|
1790
2101
|
display: inline-flex;
|
|
@@ -1802,25 +2113,38 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1802
2113
|
border-radius: var(--r-sm);
|
|
1803
2114
|
display: grid;
|
|
1804
2115
|
place-items: center;
|
|
1805
|
-
color: var(--fg-subtle);
|
|
2116
|
+
color: var(--lmn-drawer-fg-subtle, var(--fg-subtle));
|
|
1806
2117
|
cursor: pointer;
|
|
1807
2118
|
transition: all var(--dur-fast) var(--ease);
|
|
1808
2119
|
}
|
|
1809
2120
|
.drawer-close:hover {
|
|
1810
|
-
color: var(--fg);
|
|
1811
|
-
background: var(--bg);
|
|
1812
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
2121
|
+
color: var(--lmn-drawer-fg, var(--fg));
|
|
2122
|
+
background: var(--lmn-drawer-bg, var(--bg));
|
|
2123
|
+
box-shadow: var(--lmn-drawer-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
1813
2124
|
}
|
|
1814
2125
|
.drawer-body {
|
|
1815
2126
|
flex: 1;
|
|
2127
|
+
min-width: 0;
|
|
2128
|
+
min-height: 0;
|
|
2129
|
+
margin-inline: calc(var(--gap-5) * -1);
|
|
2130
|
+
padding: var(--overlay-shadow-safe-area);
|
|
2131
|
+
overflow: auto;
|
|
2132
|
+
}
|
|
2133
|
+
.drawer-body:first-child {
|
|
2134
|
+
margin-top: calc(var(--gap-5) * -1);
|
|
2135
|
+
}
|
|
2136
|
+
.drawer-body:last-child {
|
|
2137
|
+
margin-bottom: calc(var(--gap-5) * -1);
|
|
2138
|
+
}
|
|
2139
|
+
.drawer-body.inset-none {
|
|
2140
|
+
padding: 0;
|
|
1816
2141
|
}
|
|
1817
2142
|
.drawer-foot {
|
|
1818
2143
|
display: flex;
|
|
1819
2144
|
gap: 10px;
|
|
1820
2145
|
justify-content: flex-end;
|
|
1821
|
-
margin-top: var(--gap-4);
|
|
1822
2146
|
padding-top: var(--gap-4);
|
|
1823
|
-
border-top: 1px solid var(--divider);
|
|
2147
|
+
border-top: 1px solid var(--lmn-drawer-divider, var(--divider));
|
|
1824
2148
|
}
|
|
1825
2149
|
/* ============ Tooltip ============ */
|
|
1826
2150
|
.tip-anchor {
|
|
@@ -1831,14 +2155,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1831
2155
|
.tip {
|
|
1832
2156
|
display: block;
|
|
1833
2157
|
box-sizing: border-box;
|
|
1834
|
-
background: var(--bg-sunken);
|
|
1835
|
-
color: var(--fg);
|
|
2158
|
+
background: var(--lmn-tooltip-bg-sunken, var(--bg-sunken));
|
|
2159
|
+
color: var(--lmn-tooltip-fg, var(--fg));
|
|
1836
2160
|
padding: 6px 10px;
|
|
1837
2161
|
border-radius: var(--r-sm);
|
|
1838
2162
|
font-size: 11px;
|
|
1839
2163
|
font-weight: 500;
|
|
1840
2164
|
white-space: nowrap;
|
|
1841
|
-
box-shadow: var(--neu-shadow-control);
|
|
2165
|
+
box-shadow: var(--lmn-tooltip-neu-shadow-control, var(--neu-shadow-control));
|
|
1842
2166
|
pointer-events: auto;
|
|
1843
2167
|
animation: fadeIn var(--dur) var(--ease);
|
|
1844
2168
|
z-index: 1000;
|
|
@@ -1858,50 +2182,49 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1858
2182
|
.message-container.bottom-left { bottom: 20px; left: 20px; }
|
|
1859
2183
|
.message-container.top-center { top: 56px; left: 50%; transform: translateX(-50%); align-items: center; }
|
|
1860
2184
|
.message {
|
|
1861
|
-
background: var(--bg);
|
|
2185
|
+
background: var(--lmn-message-bg, var(--bg));
|
|
1862
2186
|
border-radius: var(--r-md);
|
|
1863
|
-
box-shadow: var(--neu-shadow-float);
|
|
2187
|
+
box-shadow: var(--lmn-message-neu-shadow-float, var(--neu-shadow-float));
|
|
1864
2188
|
padding: 12px 16px;
|
|
1865
2189
|
min-width: 240px;
|
|
1866
2190
|
display: flex; align-items: center; gap: 10px;
|
|
1867
2191
|
font-size: 13px;
|
|
1868
2192
|
pointer-events: auto;
|
|
1869
2193
|
animation: messageIn var(--dur-slow) var(--ease);
|
|
1870
|
-
border-left: 3px solid var(--accent);
|
|
1871
|
-
}
|
|
1872
|
-
.message.success { border-color: var(--success); }
|
|
1873
|
-
.message.warning { border-color: var(--warning); }
|
|
1874
|
-
.message.error { border-color: var(--danger); }
|
|
1875
|
-
.message .message-icon { color: var(--accent); flex-shrink: 0; }
|
|
1876
|
-
.message.success .message-icon { color: var(--success); }
|
|
1877
|
-
.message.warning .message-icon { color: var(--warning); }
|
|
1878
|
-
.message.error .message-icon { color: var(--danger); }
|
|
2194
|
+
border-left: 3px solid var(--lmn-message-accent, var(--accent));
|
|
2195
|
+
}
|
|
2196
|
+
.message.success { border-color: var(--lmn-message-success, var(--success)); }
|
|
2197
|
+
.message.warning { border-color: var(--lmn-message-warning, var(--warning)); }
|
|
2198
|
+
.message.error { border-color: var(--lmn-message-danger, var(--danger)); }
|
|
2199
|
+
.message .message-icon { color: var(--lmn-message-accent, var(--accent)); flex-shrink: 0; }
|
|
2200
|
+
.message.success .message-icon { color: var(--lmn-message-success, var(--success)); }
|
|
2201
|
+
.message.warning .message-icon { color: var(--lmn-message-warning, var(--warning)); }
|
|
2202
|
+
.message.error .message-icon { color: var(--lmn-message-danger, var(--danger)); }
|
|
1879
2203
|
.message-body { flex: 1; min-width: 0; }
|
|
1880
2204
|
.message-title { font-weight: 600; margin-bottom: 2px; }
|
|
1881
|
-
.message-content { color: var(--fg-muted); font-size: 12px; }
|
|
2205
|
+
.message-content { color: var(--lmn-message-fg-muted, var(--fg-muted)); font-size: 12px; }
|
|
1882
2206
|
.message-close {
|
|
1883
2207
|
background: transparent; border: none;
|
|
1884
|
-
color: var(--fg-subtle); cursor: pointer;
|
|
2208
|
+
color: var(--lmn-message-fg-subtle, var(--fg-subtle)); cursor: pointer;
|
|
1885
2209
|
padding: 0 2px; font-family: inherit;
|
|
1886
2210
|
}
|
|
1887
|
-
.message-close:hover { color: var(--fg); }
|
|
2211
|
+
.message-close:hover { color: var(--lmn-message-fg, var(--fg)); }
|
|
1888
2212
|
.message.leaving { animation: messageOut var(--dur) var(--ease) forwards; }
|
|
1889
2213
|
@keyframes messageIn { from { opacity: 0; transform: translateX(20px); } }
|
|
1890
2214
|
@keyframes messageOut { to { opacity: 0; transform: translateX(20px); } }
|
|
1891
2215
|
/* ============ Popover ============ */
|
|
1892
2216
|
.popover {
|
|
1893
2217
|
z-index: 1000;
|
|
1894
|
-
background: var(--bg);
|
|
2218
|
+
background: var(--lmn-popover-bg, var(--bg));
|
|
1895
2219
|
border-radius: var(--r-md);
|
|
1896
2220
|
min-width: 220px;
|
|
1897
|
-
box-shadow: var(--neu-shadow-float);
|
|
2221
|
+
box-shadow: var(--lmn-popover-neu-shadow-float, var(--neu-shadow-float));
|
|
1898
2222
|
position: relative;
|
|
1899
2223
|
}
|
|
1900
2224
|
/*
|
|
1901
2225
|
* Direction-aware entrance.
|
|
1902
|
-
* We animate `opacity` + `translate`
|
|
1903
|
-
*
|
|
1904
|
-
* applies for cross-axis centering.
|
|
2226
|
+
* We animate `opacity` + `translate` so positioning stays independent from
|
|
2227
|
+
* the coordinates calculated by useFloating.
|
|
1905
2228
|
*/
|
|
1906
2229
|
.popover-bottom { animation: popoverInDown var(--dur) var(--ease); }
|
|
1907
2230
|
.popover-top { animation: popoverInUp var(--dur) var(--ease); }
|
|
@@ -1922,13 +2245,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1922
2245
|
.popover-title {
|
|
1923
2246
|
font-weight: 600;
|
|
1924
2247
|
font-size: 14px;
|
|
1925
|
-
color: var(--fg);
|
|
2248
|
+
color: var(--lmn-popover-fg, var(--fg));
|
|
1926
2249
|
}
|
|
1927
2250
|
.popover-close {
|
|
1928
2251
|
all: unset;
|
|
1929
2252
|
cursor: pointer;
|
|
1930
2253
|
font-size: 16px;
|
|
1931
|
-
color: var(--fg-muted);
|
|
2254
|
+
color: var(--lmn-popover-fg-muted, var(--fg-muted));
|
|
1932
2255
|
line-height: 1;
|
|
1933
2256
|
padding: 2px 4px;
|
|
1934
2257
|
border-radius: var(--r-xs);
|
|
@@ -1936,7 +2259,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1936
2259
|
margin-left: auto;
|
|
1937
2260
|
}
|
|
1938
2261
|
.popover-close:hover {
|
|
1939
|
-
color: var(--fg);
|
|
2262
|
+
color: var(--lmn-popover-fg, var(--fg));
|
|
1940
2263
|
}
|
|
1941
2264
|
/* ---- Body ---- */
|
|
1942
2265
|
.popover-body {
|
|
@@ -1950,8 +2273,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1950
2273
|
position: absolute;
|
|
1951
2274
|
width: 10px;
|
|
1952
2275
|
height: 10px;
|
|
1953
|
-
background: var(--bg);
|
|
1954
|
-
box-shadow: 2px 2px 4px
|
|
2276
|
+
background: var(--lmn-popover-bg, var(--bg));
|
|
2277
|
+
box-shadow: 2px 2px 4px color-mix(in oklch, var(--lmn-popover-shadow-dark, var(--shadow-dark)) 36%, transparent);
|
|
1955
2278
|
transform: rotate(45deg);
|
|
1956
2279
|
pointer-events: none;
|
|
1957
2280
|
}
|
|
@@ -1959,35 +2282,233 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1959
2282
|
top: -5px;
|
|
1960
2283
|
left: 50%;
|
|
1961
2284
|
margin-left: -5px;
|
|
1962
|
-
box-shadow: -2px -2px 4px
|
|
2285
|
+
box-shadow: -2px -2px 4px color-mix(in oklch, var(--lmn-popover-shadow-dark, var(--shadow-dark)) 36%, transparent);
|
|
1963
2286
|
}
|
|
1964
2287
|
.popover-arrow-top {
|
|
1965
2288
|
bottom: -5px;
|
|
1966
2289
|
left: 50%;
|
|
1967
2290
|
margin-left: -5px;
|
|
1968
|
-
box-shadow: 2px 2px 4px
|
|
2291
|
+
box-shadow: 2px 2px 4px color-mix(in oklch, var(--lmn-popover-shadow-dark, var(--shadow-dark)) 36%, transparent);
|
|
1969
2292
|
}
|
|
1970
2293
|
.popover-arrow-left {
|
|
1971
2294
|
right: -5px;
|
|
1972
2295
|
top: 50%;
|
|
1973
2296
|
margin-top: -5px;
|
|
1974
|
-
box-shadow: 2px -2px 4px
|
|
2297
|
+
box-shadow: 2px -2px 4px color-mix(in oklch, var(--lmn-popover-shadow-dark, var(--shadow-dark)) 36%, transparent);
|
|
1975
2298
|
}
|
|
1976
2299
|
.popover-arrow-right {
|
|
1977
2300
|
left: -5px;
|
|
1978
2301
|
top: 50%;
|
|
1979
2302
|
margin-top: -5px;
|
|
1980
|
-
box-shadow: -2px 2px 4px
|
|
2303
|
+
box-shadow: -2px 2px 4px color-mix(in oklch, var(--lmn-popover-shadow-dark, var(--shadow-dark)) 36%, transparent);
|
|
1981
2304
|
}
|
|
1982
|
-
/* ============
|
|
1983
|
-
.
|
|
2305
|
+
/* ============ ContextMenu ============ */
|
|
2306
|
+
.context-menu {
|
|
2307
|
+
z-index: 5000;
|
|
2308
|
+
padding: 6px;
|
|
2309
|
+
background: var(--lmn-context-menu-bg, var(--bg));
|
|
2310
|
+
border-radius: var(--r-md);
|
|
2311
|
+
box-shadow: var(--lmn-context-menu-neu-shadow-float, var(--neu-shadow-float));
|
|
2312
|
+
border: 1px solid var(--lmn-context-menu-divider, var(--divider));
|
|
1984
2313
|
display: flex;
|
|
1985
|
-
|
|
1986
|
-
|
|
2314
|
+
flex-direction: column;
|
|
2315
|
+
gap: 1px;
|
|
2316
|
+
animation: menuIn var(--dur-fast) var(--ease);
|
|
2317
|
+
max-height: calc(100vh - 24px);
|
|
2318
|
+
overflow-y: auto;
|
|
2319
|
+
}
|
|
2320
|
+
.context-menu-item {
|
|
2321
|
+
display: grid;
|
|
2322
|
+
grid-template-columns: 18px 1fr auto;
|
|
2323
|
+
align-items: center;
|
|
2324
|
+
gap: 8px;
|
|
2325
|
+
padding: 6px 10px;
|
|
2326
|
+
min-height: 28px;
|
|
2327
|
+
border: none;
|
|
2328
|
+
background: transparent;
|
|
2329
|
+
box-shadow: none;
|
|
2330
|
+
font: inherit;
|
|
2331
|
+
font-size: 13px;
|
|
2332
|
+
color: var(--lmn-context-menu-fg, var(--fg));
|
|
2333
|
+
text-align: left;
|
|
2334
|
+
border-radius: var(--r-sm);
|
|
2335
|
+
cursor: pointer;
|
|
2336
|
+
transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease),
|
|
2337
|
+
box-shadow var(--dur-fast) var(--ease);
|
|
2338
|
+
}
|
|
2339
|
+
.context-menu-item:disabled { color: var(--lmn-context-menu-fg-subtle, var(--fg-subtle)); cursor: not-allowed; }
|
|
2340
|
+
.context-menu-item.active:not(:disabled) {
|
|
2341
|
+
background: var(--lmn-context-menu-bg, var(--bg));
|
|
2342
|
+
color: var(--lmn-context-menu-accent-ink, var(--accent-ink));
|
|
2343
|
+
box-shadow: var(--lmn-context-menu-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2344
|
+
}
|
|
2345
|
+
.context-menu-item.danger { color: var(--lmn-context-menu-danger, var(--danger)); }
|
|
2346
|
+
.context-menu-item.danger.active:not(:disabled) {
|
|
2347
|
+
background: var(--lmn-context-menu-bg, var(--bg));
|
|
2348
|
+
color: var(--lmn-context-menu-danger, var(--danger));
|
|
2349
|
+
box-shadow: var(--lmn-context-menu-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2350
|
+
}
|
|
2351
|
+
.context-menu-icon {
|
|
2352
|
+
display: inline-flex;
|
|
2353
|
+
justify-content: center;
|
|
2354
|
+
align-items: center;
|
|
2355
|
+
color: var(--lmn-context-menu-fg-muted, var(--fg-muted));
|
|
2356
|
+
}
|
|
2357
|
+
.context-menu-item.active:not(:disabled) .context-menu-icon { color: inherit; }
|
|
2358
|
+
.context-menu-item.danger .context-menu-icon { color: var(--lmn-context-menu-danger, var(--danger)); }
|
|
2359
|
+
.context-menu-label {
|
|
2360
|
+
overflow: hidden;
|
|
2361
|
+
text-overflow: ellipsis;
|
|
2362
|
+
white-space: nowrap;
|
|
2363
|
+
}
|
|
2364
|
+
.context-menu-shortcut {
|
|
2365
|
+
font-family: var(--font-mono);
|
|
2366
|
+
font-size: 11px;
|
|
2367
|
+
color: var(--lmn-context-menu-fg-subtle, var(--fg-subtle));
|
|
2368
|
+
padding-left: 12px;
|
|
2369
|
+
}
|
|
2370
|
+
.context-menu-item.active:not(:disabled) .context-menu-shortcut { color: inherit; opacity: 0.8; }
|
|
2371
|
+
.context-menu-divider {
|
|
2372
|
+
height: 1px;
|
|
2373
|
+
background: var(--lmn-context-menu-divider, var(--divider));
|
|
2374
|
+
margin: 4px 4px;
|
|
2375
|
+
}
|
|
2376
|
+
/* ============ CommandPalette ============ */
|
|
2377
|
+
.cmdp-overlay {
|
|
2378
|
+
position: fixed;
|
|
2379
|
+
inset: 0;
|
|
2380
|
+
z-index: 4000;
|
|
2381
|
+
background: var(--mask-bg);
|
|
2382
|
+
display: flex;
|
|
2383
|
+
justify-content: center;
|
|
2384
|
+
align-items: flex-start;
|
|
2385
|
+
padding-top: 14vh;
|
|
2386
|
+
animation: fadeIn var(--dur-fast) var(--ease);
|
|
2387
|
+
}
|
|
2388
|
+
.cmdp-panel {
|
|
2389
|
+
width: min(560px, calc(100vw - 48px));
|
|
2390
|
+
max-height: 60vh;
|
|
2391
|
+
background: var(--lmn-command-palette-bg, var(--bg));
|
|
2392
|
+
border-radius: var(--r-lg);
|
|
2393
|
+
box-shadow: var(--lmn-command-palette-neu-shadow-float, var(--neu-shadow-float));
|
|
2394
|
+
border: 1px solid var(--lmn-command-palette-divider, var(--divider));
|
|
2395
|
+
display: flex;
|
|
2396
|
+
flex-direction: column;
|
|
2397
|
+
overflow: hidden;
|
|
2398
|
+
animation: cmdpIn var(--dur) var(--ease);
|
|
2399
|
+
}
|
|
2400
|
+
@keyframes cmdpIn {
|
|
2401
|
+
from { opacity: 0; transform: translateY(-12px) scale(0.98); }
|
|
2402
|
+
to { opacity: 1; transform: translateY(0) scale(1); }
|
|
2403
|
+
}
|
|
2404
|
+
.cmdp-search {
|
|
2405
|
+
padding: 12px 12px 10px;
|
|
2406
|
+
}
|
|
2407
|
+
.cmdp-list {
|
|
2408
|
+
overflow-y: auto;
|
|
2409
|
+
padding: 6px;
|
|
2410
|
+
flex: 1;
|
|
2411
|
+
min-height: 60px;
|
|
2412
|
+
}
|
|
2413
|
+
.cmdp-group + .cmdp-group { margin-top: 4px; }
|
|
2414
|
+
.cmdp-group-head {
|
|
2415
|
+
font-size: 11px;
|
|
2416
|
+
text-transform: uppercase;
|
|
2417
|
+
letter-spacing: 0.06em;
|
|
2418
|
+
color: var(--lmn-command-palette-fg-subtle, var(--fg-subtle));
|
|
2419
|
+
padding: 8px 10px 4px;
|
|
2420
|
+
font-weight: 600;
|
|
2421
|
+
}
|
|
2422
|
+
.cmdp-item {
|
|
2423
|
+
display: grid;
|
|
2424
|
+
grid-template-columns: 20px 1fr auto;
|
|
2425
|
+
align-items: center;
|
|
2426
|
+
gap: 10px;
|
|
2427
|
+
width: 100%;
|
|
2428
|
+
padding: 9px 10px;
|
|
2429
|
+
border: none;
|
|
2430
|
+
background: transparent;
|
|
2431
|
+
box-shadow: none;
|
|
2432
|
+
color: var(--lmn-command-palette-fg, var(--fg));
|
|
2433
|
+
font: inherit;
|
|
2434
|
+
font-size: 13px;
|
|
2435
|
+
text-align: left;
|
|
2436
|
+
border-radius: var(--r-sm);
|
|
2437
|
+
cursor: pointer;
|
|
2438
|
+
transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease),
|
|
2439
|
+
box-shadow var(--dur-fast) var(--ease);
|
|
2440
|
+
}
|
|
2441
|
+
.cmdp-item:disabled { color: var(--lmn-command-palette-fg-subtle, var(--fg-subtle)); cursor: not-allowed; }
|
|
2442
|
+
.cmdp-item.active:not(:disabled) {
|
|
2443
|
+
background: var(--lmn-command-palette-bg, var(--bg));
|
|
2444
|
+
color: var(--lmn-command-palette-accent-ink, var(--accent-ink));
|
|
2445
|
+
box-shadow: var(--lmn-command-palette-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2446
|
+
}
|
|
2447
|
+
.cmdp-icon {
|
|
2448
|
+
display: inline-flex;
|
|
2449
|
+
align-items: center;
|
|
2450
|
+
justify-content: center;
|
|
2451
|
+
color: var(--lmn-command-palette-fg-muted, var(--fg-muted));
|
|
2452
|
+
}
|
|
2453
|
+
.cmdp-item.active:not(:disabled) .cmdp-icon { color: inherit; }
|
|
2454
|
+
.cmdp-labels { display: flex; flex-direction: column; min-width: 0; }
|
|
2455
|
+
.cmdp-label {
|
|
2456
|
+
overflow: hidden;
|
|
2457
|
+
text-overflow: ellipsis;
|
|
2458
|
+
white-space: nowrap;
|
|
2459
|
+
}
|
|
2460
|
+
.cmdp-desc {
|
|
2461
|
+
font-size: 11.5px;
|
|
2462
|
+
color: var(--lmn-command-palette-fg-subtle, var(--fg-subtle));
|
|
2463
|
+
overflow: hidden;
|
|
2464
|
+
text-overflow: ellipsis;
|
|
2465
|
+
white-space: nowrap;
|
|
2466
|
+
}
|
|
2467
|
+
.cmdp-item.active:not(:disabled) .cmdp-desc { color: inherit; opacity: 0.75; }
|
|
2468
|
+
.cmdp-shortcut {
|
|
2469
|
+
font-family: var(--font-mono);
|
|
2470
|
+
font-size: 11px;
|
|
2471
|
+
color: var(--lmn-command-palette-fg-subtle, var(--fg-subtle));
|
|
2472
|
+
}
|
|
2473
|
+
.cmdp-item.active:not(:disabled) .cmdp-shortcut { color: inherit; opacity: 0.8; }
|
|
2474
|
+
.cmdp-empty {
|
|
2475
|
+
padding: 28px 16px;
|
|
2476
|
+
text-align: center;
|
|
2477
|
+
color: var(--lmn-command-palette-fg-subtle, var(--fg-subtle));
|
|
2478
|
+
font-size: 13px;
|
|
2479
|
+
}
|
|
2480
|
+
.cmdp-footer {
|
|
2481
|
+
display: flex;
|
|
2482
|
+
gap: 16px;
|
|
2483
|
+
padding: 8px 14px;
|
|
2484
|
+
border-top: 1px solid var(--lmn-command-palette-divider, var(--divider));
|
|
2485
|
+
background: var(--lmn-command-palette-bg-sunken, var(--bg-sunken));
|
|
2486
|
+
font-size: 11.5px;
|
|
2487
|
+
color: var(--lmn-command-palette-fg-subtle, var(--fg-subtle));
|
|
2488
|
+
}
|
|
2489
|
+
.cmdp-footer span { display: inline-flex; align-items: center; gap: 4px; }
|
|
2490
|
+
.cmdp-kbd {
|
|
2491
|
+
display: inline-grid;
|
|
2492
|
+
place-items: center;
|
|
2493
|
+
min-width: 18px;
|
|
2494
|
+
height: 18px;
|
|
2495
|
+
padding: 0 5px;
|
|
2496
|
+
border-radius: 5px;
|
|
2497
|
+
background: var(--lmn-command-palette-bg, var(--bg));
|
|
2498
|
+
box-shadow: var(--lmn-command-palette-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
2499
|
+
font-family: var(--font-mono);
|
|
2500
|
+
font-size: 10.5px;
|
|
2501
|
+
color: var(--lmn-command-palette-fg-muted, var(--fg-muted));
|
|
2502
|
+
}
|
|
2503
|
+
/* ============ Alert ============ */
|
|
2504
|
+
.alert {
|
|
2505
|
+
display: flex;
|
|
2506
|
+
gap: 12px;
|
|
2507
|
+
align-items: flex-start;
|
|
1987
2508
|
padding: 14px 16px;
|
|
1988
2509
|
border-radius: var(--r-md);
|
|
1989
|
-
background: var(--bg);
|
|
1990
|
-
box-shadow: var(--neu-shadow-inset);
|
|
2510
|
+
background: var(--lmn-alert-bg, var(--bg));
|
|
2511
|
+
box-shadow: var(--lmn-alert-neu-shadow-inset, var(--neu-shadow-inset));
|
|
1991
2512
|
position: relative;
|
|
1992
2513
|
}
|
|
1993
2514
|
.alert-ico {
|
|
@@ -2003,13 +2524,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2003
2524
|
height: 16px;
|
|
2004
2525
|
object-fit: contain;
|
|
2005
2526
|
}
|
|
2006
|
-
.alert.info .alert-ico { color: var(--info); }
|
|
2007
|
-
.alert.success .alert-ico { color: var(--success); }
|
|
2008
|
-
.alert.warning .alert-ico { color: var(--warning); }
|
|
2009
|
-
.alert.danger .alert-ico { color: var(--danger); }
|
|
2527
|
+
.alert.info .alert-ico { color: var(--lmn-alert-info, var(--info)); }
|
|
2528
|
+
.alert.success .alert-ico { color: var(--lmn-alert-success, var(--success)); }
|
|
2529
|
+
.alert.warning .alert-ico { color: var(--lmn-alert-warning, var(--warning)); }
|
|
2530
|
+
.alert.danger .alert-ico { color: var(--lmn-alert-danger, var(--danger)); }
|
|
2010
2531
|
.alert-body { flex: 1; min-width: 0; }
|
|
2011
2532
|
.alert-title { font-size: 13px; font-weight: 600; margin-bottom: 3px; line-height: 1.4; }
|
|
2012
|
-
.alert-desc { font-size: 12px; color: var(--fg-muted); line-height: 1.55; }
|
|
2533
|
+
.alert-desc { font-size: 12px; color: var(--lmn-alert-fg-muted, var(--fg-muted)); line-height: 1.55; }
|
|
2013
2534
|
.alert.no-title { align-items: center; }
|
|
2014
2535
|
.alert.no-title .alert-ico { margin-top: 0; }
|
|
2015
2536
|
.alert.no-icon { gap: 0; }
|
|
@@ -2025,17 +2546,18 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2025
2546
|
position: absolute; top: 10px; right: 10px;
|
|
2026
2547
|
width: 22px; height: 22px; border-radius: 7px;
|
|
2027
2548
|
display: grid; place-items: center;
|
|
2028
|
-
color: var(--fg-subtle);
|
|
2549
|
+
color: var(--lmn-alert-fg-subtle, var(--fg-subtle));
|
|
2029
2550
|
cursor: pointer;
|
|
2030
2551
|
border: none; background: transparent;
|
|
2031
2552
|
}
|
|
2032
|
-
.alert-close:hover { color: var(--fg); background: var(--bg); box-shadow: var(--neu-shadow-subtle); }
|
|
2553
|
+
.alert-close:hover { color: var(--lmn-alert-fg, var(--fg)); background: var(--lmn-alert-bg, var(--bg)); box-shadow: var(--lmn-alert-neu-shadow-subtle, var(--neu-shadow-subtle)); }
|
|
2033
2554
|
/* ============ Table ============ */
|
|
2034
2555
|
.table-wrap {
|
|
2035
2556
|
border-radius: var(--r-lg);
|
|
2036
|
-
background: var(--bg);
|
|
2037
|
-
box-shadow: var(--neu-shadow-inset);
|
|
2557
|
+
background: var(--lmn-table-bg, var(--bg));
|
|
2558
|
+
box-shadow: var(--lmn-table-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2038
2559
|
overflow: auto;
|
|
2560
|
+
container-type: inline-size;
|
|
2039
2561
|
}
|
|
2040
2562
|
/* When scroll=y is on, the wrap itself becomes the scroll region. */
|
|
2041
2563
|
.table-wrap.scroll-y { overflow-y: auto; }
|
|
@@ -2049,51 +2571,68 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2049
2571
|
.table th {
|
|
2050
2572
|
text-align: left;
|
|
2051
2573
|
padding: 14px 18px;
|
|
2052
|
-
background: var(--bg);
|
|
2574
|
+
background: var(--lmn-table-bg, var(--bg));
|
|
2053
2575
|
font-size: 11px;
|
|
2054
2576
|
font-weight: 700;
|
|
2055
2577
|
letter-spacing: 0.08em;
|
|
2056
2578
|
text-transform: uppercase;
|
|
2057
|
-
color: var(--fg-subtle);
|
|
2058
|
-
border-bottom: 1px solid var(--divider);
|
|
2579
|
+
color: var(--lmn-table-fg-subtle, var(--fg-subtle));
|
|
2580
|
+
border-bottom: 1px solid var(--lmn-table-divider, var(--divider));
|
|
2059
2581
|
position: sticky; top: 0;
|
|
2060
2582
|
z-index: 1;
|
|
2061
2583
|
}
|
|
2062
2584
|
/* When the wrap is the scroll container (scroll.y), position:sticky on th needs
|
|
2063
2585
|
top:0 relative to the wrap — browsers already handle that. Adding a stronger
|
|
2064
2586
|
bg so content under the header doesn't bleed through. */
|
|
2065
|
-
.table.sticky-head th { background: var(--bg); }
|
|
2066
|
-
.table th.sortable {
|
|
2067
|
-
.table th.sortable:hover { color: var(--fg); }
|
|
2587
|
+
.table.sticky-head th { background: var(--lmn-table-bg, var(--bg)); }
|
|
2588
|
+
.table th.sortable { user-select: none; }
|
|
2589
|
+
.table th.sortable:hover { color: var(--lmn-table-fg, var(--fg)); }
|
|
2590
|
+
.table-sort-trigger.btn {
|
|
2591
|
+
height: auto;
|
|
2592
|
+
min-height: 24px;
|
|
2593
|
+
padding: 2px 4px;
|
|
2594
|
+
color: inherit;
|
|
2595
|
+
font: inherit;
|
|
2596
|
+
letter-spacing: inherit;
|
|
2597
|
+
text-transform: inherit;
|
|
2598
|
+
}
|
|
2068
2599
|
.table th .th-label { vertical-align: middle; }
|
|
2069
2600
|
.table th .sort-ind {
|
|
2070
2601
|
display: inline-flex;
|
|
2071
2602
|
width: 16px; height: 16px;
|
|
2072
2603
|
border-radius: 6px;
|
|
2073
|
-
background: var(--bg);
|
|
2074
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
2604
|
+
background: var(--lmn-table-bg, var(--bg));
|
|
2605
|
+
box-shadow: var(--lmn-table-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
2075
2606
|
align-items: center; justify-content: center;
|
|
2076
2607
|
margin-left: 6px;
|
|
2077
|
-
color: var(--fg-subtle);
|
|
2608
|
+
color: var(--lmn-table-fg-subtle, var(--fg-subtle));
|
|
2078
2609
|
vertical-align: middle;
|
|
2079
2610
|
}
|
|
2080
|
-
.table th.sorted .sort-ind { color: var(--accent); box-shadow: var(--neu-shadow-inset); }
|
|
2611
|
+
.table th.sorted .sort-ind { color: var(--lmn-table-accent, var(--accent)); box-shadow: var(--lmn-table-neu-shadow-inset, var(--neu-shadow-inset)); }
|
|
2081
2612
|
.table td {
|
|
2082
2613
|
padding: 12px 18px;
|
|
2083
|
-
border-bottom: 1px solid var(--divider);
|
|
2614
|
+
border-bottom: 1px solid var(--lmn-table-divider, var(--divider));
|
|
2084
2615
|
vertical-align: middle;
|
|
2085
2616
|
}
|
|
2086
|
-
.table.hoverable tbody tr:hover td { background: color-mix(in oklch, var(--accent-soft) 40%, transparent); }
|
|
2617
|
+
.table.hoverable tbody tr:hover td { background: color-mix(in oklch, var(--lmn-table-accent-soft, var(--accent-soft)) 40%, transparent); }
|
|
2087
2618
|
.table tbody tr.clickable { cursor: pointer; }
|
|
2088
|
-
.table tbody tr.
|
|
2619
|
+
.table tbody tr.clickable:focus-visible td {
|
|
2620
|
+
background: color-mix(in oklch, var(--lmn-table-accent-soft, var(--accent-soft)) 55%, transparent);
|
|
2621
|
+
box-shadow: inset 0 0 0 2px var(--lmn-table-accent-glow, var(--accent-glow));
|
|
2622
|
+
}
|
|
2623
|
+
.table tbody tr.selected td { background: color-mix(in oklch, var(--lmn-table-accent-soft, var(--accent-soft)) 80%, transparent); color: var(--lmn-table-accent-ink, var(--accent-ink)); }
|
|
2089
2624
|
.table tbody tr:last-child td { border-bottom: none; }
|
|
2090
2625
|
.table.striped tbody tr:nth-child(even) td {
|
|
2091
|
-
background: color-mix(in oklch, var(--bg-sunken) 40%, transparent);
|
|
2626
|
+
background: color-mix(in oklch, var(--lmn-table-bg-sunken, var(--bg-sunken)) 40%, transparent);
|
|
2627
|
+
}
|
|
2628
|
+
.table:not(.cards) tbody tr.active-row td {
|
|
2629
|
+
background: color-mix(in oklch, var(--lmn-table-accent-soft, var(--accent-soft)) 72%, transparent);
|
|
2630
|
+
color: var(--lmn-table-accent-ink, var(--accent-ink));
|
|
2092
2631
|
}
|
|
2093
2632
|
/* Embossed: each row sits on the surface */
|
|
2094
2633
|
.table.embossed { border-spacing: 0; }
|
|
2095
2634
|
.table.embossed tbody td {
|
|
2096
|
-
background: var(--bg);
|
|
2635
|
+
background: var(--lmn-table-bg, var(--bg));
|
|
2097
2636
|
}
|
|
2098
2637
|
/* Card-row variant: each row is its own raised pill */
|
|
2099
2638
|
.table.cards {
|
|
@@ -2113,8 +2652,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2113
2652
|
inset: 0;
|
|
2114
2653
|
z-index: -1;
|
|
2115
2654
|
border-radius: var(--r-md);
|
|
2116
|
-
background: var(--bg);
|
|
2117
|
-
box-shadow: var(--neu-shadow-control);
|
|
2655
|
+
background: var(--lmn-table-bg, var(--bg));
|
|
2656
|
+
box-shadow: var(--lmn-table-neu-shadow-control, var(--neu-shadow-control));
|
|
2118
2657
|
pointer-events: none;
|
|
2119
2658
|
transition: box-shadow var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);
|
|
2120
2659
|
}
|
|
@@ -2142,38 +2681,60 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2142
2681
|
.table.cards.hoverable tbody tr:hover {
|
|
2143
2682
|
transform: translateY(-1px);
|
|
2144
2683
|
}
|
|
2145
|
-
.table.cards.hoverable tbody tr:hover .card-row-surface { box-shadow: var(--neu-shadow-panel); }
|
|
2684
|
+
.table.cards.hoverable tbody tr:hover .card-row-surface { box-shadow: var(--lmn-table-neu-shadow-panel, var(--neu-shadow-panel)); }
|
|
2146
2685
|
.table.cards.hoverable tbody tr:hover td { background: transparent; }
|
|
2686
|
+
.table.cards tbody tr.active-row .card-row-surface {
|
|
2687
|
+
box-shadow:
|
|
2688
|
+
var(--lmn-table-neu-shadow-control, var(--neu-shadow-control)),
|
|
2689
|
+
inset 0 0 0 2px var(--lmn-table-accent-glow, var(--accent-glow));
|
|
2690
|
+
}
|
|
2691
|
+
.table.cards tbody tr.active-row td {
|
|
2692
|
+
color: var(--lmn-table-accent-ink, var(--accent-ink));
|
|
2693
|
+
}
|
|
2147
2694
|
.table .row-check { width: 44px; }
|
|
2148
2695
|
.table .row-check .checkbox { display: inline-flex; }
|
|
2149
2696
|
.table .row-expand { width: 40px; text-align: center; }
|
|
2150
|
-
.table-empty {
|
|
2697
|
+
.table .table-empty {
|
|
2698
|
+
padding: 0;
|
|
2699
|
+
color: var(--lmn-table-fg-muted, var(--fg-muted));
|
|
2700
|
+
}
|
|
2701
|
+
.table-empty-content {
|
|
2702
|
+
box-sizing: border-box;
|
|
2703
|
+
width: 100%;
|
|
2704
|
+
padding: 60px 20px;
|
|
2705
|
+
text-align: center;
|
|
2706
|
+
}
|
|
2707
|
+
.table-wrap.scroll-x .table-empty-content {
|
|
2708
|
+
position: sticky;
|
|
2709
|
+
left: 0;
|
|
2710
|
+
width: 100cqi;
|
|
2711
|
+
}
|
|
2151
2712
|
/* Expand button */
|
|
2152
2713
|
.expand-btn {
|
|
2153
2714
|
width: 22px; height: 22px;
|
|
2154
2715
|
border: none;
|
|
2155
2716
|
border-radius: var(--r-sm);
|
|
2156
|
-
background: var(--bg);
|
|
2157
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
2158
|
-
color: var(--fg-subtle);
|
|
2717
|
+
background: var(--lmn-table-bg, var(--bg));
|
|
2718
|
+
box-shadow: var(--lmn-table-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
2719
|
+
color: var(--lmn-table-fg-subtle, var(--fg-subtle));
|
|
2159
2720
|
display: inline-flex; align-items: center; justify-content: center;
|
|
2160
2721
|
cursor: pointer;
|
|
2161
2722
|
transition: transform var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
|
|
2162
2723
|
}
|
|
2163
|
-
.expand-btn:hover { color: var(--accent-ink); box-shadow: var(--neu-shadow-control); }
|
|
2164
|
-
.expand-btn.open { transform: rotate(90deg); color: var(--accent-ink); box-shadow: var(--neu-shadow-inset); }
|
|
2724
|
+
.expand-btn:hover { color: var(--lmn-table-accent-ink, var(--accent-ink)); box-shadow: var(--lmn-table-neu-shadow-control, var(--neu-shadow-control)); }
|
|
2725
|
+
.expand-btn.open { transform: rotate(90deg); color: var(--lmn-table-accent-ink, var(--accent-ink)); box-shadow: var(--lmn-table-neu-shadow-inset, var(--neu-shadow-inset)); }
|
|
2165
2726
|
/* Expanded row panel */
|
|
2166
2727
|
.table tbody tr.expanded-row td {
|
|
2167
2728
|
padding: 14px 18px;
|
|
2168
|
-
border-bottom: 1px solid var(--divider);
|
|
2169
|
-
background: color-mix(in oklch, var(--bg-sunken) 25%, transparent);
|
|
2729
|
+
border-bottom: 1px solid var(--lmn-table-divider, var(--divider));
|
|
2730
|
+
background: color-mix(in oklch, var(--lmn-table-bg-sunken, var(--bg-sunken)) 25%, transparent);
|
|
2170
2731
|
}
|
|
2171
2732
|
.expanded-panel {
|
|
2172
2733
|
padding: 14px 16px;
|
|
2173
2734
|
border-radius: var(--r-md);
|
|
2174
|
-
background: var(--bg);
|
|
2175
|
-
box-shadow: var(--neu-shadow-inset);
|
|
2176
|
-
color: var(--fg);
|
|
2735
|
+
background: var(--lmn-table-bg, var(--bg));
|
|
2736
|
+
box-shadow: var(--lmn-table-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2737
|
+
color: var(--lmn-table-fg, var(--fg));
|
|
2177
2738
|
font-size: 13px;
|
|
2178
2739
|
}
|
|
2179
2740
|
/* Radio-style row selector */
|
|
@@ -2182,30 +2743,30 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2182
2743
|
border-radius: 50%;
|
|
2183
2744
|
border: none;
|
|
2184
2745
|
padding: 0;
|
|
2185
|
-
background: var(--bg);
|
|
2186
|
-
box-shadow: var(--neu-shadow-inset);
|
|
2746
|
+
background: var(--lmn-table-bg, var(--bg));
|
|
2747
|
+
box-shadow: var(--lmn-table-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2187
2748
|
display: inline-flex; align-items: center; justify-content: center;
|
|
2188
2749
|
cursor: pointer;
|
|
2189
2750
|
transition: box-shadow var(--dur-fast) var(--ease);
|
|
2190
2751
|
}
|
|
2191
2752
|
.table .row-check .radio-dot:disabled { opacity: 0.5; cursor: not-allowed; }
|
|
2192
2753
|
.table .row-check .radio-dot.checked {
|
|
2193
|
-
box-shadow: var(--neu-shadow-control);
|
|
2754
|
+
box-shadow: var(--lmn-table-neu-shadow-control, var(--neu-shadow-control));
|
|
2194
2755
|
}
|
|
2195
2756
|
.table .row-check .radio-dot.checked::after {
|
|
2196
2757
|
content: "";
|
|
2197
2758
|
width: 8px; height: 8px;
|
|
2198
2759
|
border-radius: 50%;
|
|
2199
|
-
background: var(--accent);
|
|
2760
|
+
background: var(--lmn-table-accent, var(--accent));
|
|
2200
2761
|
}
|
|
2201
2762
|
/* Filter button on header */
|
|
2202
2763
|
.table th.filterable .filter-ind {
|
|
2203
2764
|
display: inline-flex;
|
|
2204
2765
|
width: 18px; height: 18px;
|
|
2205
2766
|
border-radius: 5px;
|
|
2206
|
-
background: var(--bg);
|
|
2207
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
2208
|
-
color: var(--fg-subtle);
|
|
2767
|
+
background: var(--lmn-table-bg, var(--bg));
|
|
2768
|
+
box-shadow: var(--lmn-table-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
2769
|
+
color: var(--lmn-table-fg-subtle, var(--fg-subtle));
|
|
2209
2770
|
align-items: center; justify-content: center;
|
|
2210
2771
|
margin-left: 6px;
|
|
2211
2772
|
cursor: pointer;
|
|
@@ -2214,19 +2775,19 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2214
2775
|
padding: 0;
|
|
2215
2776
|
transition: color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
|
|
2216
2777
|
}
|
|
2217
|
-
.table th.filterable .filter-ind:hover { color: var(--fg); }
|
|
2778
|
+
.table th.filterable .filter-ind:hover { color: var(--lmn-table-fg, var(--fg)); }
|
|
2218
2779
|
.table th.filterable .filter-ind.active {
|
|
2219
|
-
color: var(--accent-ink);
|
|
2220
|
-
box-shadow: var(--neu-shadow-inset);
|
|
2780
|
+
color: var(--lmn-table-accent-ink, var(--accent-ink));
|
|
2781
|
+
box-shadow: var(--lmn-table-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2221
2782
|
}
|
|
2222
2783
|
/* Filter popover panel (portaled to body) */
|
|
2223
2784
|
.table-filter-panel {
|
|
2224
2785
|
z-index: 1001;
|
|
2225
2786
|
min-width: 200px;
|
|
2226
2787
|
max-width: 260px;
|
|
2227
|
-
background: var(--bg);
|
|
2788
|
+
background: var(--lmn-table-bg, var(--bg));
|
|
2228
2789
|
border-radius: var(--r-md);
|
|
2229
|
-
box-shadow: var(--neu-shadow-float);
|
|
2790
|
+
box-shadow: var(--lmn-table-neu-shadow-float, var(--neu-shadow-float));
|
|
2230
2791
|
padding: 10px;
|
|
2231
2792
|
animation: menuIn var(--dur) var(--ease);
|
|
2232
2793
|
}
|
|
@@ -2245,12 +2806,12 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2245
2806
|
padding: 6px 8px;
|
|
2246
2807
|
border-radius: var(--r-sm);
|
|
2247
2808
|
font-size: 13px;
|
|
2248
|
-
color: var(--fg);
|
|
2809
|
+
color: var(--lmn-table-fg, var(--fg));
|
|
2249
2810
|
cursor: pointer;
|
|
2250
2811
|
transition: background var(--dur-fast) var(--ease);
|
|
2251
2812
|
}
|
|
2252
2813
|
.table-filter-item:hover {
|
|
2253
|
-
background: color-mix(in oklch, var(--accent-soft) 40%, transparent);
|
|
2814
|
+
background: color-mix(in oklch, var(--lmn-table-accent-soft, var(--accent-soft)) 40%, transparent);
|
|
2254
2815
|
}
|
|
2255
2816
|
.table-filter-actions {
|
|
2256
2817
|
display: flex;
|
|
@@ -2258,24 +2819,35 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2258
2819
|
gap: 6px;
|
|
2259
2820
|
margin-top: 6px;
|
|
2260
2821
|
padding-top: 8px;
|
|
2261
|
-
border-top: 1px solid var(--divider);
|
|
2822
|
+
border-top: 1px solid var(--lmn-table-divider, var(--divider));
|
|
2262
2823
|
}
|
|
2263
2824
|
.table-filter-actions .tf-btn {
|
|
2264
2825
|
border: none;
|
|
2265
2826
|
padding: 6px 12px;
|
|
2266
2827
|
border-radius: var(--r-sm);
|
|
2267
|
-
background: var(--bg);
|
|
2268
|
-
box-shadow: var(--neu-shadow-control);
|
|
2828
|
+
background: var(--lmn-table-bg, var(--bg));
|
|
2829
|
+
box-shadow: var(--lmn-table-neu-shadow-control, var(--neu-shadow-control));
|
|
2269
2830
|
font-size: 12px;
|
|
2270
2831
|
font-family: inherit;
|
|
2271
|
-
color: var(--fg);
|
|
2832
|
+
color: var(--lmn-table-fg, var(--fg));
|
|
2272
2833
|
cursor: pointer;
|
|
2273
2834
|
transition: box-shadow var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
|
|
2274
2835
|
}
|
|
2275
|
-
.table-filter-actions .tf-btn:hover { box-shadow: var(--neu-shadow-inset); }
|
|
2276
|
-
.table-filter-actions .tf-btn.primary { color: var(--accent-ink); font-weight: 600; }
|
|
2277
|
-
.table-filter-actions .tf-btn.ghost { color: var(--fg-muted); box-shadow: var(--neu-shadow-subtle); }
|
|
2278
|
-
.table-filter-actions .tf-btn.ghost:hover { box-shadow: var(--neu-shadow-inset); }
|
|
2836
|
+
.table-filter-actions .tf-btn:hover { box-shadow: var(--lmn-table-neu-shadow-inset, var(--neu-shadow-inset)); }
|
|
2837
|
+
.table-filter-actions .tf-btn.primary { color: var(--lmn-table-accent-ink, var(--accent-ink)); font-weight: 600; }
|
|
2838
|
+
.table-filter-actions .tf-btn.ghost { color: var(--lmn-table-fg-muted, var(--fg-muted)); box-shadow: var(--lmn-table-neu-shadow-subtle, var(--neu-shadow-subtle)); }
|
|
2839
|
+
.table-filter-actions .tf-btn.ghost:hover { box-shadow: var(--lmn-table-neu-shadow-inset, var(--neu-shadow-inset)); }
|
|
2840
|
+
.table-sr-only {
|
|
2841
|
+
position: absolute;
|
|
2842
|
+
width: 1px;
|
|
2843
|
+
height: 1px;
|
|
2844
|
+
padding: 0;
|
|
2845
|
+
margin: -1px;
|
|
2846
|
+
overflow: hidden;
|
|
2847
|
+
clip: rect(0, 0, 0, 0);
|
|
2848
|
+
white-space: nowrap;
|
|
2849
|
+
border: 0;
|
|
2850
|
+
}
|
|
2279
2851
|
/* Built-in pagination bar */
|
|
2280
2852
|
.table-pagination {
|
|
2281
2853
|
margin-top: 12px;
|
|
@@ -2283,8 +2855,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2283
2855
|
/* ============ TablePro ============ */
|
|
2284
2856
|
.table-card {
|
|
2285
2857
|
border-radius: var(--r-lg);
|
|
2286
|
-
background: var(--bg);
|
|
2287
|
-
box-shadow: var(--neu-shadow-control);
|
|
2858
|
+
background: var(--lmn-table-pro-bg, var(--bg));
|
|
2859
|
+
box-shadow: var(--lmn-table-pro-neu-shadow-control, var(--neu-shadow-control));
|
|
2288
2860
|
overflow: hidden;
|
|
2289
2861
|
}
|
|
2290
2862
|
.table-card .table-wrap { background: transparent; box-shadow: none; border-radius: 0; }
|
|
@@ -2292,7 +2864,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2292
2864
|
.table-card .table-pagination {
|
|
2293
2865
|
margin-top: 0;
|
|
2294
2866
|
padding: 6px 16px;
|
|
2295
|
-
border-top: 1px solid var(--divider);
|
|
2867
|
+
border-top: 1px solid var(--lmn-table-pro-divider, var(--divider));
|
|
2296
2868
|
background: transparent;
|
|
2297
2869
|
}
|
|
2298
2870
|
.table-toolbar {
|
|
@@ -2300,7 +2872,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2300
2872
|
align-items: center;
|
|
2301
2873
|
gap: var(--gap-3);
|
|
2302
2874
|
padding: 14px 16px;
|
|
2303
|
-
border-bottom: 1px solid var(--divider);
|
|
2875
|
+
border-bottom: 1px solid var(--lmn-table-pro-divider, var(--divider));
|
|
2304
2876
|
}
|
|
2305
2877
|
.table-toolbar .table-title {
|
|
2306
2878
|
font-size: 14px;
|
|
@@ -2322,7 +2894,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2322
2894
|
}
|
|
2323
2895
|
.table-footer {
|
|
2324
2896
|
padding: 10px 16px;
|
|
2325
|
-
border-top: 1px solid var(--divider);
|
|
2897
|
+
border-top: 1px solid var(--lmn-table-pro-divider, var(--divider));
|
|
2326
2898
|
background: transparent;
|
|
2327
2899
|
}
|
|
2328
2900
|
/* ============ Pagination ============ */
|
|
@@ -2332,7 +2904,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2332
2904
|
justify-content: space-between;
|
|
2333
2905
|
padding: 12px 14px;
|
|
2334
2906
|
font-size: 12px;
|
|
2335
|
-
color: var(--fg-muted);
|
|
2907
|
+
color: var(--lmn-pagination-fg-muted, var(--fg-muted));
|
|
2336
2908
|
gap: 12px;
|
|
2337
2909
|
flex-wrap: wrap;
|
|
2338
2910
|
}
|
|
@@ -2342,24 +2914,24 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2342
2914
|
padding: 0 10px;
|
|
2343
2915
|
border: none;
|
|
2344
2916
|
border-radius: var(--r-sm);
|
|
2345
|
-
background: var(--bg);
|
|
2346
|
-
box-shadow: var(--neu-shadow-control);
|
|
2917
|
+
background: var(--lmn-pagination-bg, var(--bg));
|
|
2918
|
+
box-shadow: var(--lmn-pagination-neu-shadow-control, var(--neu-shadow-control));
|
|
2347
2919
|
display: inline-flex; align-items: center; justify-content: center;
|
|
2348
2920
|
cursor: pointer;
|
|
2349
2921
|
font-size: 12px;
|
|
2350
2922
|
font-family: inherit;
|
|
2351
2923
|
font-variant-numeric: tabular-nums;
|
|
2352
|
-
color: var(--fg);
|
|
2924
|
+
color: var(--lmn-pagination-fg, var(--fg));
|
|
2353
2925
|
transition: all var(--dur-fast) var(--ease);
|
|
2354
2926
|
}
|
|
2355
|
-
.pagination .pg:hover { color: var(--accent-ink); }
|
|
2927
|
+
.pagination .pg:hover { color: var(--lmn-pagination-accent-ink, var(--accent-ink)); }
|
|
2356
2928
|
.pagination .pg.active {
|
|
2357
|
-
box-shadow: var(--neu-shadow-inset);
|
|
2358
|
-
color: var(--accent-ink);
|
|
2929
|
+
box-shadow: var(--lmn-pagination-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2930
|
+
color: var(--lmn-pagination-accent-ink, var(--accent-ink));
|
|
2359
2931
|
font-weight: 700;
|
|
2360
2932
|
}
|
|
2361
|
-
.pagination .pg.disabled { color: var(--fg-subtle); cursor: not-allowed; box-shadow: var(--neu-shadow-subtle); }
|
|
2362
|
-
.pagination .ellipsis { padding: 0 4px; color: var(--fg-subtle); }
|
|
2933
|
+
.pagination .pg.disabled { color: var(--lmn-pagination-fg-subtle, var(--fg-subtle)); cursor: not-allowed; box-shadow: var(--lmn-pagination-neu-shadow-subtle, var(--neu-shadow-subtle)); }
|
|
2934
|
+
.pagination .ellipsis { padding: 0 4px; color: var(--lmn-pagination-fg-subtle, var(--fg-subtle)); }
|
|
2363
2935
|
/* size changer — compact Select inline with the page buttons */
|
|
2364
2936
|
.pagination .pg-size-changer { margin-left: 8px; min-width: 108px; }
|
|
2365
2937
|
/* quick jumper */
|
|
@@ -2368,36 +2940,37 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2368
2940
|
align-items: center;
|
|
2369
2941
|
gap: 6px;
|
|
2370
2942
|
margin-left: 8px;
|
|
2371
|
-
color: var(--fg-muted);
|
|
2943
|
+
color: var(--lmn-pagination-fg-muted, var(--fg-muted));
|
|
2372
2944
|
font-size: 12px;
|
|
2373
2945
|
}
|
|
2374
|
-
.pagination .pg-jumper-label { color: var(--fg-muted); }
|
|
2946
|
+
.pagination .pg-jumper-label { color: var(--lmn-pagination-fg-muted, var(--fg-muted)); }
|
|
2375
2947
|
.pagination .pg-jumper-input {
|
|
2376
|
-
width:
|
|
2377
|
-
|
|
2378
|
-
|
|
2379
|
-
border: none;
|
|
2380
|
-
border-radius: var(--r-sm);
|
|
2381
|
-
background: var(--bg);
|
|
2382
|
-
box-shadow: var(--neu-shadow-inset);
|
|
2383
|
-
color: var(--fg);
|
|
2384
|
-
font-family: inherit;
|
|
2385
|
-
font-size: 12px;
|
|
2948
|
+
width: 52px;
|
|
2949
|
+
}
|
|
2950
|
+
.pagination .pg-jumper-input .input {
|
|
2386
2951
|
font-variant-numeric: tabular-nums;
|
|
2387
2952
|
text-align: center;
|
|
2388
|
-
outline: none;
|
|
2389
|
-
transition: box-shadow var(--dur-fast) var(--ease);
|
|
2390
2953
|
}
|
|
2391
|
-
|
|
2392
|
-
|
|
2954
|
+
@media (max-width: 480px) {
|
|
2955
|
+
.pagination {
|
|
2956
|
+
align-items: flex-start;
|
|
2957
|
+
padding-inline: 8px;
|
|
2958
|
+
}
|
|
2959
|
+
.pagination .pg-controls {
|
|
2960
|
+
flex-wrap: wrap;
|
|
2961
|
+
}
|
|
2962
|
+
.pagination .pg-size-changer,
|
|
2963
|
+
.pagination .pg-jumper {
|
|
2964
|
+
margin-left: 0;
|
|
2965
|
+
}
|
|
2393
2966
|
}
|
|
2394
2967
|
/* ============ List ============ */
|
|
2395
2968
|
.list {
|
|
2396
2969
|
display: flex;
|
|
2397
2970
|
flex-direction: column;
|
|
2398
|
-
background: var(--bg);
|
|
2971
|
+
background: var(--lmn-list-bg, var(--bg));
|
|
2399
2972
|
border-radius: var(--r-lg);
|
|
2400
|
-
box-shadow: var(--neu-shadow-inset);
|
|
2973
|
+
box-shadow: var(--lmn-list-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2401
2974
|
padding: 8px;
|
|
2402
2975
|
}
|
|
2403
2976
|
.list-item {
|
|
@@ -2408,15 +2981,31 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2408
2981
|
border-radius: var(--r-sm);
|
|
2409
2982
|
transition: all var(--dur-fast) var(--ease);
|
|
2410
2983
|
}
|
|
2984
|
+
.list-item-trigger {
|
|
2985
|
+
display: flex;
|
|
2986
|
+
align-items: center;
|
|
2987
|
+
gap: 12px;
|
|
2988
|
+
flex: 1;
|
|
2989
|
+
min-width: 0;
|
|
2990
|
+
}
|
|
2991
|
+
button.list-item-trigger {
|
|
2992
|
+
border: 0;
|
|
2993
|
+
padding: 0;
|
|
2994
|
+
background: transparent;
|
|
2995
|
+
color: inherit;
|
|
2996
|
+
font: inherit;
|
|
2997
|
+
text-align: left;
|
|
2998
|
+
cursor: pointer;
|
|
2999
|
+
}
|
|
2411
3000
|
.list-item.clickable { cursor: pointer; }
|
|
2412
|
-
.list-item.clickable:hover { background: var(--bg); box-shadow: var(--neu-shadow-subtle); }
|
|
2413
|
-
.list-item.selected { box-shadow: var(--neu-shadow-control); background: var(--bg); }
|
|
2414
|
-
.list.with-dividers .list-item + .list-item { border-top: 1px solid var(--divider); border-radius: 0; }
|
|
3001
|
+
.list-item.clickable:hover { background: var(--lmn-list-bg, var(--bg)); box-shadow: var(--lmn-list-neu-shadow-subtle, var(--neu-shadow-subtle)); }
|
|
3002
|
+
.list-item.selected { box-shadow: var(--lmn-list-neu-shadow-control, var(--neu-shadow-control)); background: var(--lmn-list-bg, var(--bg)); }
|
|
3003
|
+
.list.with-dividers .list-item + .list-item { border-top: 1px solid var(--lmn-list-divider, var(--divider)); border-radius: 0; }
|
|
2415
3004
|
.list-item-meta { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
|
|
2416
3005
|
.list-item-title { font-size: 13px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
|
2417
|
-
.list-item-desc { font-size: 12px; color: var(--fg-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
|
3006
|
+
.list-item-desc { font-size: 12px; color: var(--lmn-list-fg-muted, var(--fg-muted)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
|
2418
3007
|
.list-item-actions { display: flex; gap: 6px; align-items: center; flex-shrink: 0; }
|
|
2419
|
-
.list-item-avatar { display: inline-flex; align-items: center; justify-content: center; color: var(--fg-muted); flex-shrink: 0; }
|
|
3008
|
+
.list-item-avatar { display: inline-flex; align-items: center; justify-content: center; color: var(--lmn-list-fg-muted, var(--fg-muted)); flex-shrink: 0; }
|
|
2420
3009
|
/* ============ Spin ============ */
|
|
2421
3010
|
.spin {
|
|
2422
3011
|
width: 14px;
|
|
@@ -2427,17 +3016,17 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2427
3016
|
animation: spin 0.8s linear infinite;
|
|
2428
3017
|
display: inline-block;
|
|
2429
3018
|
}
|
|
2430
|
-
.spin.accent { color: var(--accent); }
|
|
2431
|
-
.spin.success { color: var(--success); }
|
|
2432
|
-
.spin.warning { color: var(--warning); }
|
|
2433
|
-
.spin.danger { color: var(--danger); }
|
|
3019
|
+
.spin.accent { color: var(--lmn-spin-accent, var(--accent)); }
|
|
3020
|
+
.spin.success { color: var(--lmn-spin-success, var(--success)); }
|
|
3021
|
+
.spin.warning { color: var(--lmn-spin-warning, var(--warning)); }
|
|
3022
|
+
.spin.danger { color: var(--lmn-spin-danger, var(--danger)); }
|
|
2434
3023
|
.spin.ring {
|
|
2435
3024
|
position: relative;
|
|
2436
3025
|
display: inline-block;
|
|
2437
3026
|
border: none;
|
|
2438
3027
|
border-radius: 50%;
|
|
2439
|
-
background: var(--bg);
|
|
2440
|
-
box-shadow: var(--neu-shadow-inset);
|
|
3028
|
+
background: var(--lmn-spin-bg, var(--bg));
|
|
3029
|
+
box-shadow: var(--lmn-spin-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2441
3030
|
animation: none;
|
|
2442
3031
|
}
|
|
2443
3032
|
.spin.ring::before {
|
|
@@ -2479,9 +3068,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2479
3068
|
height: 0.4em;
|
|
2480
3069
|
border-radius: 999px;
|
|
2481
3070
|
background: radial-gradient(circle at 32% 28%,
|
|
2482
|
-
color-mix(in oklch, currentColor 40%, var(--bg)),
|
|
3071
|
+
color-mix(in oklch, currentColor 40%, var(--lmn-spin-bg, var(--bg))),
|
|
2483
3072
|
currentColor 62%,
|
|
2484
|
-
color-mix(in oklch, currentColor 82%, var(--fg)) 100%);
|
|
3073
|
+
color-mix(in oklch, currentColor 82%, var(--lmn-spin-fg, var(--fg))) 100%);
|
|
2485
3074
|
box-shadow:
|
|
2486
3075
|
0 0.06em 0.14em color-mix(in oklch, currentColor 45%, transparent),
|
|
2487
3076
|
0 0 0.35em color-mix(in oklch, currentColor 50%, transparent);
|
|
@@ -2498,15 +3087,20 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2498
3087
|
display: inline-flex;
|
|
2499
3088
|
align-items: center;
|
|
2500
3089
|
gap: 8px;
|
|
2501
|
-
color: var(--fg-muted);
|
|
3090
|
+
color: var(--lmn-spin-fg-muted, var(--fg-muted));
|
|
2502
3091
|
}
|
|
2503
3092
|
.spin-label { font-size: 12px; }
|
|
3093
|
+
@media (prefers-reduced-motion: reduce) {
|
|
3094
|
+
.spin,
|
|
3095
|
+
.spin.ring::before,
|
|
3096
|
+
.spin.dots i { animation: none; }
|
|
3097
|
+
}
|
|
2504
3098
|
/* ============ Empty ============ */
|
|
2505
3099
|
.empty {
|
|
2506
3100
|
padding: 60px 20px;
|
|
2507
3101
|
display: grid; place-items: center;
|
|
2508
3102
|
gap: 12px;
|
|
2509
|
-
color: var(--fg-muted);
|
|
3103
|
+
color: var(--lmn-empty-fg-muted, var(--fg-muted));
|
|
2510
3104
|
text-align: center;
|
|
2511
3105
|
}
|
|
2512
3106
|
.empty.sm { padding: 28px 16px; gap: 8px; }
|
|
@@ -2521,25 +3115,25 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2521
3115
|
.empty-ico {
|
|
2522
3116
|
width: 56px; height: 56px;
|
|
2523
3117
|
border-radius: var(--r-lg);
|
|
2524
|
-
background: var(--bg);
|
|
2525
|
-
box-shadow: var(--neu-shadow-inset);
|
|
3118
|
+
background: var(--lmn-empty-bg, var(--bg));
|
|
3119
|
+
box-shadow: var(--lmn-empty-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2526
3120
|
display: grid; place-items: center;
|
|
2527
|
-
color: var(--fg-subtle);
|
|
3121
|
+
color: var(--lmn-empty-fg-subtle, var(--fg-subtle));
|
|
2528
3122
|
}
|
|
2529
|
-
.empty-title { font-size: 14px; font-weight: 600; color: var(--fg); }
|
|
3123
|
+
.empty-title { font-size: 14px; font-weight: 600; color: var(--lmn-empty-fg, var(--fg)); }
|
|
2530
3124
|
.empty-desc { font-size: 12px; }
|
|
2531
3125
|
.empty-action { margin-top: 8px; }
|
|
2532
3126
|
/* ============ Skeleton ============ */
|
|
2533
3127
|
.skeleton {
|
|
2534
3128
|
display: block;
|
|
2535
|
-
background: color-mix(in oklch, var(--accent-soft) 55%, var(--bg-sunken));
|
|
3129
|
+
background: color-mix(in oklch, var(--lmn-skeleton-accent-soft, var(--accent-soft)) 55%, var(--lmn-skeleton-bg-sunken, var(--bg-sunken)));
|
|
2536
3130
|
border-radius: var(--r-sm);
|
|
2537
3131
|
}
|
|
2538
3132
|
.skeleton.wave {
|
|
2539
3133
|
background: linear-gradient(90deg,
|
|
2540
|
-
color-mix(in oklch, var(--accent-soft) 35%, var(--bg-sunken)),
|
|
2541
|
-
color-mix(in oklch, var(--accent-soft) 75%, var(--bg-sunken)),
|
|
2542
|
-
color-mix(in oklch, var(--accent-soft) 35%, var(--bg-sunken)));
|
|
3134
|
+
color-mix(in oklch, var(--lmn-skeleton-accent-soft, var(--accent-soft)) 35%, var(--lmn-skeleton-bg-sunken, var(--bg-sunken))),
|
|
3135
|
+
color-mix(in oklch, var(--lmn-skeleton-accent-soft, var(--accent-soft)) 75%, var(--lmn-skeleton-bg-sunken, var(--bg-sunken))),
|
|
3136
|
+
color-mix(in oklch, var(--lmn-skeleton-accent-soft, var(--accent-soft)) 35%, var(--lmn-skeleton-bg-sunken, var(--bg-sunken))));
|
|
2543
3137
|
background-size: 200% 100%;
|
|
2544
3138
|
animation: skel-wave 1.4s ease-in-out infinite;
|
|
2545
3139
|
}
|
|
@@ -2568,6 +3162,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2568
3162
|
.skeleton-box .skeleton-row {
|
|
2569
3163
|
display: block;
|
|
2570
3164
|
}
|
|
3165
|
+
@media (prefers-reduced-motion: reduce) {
|
|
3166
|
+
.skeleton.wave,
|
|
3167
|
+
.skeleton.pulse { animation: none; }
|
|
3168
|
+
}
|
|
2571
3169
|
/* ============ DatePicker ============ */
|
|
2572
3170
|
.date-picker {
|
|
2573
3171
|
position: relative;
|
|
@@ -2586,7 +3184,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2586
3184
|
width: 100%;
|
|
2587
3185
|
}
|
|
2588
3186
|
.date-picker.open .input-wrap {
|
|
2589
|
-
box-shadow: var(--neu-shadow-inset);
|
|
3187
|
+
box-shadow: var(--lmn-date-picker-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2590
3188
|
}
|
|
2591
3189
|
.date-picker-panel {
|
|
2592
3190
|
position: fixed;
|
|
@@ -2594,8 +3192,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2594
3192
|
width: 344px;
|
|
2595
3193
|
padding: var(--gap-3);
|
|
2596
3194
|
border-radius: var(--r-md);
|
|
2597
|
-
background: var(--bg);
|
|
2598
|
-
box-shadow: var(--neu-shadow-float);
|
|
3195
|
+
background: var(--lmn-date-picker-bg, var(--bg));
|
|
3196
|
+
box-shadow: var(--lmn-date-picker-neu-shadow-float, var(--neu-shadow-float));
|
|
2599
3197
|
animation: menuIn var(--dur) var(--ease);
|
|
2600
3198
|
}
|
|
2601
3199
|
.date-picker-panel .calendar {
|
|
@@ -2613,7 +3211,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2613
3211
|
gap: var(--gap-2);
|
|
2614
3212
|
margin-top: var(--gap-3);
|
|
2615
3213
|
padding-top: var(--gap-3);
|
|
2616
|
-
border-top: 1px solid var(--divider);
|
|
3214
|
+
border-top: 1px solid var(--lmn-date-picker-divider, var(--divider));
|
|
2617
3215
|
}
|
|
2618
3216
|
.date-picker-footer-spacer {
|
|
2619
3217
|
flex: 1;
|
|
@@ -2637,7 +3235,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2637
3235
|
width: 100%;
|
|
2638
3236
|
}
|
|
2639
3237
|
.date-time-picker.open .input-wrap {
|
|
2640
|
-
box-shadow: var(--neu-shadow-inset);
|
|
3238
|
+
box-shadow: var(--lmn-date-time-picker-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2641
3239
|
}
|
|
2642
3240
|
.date-time-picker-panel {
|
|
2643
3241
|
position: fixed;
|
|
@@ -2645,10 +3243,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2645
3243
|
width: 476px;
|
|
2646
3244
|
padding: var(--gap-2) var(--gap-3);
|
|
2647
3245
|
border-radius: var(--r-md);
|
|
2648
|
-
background: var(--bg);
|
|
3246
|
+
background: var(--lmn-date-time-picker-bg, var(--bg));
|
|
2649
3247
|
box-shadow:
|
|
2650
|
-
0 calc(var(--shadow-offset) * 1.1) calc(var(--shadow-blur) * 1.3) color-mix(in oklch, var(--shadow-dark) 72%, transparent),
|
|
2651
|
-
inset 0 0 0 1px var(--divider);
|
|
3248
|
+
0 calc(var(--lmn-date-time-picker-shadow-offset, var(--shadow-offset)) * 1.1) calc(var(--lmn-date-time-picker-shadow-blur, var(--shadow-blur)) * 1.3) color-mix(in oklch, var(--lmn-date-time-picker-shadow-dark, var(--shadow-dark)) 72%, transparent),
|
|
3249
|
+
inset 0 0 0 1px var(--lmn-date-time-picker-divider, var(--divider));
|
|
2652
3250
|
animation: menuIn var(--dur) var(--ease);
|
|
2653
3251
|
}
|
|
2654
3252
|
.date-time-picker-body {
|
|
@@ -2706,8 +3304,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2706
3304
|
grid-template-columns: repeat(3, minmax(0, 1fr));
|
|
2707
3305
|
padding: 8px;
|
|
2708
3306
|
border-radius: var(--r-sm);
|
|
2709
|
-
background: var(--bg);
|
|
2710
|
-
box-shadow: inset 0 0 0 1px var(--divider);
|
|
3307
|
+
background: var(--lmn-date-time-picker-bg, var(--bg));
|
|
3308
|
+
box-shadow: inset 0 0 0 1px var(--lmn-date-time-picker-divider, var(--divider));
|
|
2711
3309
|
overflow: hidden;
|
|
2712
3310
|
}
|
|
2713
3311
|
.date-time-picker-panel.without-second .date-time-picker-time-columns {
|
|
@@ -2717,7 +3315,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2717
3315
|
min-width: 0;
|
|
2718
3316
|
}
|
|
2719
3317
|
.date-time-picker-time-column + .date-time-picker-time-column {
|
|
2720
|
-
border-left: 1px solid var(--divider);
|
|
3318
|
+
border-left: 1px solid var(--lmn-date-time-picker-divider, var(--divider));
|
|
2721
3319
|
}
|
|
2722
3320
|
.date-time-picker-time-label {
|
|
2723
3321
|
height: 20px;
|
|
@@ -2725,7 +3323,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2725
3323
|
place-items: center;
|
|
2726
3324
|
font-size: var(--fs-xs);
|
|
2727
3325
|
font-weight: 700;
|
|
2728
|
-
color: var(--fg-muted);
|
|
3326
|
+
color: var(--lmn-date-time-picker-fg-muted, var(--fg-muted));
|
|
2729
3327
|
}
|
|
2730
3328
|
.date-time-picker-time-list {
|
|
2731
3329
|
display: flex;
|
|
@@ -2750,7 +3348,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2750
3348
|
border: none;
|
|
2751
3349
|
border-radius: 7px;
|
|
2752
3350
|
background: transparent;
|
|
2753
|
-
color: var(--fg);
|
|
3351
|
+
color: var(--lmn-date-time-picker-fg, var(--fg));
|
|
2754
3352
|
cursor: pointer;
|
|
2755
3353
|
font: 600 var(--fs-md) var(--font-mono);
|
|
2756
3354
|
transition:
|
|
@@ -2759,17 +3357,17 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2759
3357
|
box-shadow var(--dur-fast) var(--ease);
|
|
2760
3358
|
}
|
|
2761
3359
|
.date-time-picker-time-option:hover:not(:disabled) {
|
|
2762
|
-
color: var(--accent-ink);
|
|
2763
|
-
background: var(--bg);
|
|
2764
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
3360
|
+
color: var(--lmn-date-time-picker-accent-ink, var(--accent-ink));
|
|
3361
|
+
background: var(--lmn-date-time-picker-bg, var(--bg));
|
|
3362
|
+
box-shadow: var(--lmn-date-time-picker-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
2765
3363
|
}
|
|
2766
3364
|
.date-time-picker-time-option.selected {
|
|
2767
|
-
color: var(--accent-ink);
|
|
2768
|
-
background: var(--bg);
|
|
2769
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
3365
|
+
color: var(--lmn-date-time-picker-accent-ink, var(--accent-ink));
|
|
3366
|
+
background: var(--lmn-date-time-picker-bg, var(--bg));
|
|
3367
|
+
box-shadow: var(--lmn-date-time-picker-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
2770
3368
|
}
|
|
2771
3369
|
.date-time-picker-time-option:disabled {
|
|
2772
|
-
color: var(--fg-subtle);
|
|
3370
|
+
color: var(--lmn-date-time-picker-fg-subtle, var(--fg-subtle));
|
|
2773
3371
|
cursor: not-allowed;
|
|
2774
3372
|
opacity: 0.45;
|
|
2775
3373
|
}
|
|
@@ -2779,7 +3377,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2779
3377
|
gap: var(--gap-2);
|
|
2780
3378
|
margin-top: var(--gap-2);
|
|
2781
3379
|
padding-top: var(--gap-2);
|
|
2782
|
-
border-top: 1px solid var(--divider);
|
|
3380
|
+
border-top: 1px solid var(--lmn-date-time-picker-divider, var(--divider));
|
|
2783
3381
|
}
|
|
2784
3382
|
.date-time-picker-footer-spacer {
|
|
2785
3383
|
flex: 1;
|
|
@@ -2813,10 +3411,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2813
3411
|
}
|
|
2814
3412
|
/* ============ Calendar ============ */
|
|
2815
3413
|
.calendar {
|
|
2816
|
-
background: var(--bg);
|
|
3414
|
+
background: var(--lmn-calendar-bg, var(--bg));
|
|
2817
3415
|
border-radius: var(--r-lg);
|
|
2818
3416
|
padding: var(--gap-4);
|
|
2819
|
-
box-shadow: var(--neu-shadow-panel);
|
|
3417
|
+
box-shadow: var(--lmn-calendar-neu-shadow-panel, var(--neu-shadow-panel));
|
|
2820
3418
|
width: 320px;
|
|
2821
3419
|
}
|
|
2822
3420
|
.calendar-head {
|
|
@@ -2827,11 +3425,11 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2827
3425
|
font-size: 14px; font-weight: 600;
|
|
2828
3426
|
display: inline-flex; align-items: center; gap: 8px;
|
|
2829
3427
|
cursor: pointer; padding: 6px 10px; border-radius: var(--r-sm);
|
|
2830
|
-
border: none; background: transparent; color: var(--fg);
|
|
3428
|
+
border: none; background: transparent; color: var(--lmn-calendar-fg, var(--fg));
|
|
2831
3429
|
font-family: inherit;
|
|
2832
3430
|
transition: all var(--dur-fast) var(--ease);
|
|
2833
3431
|
}
|
|
2834
|
-
.calendar-title:hover { background: var(--bg); box-shadow: var(--neu-shadow-subtle); }
|
|
3432
|
+
.calendar-title:hover { background: var(--lmn-calendar-bg, var(--bg)); box-shadow: var(--lmn-calendar-neu-shadow-subtle, var(--neu-shadow-subtle)); }
|
|
2835
3433
|
.calendar-title.static {
|
|
2836
3434
|
cursor: default;
|
|
2837
3435
|
}
|
|
@@ -2849,7 +3447,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2849
3447
|
border-radius: var(--r-sm);
|
|
2850
3448
|
padding: 6px 8px;
|
|
2851
3449
|
background: transparent;
|
|
2852
|
-
color: var(--fg);
|
|
3450
|
+
color: var(--lmn-calendar-fg, var(--fg));
|
|
2853
3451
|
cursor: pointer;
|
|
2854
3452
|
font: 600 14px var(--font-sans);
|
|
2855
3453
|
transition:
|
|
@@ -2858,9 +3456,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2858
3456
|
box-shadow var(--dur-fast) var(--ease);
|
|
2859
3457
|
}
|
|
2860
3458
|
.calendar-title-part:hover {
|
|
2861
|
-
color: var(--accent-ink);
|
|
2862
|
-
background: var(--bg);
|
|
2863
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
3459
|
+
color: var(--lmn-calendar-accent-ink, var(--accent-ink));
|
|
3460
|
+
background: var(--lmn-calendar-bg, var(--bg));
|
|
3461
|
+
box-shadow: var(--lmn-calendar-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
2864
3462
|
}
|
|
2865
3463
|
.calendar-grid {
|
|
2866
3464
|
display: grid;
|
|
@@ -2871,7 +3469,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2871
3469
|
text-align: center;
|
|
2872
3470
|
font-size: 10px;
|
|
2873
3471
|
font-weight: 600;
|
|
2874
|
-
color: var(--fg-subtle);
|
|
3472
|
+
color: var(--lmn-calendar-fg-subtle, var(--fg-subtle));
|
|
2875
3473
|
text-transform: uppercase;
|
|
2876
3474
|
letter-spacing: 0.06em;
|
|
2877
3475
|
padding: 8px 0;
|
|
@@ -2881,7 +3479,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2881
3479
|
aspect-ratio: 1;
|
|
2882
3480
|
display: grid; place-items: center;
|
|
2883
3481
|
font-size: 12px;
|
|
2884
|
-
color: var(--fg);
|
|
3482
|
+
color: var(--lmn-calendar-fg, var(--fg));
|
|
2885
3483
|
border-radius: var(--r-sm);
|
|
2886
3484
|
cursor: pointer;
|
|
2887
3485
|
border: none;
|
|
@@ -2889,22 +3487,22 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2889
3487
|
font-family: inherit;
|
|
2890
3488
|
transition: all var(--dur-fast) var(--ease);
|
|
2891
3489
|
}
|
|
2892
|
-
.calendar-cell.out { color: var(--fg-subtle); opacity: 0.5; }
|
|
2893
|
-
.calendar-cell:hover { background: var(--bg); box-shadow: var(--neu-shadow-subtle); }
|
|
2894
|
-
.calendar-cell.today { font-weight: 700; color: var(--accent-ink); }
|
|
3490
|
+
.calendar-cell.out { color: var(--lmn-calendar-fg-subtle, var(--fg-subtle)); opacity: 0.5; }
|
|
3491
|
+
.calendar-cell:hover { background: var(--lmn-calendar-bg, var(--bg)); box-shadow: var(--lmn-calendar-neu-shadow-subtle, var(--neu-shadow-subtle)); }
|
|
3492
|
+
.calendar-cell.today { font-weight: 700; color: var(--lmn-calendar-accent-ink, var(--accent-ink)); }
|
|
2895
3493
|
.calendar-cell.today::after {
|
|
2896
3494
|
content: ""; position: absolute; bottom: 4px; left: 50%;
|
|
2897
3495
|
width: 4px; height: 4px; border-radius: 999px;
|
|
2898
|
-
background: var(--accent);
|
|
3496
|
+
background: var(--lmn-calendar-accent, var(--accent));
|
|
2899
3497
|
transform: translateX(-50%);
|
|
2900
3498
|
}
|
|
2901
3499
|
.calendar-cell.selected {
|
|
2902
|
-
background: var(--bg);
|
|
2903
|
-
box-shadow: var(--neu-shadow-inset);
|
|
2904
|
-
color: var(--accent-ink);
|
|
3500
|
+
background: var(--lmn-calendar-bg, var(--bg));
|
|
3501
|
+
box-shadow: var(--lmn-calendar-neu-shadow-inset, var(--neu-shadow-inset));
|
|
3502
|
+
color: var(--lmn-calendar-accent-ink, var(--accent-ink));
|
|
2905
3503
|
font-weight: 600;
|
|
2906
3504
|
}
|
|
2907
|
-
.calendar-cell.disabled { color: var(--fg-subtle); opacity: 0.4; cursor: not-allowed; }
|
|
3505
|
+
.calendar-cell.disabled { color: var(--lmn-calendar-fg-subtle, var(--fg-subtle)); opacity: 0.4; cursor: not-allowed; }
|
|
2908
3506
|
.calendar-cell.disabled:hover { background: transparent; box-shadow: none; }
|
|
2909
3507
|
.calendar-select-grid {
|
|
2910
3508
|
display: grid;
|
|
@@ -2918,7 +3516,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2918
3516
|
border: none;
|
|
2919
3517
|
border-radius: var(--r-sm);
|
|
2920
3518
|
background: transparent;
|
|
2921
|
-
color: var(--fg);
|
|
3519
|
+
color: var(--lmn-calendar-fg, var(--fg));
|
|
2922
3520
|
cursor: pointer;
|
|
2923
3521
|
font: 600 var(--fs-md) var(--font-mono);
|
|
2924
3522
|
transition:
|
|
@@ -2927,17 +3525,17 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2927
3525
|
box-shadow var(--dur-fast) var(--ease);
|
|
2928
3526
|
}
|
|
2929
3527
|
.calendar-select-option:hover:not(:disabled) {
|
|
2930
|
-
color: var(--accent-ink);
|
|
2931
|
-
background: var(--bg);
|
|
2932
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
3528
|
+
color: var(--lmn-calendar-accent-ink, var(--accent-ink));
|
|
3529
|
+
background: var(--lmn-calendar-bg, var(--bg));
|
|
3530
|
+
box-shadow: var(--lmn-calendar-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
2933
3531
|
}
|
|
2934
3532
|
.calendar-select-option.selected {
|
|
2935
|
-
color: var(--accent-ink);
|
|
2936
|
-
background: var(--bg);
|
|
2937
|
-
box-shadow: var(--neu-shadow-inset);
|
|
3533
|
+
color: var(--lmn-calendar-accent-ink, var(--accent-ink));
|
|
3534
|
+
background: var(--lmn-calendar-bg, var(--bg));
|
|
3535
|
+
box-shadow: var(--lmn-calendar-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2938
3536
|
}
|
|
2939
3537
|
.calendar-select-option.disabled {
|
|
2940
|
-
color: var(--fg-subtle);
|
|
3538
|
+
color: var(--lmn-calendar-fg-subtle, var(--fg-subtle));
|
|
2941
3539
|
cursor: not-allowed;
|
|
2942
3540
|
opacity: 0.4;
|
|
2943
3541
|
}
|
|
@@ -2959,7 +3557,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2959
3557
|
width: 100%;
|
|
2960
3558
|
}
|
|
2961
3559
|
.time-picker.open .input-wrap {
|
|
2962
|
-
box-shadow: var(--neu-shadow-inset);
|
|
3560
|
+
box-shadow: var(--lmn-time-picker-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2963
3561
|
}
|
|
2964
3562
|
.time-picker-panel {
|
|
2965
3563
|
position: fixed;
|
|
@@ -2967,10 +3565,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2967
3565
|
width: 300px;
|
|
2968
3566
|
padding: 10px;
|
|
2969
3567
|
border-radius: var(--r-md);
|
|
2970
|
-
background: var(--bg);
|
|
3568
|
+
background: var(--lmn-time-picker-bg, var(--bg));
|
|
2971
3569
|
box-shadow:
|
|
2972
|
-
0 calc(var(--shadow-offset) * 1.1) calc(var(--shadow-blur) * 1.3) color-mix(in oklch, var(--shadow-dark) 72%, transparent),
|
|
2973
|
-
inset 0 0 0 1px var(--divider);
|
|
3570
|
+
0 calc(var(--lmn-time-picker-shadow-offset, var(--shadow-offset)) * 1.1) calc(var(--lmn-time-picker-shadow-blur, var(--shadow-blur)) * 1.3) color-mix(in oklch, var(--lmn-time-picker-shadow-dark, var(--shadow-dark)) 72%, transparent),
|
|
3571
|
+
inset 0 0 0 1px var(--lmn-time-picker-divider, var(--divider));
|
|
2974
3572
|
animation: menuIn var(--dur) var(--ease);
|
|
2975
3573
|
}
|
|
2976
3574
|
.time-picker-panel.without-second {
|
|
@@ -2983,12 +3581,12 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2983
3581
|
gap: 0;
|
|
2984
3582
|
padding: 8px;
|
|
2985
3583
|
border-radius: var(--r-sm);
|
|
2986
|
-
background: var(--bg);
|
|
2987
|
-
box-shadow: inset 0 0 0 1px var(--divider);
|
|
3584
|
+
background: var(--lmn-time-picker-bg, var(--bg));
|
|
3585
|
+
box-shadow: inset 0 0 0 1px var(--lmn-time-picker-divider, var(--divider));
|
|
2988
3586
|
overflow: hidden;
|
|
2989
3587
|
}
|
|
2990
3588
|
.time-picker-column + .time-picker-column {
|
|
2991
|
-
border-left: 1px solid var(--divider);
|
|
3589
|
+
border-left: 1px solid var(--lmn-time-picker-divider, var(--divider));
|
|
2992
3590
|
}
|
|
2993
3591
|
.time-picker-panel.without-second .time-picker-columns {
|
|
2994
3592
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
@@ -3004,7 +3602,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3004
3602
|
place-items: center;
|
|
3005
3603
|
font-size: var(--fs-xs);
|
|
3006
3604
|
font-weight: 700;
|
|
3007
|
-
color: var(--fg-muted);
|
|
3605
|
+
color: var(--lmn-time-picker-fg-muted, var(--fg-muted));
|
|
3008
3606
|
}
|
|
3009
3607
|
.time-picker-list {
|
|
3010
3608
|
display: flex;
|
|
@@ -3034,7 +3632,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3034
3632
|
border: none;
|
|
3035
3633
|
border-radius: 7px;
|
|
3036
3634
|
background: transparent;
|
|
3037
|
-
color: var(--fg);
|
|
3635
|
+
color: var(--lmn-time-picker-fg, var(--fg));
|
|
3038
3636
|
cursor: pointer;
|
|
3039
3637
|
font: 600 var(--fs-md) var(--font-mono);
|
|
3040
3638
|
transition:
|
|
@@ -3043,17 +3641,17 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3043
3641
|
box-shadow var(--dur-fast) var(--ease);
|
|
3044
3642
|
}
|
|
3045
3643
|
.time-picker-option:hover:not(:disabled) {
|
|
3046
|
-
color: var(--accent-ink);
|
|
3047
|
-
background: var(--bg);
|
|
3048
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
3644
|
+
color: var(--lmn-time-picker-accent-ink, var(--accent-ink));
|
|
3645
|
+
background: var(--lmn-time-picker-bg, var(--bg));
|
|
3646
|
+
box-shadow: var(--lmn-time-picker-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
3049
3647
|
}
|
|
3050
3648
|
.time-picker-option.selected {
|
|
3051
|
-
background: var(--bg);
|
|
3052
|
-
color: var(--accent-ink);
|
|
3053
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
3649
|
+
background: var(--lmn-time-picker-bg, var(--bg));
|
|
3650
|
+
color: var(--lmn-time-picker-accent-ink, var(--accent-ink));
|
|
3651
|
+
box-shadow: var(--lmn-time-picker-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
3054
3652
|
}
|
|
3055
3653
|
.time-picker-option:disabled {
|
|
3056
|
-
color: var(--fg-subtle);
|
|
3654
|
+
color: var(--lmn-time-picker-fg-subtle, var(--fg-subtle));
|
|
3057
3655
|
cursor: not-allowed;
|
|
3058
3656
|
opacity: 0.45;
|
|
3059
3657
|
}
|
|
@@ -3063,7 +3661,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3063
3661
|
gap: 6px;
|
|
3064
3662
|
margin-top: 8px;
|
|
3065
3663
|
padding: 8px 0 0;
|
|
3066
|
-
border-top: 1px solid var(--divider);
|
|
3664
|
+
border-top: 1px solid var(--lmn-time-picker-divider, var(--divider));
|
|
3067
3665
|
}
|
|
3068
3666
|
.time-picker-footer-spacer {
|
|
3069
3667
|
flex: 1;
|
|
@@ -3077,9 +3675,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3077
3675
|
display: inline-block;
|
|
3078
3676
|
position: relative;
|
|
3079
3677
|
border-radius: var(--r-md);
|
|
3080
|
-
background: var(--bg);
|
|
3678
|
+
background: var(--lmn-image-bg, var(--bg));
|
|
3081
3679
|
padding: 6px;
|
|
3082
|
-
box-shadow: var(--neu-shadow-control);
|
|
3680
|
+
box-shadow: var(--lmn-image-neu-shadow-control, var(--neu-shadow-control));
|
|
3083
3681
|
overflow: hidden;
|
|
3084
3682
|
line-height: 0;
|
|
3085
3683
|
}
|
|
@@ -3099,8 +3697,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3099
3697
|
position: relative;
|
|
3100
3698
|
overflow: hidden;
|
|
3101
3699
|
border-radius: calc(var(--r-md) - 4px);
|
|
3102
|
-
box-shadow: var(--neu-shadow-inset);
|
|
3103
|
-
background: var(--bg-sunken);
|
|
3700
|
+
box-shadow: var(--lmn-image-neu-shadow-inset, var(--neu-shadow-inset));
|
|
3701
|
+
background: var(--lmn-image-bg-sunken, var(--bg-sunken));
|
|
3104
3702
|
}
|
|
3105
3703
|
.n-image.raw .n-image-frame {
|
|
3106
3704
|
border-radius: 0;
|
|
@@ -3123,11 +3721,11 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3123
3721
|
.n-image-placeholder {
|
|
3124
3722
|
position: absolute; inset: 0;
|
|
3125
3723
|
display: grid; place-items: center;
|
|
3126
|
-
color: var(--fg-subtle);
|
|
3724
|
+
color: var(--lmn-image-fg-subtle, var(--fg-subtle));
|
|
3127
3725
|
background:
|
|
3128
3726
|
repeating-linear-gradient(45deg,
|
|
3129
3727
|
transparent 0 10px,
|
|
3130
|
-
color-mix(in oklch, var(--fg-subtle) 8%, transparent) 10px 11px);
|
|
3728
|
+
color-mix(in oklch, var(--lmn-image-fg-subtle, var(--fg-subtle)) 8%, transparent) 10px 11px);
|
|
3131
3729
|
transition: opacity var(--dur) var(--ease);
|
|
3132
3730
|
}
|
|
3133
3731
|
.n-image-placeholder.loaded { opacity: 0; pointer-events: none; }
|
|
@@ -3147,7 +3745,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3147
3745
|
transform: translateY(-4px);
|
|
3148
3746
|
transition: opacity var(--dur) var(--ease), transform var(--dur) var(--ease);
|
|
3149
3747
|
}
|
|
3150
|
-
.n-image:hover .image-actions
|
|
3748
|
+
.n-image:hover .image-actions,
|
|
3749
|
+
.n-image:focus-within .image-actions { opacity: 1; transform: translateY(0); }
|
|
3151
3750
|
.image-actions .ia-btn {
|
|
3152
3751
|
width: 26px;
|
|
3153
3752
|
height: 26px;
|
|
@@ -3185,7 +3784,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3185
3784
|
transition: opacity var(--dur) var(--ease), transform var(--dur) var(--ease);
|
|
3186
3785
|
pointer-events: none;
|
|
3187
3786
|
}
|
|
3188
|
-
.n-image:hover .image-hint
|
|
3787
|
+
.n-image:hover .image-hint,
|
|
3788
|
+
.n-image:focus-visible .image-hint { opacity: 1; transform: translateY(0); }
|
|
3189
3789
|
.image-preview-overlay {
|
|
3190
3790
|
position: fixed; inset: 0;
|
|
3191
3791
|
background: var(--image-preview-mask-bg, var(--mask-bg));
|
|
@@ -3200,8 +3800,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3200
3800
|
outline: none;
|
|
3201
3801
|
}
|
|
3202
3802
|
.image-preview-toolbar {
|
|
3203
|
-
--image-preview-toolbar-ink: color-mix(in oklch, var(--accent) 42%, var(--fg-muted));
|
|
3204
|
-
--image-preview-toolbar-ink-hover: color-mix(in oklch, var(--accent) 48%, var(--fg));
|
|
3803
|
+
--image-preview-toolbar-ink: color-mix(in oklch, var(--lmn-image-accent, var(--accent)) 42%, var(--lmn-image-fg-muted, var(--fg-muted)));
|
|
3804
|
+
--image-preview-toolbar-ink-hover: color-mix(in oklch, var(--lmn-image-accent, var(--accent)) 48%, var(--lmn-image-fg, var(--fg)));
|
|
3205
3805
|
position: absolute;
|
|
3206
3806
|
top: var(--gap-5);
|
|
3207
3807
|
left: 50%;
|
|
@@ -3213,12 +3813,12 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3213
3813
|
padding: 6px;
|
|
3214
3814
|
overflow-x: auto;
|
|
3215
3815
|
color: var(--image-preview-toolbar-ink);
|
|
3216
|
-
border: 1px solid color-mix(in oklch, var(--accent) 14%, var(--border));
|
|
3816
|
+
border: 1px solid color-mix(in oklch, var(--lmn-image-accent, var(--accent)) 14%, var(--lmn-image-border, var(--border)));
|
|
3217
3817
|
border-radius: var(--r-pill);
|
|
3218
|
-
background: color-mix(in oklch, var(--bg-raised) 92%, var(--accent-soft));
|
|
3818
|
+
background: color-mix(in oklch, var(--lmn-image-bg-raised, var(--bg-raised)) 92%, var(--lmn-image-accent-soft, var(--accent-soft)));
|
|
3219
3819
|
box-shadow:
|
|
3220
|
-
var(--neu-float),
|
|
3221
|
-
0 0 0 1px color-mix(in oklch, var(--accent-glow) 22%, transparent);
|
|
3820
|
+
var(--lmn-image-neu-float, var(--neu-float)),
|
|
3821
|
+
0 0 0 1px color-mix(in oklch, var(--lmn-image-accent-glow, var(--accent-glow)) 22%, transparent);
|
|
3222
3822
|
backdrop-filter: blur(18px) saturate(1.2);
|
|
3223
3823
|
transform: translateX(-50%);
|
|
3224
3824
|
}
|
|
@@ -3230,14 +3830,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3230
3830
|
}
|
|
3231
3831
|
.image-preview-toolbar .btn.ghost:hover {
|
|
3232
3832
|
color: var(--image-preview-toolbar-ink-hover);
|
|
3233
|
-
background: color-mix(in oklch, var(--accent-soft) 36%, var(--bg));
|
|
3234
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
3833
|
+
background: color-mix(in oklch, var(--lmn-image-accent-soft, var(--accent-soft)) 36%, var(--lmn-image-bg, var(--bg)));
|
|
3834
|
+
box-shadow: var(--lmn-image-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
3235
3835
|
}
|
|
3236
3836
|
.image-preview-toolbar .btn.ghost:active,
|
|
3237
3837
|
.image-preview-toolbar .btn.ghost.pressed {
|
|
3238
3838
|
color: var(--image-preview-toolbar-ink-hover);
|
|
3239
|
-
background: color-mix(in oklch, var(--accent-soft) 48%, var(--bg));
|
|
3240
|
-
box-shadow: var(--neu-shadow-inset-strong);
|
|
3839
|
+
background: color-mix(in oklch, var(--lmn-image-accent-soft, var(--accent-soft)) 48%, var(--lmn-image-bg, var(--bg)));
|
|
3840
|
+
box-shadow: var(--lmn-image-neu-shadow-inset-strong, var(--neu-shadow-inset-strong));
|
|
3241
3841
|
}
|
|
3242
3842
|
.image-preview-scale {
|
|
3243
3843
|
min-width: 48px;
|
|
@@ -3263,7 +3863,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3263
3863
|
max-width: 80vw;
|
|
3264
3864
|
max-height: 80vh;
|
|
3265
3865
|
border-radius: var(--r-lg);
|
|
3266
|
-
box-shadow: var(--neu-shadow-float);
|
|
3866
|
+
box-shadow: var(--lmn-image-neu-shadow-float, var(--neu-shadow-float));
|
|
3267
3867
|
transform-origin: center;
|
|
3268
3868
|
transition: transform var(--dur-fast) var(--ease);
|
|
3269
3869
|
user-select: none;
|
|
@@ -3284,9 +3884,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3284
3884
|
display: inline-block;
|
|
3285
3885
|
position: relative;
|
|
3286
3886
|
border-radius: var(--r-sm);
|
|
3287
|
-
background: var(--bg);
|
|
3887
|
+
background: var(--lmn-image-bg, var(--bg));
|
|
3288
3888
|
padding: 6px;
|
|
3289
|
-
box-shadow: var(--neu-shadow-control);
|
|
3889
|
+
box-shadow: var(--lmn-image-neu-shadow-control, var(--neu-shadow-control));
|
|
3290
3890
|
overflow: hidden;
|
|
3291
3891
|
line-height: 0;
|
|
3292
3892
|
}
|
|
@@ -3307,8 +3907,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3307
3907
|
width: 100%;
|
|
3308
3908
|
overflow: hidden;
|
|
3309
3909
|
border-radius: var(--r-sm);
|
|
3310
|
-
background: var(--bg-sunken);
|
|
3311
|
-
box-shadow: var(--neu-shadow-inset);
|
|
3910
|
+
background: var(--lmn-image-bg-sunken, var(--bg-sunken));
|
|
3911
|
+
box-shadow: var(--lmn-image-neu-shadow-inset, var(--neu-shadow-inset));
|
|
3312
3912
|
}
|
|
3313
3913
|
.n-sprite-image.raw .n-sprite-image-frame,
|
|
3314
3914
|
.n-layered-image.raw .n-layered-image-frame {
|
|
@@ -3345,8 +3945,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3345
3945
|
height: var(--ctrl-h);
|
|
3346
3946
|
padding: 0 36px 0 var(--ctrl-pad-x);
|
|
3347
3947
|
border-radius: var(--r-md);
|
|
3348
|
-
background: var(--bg);
|
|
3349
|
-
box-shadow: var(--neu-shadow-control);
|
|
3948
|
+
background: var(--lmn-cascader-bg, var(--bg));
|
|
3949
|
+
box-shadow: var(--lmn-cascader-neu-shadow-control, var(--neu-shadow-control));
|
|
3350
3950
|
display: inline-flex;
|
|
3351
3951
|
align-items: center;
|
|
3352
3952
|
font-size: 13px;
|
|
@@ -3354,11 +3954,18 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3354
3954
|
cursor: pointer;
|
|
3355
3955
|
position: relative;
|
|
3356
3956
|
border: none;
|
|
3357
|
-
color: var(--fg);
|
|
3957
|
+
color: var(--lmn-cascader-fg, var(--fg));
|
|
3358
3958
|
text-align: left;
|
|
3359
3959
|
}
|
|
3360
|
-
.cascader-trigger.placeholder { color: var(--fg-subtle); }
|
|
3361
|
-
.cascader
|
|
3960
|
+
.cascader-trigger.placeholder { color: var(--lmn-cascader-fg-subtle, var(--fg-subtle)); }
|
|
3961
|
+
.cascader-value {
|
|
3962
|
+
flex: 1;
|
|
3963
|
+
min-width: 0;
|
|
3964
|
+
overflow: hidden;
|
|
3965
|
+
white-space: nowrap;
|
|
3966
|
+
text-overflow: ellipsis;
|
|
3967
|
+
}
|
|
3968
|
+
.cascader.open .cascader-trigger { box-shadow: var(--lmn-cascader-neu-shadow-inset, var(--neu-shadow-inset)); color: var(--lmn-cascader-accent-ink, var(--accent-ink)); }
|
|
3362
3969
|
.cascader-clear {
|
|
3363
3970
|
position: absolute;
|
|
3364
3971
|
right: 30px;
|
|
@@ -3367,25 +3974,27 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3367
3974
|
width: 20px;
|
|
3368
3975
|
height: 20px;
|
|
3369
3976
|
border-radius: 999px;
|
|
3370
|
-
background: var(--bg);
|
|
3371
|
-
box-shadow: var(--neu-shadow-control);
|
|
3977
|
+
background: var(--lmn-cascader-bg, var(--bg));
|
|
3978
|
+
box-shadow: var(--lmn-cascader-neu-shadow-control, var(--neu-shadow-control));
|
|
3372
3979
|
display: inline-grid;
|
|
3373
3980
|
place-items: center;
|
|
3374
|
-
color: var(--fg-subtle);
|
|
3981
|
+
color: var(--lmn-cascader-fg-subtle, var(--fg-subtle));
|
|
3375
3982
|
opacity: 0;
|
|
3376
3983
|
transition: all var(--dur-fast) var(--ease);
|
|
3377
3984
|
}
|
|
3378
3985
|
.cascader:hover .cascader-clear { opacity: 1; }
|
|
3379
|
-
.cascader-clear:hover { color: var(--accent-ink); box-shadow: var(--neu-shadow-inset); }
|
|
3986
|
+
.cascader-clear:hover { color: var(--lmn-cascader-accent-ink, var(--accent-ink)); box-shadow: var(--lmn-cascader-neu-shadow-inset, var(--neu-shadow-inset)); }
|
|
3380
3987
|
.cascader-panel {
|
|
3381
3988
|
z-index: 1000;
|
|
3382
3989
|
display: flex;
|
|
3383
|
-
background: var(--bg);
|
|
3990
|
+
background: var(--lmn-cascader-bg, var(--bg));
|
|
3384
3991
|
border-radius: var(--r-md);
|
|
3385
|
-
box-shadow: var(--neu-shadow-float);
|
|
3992
|
+
box-shadow: var(--lmn-cascader-neu-shadow-float, var(--neu-shadow-float));
|
|
3386
3993
|
padding: 6px;
|
|
3387
3994
|
animation: menuIn var(--dur) var(--ease);
|
|
3388
3995
|
gap: 4px;
|
|
3996
|
+
max-width: calc(100vw - 16px);
|
|
3997
|
+
overflow-x: auto;
|
|
3389
3998
|
}
|
|
3390
3999
|
.cascader-panel.with-search {
|
|
3391
4000
|
flex-direction: column;
|
|
@@ -3397,20 +4006,20 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3397
4006
|
}
|
|
3398
4007
|
.cascader-search {
|
|
3399
4008
|
padding: 4px 2px 8px;
|
|
3400
|
-
border-bottom: 1px solid var(--divider);
|
|
4009
|
+
border-bottom: 1px solid var(--lmn-cascader-divider, var(--divider));
|
|
3401
4010
|
}
|
|
3402
4011
|
.cascader-search-list {
|
|
3403
4012
|
display: flex;
|
|
3404
4013
|
flex-direction: column;
|
|
3405
4014
|
gap: 4px;
|
|
3406
|
-
max-height:
|
|
4015
|
+
max-height: var(--cascader-list-height, 280px);
|
|
3407
4016
|
overflow-y: auto;
|
|
3408
4017
|
padding: 4px;
|
|
3409
4018
|
}
|
|
3410
4019
|
.cascader-search-item {
|
|
3411
4020
|
border: none;
|
|
3412
4021
|
background: transparent;
|
|
3413
|
-
color: var(--fg);
|
|
4022
|
+
color: var(--lmn-cascader-fg, var(--fg));
|
|
3414
4023
|
border-radius: var(--r-sm);
|
|
3415
4024
|
padding: 8px 10px;
|
|
3416
4025
|
display: flex;
|
|
@@ -3422,26 +4031,26 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3422
4031
|
cursor: pointer;
|
|
3423
4032
|
}
|
|
3424
4033
|
.cascader-search-item:hover {
|
|
3425
|
-
background: var(--bg);
|
|
3426
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
3427
|
-
color: var(--accent-ink);
|
|
4034
|
+
background: var(--lmn-cascader-bg, var(--bg));
|
|
4035
|
+
box-shadow: var(--lmn-cascader-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
4036
|
+
color: var(--lmn-cascader-accent-ink, var(--accent-ink));
|
|
3428
4037
|
}
|
|
3429
|
-
.cascader-path-sep { color: var(--fg-subtle); }
|
|
4038
|
+
.cascader-path-sep { color: var(--lmn-cascader-fg-subtle, var(--fg-subtle)); }
|
|
3430
4039
|
.cascader-empty {
|
|
3431
4040
|
padding: 24px 12px;
|
|
3432
4041
|
text-align: center;
|
|
3433
|
-
color: var(--fg-muted);
|
|
4042
|
+
color: var(--lmn-cascader-fg-muted, var(--fg-muted));
|
|
3434
4043
|
font-size: 12px;
|
|
3435
4044
|
}
|
|
3436
4045
|
.cascader-col {
|
|
3437
4046
|
min-width: 160px;
|
|
3438
|
-
max-height: 280px;
|
|
4047
|
+
max-height: var(--cascader-list-height, 280px);
|
|
3439
4048
|
overflow-y: auto;
|
|
3440
4049
|
padding: 4px;
|
|
3441
4050
|
border-radius: var(--r-sm);
|
|
3442
4051
|
}
|
|
3443
4052
|
.cascader-col + .cascader-col {
|
|
3444
|
-
border-left: 1px solid var(--divider);
|
|
4053
|
+
border-left: 1px solid var(--lmn-cascader-divider, var(--divider));
|
|
3445
4054
|
margin-left: 2px;
|
|
3446
4055
|
padding-left: 6px;
|
|
3447
4056
|
}
|
|
@@ -3449,7 +4058,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3449
4058
|
padding: 8px 10px;
|
|
3450
4059
|
border-radius: var(--r-sm);
|
|
3451
4060
|
font-size: 13px;
|
|
3452
|
-
color: var(--fg);
|
|
4061
|
+
color: var(--lmn-cascader-fg, var(--fg));
|
|
3453
4062
|
cursor: pointer;
|
|
3454
4063
|
display: flex;
|
|
3455
4064
|
align-items: center;
|
|
@@ -3468,27 +4077,36 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3468
4077
|
line-height: 0;
|
|
3469
4078
|
flex-shrink: 0;
|
|
3470
4079
|
}
|
|
4080
|
+
.cascader-panel.custom-options .cascader-col {
|
|
4081
|
+
min-width: 240px;
|
|
4082
|
+
}
|
|
4083
|
+
.cascader-item-label,
|
|
4084
|
+
.cascader-item-custom {
|
|
4085
|
+
flex: 1;
|
|
4086
|
+
min-width: 0;
|
|
4087
|
+
text-align: left;
|
|
4088
|
+
}
|
|
3471
4089
|
.cascader-icon img {
|
|
3472
4090
|
display: block;
|
|
3473
4091
|
width: 15px;
|
|
3474
4092
|
height: 15px;
|
|
3475
4093
|
object-fit: contain;
|
|
3476
4094
|
}
|
|
3477
|
-
.cascader-item:hover { background: var(--bg); box-shadow: var(--neu-shadow-subtle); color: var(--accent-ink); }
|
|
4095
|
+
.cascader-item:hover { background: var(--lmn-cascader-bg, var(--bg)); box-shadow: var(--lmn-cascader-neu-shadow-subtle, var(--neu-shadow-subtle)); color: var(--lmn-cascader-accent-ink, var(--accent-ink)); }
|
|
3478
4096
|
.cascader-item.active {
|
|
3479
|
-
background: var(--bg);
|
|
3480
|
-
box-shadow: var(--neu-shadow-inset);
|
|
3481
|
-
color: var(--accent-ink);
|
|
4097
|
+
background: var(--lmn-cascader-bg, var(--bg));
|
|
4098
|
+
box-shadow: var(--lmn-cascader-neu-shadow-inset, var(--neu-shadow-inset));
|
|
4099
|
+
color: var(--lmn-cascader-accent-ink, var(--accent-ink));
|
|
3482
4100
|
font-weight: 500;
|
|
3483
4101
|
}
|
|
3484
|
-
.cascader-item .chev { margin-left: auto; color: var(--fg-subtle); display: inline-flex; }
|
|
3485
|
-
.cascader-item.active .chev { color: var(--accent); }
|
|
4102
|
+
.cascader-item .chev { margin-left: auto; color: var(--lmn-cascader-fg-subtle, var(--fg-subtle)); display: inline-flex; }
|
|
4103
|
+
.cascader-item.active .chev { color: var(--lmn-cascader-accent, var(--accent)); }
|
|
3486
4104
|
/* ============================================================================
|
|
3487
4105
|
* Typography
|
|
3488
4106
|
* ========================================================================== */
|
|
3489
4107
|
.typo-root {
|
|
3490
4108
|
font-family: var(--font-sans);
|
|
3491
|
-
color: var(--fg);
|
|
4109
|
+
color: var(--lmn-typography-fg, var(--fg));
|
|
3492
4110
|
line-height: 1.7;
|
|
3493
4111
|
font-size: 14px;
|
|
3494
4112
|
}
|
|
@@ -3499,16 +4117,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3499
4117
|
.typo-root > .typo-title:first-child { margin-top: 0; }
|
|
3500
4118
|
/* ---- Base ---- */
|
|
3501
4119
|
.typo {
|
|
3502
|
-
color: var(--fg);
|
|
4120
|
+
color: var(--lmn-typography-fg, var(--fg));
|
|
3503
4121
|
font-family: var(--font-sans);
|
|
3504
4122
|
word-wrap: break-word;
|
|
3505
4123
|
}
|
|
3506
4124
|
/* Semantic colors */
|
|
3507
|
-
.typo.secondary { color: var(--fg-muted); }
|
|
3508
|
-
.typo.success { color: var(--success); }
|
|
3509
|
-
.typo.warning { color: var(--warning); }
|
|
3510
|
-
.typo.danger { color: var(--danger); }
|
|
3511
|
-
.typo.disabled { color: var(--fg-subtle); cursor: not-allowed; user-select: none; }
|
|
4125
|
+
.typo.secondary { color: var(--lmn-typography-fg-muted, var(--fg-muted)); }
|
|
4126
|
+
.typo.success { color: var(--lmn-typography-success, var(--success)); }
|
|
4127
|
+
.typo.warning { color: var(--lmn-typography-warning, var(--warning)); }
|
|
4128
|
+
.typo.danger { color: var(--lmn-typography-danger, var(--danger)); }
|
|
4129
|
+
.typo.disabled { color: var(--lmn-typography-fg-subtle, var(--fg-subtle)); cursor: not-allowed; user-select: none; }
|
|
3512
4130
|
/* Decorations */
|
|
3513
4131
|
.typo.strong { font-weight: 600; }
|
|
3514
4132
|
.typo.italic { font-style: italic; }
|
|
@@ -3516,7 +4134,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3516
4134
|
.typo.del { text-decoration: line-through; text-decoration-thickness: 1.5px; }
|
|
3517
4135
|
/* mark / code / kbd render their own elements; we still color the shell */
|
|
3518
4136
|
.typo mark {
|
|
3519
|
-
background: color-mix(in oklch, var(--warning)
|
|
4137
|
+
background: color-mix(in oklch, var(--lmn-typography-warning, var(--warning)) 33%, transparent);
|
|
3520
4138
|
color: inherit;
|
|
3521
4139
|
padding: 0 3px;
|
|
3522
4140
|
border-radius: 3px;
|
|
@@ -3526,9 +4144,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3526
4144
|
font-size: 0.88em;
|
|
3527
4145
|
padding: 1px 6px;
|
|
3528
4146
|
border-radius: 5px;
|
|
3529
|
-
background: var(--bg-sunken);
|
|
3530
|
-
box-shadow: var(--neu-shadow-inset);
|
|
3531
|
-
color: var(--accent-ink);
|
|
4147
|
+
background: var(--lmn-typography-bg-sunken, var(--bg-sunken));
|
|
4148
|
+
box-shadow: var(--lmn-typography-neu-shadow-inset, var(--neu-shadow-inset));
|
|
4149
|
+
color: var(--lmn-typography-accent-ink, var(--accent-ink));
|
|
3532
4150
|
margin: 0 2px;
|
|
3533
4151
|
}
|
|
3534
4152
|
.typo kbd {
|
|
@@ -3536,10 +4154,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3536
4154
|
font-size: 0.82em;
|
|
3537
4155
|
padding: 1px 7px;
|
|
3538
4156
|
border-radius: 5px;
|
|
3539
|
-
background: var(--bg-raised);
|
|
3540
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
3541
|
-
border: 1px solid var(--border);
|
|
3542
|
-
color: var(--fg);
|
|
4157
|
+
background: var(--lmn-typography-bg-raised, var(--bg-raised));
|
|
4158
|
+
box-shadow: var(--lmn-typography-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
4159
|
+
border: 1px solid var(--lmn-typography-border, var(--border));
|
|
4160
|
+
color: var(--lmn-typography-fg, var(--fg));
|
|
3543
4161
|
margin: 0 2px;
|
|
3544
4162
|
line-height: 1.4;
|
|
3545
4163
|
display: inline-block;
|
|
@@ -3551,7 +4169,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3551
4169
|
font-weight: 700;
|
|
3552
4170
|
letter-spacing: -0.01em;
|
|
3553
4171
|
line-height: 1.25;
|
|
3554
|
-
color: var(--fg);
|
|
4172
|
+
color: var(--lmn-typography-fg, var(--fg));
|
|
3555
4173
|
margin: 0;
|
|
3556
4174
|
}
|
|
3557
4175
|
.typo-title.h1 { font-size: 32px; letter-spacing: -0.02em; }
|
|
@@ -3565,13 +4183,22 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3565
4183
|
font-size: 14px;
|
|
3566
4184
|
line-height: 1.75;
|
|
3567
4185
|
margin: 0;
|
|
3568
|
-
color: var(--fg);
|
|
4186
|
+
color: var(--lmn-typography-fg, var(--fg));
|
|
3569
4187
|
}
|
|
3570
4188
|
/* ---- Text ---- */
|
|
3571
4189
|
.typo-text { font-size: inherit; line-height: inherit; }
|
|
3572
4190
|
/* ---- Link ---- */
|
|
4191
|
+
.typo-link-group {
|
|
4192
|
+
display: inline-flex;
|
|
4193
|
+
align-items: center;
|
|
4194
|
+
max-width: 100%;
|
|
4195
|
+
vertical-align: baseline;
|
|
4196
|
+
}
|
|
4197
|
+
.typo-link-group > .typo-link { min-width: 0; }
|
|
4198
|
+
.typo-link-group > .typo-action,
|
|
4199
|
+
.typo-link-group > .typo-expand { flex: 0 0 auto; }
|
|
3573
4200
|
.typo-link {
|
|
3574
|
-
color: var(--accent-ink);
|
|
4201
|
+
color: var(--lmn-typography-accent-ink, var(--accent-ink));
|
|
3575
4202
|
text-decoration: none;
|
|
3576
4203
|
transition: color var(--dur-fast) var(--ease), text-decoration-color var(--dur-fast) var(--ease);
|
|
3577
4204
|
cursor: pointer;
|
|
@@ -3580,14 +4207,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3580
4207
|
align-items: center;
|
|
3581
4208
|
gap: 3px;
|
|
3582
4209
|
}
|
|
3583
|
-
.typo-link:hover { color: var(--accent); text-decoration: underline; }
|
|
4210
|
+
.typo-link:hover { color: var(--lmn-typography-accent, var(--accent)); text-decoration: underline; }
|
|
3584
4211
|
.typo-link:focus-visible {
|
|
3585
|
-
outline: 2px solid var(--accent-glow);
|
|
4212
|
+
outline: 2px solid var(--lmn-typography-accent-glow, var(--accent-glow));
|
|
3586
4213
|
outline-offset: 2px;
|
|
3587
4214
|
border-radius: 2px;
|
|
3588
4215
|
}
|
|
3589
4216
|
.typo-link.disabled {
|
|
3590
|
-
color: var(--fg-subtle);
|
|
4217
|
+
color: var(--lmn-typography-fg-subtle, var(--fg-subtle));
|
|
3591
4218
|
cursor: not-allowed;
|
|
3592
4219
|
pointer-events: auto;
|
|
3593
4220
|
text-decoration: none;
|
|
@@ -3610,26 +4237,31 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3610
4237
|
margin-left: 5px;
|
|
3611
4238
|
border-radius: 6px;
|
|
3612
4239
|
cursor: pointer;
|
|
3613
|
-
color: var(--fg-subtle);
|
|
4240
|
+
color: var(--lmn-typography-fg-subtle, var(--fg-subtle));
|
|
3614
4241
|
line-height: 1;
|
|
3615
4242
|
transition: color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
|
|
3616
4243
|
vertical-align: -0.18em;
|
|
3617
4244
|
user-select: none;
|
|
4245
|
+
padding: 0;
|
|
4246
|
+
border: none;
|
|
4247
|
+
background: transparent;
|
|
4248
|
+
font: inherit;
|
|
3618
4249
|
}
|
|
3619
4250
|
.typo-action > svg {
|
|
3620
4251
|
display: block;
|
|
3621
4252
|
flex-shrink: 0;
|
|
3622
4253
|
}
|
|
3623
4254
|
.typo-action:hover {
|
|
3624
|
-
color: var(--accent-ink);
|
|
3625
|
-
background: var(--bg);
|
|
3626
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
4255
|
+
color: var(--lmn-typography-accent-ink, var(--accent-ink));
|
|
4256
|
+
background: var(--lmn-typography-bg, var(--bg));
|
|
4257
|
+
box-shadow: var(--lmn-typography-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
3627
4258
|
}
|
|
3628
4259
|
.typo-action:focus-visible {
|
|
3629
|
-
outline: 2px solid var(--accent-glow);
|
|
4260
|
+
outline: 2px solid var(--lmn-typography-accent-glow, var(--accent-glow));
|
|
3630
4261
|
outline-offset: 1px;
|
|
3631
4262
|
}
|
|
3632
|
-
.typo-copy.copied { color: var(--success); }
|
|
4263
|
+
.typo-copy.copied { color: var(--lmn-typography-success, var(--success)); }
|
|
4264
|
+
.typo-copy.error { color: var(--lmn-typography-danger, var(--danger)); }
|
|
3633
4265
|
/* Editable text trigger overlays */
|
|
3634
4266
|
.typo-edit-text-trigger {
|
|
3635
4267
|
cursor: text;
|
|
@@ -3638,14 +4270,32 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3638
4270
|
padding: 0 2px;
|
|
3639
4271
|
margin: 0 -2px;
|
|
3640
4272
|
}
|
|
3641
|
-
.typo-edit-text-trigger:hover { background: color-mix(in oklch, var(--accent) 8%, transparent); }
|
|
4273
|
+
.typo-edit-text-trigger:hover { background: color-mix(in oklch, var(--lmn-typography-accent, var(--accent)) 8%, transparent); }
|
|
3642
4274
|
/* ---- Editor (input / textarea) ---- */
|
|
3643
4275
|
.typo.editing { display: block; }
|
|
4276
|
+
.typo-editor-wrap {
|
|
4277
|
+
display: inline-flex;
|
|
4278
|
+
align-items: center;
|
|
4279
|
+
gap: var(--gap-1);
|
|
4280
|
+
width: 100%;
|
|
4281
|
+
max-width: 100%;
|
|
4282
|
+
}
|
|
4283
|
+
.typo-editor-wrap > .typo-editor { min-width: 0; }
|
|
4284
|
+
.typo-enter {
|
|
4285
|
+
flex: 0 0 auto;
|
|
4286
|
+
margin-left: 0;
|
|
4287
|
+
}
|
|
4288
|
+
.typo.typo-link-editor-shell {
|
|
4289
|
+
display: inline-flex;
|
|
4290
|
+
min-width: 0;
|
|
4291
|
+
flex: 1 1 auto;
|
|
4292
|
+
}
|
|
4293
|
+
.typo.typo-link-editing-anchor { display: none; }
|
|
3644
4294
|
.typo-editor {
|
|
3645
4295
|
font: inherit;
|
|
3646
4296
|
color: inherit;
|
|
3647
|
-
background: var(--bg-sunken);
|
|
3648
|
-
box-shadow: var(--neu-shadow-inset-strong);
|
|
4297
|
+
background: var(--lmn-typography-bg-sunken, var(--bg-sunken));
|
|
4298
|
+
box-shadow: var(--lmn-typography-neu-shadow-inset-strong, var(--neu-shadow-inset-strong));
|
|
3649
4299
|
border: none;
|
|
3650
4300
|
outline: none;
|
|
3651
4301
|
width: 100%;
|
|
@@ -3660,7 +4310,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3660
4310
|
font-family: inherit;
|
|
3661
4311
|
}
|
|
3662
4312
|
.typo-editor:focus {
|
|
3663
|
-
box-shadow: var(--neu-shadow-inset-strong), 0 0 0 3px var(--accent-glow);
|
|
4313
|
+
box-shadow: var(--lmn-typography-neu-shadow-inset-strong, var(--neu-shadow-inset-strong)), 0 0 0 3px var(--lmn-typography-accent-glow, var(--accent-glow));
|
|
3664
4314
|
}
|
|
3665
4315
|
/* ---- Ellipsis ---- */
|
|
3666
4316
|
.typo.ellipsis {
|
|
@@ -3692,23 +4342,59 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3692
4342
|
-webkit-box-orient: vertical;
|
|
3693
4343
|
overflow: hidden;
|
|
3694
4344
|
}
|
|
4345
|
+
/* 后缀与裁切正文分栏,确保后缀不进入 overflow / line-clamp 区域。 */
|
|
4346
|
+
.typo.ellipsis-with-suffix {
|
|
4347
|
+
display: inline-flex;
|
|
4348
|
+
align-items: flex-end;
|
|
4349
|
+
max-width: 100%;
|
|
4350
|
+
min-width: 0;
|
|
4351
|
+
vertical-align: bottom;
|
|
4352
|
+
}
|
|
4353
|
+
.typo-paragraph.ellipsis-with-suffix,
|
|
4354
|
+
.typo-title.ellipsis-with-suffix {
|
|
4355
|
+
display: flex;
|
|
4356
|
+
}
|
|
4357
|
+
.typo-ellipsis-content {
|
|
4358
|
+
flex: 0 1 auto;
|
|
4359
|
+
min-width: 0;
|
|
4360
|
+
max-width: 100%;
|
|
4361
|
+
}
|
|
4362
|
+
.typo-ellipsis-content.ellipsis {
|
|
4363
|
+
display: block;
|
|
4364
|
+
overflow: hidden;
|
|
4365
|
+
white-space: nowrap;
|
|
4366
|
+
text-overflow: ellipsis;
|
|
4367
|
+
}
|
|
4368
|
+
.typo-ellipsis-content.ellipsis-multi {
|
|
4369
|
+
display: -webkit-box;
|
|
4370
|
+
-webkit-box-orient: vertical;
|
|
4371
|
+
overflow: hidden;
|
|
4372
|
+
}
|
|
3695
4373
|
.typo-expand {
|
|
3696
4374
|
margin-left: 4px;
|
|
3697
|
-
color: var(--accent-ink);
|
|
4375
|
+
color: var(--lmn-typography-accent-ink, var(--accent-ink));
|
|
3698
4376
|
cursor: pointer;
|
|
3699
4377
|
font-size: 0.92em;
|
|
3700
4378
|
user-select: none;
|
|
4379
|
+
padding: 0;
|
|
4380
|
+
border: none;
|
|
4381
|
+
background: transparent;
|
|
4382
|
+
font: inherit;
|
|
4383
|
+
}
|
|
4384
|
+
.typo-expand:hover { color: var(--lmn-typography-accent, var(--accent)); text-decoration: underline; text-underline-offset: 3px; }
|
|
4385
|
+
.typo-suffix {
|
|
4386
|
+
flex: none;
|
|
4387
|
+
margin-left: 0.25em;
|
|
3701
4388
|
}
|
|
3702
|
-
.typo-expand:hover { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
|
|
3703
4389
|
.typo-ellipsis-tooltip {
|
|
3704
4390
|
display: block;
|
|
3705
4391
|
box-sizing: border-box;
|
|
3706
4392
|
max-width: min(520px, calc(100vw - 32px));
|
|
3707
4393
|
padding: 7px 10px;
|
|
3708
4394
|
border-radius: var(--r-sm);
|
|
3709
|
-
background: var(--bg-sunken);
|
|
3710
|
-
color: var(--fg);
|
|
3711
|
-
box-shadow: var(--neu-shadow-control);
|
|
4395
|
+
background: var(--lmn-typography-bg-sunken, var(--bg-sunken));
|
|
4396
|
+
color: var(--lmn-typography-fg, var(--fg));
|
|
4397
|
+
box-shadow: var(--lmn-typography-neu-shadow-control, var(--neu-shadow-control));
|
|
3712
4398
|
font-size: 12px;
|
|
3713
4399
|
font-weight: 500;
|
|
3714
4400
|
line-height: 1.55;
|
|
@@ -3724,11 +4410,6 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3724
4410
|
animation: fadeIn var(--dur) var(--ease);
|
|
3725
4411
|
z-index: 1000;
|
|
3726
4412
|
}
|
|
3727
|
-
/* In dark mode, mark needs slightly higher contrast */
|
|
3728
|
-
[data-theme="dark"] .typo mark {
|
|
3729
|
-
background: color-mix(in oklch, var(--warning) 30%, transparent);
|
|
3730
|
-
color: var(--fg);
|
|
3731
|
-
}
|
|
3732
4413
|
/* ============================================================================
|
|
3733
4414
|
* Container & trigger
|
|
3734
4415
|
* ========================================================================== */
|
|
@@ -3742,16 +4423,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3742
4423
|
gap: 8px;
|
|
3743
4424
|
padding: 4px;
|
|
3744
4425
|
border: none;
|
|
3745
|
-
background: var(--bg);
|
|
3746
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
4426
|
+
background: var(--lmn-color-picker-bg, var(--bg));
|
|
4427
|
+
box-shadow: var(--lmn-color-picker-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
3747
4428
|
border-radius: 10px;
|
|
3748
4429
|
cursor: pointer;
|
|
3749
4430
|
transition: box-shadow var(--dur) var(--ease);
|
|
3750
|
-
color: var(--fg);
|
|
4431
|
+
color: var(--lmn-color-picker-fg, var(--fg));
|
|
3751
4432
|
font: inherit;
|
|
3752
4433
|
}
|
|
3753
4434
|
.cp-trigger:hover:not(:disabled) {
|
|
3754
|
-
box-shadow: var(--neu-shadow-panel);
|
|
4435
|
+
box-shadow: var(--lmn-color-picker-neu-shadow-panel, var(--neu-shadow-panel));
|
|
3755
4436
|
}
|
|
3756
4437
|
.cp-trigger:disabled {
|
|
3757
4438
|
opacity: 0.5;
|
|
@@ -3768,12 +4449,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3768
4449
|
font: inherit;
|
|
3769
4450
|
}
|
|
3770
4451
|
.cp-custom-trigger:disabled { opacity: 0.5; cursor: not-allowed; }
|
|
4452
|
+
.cp-custom-trigger[aria-disabled="true"] { opacity: 0.5; cursor: not-allowed; }
|
|
3771
4453
|
.cp-swatch {
|
|
3772
4454
|
display: inline-block;
|
|
3773
4455
|
width: 22px;
|
|
3774
4456
|
height: 22px;
|
|
3775
4457
|
border-radius: 6px;
|
|
3776
|
-
box-shadow: inset 0 0 0 1px
|
|
4458
|
+
box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--lmn-color-picker-fg, var(--fg)) 10%, transparent), var(--lmn-color-picker-neu-shadow-inset, var(--neu-shadow-inset));
|
|
3777
4459
|
background-clip: padding-box;
|
|
3778
4460
|
}
|
|
3779
4461
|
.cp-trigger.sm .cp-swatch { width: 18px; height: 18px; border-radius: 5px; }
|
|
@@ -3786,7 +4468,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3786
4468
|
.cp-text {
|
|
3787
4469
|
font-family: var(--font-mono);
|
|
3788
4470
|
font-size: 12px;
|
|
3789
|
-
color: var(--fg-muted);
|
|
4471
|
+
color: var(--lmn-color-picker-fg-muted, var(--fg-muted));
|
|
3790
4472
|
padding-right: 6px;
|
|
3791
4473
|
}
|
|
3792
4474
|
/* ============================================================================
|
|
@@ -3797,9 +4479,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3797
4479
|
z-index: 1000;
|
|
3798
4480
|
width: 232px;
|
|
3799
4481
|
padding: 12px;
|
|
3800
|
-
background: var(--bg);
|
|
4482
|
+
background: var(--lmn-color-picker-bg, var(--bg));
|
|
3801
4483
|
border-radius: var(--r-md);
|
|
3802
|
-
box-shadow: var(--neu-shadow-float);
|
|
4484
|
+
box-shadow: var(--lmn-color-picker-neu-shadow-float, var(--neu-shadow-float));
|
|
3803
4485
|
display: flex;
|
|
3804
4486
|
flex-direction: column;
|
|
3805
4487
|
gap: 10px;
|
|
@@ -3822,6 +4504,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3822
4504
|
cursor: crosshair;
|
|
3823
4505
|
touch-action: none;
|
|
3824
4506
|
user-select: none;
|
|
4507
|
+
box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--lmn-color-picker-fg, var(--fg)) 10%, transparent);
|
|
3825
4508
|
}
|
|
3826
4509
|
.cp-board-white,
|
|
3827
4510
|
.cp-board-black {
|
|
@@ -3863,7 +4546,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3863
4546
|
hsl(300, 100%, 50%),
|
|
3864
4547
|
hsl(360, 100%, 50%)
|
|
3865
4548
|
);
|
|
3866
|
-
box-shadow: inset 0 0 0 1px
|
|
4549
|
+
box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--lmn-color-picker-fg, var(--fg)) 10%, transparent);
|
|
3867
4550
|
cursor: pointer;
|
|
3868
4551
|
touch-action: none;
|
|
3869
4552
|
user-select: none;
|
|
@@ -3894,16 +4577,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3894
4577
|
padding: 0 10px;
|
|
3895
4578
|
border: none;
|
|
3896
4579
|
outline: none;
|
|
3897
|
-
background: var(--bg-sunken);
|
|
3898
|
-
box-shadow: var(--neu-shadow-inset);
|
|
4580
|
+
background: var(--lmn-color-picker-bg-sunken, var(--bg-sunken));
|
|
4581
|
+
box-shadow: var(--lmn-color-picker-neu-shadow-inset, var(--neu-shadow-inset));
|
|
3899
4582
|
border-radius: 7px;
|
|
3900
4583
|
font-family: var(--font-mono);
|
|
3901
4584
|
font-size: 12px;
|
|
3902
|
-
color: var(--fg);
|
|
4585
|
+
color: var(--lmn-color-picker-fg, var(--fg));
|
|
3903
4586
|
text-transform: lowercase;
|
|
3904
4587
|
}
|
|
3905
4588
|
.cp-input:focus {
|
|
3906
|
-
box-shadow: var(--neu-shadow-inset), 0 0 0 2px var(--accent-soft);
|
|
4589
|
+
box-shadow: var(--lmn-color-picker-neu-shadow-inset, var(--neu-shadow-inset)), 0 0 0 2px var(--lmn-color-picker-accent-soft, var(--accent-soft));
|
|
3907
4590
|
}
|
|
3908
4591
|
.cp-presets {
|
|
3909
4592
|
display: grid;
|
|
@@ -3917,30 +4600,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3917
4600
|
border: none;
|
|
3918
4601
|
padding: 0;
|
|
3919
4602
|
cursor: pointer;
|
|
3920
|
-
box-shadow: inset 0 0 0 1px
|
|
4603
|
+
box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--lmn-color-picker-fg, var(--fg)) 10%, transparent);
|
|
3921
4604
|
transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
|
|
3922
4605
|
}
|
|
3923
4606
|
.cp-preset:hover {
|
|
3924
4607
|
transform: scale(1.1);
|
|
3925
4608
|
}
|
|
3926
4609
|
.cp-preset.active {
|
|
3927
|
-
box-shadow: inset 0 0 0 1px
|
|
3928
|
-
}
|
|
3929
|
-
/* Dark mode tweaks */
|
|
3930
|
-
[data-theme="dark"] .cp-swatch {
|
|
3931
|
-
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12), var(--neu-shadow-inset);
|
|
3932
|
-
}
|
|
3933
|
-
[data-theme="dark"] .cp-preset {
|
|
3934
|
-
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
|
|
3935
|
-
}
|
|
3936
|
-
[data-theme="dark"] .cp-preset.active {
|
|
3937
|
-
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1), 0 0 0 2px var(--accent);
|
|
3938
|
-
}
|
|
3939
|
-
[data-theme="dark"] .cp-board {
|
|
3940
|
-
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
|
|
3941
|
-
}
|
|
3942
|
-
[data-theme="dark"] .cp-hue {
|
|
3943
|
-
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
|
|
4610
|
+
box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--lmn-color-picker-fg, var(--fg)) 10%, transparent), 0 0 0 2px var(--lmn-color-picker-accent, var(--accent));
|
|
3944
4611
|
}
|
|
3945
4612
|
/* ============ TitleBar (Electron) ============ */
|
|
3946
4613
|
.titlebar {
|
|
@@ -3949,15 +4616,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3949
4616
|
gap: var(--gap-3);
|
|
3950
4617
|
padding: 0 var(--gap-3);
|
|
3951
4618
|
height: 40px;
|
|
3952
|
-
background: var(--bg);
|
|
4619
|
+
background: var(--lmn-app-shell-bg, var(--bg));
|
|
3953
4620
|
-webkit-app-region: drag;
|
|
3954
4621
|
user-select: none;
|
|
3955
|
-
border-bottom: 1px solid var(--divider);
|
|
4622
|
+
border-bottom: 1px solid var(--lmn-app-shell-divider, var(--divider));
|
|
3956
4623
|
position: relative;
|
|
3957
4624
|
z-index: 5;
|
|
3958
4625
|
overflow: visible;
|
|
3959
4626
|
}
|
|
3960
4627
|
.titlebar.windows { padding-right: 0; }
|
|
4628
|
+
.titlebar.no-drag { -webkit-app-region: no-drag; }
|
|
3961
4629
|
.titlebar-title {
|
|
3962
4630
|
display: inline-flex;
|
|
3963
4631
|
align-items: center;
|
|
@@ -3985,8 +4653,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3985
4653
|
width: 13px; height: 13px;
|
|
3986
4654
|
border: none; padding: 0;
|
|
3987
4655
|
border-radius: 999px;
|
|
3988
|
-
background: var(--bg);
|
|
3989
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
4656
|
+
background: var(--lmn-app-shell-bg, var(--bg));
|
|
4657
|
+
box-shadow: var(--lmn-app-shell-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
3990
4658
|
position: relative;
|
|
3991
4659
|
cursor: pointer;
|
|
3992
4660
|
transition: transform var(--dur-fast) var(--ease);
|
|
@@ -3995,13 +4663,18 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3995
4663
|
content: "";
|
|
3996
4664
|
position: absolute; inset: 2px;
|
|
3997
4665
|
border-radius: 999px;
|
|
3998
|
-
background: var(--dot, var(--fg-subtle));
|
|
4666
|
+
background: var(--dot, var(--lmn-app-shell-fg-subtle, var(--fg-subtle)));
|
|
3999
4667
|
opacity: 0.85;
|
|
4000
4668
|
}
|
|
4001
4669
|
.win-controls.mac .win-btn.close { --dot: #ff5f57; }
|
|
4002
4670
|
.win-controls.mac .win-btn.minimize { --dot: #febc2e; }
|
|
4003
4671
|
.win-controls.mac .win-btn.maximize { --dot: #28c840; }
|
|
4004
4672
|
.win-controls.mac .win-btn:hover { transform: scale(1.08); }
|
|
4673
|
+
.win-controls .win-btn:disabled {
|
|
4674
|
+
opacity: 0.45;
|
|
4675
|
+
cursor: default;
|
|
4676
|
+
pointer-events: none;
|
|
4677
|
+
}
|
|
4005
4678
|
/* Windows controls */
|
|
4006
4679
|
.win-controls.windows {
|
|
4007
4680
|
display: inline-flex;
|
|
@@ -4016,7 +4689,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4016
4689
|
padding: 0;
|
|
4017
4690
|
border-radius: 8px;
|
|
4018
4691
|
background: transparent;
|
|
4019
|
-
color: var(--fg-muted);
|
|
4692
|
+
color: var(--lmn-app-shell-fg-muted, var(--fg-muted));
|
|
4020
4693
|
display: inline-grid;
|
|
4021
4694
|
place-items: center;
|
|
4022
4695
|
cursor: pointer;
|
|
@@ -4026,11 +4699,11 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4026
4699
|
overflow: visible;
|
|
4027
4700
|
}
|
|
4028
4701
|
.win-controls.windows .win-btn svg { display: block; flex-shrink: 0; }
|
|
4029
|
-
.win-controls.windows .win-btn:hover { background: var(--bg); box-shadow: var(--neu-shadow-inset); color: var(--fg); }
|
|
4702
|
+
.win-controls.windows .win-btn:hover { background: var(--lmn-app-shell-bg, var(--bg)); box-shadow: var(--lmn-app-shell-neu-shadow-inset, var(--neu-shadow-inset)); color: var(--lmn-app-shell-fg, var(--fg)); }
|
|
4030
4703
|
.win-controls.windows .win-btn.close:hover {
|
|
4031
|
-
background: var(--danger);
|
|
4704
|
+
background: var(--lmn-app-shell-danger, var(--danger));
|
|
4032
4705
|
color: white;
|
|
4033
|
-
box-shadow: 2px 2px 4px color-mix(in oklch, var(--danger) 30%, var(--shadow-dark));
|
|
4706
|
+
box-shadow: 2px 2px 4px color-mix(in oklch, var(--lmn-app-shell-danger, var(--danger)) 30%, var(--lmn-app-shell-shadow-dark, var(--shadow-dark)));
|
|
4034
4707
|
}
|
|
4035
4708
|
/* ============ Sidebar ============ */
|
|
4036
4709
|
.sidebar {
|
|
@@ -4038,23 +4711,24 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4038
4711
|
flex-direction: column;
|
|
4039
4712
|
width: 220px;
|
|
4040
4713
|
padding: 12px;
|
|
4041
|
-
background: var(--bg);
|
|
4042
|
-
border-right: 1px solid var(--divider);
|
|
4714
|
+
background: var(--lmn-app-shell-bg, var(--bg));
|
|
4715
|
+
border-right: 1px solid var(--lmn-app-shell-divider, var(--divider));
|
|
4043
4716
|
flex-shrink: 0;
|
|
4044
4717
|
overflow-y: auto;
|
|
4045
4718
|
gap: 4px;
|
|
4046
4719
|
}
|
|
4047
4720
|
.sidebar.collapsed { width: 64px; }
|
|
4048
|
-
.sidebar-header { padding: 4px 8px 12px; border-bottom: 1px solid var(--divider); margin-bottom: 8px; }
|
|
4049
|
-
.sidebar-footer { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--divider); }
|
|
4721
|
+
.sidebar-header { padding: 4px 8px 12px; border-bottom: 1px solid var(--lmn-app-shell-divider, var(--divider)); margin-bottom: 8px; }
|
|
4722
|
+
.sidebar-footer { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--lmn-app-shell-divider, var(--divider)); }
|
|
4050
4723
|
.sidebar-nav { display: flex; flex-direction: column; gap: 2px; }
|
|
4724
|
+
.sidebar-children { display: flex; flex-direction: column; gap: 2px; }
|
|
4051
4725
|
.sidebar-item {
|
|
4052
4726
|
display: flex; align-items: center; gap: 10px;
|
|
4053
|
-
padding: 10px 12px;
|
|
4727
|
+
padding: 10px 12px 10px calc(12px + var(--sidebar-indent, 0px));
|
|
4054
4728
|
border: none;
|
|
4055
4729
|
border-radius: var(--r-sm);
|
|
4056
4730
|
background: transparent;
|
|
4057
|
-
color: var(--fg-muted);
|
|
4731
|
+
color: var(--lmn-app-shell-fg-muted, var(--fg-muted));
|
|
4058
4732
|
font-size: 13px;
|
|
4059
4733
|
font-family: inherit;
|
|
4060
4734
|
text-align: left;
|
|
@@ -4062,11 +4736,11 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4062
4736
|
width: 100%;
|
|
4063
4737
|
transition: all var(--dur-fast) var(--ease);
|
|
4064
4738
|
}
|
|
4065
|
-
.sidebar-item:hover { color: var(--fg); background: var(--bg); box-shadow: var(--neu-shadow-subtle); }
|
|
4739
|
+
.sidebar-item:hover { color: var(--lmn-app-shell-fg, var(--fg)); background: var(--lmn-app-shell-bg, var(--bg)); box-shadow: var(--lmn-app-shell-neu-shadow-subtle, var(--neu-shadow-subtle)); }
|
|
4066
4740
|
.sidebar-item.active {
|
|
4067
|
-
color: var(--accent-ink);
|
|
4068
|
-
background: var(--bg);
|
|
4069
|
-
box-shadow: var(--neu-shadow-inset);
|
|
4741
|
+
color: var(--lmn-app-shell-accent-ink, var(--accent-ink));
|
|
4742
|
+
background: var(--lmn-app-shell-bg, var(--bg));
|
|
4743
|
+
box-shadow: var(--lmn-app-shell-neu-shadow-inset, var(--neu-shadow-inset));
|
|
4070
4744
|
font-weight: 500;
|
|
4071
4745
|
}
|
|
4072
4746
|
.sidebar-icon { display: inline-flex; flex-shrink: 0; }
|
|
@@ -4075,18 +4749,29 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4075
4749
|
font-size: 11px;
|
|
4076
4750
|
padding: 1px 7px;
|
|
4077
4751
|
border-radius: 999px;
|
|
4078
|
-
background: var(--accent);
|
|
4752
|
+
background: var(--lmn-app-shell-accent, var(--accent));
|
|
4079
4753
|
color: white;
|
|
4080
4754
|
font-weight: 600;
|
|
4081
4755
|
}
|
|
4756
|
+
.sidebar-expand {
|
|
4757
|
+
display: inline-flex;
|
|
4758
|
+
flex-shrink: 0;
|
|
4759
|
+
color: var(--lmn-app-shell-fg-subtle, var(--fg-subtle));
|
|
4760
|
+
transition: transform var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
|
|
4761
|
+
}
|
|
4762
|
+
.sidebar-expand.open {
|
|
4763
|
+
color: var(--lmn-app-shell-accent, var(--accent));
|
|
4764
|
+
transform: rotate(180deg);
|
|
4765
|
+
}
|
|
4082
4766
|
/* ============ AppShell ============ */
|
|
4083
4767
|
.app-shell {
|
|
4084
4768
|
display: flex;
|
|
4085
4769
|
flex-direction: column;
|
|
4086
4770
|
width: 100%;
|
|
4087
4771
|
height: 100vh;
|
|
4088
|
-
|
|
4089
|
-
|
|
4772
|
+
height: 100dvh;
|
|
4773
|
+
background: var(--lmn-app-shell-bg, var(--bg));
|
|
4774
|
+
color: var(--lmn-app-shell-fg, var(--fg));
|
|
4090
4775
|
overflow: hidden;
|
|
4091
4776
|
position: relative;
|
|
4092
4777
|
}
|
|
@@ -4100,6 +4785,289 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4100
4785
|
min-width: 0;
|
|
4101
4786
|
overflow: auto;
|
|
4102
4787
|
}
|
|
4788
|
+
@media (max-width: 720px) {
|
|
4789
|
+
.titlebar-center {
|
|
4790
|
+
position: static;
|
|
4791
|
+
flex: 1;
|
|
4792
|
+
min-width: 0;
|
|
4793
|
+
justify-content: center;
|
|
4794
|
+
overflow: hidden;
|
|
4795
|
+
transform: none;
|
|
4796
|
+
}
|
|
4797
|
+
.titlebar-title,
|
|
4798
|
+
.titlebar-center,
|
|
4799
|
+
.titlebar-actions {
|
|
4800
|
+
max-width: 34%;
|
|
4801
|
+
}
|
|
4802
|
+
.sidebar:not(.collapsed) { width: 180px; }
|
|
4803
|
+
}
|
|
4804
|
+
/* ============ Splitter ============ */
|
|
4805
|
+
.splitter {
|
|
4806
|
+
display: flex;
|
|
4807
|
+
width: 100%;
|
|
4808
|
+
height: 100%;
|
|
4809
|
+
min-width: 0;
|
|
4810
|
+
min-height: 0;
|
|
4811
|
+
}
|
|
4812
|
+
.splitter.horizontal { flex-direction: row; }
|
|
4813
|
+
.splitter.vertical { flex-direction: column; }
|
|
4814
|
+
.splitter.dragging { cursor: col-resize; user-select: none; }
|
|
4815
|
+
.splitter.dragging.vertical { cursor: row-resize; }
|
|
4816
|
+
.splitter-panel {
|
|
4817
|
+
min-width: 0;
|
|
4818
|
+
min-height: 0;
|
|
4819
|
+
overflow: auto;
|
|
4820
|
+
}
|
|
4821
|
+
.splitter-panel.first { flex-shrink: 0; }
|
|
4822
|
+
.splitter-panel.second { flex: 1; }
|
|
4823
|
+
.splitter-handle {
|
|
4824
|
+
flex-shrink: 0;
|
|
4825
|
+
position: relative;
|
|
4826
|
+
display: flex;
|
|
4827
|
+
align-items: center;
|
|
4828
|
+
justify-content: center;
|
|
4829
|
+
background: transparent;
|
|
4830
|
+
transition: background var(--dur-fast) var(--ease);
|
|
4831
|
+
outline: none;
|
|
4832
|
+
}
|
|
4833
|
+
.splitter.horizontal > .splitter-handle {
|
|
4834
|
+
width: 6px;
|
|
4835
|
+
cursor: col-resize;
|
|
4836
|
+
}
|
|
4837
|
+
.splitter.vertical > .splitter-handle {
|
|
4838
|
+
height: 6px;
|
|
4839
|
+
cursor: row-resize;
|
|
4840
|
+
}
|
|
4841
|
+
.splitter-handle:hover,
|
|
4842
|
+
.splitter.dragging > .splitter-handle {
|
|
4843
|
+
background: var(--lmn-splitter-accent-soft, var(--accent-soft));
|
|
4844
|
+
}
|
|
4845
|
+
.splitter-handle:focus-visible {
|
|
4846
|
+
box-shadow: inset 0 0 0 2px var(--lmn-splitter-accent-glow, var(--accent-glow));
|
|
4847
|
+
border-radius: var(--r-xs);
|
|
4848
|
+
}
|
|
4849
|
+
.splitter-handle-grip {
|
|
4850
|
+
display: block;
|
|
4851
|
+
background: var(--lmn-splitter-divider, var(--divider));
|
|
4852
|
+
border-radius: 999px;
|
|
4853
|
+
transition: background var(--dur-fast) var(--ease);
|
|
4854
|
+
}
|
|
4855
|
+
.splitter.horizontal > .splitter-handle > .splitter-handle-grip {
|
|
4856
|
+
width: 2px;
|
|
4857
|
+
height: 28px;
|
|
4858
|
+
}
|
|
4859
|
+
.splitter.vertical > .splitter-handle > .splitter-handle-grip {
|
|
4860
|
+
width: 28px;
|
|
4861
|
+
height: 2px;
|
|
4862
|
+
}
|
|
4863
|
+
.splitter-handle:hover > .splitter-handle-grip,
|
|
4864
|
+
.splitter.dragging > .splitter-handle > .splitter-handle-grip {
|
|
4865
|
+
background: var(--lmn-splitter-accent, var(--accent));
|
|
4866
|
+
}
|
|
4867
|
+
/* ============ StatusBar ============ */
|
|
4868
|
+
.statusbar {
|
|
4869
|
+
display: flex;
|
|
4870
|
+
align-items: center;
|
|
4871
|
+
position: relative;
|
|
4872
|
+
height: 26px;
|
|
4873
|
+
padding: 0 10px;
|
|
4874
|
+
background: var(--lmn-status-bar-bg, var(--bg));
|
|
4875
|
+
border-top: 1px solid var(--lmn-status-bar-divider, var(--divider));
|
|
4876
|
+
color: var(--lmn-status-bar-fg-muted, var(--fg-muted));
|
|
4877
|
+
font-size: 11.5px;
|
|
4878
|
+
user-select: none;
|
|
4879
|
+
flex-shrink: 0;
|
|
4880
|
+
gap: 8px;
|
|
4881
|
+
}
|
|
4882
|
+
.statusbar-section {
|
|
4883
|
+
display: inline-flex;
|
|
4884
|
+
align-items: center;
|
|
4885
|
+
gap: 2px;
|
|
4886
|
+
min-width: 0;
|
|
4887
|
+
}
|
|
4888
|
+
.statusbar-section.left { margin-right: auto; }
|
|
4889
|
+
.statusbar-section.right { margin-left: auto; }
|
|
4890
|
+
.statusbar-section.center {
|
|
4891
|
+
position: absolute;
|
|
4892
|
+
left: 50%;
|
|
4893
|
+
transform: translateX(-50%);
|
|
4894
|
+
}
|
|
4895
|
+
.statusbar-item {
|
|
4896
|
+
display: inline-flex;
|
|
4897
|
+
align-items: center;
|
|
4898
|
+
gap: 5px;
|
|
4899
|
+
height: 20px;
|
|
4900
|
+
padding: 0 8px;
|
|
4901
|
+
border: none;
|
|
4902
|
+
background: transparent;
|
|
4903
|
+
color: inherit;
|
|
4904
|
+
font: inherit;
|
|
4905
|
+
border-radius: var(--r-xs);
|
|
4906
|
+
transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
|
|
4907
|
+
white-space: nowrap;
|
|
4908
|
+
}
|
|
4909
|
+
.statusbar-item.clickable { cursor: pointer; }
|
|
4910
|
+
.statusbar-item.clickable:hover { background: var(--lmn-status-bar-bg-sunken, var(--bg-sunken)); color: var(--lmn-status-bar-fg, var(--fg)); }
|
|
4911
|
+
.statusbar-item.tone-muted { color: var(--lmn-status-bar-fg-subtle, var(--fg-subtle)); }
|
|
4912
|
+
.statusbar-item.tone-accent { color: var(--lmn-status-bar-accent-ink, var(--accent-ink)); }
|
|
4913
|
+
.statusbar-item.tone-success { color: var(--lmn-status-bar-success, var(--success)); }
|
|
4914
|
+
.statusbar-item.tone-warning { color: var(--lmn-status-bar-warning, var(--warning)); }
|
|
4915
|
+
.statusbar-item.tone-danger { color: var(--lmn-status-bar-danger, var(--danger)); }
|
|
4916
|
+
.statusbar-item-icon { display: inline-flex; flex-shrink: 0; }
|
|
4917
|
+
.statusbar-item-label { overflow: hidden; text-overflow: ellipsis; }
|
|
4918
|
+
@media (max-width: 640px) {
|
|
4919
|
+
.statusbar-section.center {
|
|
4920
|
+
position: static;
|
|
4921
|
+
min-width: 0;
|
|
4922
|
+
margin-inline: auto;
|
|
4923
|
+
transform: none;
|
|
4924
|
+
}
|
|
4925
|
+
.statusbar-section.left,
|
|
4926
|
+
.statusbar-section.right {
|
|
4927
|
+
max-width: 38%;
|
|
4928
|
+
overflow: hidden;
|
|
4929
|
+
}
|
|
4930
|
+
}
|
|
4931
|
+
.timeline {
|
|
4932
|
+
display: flex;
|
|
4933
|
+
flex-direction: column;
|
|
4934
|
+
font-size: 14px;
|
|
4935
|
+
color: var(--lmn-timeline-fg, var(--fg));
|
|
4936
|
+
}
|
|
4937
|
+
/* ---- Item layout ---- */
|
|
4938
|
+
.timeline-item {
|
|
4939
|
+
display: grid;
|
|
4940
|
+
grid-template-columns: 1fr auto 1fr;
|
|
4941
|
+
gap: 0 var(--gap-3);
|
|
4942
|
+
min-height: 60px;
|
|
4943
|
+
min-width: 0;
|
|
4944
|
+
position: relative;
|
|
4945
|
+
}
|
|
4946
|
+
/* Left mode: label hidden, content on right */
|
|
4947
|
+
.timeline-left .timeline-item-label {
|
|
4948
|
+
display: none;
|
|
4949
|
+
}
|
|
4950
|
+
.timeline-left .timeline-item {
|
|
4951
|
+
grid-template-columns: auto 1fr;
|
|
4952
|
+
}
|
|
4953
|
+
/* Right mode: content on left, label hidden */
|
|
4954
|
+
.timeline-right .timeline-item-label {
|
|
4955
|
+
display: none;
|
|
4956
|
+
}
|
|
4957
|
+
.timeline-right .timeline-item {
|
|
4958
|
+
grid-template-columns: 1fr auto;
|
|
4959
|
+
direction: rtl;
|
|
4960
|
+
}
|
|
4961
|
+
.timeline-right .timeline-item-content,
|
|
4962
|
+
.timeline-right .timeline-item-head {
|
|
4963
|
+
direction: ltr;
|
|
4964
|
+
}
|
|
4965
|
+
/* Alternate mode */
|
|
4966
|
+
.timeline-alternate .timeline-item-left .timeline-item-label {
|
|
4967
|
+
text-align: right;
|
|
4968
|
+
color: var(--lmn-timeline-fg-muted, var(--fg-muted));
|
|
4969
|
+
}
|
|
4970
|
+
.timeline-alternate .timeline-item-left .timeline-item-content {
|
|
4971
|
+
text-align: left;
|
|
4972
|
+
}
|
|
4973
|
+
.timeline-alternate .timeline-item-right .timeline-item-label {
|
|
4974
|
+
text-align: left;
|
|
4975
|
+
}
|
|
4976
|
+
.timeline-alternate .timeline-item-right .timeline-item-content {
|
|
4977
|
+
text-align: right;
|
|
4978
|
+
color: var(--lmn-timeline-fg-muted, var(--fg-muted));
|
|
4979
|
+
}
|
|
4980
|
+
.timeline-alternate .timeline-item-right {
|
|
4981
|
+
direction: rtl;
|
|
4982
|
+
}
|
|
4983
|
+
.timeline-alternate .timeline-item-right .timeline-item-head,
|
|
4984
|
+
.timeline-alternate .timeline-item-right .timeline-item-content,
|
|
4985
|
+
.timeline-alternate .timeline-item-right .timeline-item-label {
|
|
4986
|
+
direction: ltr;
|
|
4987
|
+
}
|
|
4988
|
+
/* ---- Head (dot + tail) ---- */
|
|
4989
|
+
.timeline-item-head {
|
|
4990
|
+
display: flex;
|
|
4991
|
+
flex-direction: column;
|
|
4992
|
+
align-items: center;
|
|
4993
|
+
position: relative;
|
|
4994
|
+
}
|
|
4995
|
+
.timeline-item-dot {
|
|
4996
|
+
width: 12px;
|
|
4997
|
+
height: 12px;
|
|
4998
|
+
border-radius: var(--r-pill);
|
|
4999
|
+
box-shadow: var(--lmn-timeline-neu-shadow-control, var(--neu-shadow-control));
|
|
5000
|
+
flex-shrink: 0;
|
|
5001
|
+
display: flex;
|
|
5002
|
+
align-items: center;
|
|
5003
|
+
justify-content: center;
|
|
5004
|
+
position: relative;
|
|
5005
|
+
z-index: 1;
|
|
5006
|
+
margin-top: var(--timeline-dot-offset, 4px);
|
|
5007
|
+
}
|
|
5008
|
+
.timeline-item-dot.accent { background: var(--lmn-timeline-accent, var(--accent)); }
|
|
5009
|
+
.timeline-item-dot.success { background: var(--lmn-timeline-success, var(--success)); }
|
|
5010
|
+
.timeline-item-dot.warning { background: var(--lmn-timeline-warning, var(--warning)); }
|
|
5011
|
+
.timeline-item-dot.danger { background: var(--lmn-timeline-danger, var(--danger)); }
|
|
5012
|
+
.timeline-item-dot.info { background: var(--lmn-timeline-info, var(--info)); }
|
|
5013
|
+
.timeline-item-dot.muted { background: var(--lmn-timeline-fg-subtle, var(--fg-subtle)); }
|
|
5014
|
+
/* Pending dot: clear default fill, Spin handles its own visuals */
|
|
5015
|
+
.timeline-item-dot.pending {
|
|
5016
|
+
background: transparent;
|
|
5017
|
+
box-shadow: none;
|
|
5018
|
+
border: none;
|
|
5019
|
+
}
|
|
5020
|
+
.timeline-item-tail {
|
|
5021
|
+
width: 2px;
|
|
5022
|
+
flex: 1;
|
|
5023
|
+
background: var(--lmn-timeline-divider, var(--divider));
|
|
5024
|
+
margin-top: var(--gap-1);
|
|
5025
|
+
margin-bottom: 0;
|
|
5026
|
+
border-radius: 1px;
|
|
5027
|
+
}
|
|
5028
|
+
/* ---- Content ---- */
|
|
5029
|
+
.timeline-item-content {
|
|
5030
|
+
padding-bottom: var(--gap-5);
|
|
5031
|
+
line-height: 1.6;
|
|
5032
|
+
min-width: var(--timeline-content-min-width, 0);
|
|
5033
|
+
}
|
|
5034
|
+
.timeline-item-last .timeline-item-content {
|
|
5035
|
+
padding-bottom: 0;
|
|
5036
|
+
}
|
|
5037
|
+
.timeline-item-label {
|
|
5038
|
+
padding-bottom: var(--gap-5);
|
|
5039
|
+
line-height: 1.6;
|
|
5040
|
+
color: var(--lmn-timeline-fg-muted, var(--fg-muted));
|
|
5041
|
+
font-size: 13px;
|
|
5042
|
+
min-width: 0;
|
|
5043
|
+
}
|
|
5044
|
+
/* ---- Pending animation ---- */
|
|
5045
|
+
.timeline-item-pending .timeline-item-content {
|
|
5046
|
+
color: var(--lmn-timeline-fg-muted, var(--fg-muted));
|
|
5047
|
+
}
|
|
5048
|
+
/* When dot has custom content (Spin / Icon), expand to fit */
|
|
5049
|
+
.timeline-item-dot:has(> *) {
|
|
5050
|
+
width: auto;
|
|
5051
|
+
height: auto;
|
|
5052
|
+
background: transparent !important;
|
|
5053
|
+
box-shadow: none;
|
|
5054
|
+
border-radius: 0;
|
|
5055
|
+
border: none;
|
|
5056
|
+
}
|
|
5057
|
+
@media (max-width: 640px) {
|
|
5058
|
+
.timeline-alternate .timeline-item {
|
|
5059
|
+
grid-template-columns: auto minmax(0, 1fr);
|
|
5060
|
+
direction: ltr;
|
|
5061
|
+
}
|
|
5062
|
+
.timeline-alternate .timeline-item-label {
|
|
5063
|
+
display: none;
|
|
5064
|
+
}
|
|
5065
|
+
.timeline-alternate .timeline-item-head,
|
|
5066
|
+
.timeline-alternate .timeline-item-content {
|
|
5067
|
+
direction: ltr;
|
|
5068
|
+
text-align: left;
|
|
5069
|
+
}
|
|
5070
|
+
}
|
|
4103
5071
|
/* ============ ThemePanel ============ */
|
|
4104
5072
|
.theme-panel {
|
|
4105
5073
|
width: min(100%, 340px);
|
|
@@ -4109,9 +5077,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4109
5077
|
box-sizing: border-box;
|
|
4110
5078
|
padding: var(--gap-4);
|
|
4111
5079
|
border-radius: var(--r-xl);
|
|
4112
|
-
color: var(--fg);
|
|
4113
|
-
background: var(--bg);
|
|
4114
|
-
box-shadow: var(--neu-shadow-lift);
|
|
5080
|
+
color: var(--lmn-theme-panel-fg, var(--fg));
|
|
5081
|
+
background: var(--lmn-theme-panel-bg, var(--bg));
|
|
5082
|
+
box-shadow: var(--lmn-theme-panel-neu-shadow-lift, var(--neu-shadow-lift));
|
|
4115
5083
|
}
|
|
4116
5084
|
.theme-panel.compact {
|
|
4117
5085
|
width: min(100%, 300px);
|
|
@@ -4128,13 +5096,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4128
5096
|
align-items: center;
|
|
4129
5097
|
gap: 8px;
|
|
4130
5098
|
min-width: 0;
|
|
4131
|
-
color: var(--fg);
|
|
5099
|
+
color: var(--lmn-theme-panel-fg, var(--fg));
|
|
4132
5100
|
font-size: 14px;
|
|
4133
5101
|
font-weight: 700;
|
|
4134
5102
|
}
|
|
4135
5103
|
.theme-panel-title svg {
|
|
4136
5104
|
flex: 0 0 auto;
|
|
4137
|
-
color: var(--accent);
|
|
5105
|
+
color: var(--lmn-theme-panel-accent, var(--accent));
|
|
4138
5106
|
}
|
|
4139
5107
|
.theme-panel-title span {
|
|
4140
5108
|
min-width: 0;
|
|
@@ -4144,14 +5112,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4144
5112
|
}
|
|
4145
5113
|
.theme-panel-desc {
|
|
4146
5114
|
font-size: 12px;
|
|
4147
|
-
color: var(--fg-muted);
|
|
5115
|
+
color: var(--lmn-theme-panel-fg-muted, var(--fg-muted));
|
|
4148
5116
|
}
|
|
4149
5117
|
.theme-panel-row {
|
|
4150
5118
|
display: flex;
|
|
4151
5119
|
flex-direction: column;
|
|
4152
5120
|
gap: 8px;
|
|
4153
5121
|
padding-top: var(--gap-3);
|
|
4154
|
-
border-top: 1px solid var(--divider);
|
|
5122
|
+
border-top: 1px solid var(--lmn-theme-panel-divider, var(--divider));
|
|
4155
5123
|
}
|
|
4156
5124
|
.theme-panel-head + .theme-panel-row,
|
|
4157
5125
|
.theme-panel-row:first-child {
|
|
@@ -4165,7 +5133,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4165
5133
|
gap: 10px;
|
|
4166
5134
|
font-size: 12px;
|
|
4167
5135
|
font-weight: 600;
|
|
4168
|
-
color: var(--fg);
|
|
5136
|
+
color: var(--lmn-theme-panel-fg, var(--fg));
|
|
4169
5137
|
}
|
|
4170
5138
|
.theme-panel-label > span:last-child:not(:first-child) {
|
|
4171
5139
|
min-width: 0;
|
|
@@ -4175,9 +5143,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4175
5143
|
white-space: nowrap;
|
|
4176
5144
|
padding: 2px 8px;
|
|
4177
5145
|
border-radius: var(--r-pill);
|
|
4178
|
-
color: var(--accent-ink);
|
|
4179
|
-
background: var(--bg);
|
|
4180
|
-
box-shadow: var(--neu-shadow-inset);
|
|
5146
|
+
color: var(--lmn-theme-panel-accent-ink, var(--accent-ink));
|
|
5147
|
+
background: var(--lmn-theme-panel-bg, var(--bg));
|
|
5148
|
+
box-shadow: var(--lmn-theme-panel-neu-shadow-inset, var(--neu-shadow-inset));
|
|
4181
5149
|
font-family: var(--font-mono);
|
|
4182
5150
|
font-size: 11px;
|
|
4183
5151
|
font-weight: 500;
|
|
@@ -4201,9 +5169,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4201
5169
|
flex-direction: column;
|
|
4202
5170
|
gap: 8px;
|
|
4203
5171
|
padding: 9px;
|
|
4204
|
-
color: var(--fg-muted);
|
|
4205
|
-
background: var(--bg);
|
|
4206
|
-
box-shadow: var(--neu-shadow-control);
|
|
5172
|
+
color: var(--lmn-theme-panel-fg-muted, var(--fg-muted));
|
|
5173
|
+
background: var(--lmn-theme-panel-bg, var(--bg));
|
|
5174
|
+
box-shadow: var(--lmn-theme-panel-neu-shadow-control, var(--neu-shadow-control));
|
|
4207
5175
|
text-align: left;
|
|
4208
5176
|
white-space: normal;
|
|
4209
5177
|
transition:
|
|
@@ -4212,18 +5180,18 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4212
5180
|
transform var(--dur-fast) var(--ease);
|
|
4213
5181
|
}
|
|
4214
5182
|
.theme-panel .theme-panel-preset.btn:hover {
|
|
4215
|
-
color: var(--fg);
|
|
4216
|
-
box-shadow: var(--neu-shadow-panel);
|
|
5183
|
+
color: var(--lmn-theme-panel-fg, var(--fg));
|
|
5184
|
+
box-shadow: var(--lmn-theme-panel-neu-shadow-panel, var(--neu-shadow-panel));
|
|
4217
5185
|
transform: translateY(-1px);
|
|
4218
5186
|
}
|
|
4219
5187
|
.theme-panel .theme-panel-preset.btn.active {
|
|
4220
|
-
color: var(--accent-ink);
|
|
4221
|
-
box-shadow: var(--neu-shadow-inset), 0 0 0 1px var(--accent-glow);
|
|
5188
|
+
color: var(--lmn-theme-panel-accent-ink, var(--accent-ink));
|
|
5189
|
+
box-shadow: var(--lmn-theme-panel-neu-shadow-inset, var(--neu-shadow-inset)), 0 0 0 1px var(--lmn-theme-panel-accent-glow, var(--accent-glow));
|
|
4222
5190
|
transform: none;
|
|
4223
5191
|
}
|
|
4224
5192
|
.theme-panel .theme-panel-preset.btn.active:hover {
|
|
4225
|
-
color: var(--accent-ink);
|
|
4226
|
-
box-shadow: var(--neu-shadow-inset), 0 0 0 1px var(--accent-glow);
|
|
5193
|
+
color: var(--lmn-theme-panel-accent-ink, var(--accent-ink));
|
|
5194
|
+
box-shadow: var(--lmn-theme-panel-neu-shadow-inset, var(--neu-shadow-inset)), 0 0 0 1px var(--lmn-theme-panel-accent-glow, var(--accent-glow));
|
|
4227
5195
|
}
|
|
4228
5196
|
.theme-panel .theme-panel-preset-shell.deletable .theme-panel-preset.btn {
|
|
4229
5197
|
padding-right: 28px;
|
|
@@ -4236,9 +5204,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4236
5204
|
height: 22px;
|
|
4237
5205
|
min-width: 22px;
|
|
4238
5206
|
padding: 0;
|
|
4239
|
-
color: var(--fg-subtle);
|
|
4240
|
-
background: var(--bg);
|
|
4241
|
-
box-shadow: var(--neu-shadow-control);
|
|
5207
|
+
color: var(--lmn-theme-panel-fg-subtle, var(--fg-subtle));
|
|
5208
|
+
background: var(--lmn-theme-panel-bg, var(--bg));
|
|
5209
|
+
box-shadow: var(--lmn-theme-panel-neu-shadow-control, var(--neu-shadow-control));
|
|
4242
5210
|
opacity: 0;
|
|
4243
5211
|
transform: scale(0.92);
|
|
4244
5212
|
}
|
|
@@ -4248,7 +5216,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4248
5216
|
transform: scale(1);
|
|
4249
5217
|
}
|
|
4250
5218
|
.theme-panel .theme-panel-preset-delete.btn:hover {
|
|
4251
|
-
box-shadow: var(--neu-shadow-inset);
|
|
5219
|
+
box-shadow: var(--lmn-theme-panel-neu-shadow-inset, var(--neu-shadow-inset));
|
|
4252
5220
|
}
|
|
4253
5221
|
.theme-panel-preset-ink {
|
|
4254
5222
|
display: grid;
|
|
@@ -4260,7 +5228,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4260
5228
|
height: 18px;
|
|
4261
5229
|
min-width: 0;
|
|
4262
5230
|
border-radius: var(--r-pill);
|
|
4263
|
-
box-shadow: inset 0 0 0 1px var(--divider);
|
|
5231
|
+
box-shadow: inset 0 0 0 1px var(--lmn-theme-panel-divider, var(--divider));
|
|
4264
5232
|
}
|
|
4265
5233
|
.theme-panel-preset-copy {
|
|
4266
5234
|
display: flex;
|
|
@@ -4283,7 +5251,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4283
5251
|
overflow: hidden;
|
|
4284
5252
|
text-overflow: ellipsis;
|
|
4285
5253
|
white-space: nowrap;
|
|
4286
|
-
color: var(--fg-subtle);
|
|
5254
|
+
color: var(--lmn-theme-panel-fg-subtle, var(--fg-subtle));
|
|
4287
5255
|
font-size: 10px;
|
|
4288
5256
|
font-weight: 500;
|
|
4289
5257
|
}
|
|
@@ -4299,10 +5267,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4299
5267
|
min-width: 28px;
|
|
4300
5268
|
padding: 0;
|
|
4301
5269
|
border-radius: var(--r-pill);
|
|
4302
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
5270
|
+
box-shadow: var(--lmn-theme-panel-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
4303
5271
|
}
|
|
4304
5272
|
.theme-panel-swatch.active {
|
|
4305
|
-
box-shadow: var(--neu-shadow-inset), 0 0 0 2px var(--accent-glow);
|
|
5273
|
+
box-shadow: var(--lmn-theme-panel-neu-shadow-inset, var(--neu-shadow-inset)), 0 0 0 2px var(--lmn-theme-panel-accent-glow, var(--accent-glow));
|
|
4306
5274
|
}
|
|
4307
5275
|
.theme-panel .radio-group.segmented {
|
|
4308
5276
|
width: 100%;
|
|
@@ -4316,8 +5284,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4316
5284
|
gap: 10px;
|
|
4317
5285
|
padding: 10px;
|
|
4318
5286
|
border-radius: var(--r-md);
|
|
4319
|
-
background: var(--bg);
|
|
4320
|
-
box-shadow: var(--neu-shadow-inset);
|
|
5287
|
+
background: var(--lmn-theme-panel-bg, var(--bg));
|
|
5288
|
+
box-shadow: var(--lmn-theme-panel-neu-shadow-inset, var(--neu-shadow-inset));
|
|
4321
5289
|
}
|
|
4322
5290
|
.theme-panel-create-head {
|
|
4323
5291
|
display: flex;
|
|
@@ -4332,13 +5300,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4332
5300
|
gap: 2px;
|
|
4333
5301
|
}
|
|
4334
5302
|
.theme-panel-create-head span {
|
|
4335
|
-
color: var(--fg);
|
|
5303
|
+
color: var(--lmn-theme-panel-fg, var(--fg));
|
|
4336
5304
|
font-size: 12px;
|
|
4337
5305
|
font-weight: 700;
|
|
4338
5306
|
}
|
|
4339
5307
|
.theme-panel-create-head small {
|
|
4340
5308
|
min-width: 0;
|
|
4341
|
-
color: var(--fg-subtle);
|
|
5309
|
+
color: var(--lmn-theme-panel-fg-subtle, var(--fg-subtle));
|
|
4342
5310
|
font-family: var(--font-mono);
|
|
4343
5311
|
font-size: 10px;
|
|
4344
5312
|
overflow: hidden;
|
|
@@ -4350,7 +5318,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4350
5318
|
display: flex;
|
|
4351
5319
|
flex-direction: column;
|
|
4352
5320
|
gap: 6px;
|
|
4353
|
-
color: var(--fg-subtle);
|
|
5321
|
+
color: var(--lmn-theme-panel-fg-subtle, var(--fg-subtle));
|
|
4354
5322
|
font-family: var(--font-mono);
|
|
4355
5323
|
font-size: 10px;
|
|
4356
5324
|
}
|
|
@@ -4390,15 +5358,15 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4390
5358
|
gap: 10px;
|
|
4391
5359
|
padding: 10px;
|
|
4392
5360
|
border-radius: var(--r-md);
|
|
4393
|
-
background: var(--bg);
|
|
4394
|
-
box-shadow: var(--neu-shadow-inset);
|
|
5361
|
+
background: var(--lmn-theme-panel-bg, var(--bg));
|
|
5362
|
+
box-shadow: var(--lmn-theme-panel-neu-shadow-inset, var(--neu-shadow-inset));
|
|
4395
5363
|
}
|
|
4396
5364
|
.theme-panel-advanced-actions {
|
|
4397
5365
|
display: flex;
|
|
4398
5366
|
flex-direction: column;
|
|
4399
5367
|
gap: 8px;
|
|
4400
5368
|
padding-top: 10px;
|
|
4401
|
-
border-top: 1px solid var(--divider);
|
|
5369
|
+
border-top: 1px solid var(--lmn-theme-panel-divider, var(--divider));
|
|
4402
5370
|
}
|
|
4403
5371
|
.theme-panel-save-as-field {
|
|
4404
5372
|
display: grid;
|
|
@@ -4407,7 +5375,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4407
5375
|
align-items: center;
|
|
4408
5376
|
}
|
|
4409
5377
|
.theme-panel-save-as-field > span {
|
|
4410
|
-
color: var(--fg-muted);
|
|
5378
|
+
color: var(--lmn-theme-panel-fg-muted, var(--fg-muted));
|
|
4411
5379
|
font-size: 11px;
|
|
4412
5380
|
font-weight: 800;
|
|
4413
5381
|
white-space: nowrap;
|
|
@@ -4420,7 +5388,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4420
5388
|
}
|
|
4421
5389
|
.theme-panel-advanced-footer > span {
|
|
4422
5390
|
min-width: 0;
|
|
4423
|
-
color: var(--fg-subtle);
|
|
5391
|
+
color: var(--lmn-theme-panel-fg-subtle, var(--fg-subtle));
|
|
4424
5392
|
font-family: var(--font-mono);
|
|
4425
5393
|
font-size: 10px;
|
|
4426
5394
|
overflow: hidden;
|
|
@@ -4444,11 +5412,11 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4444
5412
|
gap: 10px;
|
|
4445
5413
|
padding: 7px 9px;
|
|
4446
5414
|
border-radius: var(--preview-radius, var(--r-md));
|
|
4447
|
-
color: var(--preview-fg, var(--fg));
|
|
4448
|
-
background: var(--preview-bg, var(--bg));
|
|
5415
|
+
color: var(--preview-fg, var(--lmn-theme-panel-fg, var(--fg)));
|
|
5416
|
+
background: var(--preview-bg, var(--lmn-theme-panel-bg, var(--bg)));
|
|
4449
5417
|
box-shadow:
|
|
4450
|
-
calc(var(--shadow-offset) * 0.45 * var(--preview-shadow-scale, 1)) calc(var(--shadow-offset) * 0.45 * var(--preview-shadow-scale, 1)) calc(var(--shadow-blur) * 0.55 * var(--preview-shadow-scale, 1)) var(--preview-shadow-dark, var(--shadow-dark)),
|
|
4451
|
-
calc(var(--shadow-offset) * -0.45 * var(--preview-shadow-scale, 1)) calc(var(--shadow-offset) * -0.45 * var(--preview-shadow-scale, 1)) calc(var(--shadow-blur) * 0.55 * var(--preview-shadow-scale, 1)) var(--preview-shadow-light, var(--shadow-light));
|
|
5418
|
+
calc(var(--lmn-theme-panel-shadow-offset, var(--shadow-offset)) * 0.45 * var(--preview-shadow-scale, 1)) calc(var(--lmn-theme-panel-shadow-offset, var(--shadow-offset)) * 0.45 * var(--preview-shadow-scale, 1)) calc(var(--lmn-theme-panel-shadow-blur, var(--shadow-blur)) * 0.55 * var(--preview-shadow-scale, 1)) var(--preview-shadow-dark, var(--lmn-theme-panel-shadow-dark, var(--shadow-dark))),
|
|
5419
|
+
calc(var(--lmn-theme-panel-shadow-offset, var(--shadow-offset)) * -0.45 * var(--preview-shadow-scale, 1)) calc(var(--lmn-theme-panel-shadow-offset, var(--shadow-offset)) * -0.45 * var(--preview-shadow-scale, 1)) calc(var(--lmn-theme-panel-shadow-blur, var(--shadow-blur)) * 0.55 * var(--preview-shadow-scale, 1)) var(--preview-shadow-light, var(--lmn-theme-panel-shadow-light, var(--shadow-light)));
|
|
4452
5420
|
font-family: var(--preview-font, var(--font-sans));
|
|
4453
5421
|
font-size: 12px;
|
|
4454
5422
|
font-weight: 700;
|
|
@@ -4471,10 +5439,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4471
5439
|
width: 20px;
|
|
4472
5440
|
height: 20px;
|
|
4473
5441
|
border-radius: var(--r-pill);
|
|
4474
|
-
background: var(--preview-accent, var(--accent));
|
|
5442
|
+
background: var(--preview-accent, var(--lmn-theme-panel-accent, var(--accent)));
|
|
4475
5443
|
box-shadow:
|
|
4476
|
-
inset 1px 1px 2px color-mix(in oklch, var(--preview-accent, var(--accent)) 50%, white),
|
|
4477
|
-
0 0 0 4px var(--preview-accent-glow, var(--accent-glow));
|
|
5444
|
+
inset 1px 1px 2px color-mix(in oklch, var(--preview-accent, var(--lmn-theme-panel-accent, var(--accent))) 50%, white),
|
|
5445
|
+
0 0 0 4px var(--preview-accent-glow, var(--lmn-theme-panel-accent-glow, var(--accent-glow)));
|
|
4478
5446
|
}
|
|
4479
5447
|
.theme-panel-create-actions {
|
|
4480
5448
|
display: grid;
|
|
@@ -4492,7 +5460,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4492
5460
|
flex-direction: column;
|
|
4493
5461
|
gap: 8px;
|
|
4494
5462
|
padding-top: 10px;
|
|
4495
|
-
border-top: 1px solid var(--divider);
|
|
5463
|
+
border-top: 1px solid var(--lmn-theme-panel-divider, var(--divider));
|
|
4496
5464
|
}
|
|
4497
5465
|
.theme-panel-advanced-section.compact {
|
|
4498
5466
|
padding-top: 0;
|
|
@@ -4506,13 +5474,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4506
5474
|
}
|
|
4507
5475
|
.theme-panel-advanced-title span {
|
|
4508
5476
|
min-width: 0;
|
|
4509
|
-
color: var(--fg);
|
|
5477
|
+
color: var(--lmn-theme-panel-fg, var(--fg));
|
|
4510
5478
|
font-size: 11px;
|
|
4511
5479
|
font-weight: 700;
|
|
4512
5480
|
}
|
|
4513
5481
|
.theme-panel-advanced-title small {
|
|
4514
5482
|
min-width: 0;
|
|
4515
|
-
color: var(--fg-subtle);
|
|
5483
|
+
color: var(--lmn-theme-panel-fg-subtle, var(--fg-subtle));
|
|
4516
5484
|
font-family: var(--font-mono);
|
|
4517
5485
|
font-size: 9px;
|
|
4518
5486
|
overflow: hidden;
|
|
@@ -4538,13 +5506,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4538
5506
|
gap: 2px;
|
|
4539
5507
|
}
|
|
4540
5508
|
.theme-panel-token-label span {
|
|
4541
|
-
color: var(--fg-muted);
|
|
5509
|
+
color: var(--lmn-theme-panel-fg-muted, var(--fg-muted));
|
|
4542
5510
|
font-size: 10px;
|
|
4543
5511
|
font-weight: 650;
|
|
4544
5512
|
white-space: nowrap;
|
|
4545
5513
|
}
|
|
4546
5514
|
.theme-panel-token-label code {
|
|
4547
|
-
color: var(--fg-subtle);
|
|
5515
|
+
color: var(--lmn-theme-panel-fg-subtle, var(--fg-subtle));
|
|
4548
5516
|
font-family: var(--font-mono);
|
|
4549
5517
|
font-size: 9px;
|
|
4550
5518
|
overflow: hidden;
|
|
@@ -4583,13 +5551,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4583
5551
|
width: 24px;
|
|
4584
5552
|
height: 24px;
|
|
4585
5553
|
border-radius: 7px;
|
|
4586
|
-
box-shadow: var(--neu-shadow-inset), inset 0 0 0 1px var(--border);
|
|
5554
|
+
box-shadow: var(--lmn-theme-panel-neu-shadow-inset, var(--neu-shadow-inset)), inset 0 0 0 1px var(--lmn-theme-panel-border, var(--border));
|
|
4587
5555
|
transition:
|
|
4588
5556
|
box-shadow var(--dur-fast) var(--ease),
|
|
4589
5557
|
transform var(--dur-fast) var(--ease);
|
|
4590
5558
|
}
|
|
4591
5559
|
.theme-panel-token-picker .cp-custom-trigger:hover .theme-panel-token-swatch {
|
|
4592
|
-
box-shadow: var(--neu-shadow-control), inset 0 0 0 1px var(--border);
|
|
5560
|
+
box-shadow: var(--lmn-theme-panel-neu-shadow-control, var(--neu-shadow-control)), inset 0 0 0 1px var(--lmn-theme-panel-border, var(--border));
|
|
4593
5561
|
transform: translateY(-1px);
|
|
4594
5562
|
}
|
|
4595
5563
|
.theme-panel-token-input .input-wrap,
|