@fangxinyan/lumina 0.6.18 → 0.7.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 +24 -3
- package/dist/Select.d.ts +24 -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 +8 -12
- package/dist/Splitter.d.ts +8 -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-W4HPZ7MZ.css} +78 -53
- package/dist/Table.cjs +14 -10
- package/dist/Table.d.cts +32 -3
- package/dist/Table.d.ts +32 -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-A3IG6UZ6.css} +10 -10
- package/dist/Tabs.cjs +4 -2
- package/dist/Tabs.d.cts +2 -2
- package/dist/Tabs.d.ts +2 -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-E22OIVYP.js → chunk-3EHJ5QI3.js} +202 -69
- 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-L6GIV5DQ.cjs → chunk-56I6ZKGU.cjs} +40 -22
- 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-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-V5SQOZPF.js → chunk-BJDQVVCG.js} +38 -20
- package/dist/{chunk-BVQOJKRX.js → chunk-BKW5PXEO.js} +115 -72
- package/dist/{chunk-UW57F3UO.cjs → chunk-D7YSY5RZ.cjs} +208 -75
- package/dist/chunk-DRDDQCDD.js +322 -0
- package/dist/chunk-DU2DSERH.js +190 -0
- package/dist/{chunk-PSQ3HNZP.cjs → chunk-E66PSVBU.cjs} +106 -19
- package/dist/{chunk-UGAN4BBW.js → chunk-EA3NZBCZ.js} +251 -125
- package/dist/chunk-EAUB6FEN.js +262 -0
- package/dist/chunk-EE5KXDRK.cjs +1223 -0
- package/dist/chunk-EE7IJ3MB.js +1 -0
- package/dist/{chunk-NXBFEIUX.cjs → chunk-ENFLP7SN.cjs} +255 -129
- 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-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-IPSNC5VZ.js → chunk-JHM7MN3G.js} +15 -7
- package/dist/{chunk-4ACCOYBY.cjs → chunk-JINKQT6H.cjs} +20 -8
- 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-LOWTSOWT.js +199 -0
- 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-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-RAK6CENJ.js +83 -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-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-U7VEPMCX.cjs +221 -0
- 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-2FOC3D6X.js → chunk-WMZV7PNO.js} +19 -7
- package/dist/{chunk-MYW7LNB2.cjs → chunk-WROF2PVG.cjs} +40 -21
- package/dist/chunk-XZXY3XCL.cjs +105 -0
- 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 +1628 -701
- 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 +20 -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 +29 -2
- package/docs/llms/sidebar.md +24 -0
- package/docs/llms/slider.md +5 -2
- package/docs/llms/splitter.md +5 -2
- package/docs/llms/switch.md +13 -0
- package/docs/llms/table.md +7 -8
- 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-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-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); }
|
|
@@ -1253,8 +1448,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1253
1448
|
display: inline-flex;
|
|
1254
1449
|
padding: 5px;
|
|
1255
1450
|
border-radius: var(--r-md);
|
|
1256
|
-
background: var(--bg);
|
|
1257
|
-
box-shadow: var(--neu-shadow-inset);
|
|
1451
|
+
background: var(--lmn-tabs-bg, var(--bg));
|
|
1452
|
+
box-shadow: var(--lmn-tabs-neu-shadow-inset, var(--neu-shadow-inset));
|
|
1258
1453
|
gap: 2px;
|
|
1259
1454
|
align-self: flex-start;
|
|
1260
1455
|
}
|
|
@@ -1266,18 +1461,18 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1266
1461
|
font-size: 12px;
|
|
1267
1462
|
font-weight: 500;
|
|
1268
1463
|
font-family: inherit;
|
|
1269
|
-
color: var(--fg-muted);
|
|
1464
|
+
color: var(--lmn-tabs-fg-muted, var(--fg-muted));
|
|
1270
1465
|
cursor: pointer;
|
|
1271
1466
|
display: inline-flex;
|
|
1272
1467
|
align-items: center;
|
|
1273
1468
|
gap: 6px;
|
|
1274
1469
|
transition: all var(--dur-fast) var(--ease);
|
|
1275
1470
|
}
|
|
1276
|
-
.tabs-nav .tab:hover { color: var(--fg); }
|
|
1471
|
+
.tabs-nav .tab:hover { color: var(--lmn-tabs-fg, var(--fg)); }
|
|
1277
1472
|
.tabs-nav .tab.active {
|
|
1278
|
-
color: var(--accent-ink);
|
|
1279
|
-
background: var(--bg);
|
|
1280
|
-
box-shadow: var(--neu-shadow-control);
|
|
1473
|
+
color: var(--lmn-tabs-accent-ink, var(--accent-ink));
|
|
1474
|
+
background: var(--lmn-tabs-bg, var(--bg));
|
|
1475
|
+
box-shadow: var(--lmn-tabs-neu-shadow-control, var(--neu-shadow-control));
|
|
1281
1476
|
font-weight: 600;
|
|
1282
1477
|
}
|
|
1283
1478
|
.tabs-nav .tab[disabled] { opacity: 0.4; cursor: not-allowed; }
|
|
@@ -1287,7 +1482,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1287
1482
|
background: transparent;
|
|
1288
1483
|
box-shadow: none;
|
|
1289
1484
|
border-radius: 0;
|
|
1290
|
-
border-bottom: 1px solid var(--divider);
|
|
1485
|
+
border-bottom: 1px solid var(--lmn-tabs-divider, var(--divider));
|
|
1291
1486
|
align-self: stretch;
|
|
1292
1487
|
}
|
|
1293
1488
|
.tabs.line .tabs-nav .tab,
|
|
@@ -1302,8 +1497,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1302
1497
|
.tabs.line .tabs-nav .tab.active::after,
|
|
1303
1498
|
.tabs.underline .tabs-nav .tab.active::after {
|
|
1304
1499
|
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);
|
|
1500
|
+
background: var(--lmn-tabs-accent, var(--accent)); border-radius: 999px;
|
|
1501
|
+
box-shadow: 0 0 8px var(--lmn-tabs-accent-glow, var(--accent-glow));
|
|
1307
1502
|
}
|
|
1308
1503
|
/* Centered nav — works for pill / segmented (self-align) and line (flex-center) */
|
|
1309
1504
|
.tabs.centered .tabs-nav { align-self: center; }
|
|
@@ -1315,9 +1510,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1315
1510
|
/* ============ Collapse ============ */
|
|
1316
1511
|
.collapse { display: flex; flex-direction: column; gap: 10px; }
|
|
1317
1512
|
.collapse-item {
|
|
1318
|
-
background: var(--bg);
|
|
1513
|
+
background: var(--lmn-collapse-bg, var(--bg));
|
|
1319
1514
|
border-radius: var(--r-md);
|
|
1320
|
-
box-shadow: var(--neu-shadow-control);
|
|
1515
|
+
box-shadow: var(--lmn-collapse-neu-shadow-control, var(--neu-shadow-control));
|
|
1321
1516
|
overflow: hidden;
|
|
1322
1517
|
}
|
|
1323
1518
|
.collapse.ghost .collapse-item {
|
|
@@ -1338,7 +1533,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1338
1533
|
font-size: 13px;
|
|
1339
1534
|
font-weight: 500;
|
|
1340
1535
|
font-family: inherit;
|
|
1341
|
-
color: var(--fg);
|
|
1536
|
+
color: var(--lmn-collapse-fg, var(--fg));
|
|
1342
1537
|
text-align: left;
|
|
1343
1538
|
}
|
|
1344
1539
|
.collapse.small .collapse-head { padding: 10px 14px; font-size: 12px; }
|
|
@@ -1349,7 +1544,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1349
1544
|
max-height: 0;
|
|
1350
1545
|
overflow: hidden;
|
|
1351
1546
|
transition: max-height var(--dur) var(--ease);
|
|
1352
|
-
color: var(--fg-muted);
|
|
1547
|
+
color: var(--lmn-collapse-fg-muted, var(--fg-muted));
|
|
1353
1548
|
font-size: 13px;
|
|
1354
1549
|
}
|
|
1355
1550
|
.collapse-body-inner { padding: 0 18px 16px; }
|
|
@@ -1357,14 +1552,19 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1357
1552
|
.collapse.large .collapse-body-inner { padding: 0 22px 20px; }
|
|
1358
1553
|
.collapse-chev {
|
|
1359
1554
|
transition: transform var(--dur) var(--ease), color var(--dur) var(--ease);
|
|
1360
|
-
color: var(--fg-subtle);
|
|
1555
|
+
color: var(--lmn-collapse-fg-subtle, var(--fg-subtle));
|
|
1361
1556
|
display: inline-flex;
|
|
1362
1557
|
border-radius: var(--r-xs);
|
|
1363
1558
|
padding: 2px;
|
|
1364
1559
|
}
|
|
1560
|
+
button.collapse-chev {
|
|
1561
|
+
border: 0;
|
|
1562
|
+
background: transparent;
|
|
1563
|
+
font: inherit;
|
|
1564
|
+
}
|
|
1365
1565
|
.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); }
|
|
1566
|
+
.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)); }
|
|
1567
|
+
.collapse-item.open .collapse-chev { transform: rotate(180deg); color: var(--lmn-collapse-accent, var(--accent)); }
|
|
1368
1568
|
/* ============ Select ============ */
|
|
1369
1569
|
.select {
|
|
1370
1570
|
position: relative;
|
|
@@ -1380,14 +1580,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1380
1580
|
padding: 0 36px 0 var(--ctrl-pad-x);
|
|
1381
1581
|
border: none;
|
|
1382
1582
|
border-radius: var(--r-md);
|
|
1383
|
-
background: var(--bg);
|
|
1384
|
-
box-shadow: var(--neu-shadow-control);
|
|
1583
|
+
background: var(--lmn-select-bg, var(--bg));
|
|
1584
|
+
box-shadow: var(--lmn-select-neu-shadow-control, var(--neu-shadow-control));
|
|
1385
1585
|
display: inline-flex;
|
|
1386
1586
|
align-items: center;
|
|
1387
1587
|
gap: 8px;
|
|
1388
1588
|
font-size: var(--fs-md);
|
|
1389
1589
|
font-family: inherit;
|
|
1390
|
-
color: var(--fg);
|
|
1590
|
+
color: var(--lmn-select-fg, var(--fg));
|
|
1391
1591
|
cursor: pointer;
|
|
1392
1592
|
transition: all var(--dur-fast) var(--ease);
|
|
1393
1593
|
position: relative;
|
|
@@ -1431,25 +1631,25 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1431
1631
|
height: 18px;
|
|
1432
1632
|
}
|
|
1433
1633
|
.select.invalid .select-trigger {
|
|
1434
|
-
box-shadow: var(--neu-shadow-control), 0 0 0 2px color-mix(in oklch, var(--danger) 30%, transparent);
|
|
1634
|
+
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
1635
|
}
|
|
1436
1636
|
.select.invalid.open .select-trigger {
|
|
1437
|
-
box-shadow: var(--neu-shadow-inset), 0 0 0 2px color-mix(in oklch, var(--danger) 30%, transparent);
|
|
1637
|
+
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
1638
|
}
|
|
1439
1639
|
.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
1640
|
.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); }
|
|
1641
|
+
.select-trigger:hover { color: var(--lmn-select-accent-ink, var(--accent-ink)); }
|
|
1642
|
+
.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)); }
|
|
1643
|
+
.select-trigger .placeholder { color: var(--lmn-select-fg-subtle, var(--fg-subtle)); }
|
|
1444
1644
|
.select-caret {
|
|
1445
1645
|
position: absolute;
|
|
1446
1646
|
right: 12px; top: 50%;
|
|
1447
1647
|
transform: translateY(-50%);
|
|
1448
|
-
color: var(--fg-subtle);
|
|
1648
|
+
color: var(--lmn-select-fg-subtle, var(--fg-subtle));
|
|
1449
1649
|
transition: transform var(--dur) var(--ease);
|
|
1450
1650
|
flex-shrink: 0;
|
|
1451
1651
|
}
|
|
1452
|
-
.select.open .select-caret { transform: translateY(-50%) rotate(180deg); color: var(--accent); }
|
|
1652
|
+
.select.open .select-caret { transform: translateY(-50%) rotate(180deg); color: var(--lmn-select-accent, var(--accent)); }
|
|
1453
1653
|
/* Multi-select trigger: variable height, tags inside, vertically centered */
|
|
1454
1654
|
.select.multi .select-trigger {
|
|
1455
1655
|
height: auto;
|
|
@@ -1486,25 +1686,28 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1486
1686
|
width: 20px;
|
|
1487
1687
|
height: 20px;
|
|
1488
1688
|
border-radius: 999px;
|
|
1489
|
-
background: var(--bg);
|
|
1490
|
-
|
|
1689
|
+
background: var(--lmn-select-bg, var(--bg));
|
|
1690
|
+
border: none;
|
|
1691
|
+
padding: 0;
|
|
1692
|
+
font: inherit;
|
|
1693
|
+
box-shadow: var(--lmn-select-neu-shadow-control, var(--neu-shadow-control));
|
|
1491
1694
|
display: inline-grid;
|
|
1492
1695
|
place-items: center;
|
|
1493
1696
|
cursor: pointer;
|
|
1494
|
-
color: var(--fg-subtle);
|
|
1697
|
+
color: var(--lmn-select-fg-subtle, var(--fg-subtle));
|
|
1495
1698
|
opacity: 0;
|
|
1496
1699
|
transition: all var(--dur-fast) var(--ease);
|
|
1497
1700
|
z-index: 1;
|
|
1498
1701
|
}
|
|
1499
1702
|
.select:hover .select-clear { opacity: 1; }
|
|
1500
|
-
.select-clear:hover { color: var(--accent-ink); box-shadow: var(--neu-shadow-inset); }
|
|
1703
|
+
.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
1704
|
/* Multi-select menu: leading checkbox per item */
|
|
1502
1705
|
.menu-check {
|
|
1503
1706
|
width: 16px;
|
|
1504
1707
|
height: 16px;
|
|
1505
1708
|
border-radius: 5px;
|
|
1506
|
-
background: var(--bg);
|
|
1507
|
-
box-shadow: var(--neu-shadow-inset);
|
|
1709
|
+
background: var(--lmn-select-bg, var(--bg));
|
|
1710
|
+
box-shadow: var(--lmn-select-neu-shadow-inset, var(--neu-shadow-inset));
|
|
1508
1711
|
display: inline-grid;
|
|
1509
1712
|
place-items: center;
|
|
1510
1713
|
flex-shrink: 0;
|
|
@@ -1512,15 +1715,15 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1512
1715
|
transition: all var(--dur-fast) var(--ease);
|
|
1513
1716
|
}
|
|
1514
1717
|
.menu-check.on {
|
|
1515
|
-
background: var(--accent);
|
|
1516
|
-
box-shadow: var(--neu-shadow-control), 0 1px 4px var(--accent-glow);
|
|
1718
|
+
background: var(--lmn-select-accent, var(--accent));
|
|
1719
|
+
box-shadow: var(--lmn-select-neu-shadow-control, var(--neu-shadow-control)), 0 1px 4px var(--lmn-select-accent-glow, var(--accent-glow));
|
|
1517
1720
|
}
|
|
1518
1721
|
/* Menu search — flush with menu, single subtle separator (no nested frame) */
|
|
1519
1722
|
.menu-search {
|
|
1520
1723
|
display: block;
|
|
1521
1724
|
padding: 4px 2px 8px;
|
|
1522
1725
|
margin: -2px -2px 4px;
|
|
1523
|
-
border-bottom: 1px solid var(--divider);
|
|
1726
|
+
border-bottom: 1px solid var(--lmn-select-divider, var(--divider));
|
|
1524
1727
|
}
|
|
1525
1728
|
.menu-search .input-wrap { width: 100%; }
|
|
1526
1729
|
/* Menu state (loading / empty) */
|
|
@@ -1532,28 +1735,38 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1532
1735
|
gap: 10px;
|
|
1533
1736
|
padding: 26px 12px;
|
|
1534
1737
|
font-size: var(--fs-sm);
|
|
1535
|
-
color: var(--fg-muted);
|
|
1738
|
+
color: var(--lmn-select-fg-muted, var(--fg-muted));
|
|
1536
1739
|
}
|
|
1537
1740
|
.menu-state .menu-state-ico {
|
|
1538
1741
|
width: 40px;
|
|
1539
1742
|
height: 40px;
|
|
1540
1743
|
border-radius: var(--r-md);
|
|
1541
|
-
background: var(--bg);
|
|
1542
|
-
box-shadow: var(--neu-shadow-inset);
|
|
1744
|
+
background: var(--lmn-select-bg, var(--bg));
|
|
1745
|
+
box-shadow: var(--lmn-select-neu-shadow-inset, var(--neu-shadow-inset));
|
|
1543
1746
|
display: grid;
|
|
1544
1747
|
place-items: center;
|
|
1545
|
-
color: var(--fg-subtle);
|
|
1748
|
+
color: var(--lmn-select-fg-subtle, var(--fg-subtle));
|
|
1546
1749
|
}
|
|
1547
1750
|
.menu-state .menu-state-ico .spinner {
|
|
1548
1751
|
width: 16px;
|
|
1549
1752
|
height: 16px;
|
|
1550
1753
|
display: inline-block;
|
|
1551
1754
|
border-radius: 999px;
|
|
1552
|
-
border: 2px solid var(--accent);
|
|
1553
|
-
border-color: var(--accent);
|
|
1755
|
+
border: 2px solid var(--lmn-select-accent, var(--accent));
|
|
1756
|
+
border-color: var(--lmn-select-accent, var(--accent));
|
|
1554
1757
|
border-right-color: transparent;
|
|
1555
1758
|
animation: spin 0.8s linear infinite;
|
|
1556
1759
|
}
|
|
1760
|
+
.select-value-custom {
|
|
1761
|
+
overflow: hidden;
|
|
1762
|
+
}
|
|
1763
|
+
.select-value-custom > * {
|
|
1764
|
+
min-width: 0;
|
|
1765
|
+
max-width: 100%;
|
|
1766
|
+
}
|
|
1767
|
+
@media (prefers-reduced-motion: reduce) {
|
|
1768
|
+
.menu-state .menu-state-ico .spinner { animation: none; }
|
|
1769
|
+
}
|
|
1557
1770
|
/* Option body — supports description line under label */
|
|
1558
1771
|
.menu-item-body {
|
|
1559
1772
|
flex: 1;
|
|
@@ -1563,6 +1776,11 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1563
1776
|
min-width: 0;
|
|
1564
1777
|
text-align: left;
|
|
1565
1778
|
}
|
|
1779
|
+
.menu-item-custom {
|
|
1780
|
+
flex: 1;
|
|
1781
|
+
min-width: 0;
|
|
1782
|
+
text-align: left;
|
|
1783
|
+
}
|
|
1566
1784
|
.menu-item-label {
|
|
1567
1785
|
white-space: nowrap;
|
|
1568
1786
|
overflow: hidden;
|
|
@@ -1570,31 +1788,36 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1570
1788
|
}
|
|
1571
1789
|
.menu-item-desc {
|
|
1572
1790
|
font-size: var(--fs-xs);
|
|
1573
|
-
color: var(--fg-subtle);
|
|
1791
|
+
color: var(--lmn-select-fg-subtle, var(--fg-subtle));
|
|
1574
1792
|
white-space: nowrap;
|
|
1575
1793
|
overflow: hidden;
|
|
1576
1794
|
text-overflow: ellipsis;
|
|
1577
1795
|
}
|
|
1578
|
-
.menu-item.active .menu-item-desc { color: color-mix(in oklch, var(--accent-ink) 70%, var(--fg-subtle)); }
|
|
1796
|
+
.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
1797
|
/* Keyboard / hover highlight — soft raised pill */
|
|
1580
1798
|
.menu-item.highlight:not([disabled]) {
|
|
1581
|
-
background: var(--bg);
|
|
1582
|
-
box-shadow: var(--neu-shadow-control);
|
|
1583
|
-
color: var(--accent-ink);
|
|
1799
|
+
background: var(--lmn-select-bg, var(--bg));
|
|
1800
|
+
box-shadow: var(--lmn-select-neu-shadow-control, var(--neu-shadow-control));
|
|
1801
|
+
color: var(--lmn-select-accent-ink, var(--accent-ink));
|
|
1584
1802
|
}
|
|
1585
1803
|
.menu-item[disabled] {
|
|
1586
1804
|
opacity: 0.45;
|
|
1587
1805
|
cursor: not-allowed;
|
|
1588
1806
|
}
|
|
1589
1807
|
.menu {
|
|
1590
|
-
background: var(--bg);
|
|
1808
|
+
background: var(--lmn-select-bg, var(--bg));
|
|
1591
1809
|
border-radius: var(--r-md);
|
|
1592
|
-
box-shadow: var(--neu-shadow-float);
|
|
1810
|
+
box-shadow: var(--lmn-select-neu-shadow-float, var(--neu-shadow-float));
|
|
1593
1811
|
padding: 6px;
|
|
1594
1812
|
min-width: 180px;
|
|
1813
|
+
max-width: calc(100vw - 16px);
|
|
1595
1814
|
z-index: 1000;
|
|
1596
1815
|
animation: menuIn var(--dur) var(--ease);
|
|
1597
|
-
|
|
1816
|
+
overflow: hidden;
|
|
1817
|
+
}
|
|
1818
|
+
.menu-options {
|
|
1819
|
+
display: flex;
|
|
1820
|
+
flex-direction: column;
|
|
1598
1821
|
overflow-y: auto;
|
|
1599
1822
|
}
|
|
1600
1823
|
.menu-item {
|
|
@@ -1602,7 +1825,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1602
1825
|
border-radius: var(--r-sm);
|
|
1603
1826
|
font-size: var(--fs-md);
|
|
1604
1827
|
cursor: pointer;
|
|
1605
|
-
color: var(--fg);
|
|
1828
|
+
color: var(--lmn-select-fg, var(--fg));
|
|
1606
1829
|
display: flex;
|
|
1607
1830
|
align-items: center;
|
|
1608
1831
|
gap: 10px;
|
|
@@ -1613,20 +1836,83 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1613
1836
|
width: 100%;
|
|
1614
1837
|
text-align: left;
|
|
1615
1838
|
}
|
|
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; }
|
|
1839
|
+
.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)); }
|
|
1840
|
+
.menu-item.active { color: var(--lmn-select-accent-ink, var(--accent-ink)); font-weight: 500; }
|
|
1841
|
+
.menu-item .tick { margin-left: auto; color: var(--lmn-select-accent, var(--accent)); opacity: 0; }
|
|
1619
1842
|
.menu-item.active .tick { opacity: 1; }
|
|
1620
|
-
.menu-item.danger { color: var(--danger); }
|
|
1621
|
-
.menu-separator { height: 1px; background: var(--divider); margin: 6px 4px; }
|
|
1843
|
+
.menu-item.danger { color: var(--lmn-select-danger, var(--danger)); }
|
|
1844
|
+
.menu-separator { height: 1px; background: var(--lmn-select-divider, var(--divider)); margin: 6px 4px; }
|
|
1622
1845
|
.menu-group-label {
|
|
1623
1846
|
font-size: 10px;
|
|
1624
1847
|
font-weight: 600;
|
|
1625
1848
|
text-transform: uppercase;
|
|
1626
1849
|
letter-spacing: 0.08em;
|
|
1627
|
-
color: var(--fg-subtle);
|
|
1850
|
+
color: var(--lmn-select-fg-subtle, var(--fg-subtle));
|
|
1628
1851
|
padding: 8px 12px 4px;
|
|
1629
1852
|
}
|
|
1853
|
+
/* ============ Form ============ */
|
|
1854
|
+
.lumina-form { display: flex; flex-direction: column; gap: 18px; }
|
|
1855
|
+
.lumina-form.layout-inline {
|
|
1856
|
+
flex-direction: row;
|
|
1857
|
+
flex-wrap: wrap;
|
|
1858
|
+
align-items: flex-start;
|
|
1859
|
+
gap: 12px;
|
|
1860
|
+
}
|
|
1861
|
+
.lumina-form.layout-inline .form-item { flex: 0 0 auto; }
|
|
1862
|
+
.form-item {
|
|
1863
|
+
display: flex;
|
|
1864
|
+
flex-direction: column;
|
|
1865
|
+
gap: 6px;
|
|
1866
|
+
min-width: 0;
|
|
1867
|
+
}
|
|
1868
|
+
.lumina-form.layout-horizontal .form-item {
|
|
1869
|
+
flex-direction: row;
|
|
1870
|
+
align-items: flex-start;
|
|
1871
|
+
gap: 12px;
|
|
1872
|
+
}
|
|
1873
|
+
.lumina-form.layout-horizontal .form-item-label {
|
|
1874
|
+
flex: 0 0 auto;
|
|
1875
|
+
min-width: 96px;
|
|
1876
|
+
padding-top: 10px;
|
|
1877
|
+
text-align: right;
|
|
1878
|
+
}
|
|
1879
|
+
.lumina-form.layout-horizontal .form-item-control { flex: 1; min-width: 0; }
|
|
1880
|
+
.form-item-label {
|
|
1881
|
+
font-size: 13px;
|
|
1882
|
+
font-weight: 500;
|
|
1883
|
+
color: var(--lmn-form-fg, var(--fg));
|
|
1884
|
+
padding-left: 2px;
|
|
1885
|
+
display: inline-flex;
|
|
1886
|
+
align-items: center;
|
|
1887
|
+
gap: 4px;
|
|
1888
|
+
}
|
|
1889
|
+
.form-item-required {
|
|
1890
|
+
color: var(--lmn-form-danger, var(--danger));
|
|
1891
|
+
font-weight: 600;
|
|
1892
|
+
margin-right: 2px;
|
|
1893
|
+
}
|
|
1894
|
+
.form-item-control { min-width: 0; }
|
|
1895
|
+
.form-item-error {
|
|
1896
|
+
font-size: 12px;
|
|
1897
|
+
color: var(--lmn-form-danger, var(--danger));
|
|
1898
|
+
padding-left: 2px;
|
|
1899
|
+
animation: fadeIn var(--dur-fast) var(--ease);
|
|
1900
|
+
}
|
|
1901
|
+
.form-item-help {
|
|
1902
|
+
font-size: 12px;
|
|
1903
|
+
color: var(--lmn-form-fg-subtle, var(--fg-subtle));
|
|
1904
|
+
padding-left: 2px;
|
|
1905
|
+
}
|
|
1906
|
+
.form-item-extra {
|
|
1907
|
+
font-size: 11.5px;
|
|
1908
|
+
color: var(--lmn-form-fg-subtle, var(--fg-subtle));
|
|
1909
|
+
padding-left: 2px;
|
|
1910
|
+
opacity: 0.85;
|
|
1911
|
+
}
|
|
1912
|
+
.form-item.has-error .input-wrap,
|
|
1913
|
+
.form-item.has-error .select-trigger {
|
|
1914
|
+
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);
|
|
1915
|
+
}
|
|
1630
1916
|
/* ============ Modal ============ */
|
|
1631
1917
|
.modal-overlay {
|
|
1632
1918
|
position: fixed;
|
|
@@ -1642,15 +1928,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1642
1928
|
display: none;
|
|
1643
1929
|
}
|
|
1644
1930
|
.modal {
|
|
1645
|
-
background: var(--bg);
|
|
1931
|
+
background: var(--lmn-modal-bg, var(--bg));
|
|
1646
1932
|
border-radius: var(--r-xl);
|
|
1647
|
-
box-shadow: var(--neu-shadow-float);
|
|
1933
|
+
box-shadow: var(--lmn-modal-neu-shadow-float, var(--neu-shadow-float));
|
|
1648
1934
|
padding: var(--gap-6);
|
|
1649
1935
|
width: min(480px, 92vw);
|
|
1650
1936
|
animation: modalIn var(--dur-slow) var(--ease);
|
|
1651
1937
|
max-height: 86vh;
|
|
1652
1938
|
display: flex;
|
|
1653
1939
|
flex-direction: column;
|
|
1940
|
+
--overlay-shadow-safe-area: calc(var(--lmn-modal-shadow-offset, var(--shadow-offset)) + var(--lmn-modal-shadow-blur, var(--shadow-blur)));
|
|
1654
1941
|
}
|
|
1655
1942
|
@keyframes modalIn {
|
|
1656
1943
|
from { opacity: 0; transform: translateY(8px) scale(0.97); }
|
|
@@ -1660,7 +1947,6 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1660
1947
|
align-items: flex-start;
|
|
1661
1948
|
justify-content: space-between;
|
|
1662
1949
|
gap: var(--gap-3);
|
|
1663
|
-
margin-bottom: var(--gap-3);
|
|
1664
1950
|
}
|
|
1665
1951
|
.modal-titles {
|
|
1666
1952
|
display: flex;
|
|
@@ -1668,20 +1954,31 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1668
1954
|
gap: 4px;
|
|
1669
1955
|
}
|
|
1670
1956
|
.modal-title { font-size: 17px; font-weight: 600; }
|
|
1671
|
-
.modal-desc { font-size: 13px; color: var(--fg-muted); }
|
|
1957
|
+
.modal-desc { font-size: 13px; color: var(--lmn-modal-fg-muted, var(--fg-muted)); }
|
|
1672
1958
|
.modal-body {
|
|
1673
|
-
|
|
1674
|
-
|
|
1959
|
+
min-width: 0;
|
|
1960
|
+
min-height: 0;
|
|
1961
|
+
margin-inline: calc(var(--gap-6) * -1);
|
|
1962
|
+
padding: var(--overlay-shadow-safe-area);
|
|
1963
|
+
color: var(--lmn-modal-fg-muted, var(--fg-muted));
|
|
1675
1964
|
font-size: 13px;
|
|
1676
1965
|
line-height: 1.6;
|
|
1677
1966
|
flex: 1;
|
|
1678
1967
|
overflow-y: auto;
|
|
1679
1968
|
}
|
|
1969
|
+
.modal-body:first-child {
|
|
1970
|
+
margin-top: calc(var(--gap-6) * -1);
|
|
1971
|
+
}
|
|
1972
|
+
.modal-body:last-child {
|
|
1973
|
+
margin-bottom: calc(var(--gap-6) * -1);
|
|
1974
|
+
}
|
|
1975
|
+
.modal-body.inset-none {
|
|
1976
|
+
padding: 0;
|
|
1977
|
+
}
|
|
1680
1978
|
.modal-foot {
|
|
1681
1979
|
display: flex;
|
|
1682
1980
|
gap: 10px;
|
|
1683
1981
|
justify-content: flex-end;
|
|
1684
|
-
margin-top: var(--gap-4);
|
|
1685
1982
|
}
|
|
1686
1983
|
.modal-close {
|
|
1687
1984
|
width: 28px; height: 28px;
|
|
@@ -1690,14 +1987,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1690
1987
|
border-radius: var(--r-sm);
|
|
1691
1988
|
display: grid;
|
|
1692
1989
|
place-items: center;
|
|
1693
|
-
color: var(--fg-subtle);
|
|
1990
|
+
color: var(--lmn-modal-fg-subtle, var(--fg-subtle));
|
|
1694
1991
|
cursor: pointer;
|
|
1695
1992
|
transition: all var(--dur-fast) var(--ease);
|
|
1696
1993
|
}
|
|
1697
1994
|
.modal-close:hover {
|
|
1698
|
-
color: var(--fg);
|
|
1699
|
-
background: var(--bg);
|
|
1700
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
1995
|
+
color: var(--lmn-modal-fg, var(--fg));
|
|
1996
|
+
background: var(--lmn-modal-bg, var(--bg));
|
|
1997
|
+
box-shadow: var(--lmn-modal-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
1701
1998
|
}
|
|
1702
1999
|
.modal-static-body {
|
|
1703
2000
|
display: flex;
|
|
@@ -1711,16 +2008,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1711
2008
|
display: inline-grid;
|
|
1712
2009
|
place-items: center;
|
|
1713
2010
|
flex-shrink: 0;
|
|
1714
|
-
background: var(--bg);
|
|
1715
|
-
box-shadow: var(--neu-shadow-inset);
|
|
1716
|
-
color: var(--accent);
|
|
2011
|
+
background: var(--lmn-modal-bg, var(--bg));
|
|
2012
|
+
box-shadow: var(--lmn-modal-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2013
|
+
color: var(--lmn-modal-accent, var(--accent));
|
|
1717
2014
|
}
|
|
1718
|
-
.modal-static-icon.success { color: var(--success); }
|
|
1719
|
-
.modal-static-icon.warning { color: var(--warning); }
|
|
1720
|
-
.modal-static-icon.error { color: var(--danger); }
|
|
2015
|
+
.modal-static-icon.success { color: var(--lmn-modal-success, var(--success)); }
|
|
2016
|
+
.modal-static-icon.warning { color: var(--lmn-modal-warning, var(--warning)); }
|
|
2017
|
+
.modal-static-icon.error { color: var(--lmn-modal-danger, var(--danger)); }
|
|
1721
2018
|
.modal-static-content {
|
|
1722
2019
|
min-width: 0;
|
|
1723
|
-
color: var(--fg-muted);
|
|
2020
|
+
color: var(--lmn-modal-fg-muted, var(--fg-muted));
|
|
1724
2021
|
}
|
|
1725
2022
|
/* ============ Drawer ============ */
|
|
1726
2023
|
.drawer-overlay {
|
|
@@ -1736,15 +2033,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1736
2033
|
}
|
|
1737
2034
|
.drawer {
|
|
1738
2035
|
position: fixed;
|
|
1739
|
-
background: var(--bg);
|
|
2036
|
+
background: var(--lmn-drawer-bg, var(--bg));
|
|
1740
2037
|
padding: var(--gap-5);
|
|
1741
2038
|
z-index: 151;
|
|
1742
|
-
overflow
|
|
2039
|
+
overflow: hidden;
|
|
1743
2040
|
display: flex;
|
|
1744
2041
|
flex-direction: column;
|
|
1745
|
-
--
|
|
1746
|
-
--drawer-shadow-
|
|
1747
|
-
--drawer-shadow-
|
|
2042
|
+
--overlay-shadow-safe-area: calc(var(--lmn-drawer-shadow-offset, var(--shadow-offset)) + var(--lmn-drawer-shadow-blur, var(--shadow-blur)));
|
|
2043
|
+
--drawer-shadow-offset: calc(var(--lmn-drawer-shadow-offset, var(--shadow-offset)) * 4 * var(--shadow-float-scale));
|
|
2044
|
+
--drawer-shadow-blur: calc(var(--lmn-drawer-shadow-blur, var(--shadow-blur)) * 3.75 * var(--shadow-float-scale));
|
|
2045
|
+
--drawer-shadow-spread: calc(var(--lmn-drawer-shadow-offset, var(--shadow-offset)) * -3.3 * var(--shadow-float-scale));
|
|
1748
2046
|
}
|
|
1749
2047
|
.drawer.hidden {
|
|
1750
2048
|
display: none;
|
|
@@ -1753,25 +2051,25 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1753
2051
|
top: 0; right: 0; bottom: 0;
|
|
1754
2052
|
width: min(420px, 92vw);
|
|
1755
2053
|
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);
|
|
2054
|
+
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
2055
|
}
|
|
1758
2056
|
.drawer.left {
|
|
1759
2057
|
top: 0; left: 0; bottom: 0;
|
|
1760
2058
|
width: min(420px, 92vw);
|
|
1761
2059
|
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);
|
|
2060
|
+
box-shadow: var(--drawer-shadow-offset) 0 var(--drawer-shadow-blur) var(--drawer-shadow-spread) var(--lmn-drawer-shadow-dark, var(--shadow-dark));
|
|
1763
2061
|
}
|
|
1764
2062
|
.drawer.top {
|
|
1765
2063
|
top: 0; left: 0; right: 0;
|
|
1766
2064
|
height: min(320px, 80vh);
|
|
1767
2065
|
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);
|
|
2066
|
+
box-shadow: 0 var(--drawer-shadow-offset) var(--drawer-shadow-blur) var(--drawer-shadow-spread) var(--lmn-drawer-shadow-dark, var(--shadow-dark));
|
|
1769
2067
|
}
|
|
1770
2068
|
.drawer.bottom {
|
|
1771
2069
|
bottom: 0; left: 0; right: 0;
|
|
1772
2070
|
height: min(320px, 80vh);
|
|
1773
2071
|
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);
|
|
2072
|
+
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
2073
|
}
|
|
1776
2074
|
@keyframes drawerInRight { from { transform: translateX( 20px); opacity: 0; } }
|
|
1777
2075
|
@keyframes drawerInLeft { from { transform: translateX(-20px); opacity: 0; } }
|
|
@@ -1782,9 +2080,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1782
2080
|
align-items: center;
|
|
1783
2081
|
justify-content: space-between;
|
|
1784
2082
|
gap: var(--gap-3);
|
|
1785
|
-
margin-bottom: var(--gap-4);
|
|
1786
2083
|
padding-bottom: var(--gap-4);
|
|
1787
|
-
border-bottom: 1px solid var(--divider);
|
|
2084
|
+
border-bottom: 1px solid var(--lmn-drawer-divider, var(--divider));
|
|
1788
2085
|
}
|
|
1789
2086
|
.drawer-head-right {
|
|
1790
2087
|
display: inline-flex;
|
|
@@ -1802,25 +2099,38 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1802
2099
|
border-radius: var(--r-sm);
|
|
1803
2100
|
display: grid;
|
|
1804
2101
|
place-items: center;
|
|
1805
|
-
color: var(--fg-subtle);
|
|
2102
|
+
color: var(--lmn-drawer-fg-subtle, var(--fg-subtle));
|
|
1806
2103
|
cursor: pointer;
|
|
1807
2104
|
transition: all var(--dur-fast) var(--ease);
|
|
1808
2105
|
}
|
|
1809
2106
|
.drawer-close:hover {
|
|
1810
|
-
color: var(--fg);
|
|
1811
|
-
background: var(--bg);
|
|
1812
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
2107
|
+
color: var(--lmn-drawer-fg, var(--fg));
|
|
2108
|
+
background: var(--lmn-drawer-bg, var(--bg));
|
|
2109
|
+
box-shadow: var(--lmn-drawer-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
1813
2110
|
}
|
|
1814
2111
|
.drawer-body {
|
|
1815
2112
|
flex: 1;
|
|
2113
|
+
min-width: 0;
|
|
2114
|
+
min-height: 0;
|
|
2115
|
+
margin-inline: calc(var(--gap-5) * -1);
|
|
2116
|
+
padding: var(--overlay-shadow-safe-area);
|
|
2117
|
+
overflow: auto;
|
|
2118
|
+
}
|
|
2119
|
+
.drawer-body:first-child {
|
|
2120
|
+
margin-top: calc(var(--gap-5) * -1);
|
|
2121
|
+
}
|
|
2122
|
+
.drawer-body:last-child {
|
|
2123
|
+
margin-bottom: calc(var(--gap-5) * -1);
|
|
2124
|
+
}
|
|
2125
|
+
.drawer-body.inset-none {
|
|
2126
|
+
padding: 0;
|
|
1816
2127
|
}
|
|
1817
2128
|
.drawer-foot {
|
|
1818
2129
|
display: flex;
|
|
1819
2130
|
gap: 10px;
|
|
1820
2131
|
justify-content: flex-end;
|
|
1821
|
-
margin-top: var(--gap-4);
|
|
1822
2132
|
padding-top: var(--gap-4);
|
|
1823
|
-
border-top: 1px solid var(--divider);
|
|
2133
|
+
border-top: 1px solid var(--lmn-drawer-divider, var(--divider));
|
|
1824
2134
|
}
|
|
1825
2135
|
/* ============ Tooltip ============ */
|
|
1826
2136
|
.tip-anchor {
|
|
@@ -1831,14 +2141,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1831
2141
|
.tip {
|
|
1832
2142
|
display: block;
|
|
1833
2143
|
box-sizing: border-box;
|
|
1834
|
-
background: var(--bg-sunken);
|
|
1835
|
-
color: var(--fg);
|
|
2144
|
+
background: var(--lmn-tooltip-bg-sunken, var(--bg-sunken));
|
|
2145
|
+
color: var(--lmn-tooltip-fg, var(--fg));
|
|
1836
2146
|
padding: 6px 10px;
|
|
1837
2147
|
border-radius: var(--r-sm);
|
|
1838
2148
|
font-size: 11px;
|
|
1839
2149
|
font-weight: 500;
|
|
1840
2150
|
white-space: nowrap;
|
|
1841
|
-
box-shadow: var(--neu-shadow-control);
|
|
2151
|
+
box-shadow: var(--lmn-tooltip-neu-shadow-control, var(--neu-shadow-control));
|
|
1842
2152
|
pointer-events: auto;
|
|
1843
2153
|
animation: fadeIn var(--dur) var(--ease);
|
|
1844
2154
|
z-index: 1000;
|
|
@@ -1858,50 +2168,49 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1858
2168
|
.message-container.bottom-left { bottom: 20px; left: 20px; }
|
|
1859
2169
|
.message-container.top-center { top: 56px; left: 50%; transform: translateX(-50%); align-items: center; }
|
|
1860
2170
|
.message {
|
|
1861
|
-
background: var(--bg);
|
|
2171
|
+
background: var(--lmn-message-bg, var(--bg));
|
|
1862
2172
|
border-radius: var(--r-md);
|
|
1863
|
-
box-shadow: var(--neu-shadow-float);
|
|
2173
|
+
box-shadow: var(--lmn-message-neu-shadow-float, var(--neu-shadow-float));
|
|
1864
2174
|
padding: 12px 16px;
|
|
1865
2175
|
min-width: 240px;
|
|
1866
2176
|
display: flex; align-items: center; gap: 10px;
|
|
1867
2177
|
font-size: 13px;
|
|
1868
2178
|
pointer-events: auto;
|
|
1869
2179
|
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); }
|
|
2180
|
+
border-left: 3px solid var(--lmn-message-accent, var(--accent));
|
|
2181
|
+
}
|
|
2182
|
+
.message.success { border-color: var(--lmn-message-success, var(--success)); }
|
|
2183
|
+
.message.warning { border-color: var(--lmn-message-warning, var(--warning)); }
|
|
2184
|
+
.message.error { border-color: var(--lmn-message-danger, var(--danger)); }
|
|
2185
|
+
.message .message-icon { color: var(--lmn-message-accent, var(--accent)); flex-shrink: 0; }
|
|
2186
|
+
.message.success .message-icon { color: var(--lmn-message-success, var(--success)); }
|
|
2187
|
+
.message.warning .message-icon { color: var(--lmn-message-warning, var(--warning)); }
|
|
2188
|
+
.message.error .message-icon { color: var(--lmn-message-danger, var(--danger)); }
|
|
1879
2189
|
.message-body { flex: 1; min-width: 0; }
|
|
1880
2190
|
.message-title { font-weight: 600; margin-bottom: 2px; }
|
|
1881
|
-
.message-content { color: var(--fg-muted); font-size: 12px; }
|
|
2191
|
+
.message-content { color: var(--lmn-message-fg-muted, var(--fg-muted)); font-size: 12px; }
|
|
1882
2192
|
.message-close {
|
|
1883
2193
|
background: transparent; border: none;
|
|
1884
|
-
color: var(--fg-subtle); cursor: pointer;
|
|
2194
|
+
color: var(--lmn-message-fg-subtle, var(--fg-subtle)); cursor: pointer;
|
|
1885
2195
|
padding: 0 2px; font-family: inherit;
|
|
1886
2196
|
}
|
|
1887
|
-
.message-close:hover { color: var(--fg); }
|
|
2197
|
+
.message-close:hover { color: var(--lmn-message-fg, var(--fg)); }
|
|
1888
2198
|
.message.leaving { animation: messageOut var(--dur) var(--ease) forwards; }
|
|
1889
2199
|
@keyframes messageIn { from { opacity: 0; transform: translateX(20px); } }
|
|
1890
2200
|
@keyframes messageOut { to { opacity: 0; transform: translateX(20px); } }
|
|
1891
2201
|
/* ============ Popover ============ */
|
|
1892
2202
|
.popover {
|
|
1893
2203
|
z-index: 1000;
|
|
1894
|
-
background: var(--bg);
|
|
2204
|
+
background: var(--lmn-popover-bg, var(--bg));
|
|
1895
2205
|
border-radius: var(--r-md);
|
|
1896
2206
|
min-width: 220px;
|
|
1897
|
-
box-shadow: var(--neu-shadow-float);
|
|
2207
|
+
box-shadow: var(--lmn-popover-neu-shadow-float, var(--neu-shadow-float));
|
|
1898
2208
|
position: relative;
|
|
1899
2209
|
}
|
|
1900
2210
|
/*
|
|
1901
2211
|
* Direction-aware entrance.
|
|
1902
|
-
* We animate `opacity` + `translate`
|
|
1903
|
-
*
|
|
1904
|
-
* applies for cross-axis centering.
|
|
2212
|
+
* We animate `opacity` + `translate` so positioning stays independent from
|
|
2213
|
+
* the coordinates calculated by useFloating.
|
|
1905
2214
|
*/
|
|
1906
2215
|
.popover-bottom { animation: popoverInDown var(--dur) var(--ease); }
|
|
1907
2216
|
.popover-top { animation: popoverInUp var(--dur) var(--ease); }
|
|
@@ -1922,13 +2231,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1922
2231
|
.popover-title {
|
|
1923
2232
|
font-weight: 600;
|
|
1924
2233
|
font-size: 14px;
|
|
1925
|
-
color: var(--fg);
|
|
2234
|
+
color: var(--lmn-popover-fg, var(--fg));
|
|
1926
2235
|
}
|
|
1927
2236
|
.popover-close {
|
|
1928
2237
|
all: unset;
|
|
1929
2238
|
cursor: pointer;
|
|
1930
2239
|
font-size: 16px;
|
|
1931
|
-
color: var(--fg-muted);
|
|
2240
|
+
color: var(--lmn-popover-fg-muted, var(--fg-muted));
|
|
1932
2241
|
line-height: 1;
|
|
1933
2242
|
padding: 2px 4px;
|
|
1934
2243
|
border-radius: var(--r-xs);
|
|
@@ -1936,7 +2245,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1936
2245
|
margin-left: auto;
|
|
1937
2246
|
}
|
|
1938
2247
|
.popover-close:hover {
|
|
1939
|
-
color: var(--fg);
|
|
2248
|
+
color: var(--lmn-popover-fg, var(--fg));
|
|
1940
2249
|
}
|
|
1941
2250
|
/* ---- Body ---- */
|
|
1942
2251
|
.popover-body {
|
|
@@ -1950,8 +2259,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1950
2259
|
position: absolute;
|
|
1951
2260
|
width: 10px;
|
|
1952
2261
|
height: 10px;
|
|
1953
|
-
background: var(--bg);
|
|
1954
|
-
box-shadow: 2px 2px 4px
|
|
2262
|
+
background: var(--lmn-popover-bg, var(--bg));
|
|
2263
|
+
box-shadow: 2px 2px 4px color-mix(in oklch, var(--lmn-popover-shadow-dark, var(--shadow-dark)) 36%, transparent);
|
|
1955
2264
|
transform: rotate(45deg);
|
|
1956
2265
|
pointer-events: none;
|
|
1957
2266
|
}
|
|
@@ -1959,40 +2268,238 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
1959
2268
|
top: -5px;
|
|
1960
2269
|
left: 50%;
|
|
1961
2270
|
margin-left: -5px;
|
|
1962
|
-
box-shadow: -2px -2px 4px
|
|
2271
|
+
box-shadow: -2px -2px 4px color-mix(in oklch, var(--lmn-popover-shadow-dark, var(--shadow-dark)) 36%, transparent);
|
|
1963
2272
|
}
|
|
1964
2273
|
.popover-arrow-top {
|
|
1965
2274
|
bottom: -5px;
|
|
1966
2275
|
left: 50%;
|
|
1967
2276
|
margin-left: -5px;
|
|
1968
|
-
box-shadow: 2px 2px 4px
|
|
2277
|
+
box-shadow: 2px 2px 4px color-mix(in oklch, var(--lmn-popover-shadow-dark, var(--shadow-dark)) 36%, transparent);
|
|
1969
2278
|
}
|
|
1970
2279
|
.popover-arrow-left {
|
|
1971
2280
|
right: -5px;
|
|
1972
2281
|
top: 50%;
|
|
1973
2282
|
margin-top: -5px;
|
|
1974
|
-
box-shadow: 2px -2px 4px
|
|
2283
|
+
box-shadow: 2px -2px 4px color-mix(in oklch, var(--lmn-popover-shadow-dark, var(--shadow-dark)) 36%, transparent);
|
|
1975
2284
|
}
|
|
1976
2285
|
.popover-arrow-right {
|
|
1977
2286
|
left: -5px;
|
|
1978
2287
|
top: 50%;
|
|
1979
2288
|
margin-top: -5px;
|
|
1980
|
-
box-shadow: -2px 2px 4px
|
|
2289
|
+
box-shadow: -2px 2px 4px color-mix(in oklch, var(--lmn-popover-shadow-dark, var(--shadow-dark)) 36%, transparent);
|
|
1981
2290
|
}
|
|
1982
|
-
/* ============
|
|
1983
|
-
.
|
|
1984
|
-
|
|
1985
|
-
|
|
1986
|
-
|
|
1987
|
-
padding: 14px 16px;
|
|
2291
|
+
/* ============ ContextMenu ============ */
|
|
2292
|
+
.context-menu {
|
|
2293
|
+
z-index: 5000;
|
|
2294
|
+
padding: 6px;
|
|
2295
|
+
background: var(--lmn-context-menu-bg, var(--bg));
|
|
1988
2296
|
border-radius: var(--r-md);
|
|
1989
|
-
|
|
1990
|
-
|
|
1991
|
-
|
|
2297
|
+
box-shadow: var(--lmn-context-menu-neu-shadow-float, var(--neu-shadow-float));
|
|
2298
|
+
border: 1px solid var(--lmn-context-menu-divider, var(--divider));
|
|
2299
|
+
display: flex;
|
|
2300
|
+
flex-direction: column;
|
|
2301
|
+
gap: 1px;
|
|
2302
|
+
animation: menuIn var(--dur-fast) var(--ease);
|
|
2303
|
+
max-height: calc(100vh - 24px);
|
|
2304
|
+
overflow-y: auto;
|
|
1992
2305
|
}
|
|
1993
|
-
.
|
|
1994
|
-
|
|
1995
|
-
|
|
2306
|
+
.context-menu-item {
|
|
2307
|
+
display: grid;
|
|
2308
|
+
grid-template-columns: 18px 1fr auto;
|
|
2309
|
+
align-items: center;
|
|
2310
|
+
gap: 8px;
|
|
2311
|
+
padding: 6px 10px;
|
|
2312
|
+
min-height: 28px;
|
|
2313
|
+
border: none;
|
|
2314
|
+
background: transparent;
|
|
2315
|
+
box-shadow: none;
|
|
2316
|
+
font: inherit;
|
|
2317
|
+
font-size: 13px;
|
|
2318
|
+
color: var(--lmn-context-menu-fg, var(--fg));
|
|
2319
|
+
text-align: left;
|
|
2320
|
+
border-radius: var(--r-sm);
|
|
2321
|
+
cursor: pointer;
|
|
2322
|
+
transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease),
|
|
2323
|
+
box-shadow var(--dur-fast) var(--ease);
|
|
2324
|
+
}
|
|
2325
|
+
.context-menu-item:disabled { color: var(--lmn-context-menu-fg-subtle, var(--fg-subtle)); cursor: not-allowed; }
|
|
2326
|
+
.context-menu-item.active:not(:disabled) {
|
|
2327
|
+
background: var(--lmn-context-menu-bg, var(--bg));
|
|
2328
|
+
color: var(--lmn-context-menu-accent-ink, var(--accent-ink));
|
|
2329
|
+
box-shadow: var(--lmn-context-menu-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2330
|
+
}
|
|
2331
|
+
.context-menu-item.danger { color: var(--lmn-context-menu-danger, var(--danger)); }
|
|
2332
|
+
.context-menu-item.danger.active:not(:disabled) {
|
|
2333
|
+
background: var(--lmn-context-menu-bg, var(--bg));
|
|
2334
|
+
color: var(--lmn-context-menu-danger, var(--danger));
|
|
2335
|
+
box-shadow: var(--lmn-context-menu-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2336
|
+
}
|
|
2337
|
+
.context-menu-icon {
|
|
2338
|
+
display: inline-flex;
|
|
2339
|
+
justify-content: center;
|
|
2340
|
+
align-items: center;
|
|
2341
|
+
color: var(--lmn-context-menu-fg-muted, var(--fg-muted));
|
|
2342
|
+
}
|
|
2343
|
+
.context-menu-item.active:not(:disabled) .context-menu-icon { color: inherit; }
|
|
2344
|
+
.context-menu-item.danger .context-menu-icon { color: var(--lmn-context-menu-danger, var(--danger)); }
|
|
2345
|
+
.context-menu-label {
|
|
2346
|
+
overflow: hidden;
|
|
2347
|
+
text-overflow: ellipsis;
|
|
2348
|
+
white-space: nowrap;
|
|
2349
|
+
}
|
|
2350
|
+
.context-menu-shortcut {
|
|
2351
|
+
font-family: var(--font-mono);
|
|
2352
|
+
font-size: 11px;
|
|
2353
|
+
color: var(--lmn-context-menu-fg-subtle, var(--fg-subtle));
|
|
2354
|
+
padding-left: 12px;
|
|
2355
|
+
}
|
|
2356
|
+
.context-menu-item.active:not(:disabled) .context-menu-shortcut { color: inherit; opacity: 0.8; }
|
|
2357
|
+
.context-menu-divider {
|
|
2358
|
+
height: 1px;
|
|
2359
|
+
background: var(--lmn-context-menu-divider, var(--divider));
|
|
2360
|
+
margin: 4px 4px;
|
|
2361
|
+
}
|
|
2362
|
+
/* ============ CommandPalette ============ */
|
|
2363
|
+
.cmdp-overlay {
|
|
2364
|
+
position: fixed;
|
|
2365
|
+
inset: 0;
|
|
2366
|
+
z-index: 4000;
|
|
2367
|
+
background: var(--mask-bg);
|
|
2368
|
+
display: flex;
|
|
2369
|
+
justify-content: center;
|
|
2370
|
+
align-items: flex-start;
|
|
2371
|
+
padding-top: 14vh;
|
|
2372
|
+
animation: fadeIn var(--dur-fast) var(--ease);
|
|
2373
|
+
}
|
|
2374
|
+
.cmdp-panel {
|
|
2375
|
+
width: min(560px, calc(100vw - 48px));
|
|
2376
|
+
max-height: 60vh;
|
|
2377
|
+
background: var(--lmn-command-palette-bg, var(--bg));
|
|
2378
|
+
border-radius: var(--r-lg);
|
|
2379
|
+
box-shadow: var(--lmn-command-palette-neu-shadow-float, var(--neu-shadow-float));
|
|
2380
|
+
border: 1px solid var(--lmn-command-palette-divider, var(--divider));
|
|
2381
|
+
display: flex;
|
|
2382
|
+
flex-direction: column;
|
|
2383
|
+
overflow: hidden;
|
|
2384
|
+
animation: cmdpIn var(--dur) var(--ease);
|
|
2385
|
+
}
|
|
2386
|
+
@keyframes cmdpIn {
|
|
2387
|
+
from { opacity: 0; transform: translateY(-12px) scale(0.98); }
|
|
2388
|
+
to { opacity: 1; transform: translateY(0) scale(1); }
|
|
2389
|
+
}
|
|
2390
|
+
.cmdp-search {
|
|
2391
|
+
padding: 12px 12px 10px;
|
|
2392
|
+
}
|
|
2393
|
+
.cmdp-list {
|
|
2394
|
+
overflow-y: auto;
|
|
2395
|
+
padding: 6px;
|
|
2396
|
+
flex: 1;
|
|
2397
|
+
min-height: 60px;
|
|
2398
|
+
}
|
|
2399
|
+
.cmdp-group + .cmdp-group { margin-top: 4px; }
|
|
2400
|
+
.cmdp-group-head {
|
|
2401
|
+
font-size: 11px;
|
|
2402
|
+
text-transform: uppercase;
|
|
2403
|
+
letter-spacing: 0.06em;
|
|
2404
|
+
color: var(--lmn-command-palette-fg-subtle, var(--fg-subtle));
|
|
2405
|
+
padding: 8px 10px 4px;
|
|
2406
|
+
font-weight: 600;
|
|
2407
|
+
}
|
|
2408
|
+
.cmdp-item {
|
|
2409
|
+
display: grid;
|
|
2410
|
+
grid-template-columns: 20px 1fr auto;
|
|
2411
|
+
align-items: center;
|
|
2412
|
+
gap: 10px;
|
|
2413
|
+
width: 100%;
|
|
2414
|
+
padding: 9px 10px;
|
|
2415
|
+
border: none;
|
|
2416
|
+
background: transparent;
|
|
2417
|
+
box-shadow: none;
|
|
2418
|
+
color: var(--lmn-command-palette-fg, var(--fg));
|
|
2419
|
+
font: inherit;
|
|
2420
|
+
font-size: 13px;
|
|
2421
|
+
text-align: left;
|
|
2422
|
+
border-radius: var(--r-sm);
|
|
2423
|
+
cursor: pointer;
|
|
2424
|
+
transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease),
|
|
2425
|
+
box-shadow var(--dur-fast) var(--ease);
|
|
2426
|
+
}
|
|
2427
|
+
.cmdp-item:disabled { color: var(--lmn-command-palette-fg-subtle, var(--fg-subtle)); cursor: not-allowed; }
|
|
2428
|
+
.cmdp-item.active:not(:disabled) {
|
|
2429
|
+
background: var(--lmn-command-palette-bg, var(--bg));
|
|
2430
|
+
color: var(--lmn-command-palette-accent-ink, var(--accent-ink));
|
|
2431
|
+
box-shadow: var(--lmn-command-palette-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2432
|
+
}
|
|
2433
|
+
.cmdp-icon {
|
|
2434
|
+
display: inline-flex;
|
|
2435
|
+
align-items: center;
|
|
2436
|
+
justify-content: center;
|
|
2437
|
+
color: var(--lmn-command-palette-fg-muted, var(--fg-muted));
|
|
2438
|
+
}
|
|
2439
|
+
.cmdp-item.active:not(:disabled) .cmdp-icon { color: inherit; }
|
|
2440
|
+
.cmdp-labels { display: flex; flex-direction: column; min-width: 0; }
|
|
2441
|
+
.cmdp-label {
|
|
2442
|
+
overflow: hidden;
|
|
2443
|
+
text-overflow: ellipsis;
|
|
2444
|
+
white-space: nowrap;
|
|
2445
|
+
}
|
|
2446
|
+
.cmdp-desc {
|
|
2447
|
+
font-size: 11.5px;
|
|
2448
|
+
color: var(--lmn-command-palette-fg-subtle, var(--fg-subtle));
|
|
2449
|
+
overflow: hidden;
|
|
2450
|
+
text-overflow: ellipsis;
|
|
2451
|
+
white-space: nowrap;
|
|
2452
|
+
}
|
|
2453
|
+
.cmdp-item.active:not(:disabled) .cmdp-desc { color: inherit; opacity: 0.75; }
|
|
2454
|
+
.cmdp-shortcut {
|
|
2455
|
+
font-family: var(--font-mono);
|
|
2456
|
+
font-size: 11px;
|
|
2457
|
+
color: var(--lmn-command-palette-fg-subtle, var(--fg-subtle));
|
|
2458
|
+
}
|
|
2459
|
+
.cmdp-item.active:not(:disabled) .cmdp-shortcut { color: inherit; opacity: 0.8; }
|
|
2460
|
+
.cmdp-empty {
|
|
2461
|
+
padding: 28px 16px;
|
|
2462
|
+
text-align: center;
|
|
2463
|
+
color: var(--lmn-command-palette-fg-subtle, var(--fg-subtle));
|
|
2464
|
+
font-size: 13px;
|
|
2465
|
+
}
|
|
2466
|
+
.cmdp-footer {
|
|
2467
|
+
display: flex;
|
|
2468
|
+
gap: 16px;
|
|
2469
|
+
padding: 8px 14px;
|
|
2470
|
+
border-top: 1px solid var(--lmn-command-palette-divider, var(--divider));
|
|
2471
|
+
background: var(--lmn-command-palette-bg-sunken, var(--bg-sunken));
|
|
2472
|
+
font-size: 11.5px;
|
|
2473
|
+
color: var(--lmn-command-palette-fg-subtle, var(--fg-subtle));
|
|
2474
|
+
}
|
|
2475
|
+
.cmdp-footer span { display: inline-flex; align-items: center; gap: 4px; }
|
|
2476
|
+
.cmdp-kbd {
|
|
2477
|
+
display: inline-grid;
|
|
2478
|
+
place-items: center;
|
|
2479
|
+
min-width: 18px;
|
|
2480
|
+
height: 18px;
|
|
2481
|
+
padding: 0 5px;
|
|
2482
|
+
border-radius: 5px;
|
|
2483
|
+
background: var(--lmn-command-palette-bg, var(--bg));
|
|
2484
|
+
box-shadow: var(--lmn-command-palette-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
2485
|
+
font-family: var(--font-mono);
|
|
2486
|
+
font-size: 10.5px;
|
|
2487
|
+
color: var(--lmn-command-palette-fg-muted, var(--fg-muted));
|
|
2488
|
+
}
|
|
2489
|
+
/* ============ Alert ============ */
|
|
2490
|
+
.alert {
|
|
2491
|
+
display: flex;
|
|
2492
|
+
gap: 12px;
|
|
2493
|
+
align-items: flex-start;
|
|
2494
|
+
padding: 14px 16px;
|
|
2495
|
+
border-radius: var(--r-md);
|
|
2496
|
+
background: var(--lmn-alert-bg, var(--bg));
|
|
2497
|
+
box-shadow: var(--lmn-alert-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2498
|
+
position: relative;
|
|
2499
|
+
}
|
|
2500
|
+
.alert-ico {
|
|
2501
|
+
width: 20px; height: 20px;
|
|
2502
|
+
display: grid; place-items: center;
|
|
1996
2503
|
flex-shrink: 0;
|
|
1997
2504
|
margin-top: 1px;
|
|
1998
2505
|
line-height: 0;
|
|
@@ -2003,13 +2510,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2003
2510
|
height: 16px;
|
|
2004
2511
|
object-fit: contain;
|
|
2005
2512
|
}
|
|
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); }
|
|
2513
|
+
.alert.info .alert-ico { color: var(--lmn-alert-info, var(--info)); }
|
|
2514
|
+
.alert.success .alert-ico { color: var(--lmn-alert-success, var(--success)); }
|
|
2515
|
+
.alert.warning .alert-ico { color: var(--lmn-alert-warning, var(--warning)); }
|
|
2516
|
+
.alert.danger .alert-ico { color: var(--lmn-alert-danger, var(--danger)); }
|
|
2010
2517
|
.alert-body { flex: 1; min-width: 0; }
|
|
2011
2518
|
.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; }
|
|
2519
|
+
.alert-desc { font-size: 12px; color: var(--lmn-alert-fg-muted, var(--fg-muted)); line-height: 1.55; }
|
|
2013
2520
|
.alert.no-title { align-items: center; }
|
|
2014
2521
|
.alert.no-title .alert-ico { margin-top: 0; }
|
|
2015
2522
|
.alert.no-icon { gap: 0; }
|
|
@@ -2025,16 +2532,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2025
2532
|
position: absolute; top: 10px; right: 10px;
|
|
2026
2533
|
width: 22px; height: 22px; border-radius: 7px;
|
|
2027
2534
|
display: grid; place-items: center;
|
|
2028
|
-
color: var(--fg-subtle);
|
|
2535
|
+
color: var(--lmn-alert-fg-subtle, var(--fg-subtle));
|
|
2029
2536
|
cursor: pointer;
|
|
2030
2537
|
border: none; background: transparent;
|
|
2031
2538
|
}
|
|
2032
|
-
.alert-close:hover { color: var(--fg); background: var(--bg); box-shadow: var(--neu-shadow-subtle); }
|
|
2539
|
+
.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
2540
|
/* ============ Table ============ */
|
|
2034
2541
|
.table-wrap {
|
|
2035
2542
|
border-radius: var(--r-lg);
|
|
2036
|
-
background: var(--bg);
|
|
2037
|
-
box-shadow: var(--neu-shadow-inset);
|
|
2543
|
+
background: var(--lmn-table-bg, var(--bg));
|
|
2544
|
+
box-shadow: var(--lmn-table-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2038
2545
|
overflow: auto;
|
|
2039
2546
|
}
|
|
2040
2547
|
/* When scroll=y is on, the wrap itself becomes the scroll region. */
|
|
@@ -2049,51 +2556,64 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2049
2556
|
.table th {
|
|
2050
2557
|
text-align: left;
|
|
2051
2558
|
padding: 14px 18px;
|
|
2052
|
-
background: var(--bg);
|
|
2559
|
+
background: var(--lmn-table-bg, var(--bg));
|
|
2053
2560
|
font-size: 11px;
|
|
2054
2561
|
font-weight: 700;
|
|
2055
2562
|
letter-spacing: 0.08em;
|
|
2056
2563
|
text-transform: uppercase;
|
|
2057
|
-
color: var(--fg-subtle);
|
|
2058
|
-
border-bottom: 1px solid var(--divider);
|
|
2564
|
+
color: var(--lmn-table-fg-subtle, var(--fg-subtle));
|
|
2565
|
+
border-bottom: 1px solid var(--lmn-table-divider, var(--divider));
|
|
2059
2566
|
position: sticky; top: 0;
|
|
2060
2567
|
z-index: 1;
|
|
2061
2568
|
}
|
|
2062
2569
|
/* When the wrap is the scroll container (scroll.y), position:sticky on th needs
|
|
2063
2570
|
top:0 relative to the wrap — browsers already handle that. Adding a stronger
|
|
2064
2571
|
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); }
|
|
2572
|
+
.table.sticky-head th { background: var(--lmn-table-bg, var(--bg)); }
|
|
2573
|
+
.table th.sortable { user-select: none; }
|
|
2574
|
+
.table th.sortable:hover { color: var(--lmn-table-fg, var(--fg)); }
|
|
2575
|
+
.table-sort-trigger.btn {
|
|
2576
|
+
height: auto;
|
|
2577
|
+
min-height: 24px;
|
|
2578
|
+
padding: 2px 4px;
|
|
2579
|
+
color: inherit;
|
|
2580
|
+
font: inherit;
|
|
2581
|
+
letter-spacing: inherit;
|
|
2582
|
+
text-transform: inherit;
|
|
2583
|
+
}
|
|
2068
2584
|
.table th .th-label { vertical-align: middle; }
|
|
2069
2585
|
.table th .sort-ind {
|
|
2070
2586
|
display: inline-flex;
|
|
2071
2587
|
width: 16px; height: 16px;
|
|
2072
2588
|
border-radius: 6px;
|
|
2073
|
-
background: var(--bg);
|
|
2074
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
2589
|
+
background: var(--lmn-table-bg, var(--bg));
|
|
2590
|
+
box-shadow: var(--lmn-table-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
2075
2591
|
align-items: center; justify-content: center;
|
|
2076
2592
|
margin-left: 6px;
|
|
2077
|
-
color: var(--fg-subtle);
|
|
2593
|
+
color: var(--lmn-table-fg-subtle, var(--fg-subtle));
|
|
2078
2594
|
vertical-align: middle;
|
|
2079
2595
|
}
|
|
2080
|
-
.table th.sorted .sort-ind { color: var(--accent); box-shadow: var(--neu-shadow-inset); }
|
|
2596
|
+
.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
2597
|
.table td {
|
|
2082
2598
|
padding: 12px 18px;
|
|
2083
|
-
border-bottom: 1px solid var(--divider);
|
|
2599
|
+
border-bottom: 1px solid var(--lmn-table-divider, var(--divider));
|
|
2084
2600
|
vertical-align: middle;
|
|
2085
2601
|
}
|
|
2086
|
-
.table.hoverable tbody tr:hover td { background: color-mix(in oklch, var(--accent-soft) 40%, transparent); }
|
|
2602
|
+
.table.hoverable tbody tr:hover td { background: color-mix(in oklch, var(--lmn-table-accent-soft, var(--accent-soft)) 40%, transparent); }
|
|
2087
2603
|
.table tbody tr.clickable { cursor: pointer; }
|
|
2088
|
-
.table tbody tr.
|
|
2604
|
+
.table tbody tr.clickable:focus-visible td {
|
|
2605
|
+
background: color-mix(in oklch, var(--lmn-table-accent-soft, var(--accent-soft)) 55%, transparent);
|
|
2606
|
+
box-shadow: inset 0 0 0 2px var(--lmn-table-accent-glow, var(--accent-glow));
|
|
2607
|
+
}
|
|
2608
|
+
.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
2609
|
.table tbody tr:last-child td { border-bottom: none; }
|
|
2090
2610
|
.table.striped tbody tr:nth-child(even) td {
|
|
2091
|
-
background: color-mix(in oklch, var(--bg-sunken) 40%, transparent);
|
|
2611
|
+
background: color-mix(in oklch, var(--lmn-table-bg-sunken, var(--bg-sunken)) 40%, transparent);
|
|
2092
2612
|
}
|
|
2093
2613
|
/* Embossed: each row sits on the surface */
|
|
2094
2614
|
.table.embossed { border-spacing: 0; }
|
|
2095
2615
|
.table.embossed tbody td {
|
|
2096
|
-
background: var(--bg);
|
|
2616
|
+
background: var(--lmn-table-bg, var(--bg));
|
|
2097
2617
|
}
|
|
2098
2618
|
/* Card-row variant: each row is its own raised pill */
|
|
2099
2619
|
.table.cards {
|
|
@@ -2113,8 +2633,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2113
2633
|
inset: 0;
|
|
2114
2634
|
z-index: -1;
|
|
2115
2635
|
border-radius: var(--r-md);
|
|
2116
|
-
background: var(--bg);
|
|
2117
|
-
box-shadow: var(--neu-shadow-control);
|
|
2636
|
+
background: var(--lmn-table-bg, var(--bg));
|
|
2637
|
+
box-shadow: var(--lmn-table-neu-shadow-control, var(--neu-shadow-control));
|
|
2118
2638
|
pointer-events: none;
|
|
2119
2639
|
transition: box-shadow var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);
|
|
2120
2640
|
}
|
|
@@ -2142,38 +2662,38 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2142
2662
|
.table.cards.hoverable tbody tr:hover {
|
|
2143
2663
|
transform: translateY(-1px);
|
|
2144
2664
|
}
|
|
2145
|
-
.table.cards.hoverable tbody tr:hover .card-row-surface { box-shadow: var(--neu-shadow-panel); }
|
|
2665
|
+
.table.cards.hoverable tbody tr:hover .card-row-surface { box-shadow: var(--lmn-table-neu-shadow-panel, var(--neu-shadow-panel)); }
|
|
2146
2666
|
.table.cards.hoverable tbody tr:hover td { background: transparent; }
|
|
2147
2667
|
.table .row-check { width: 44px; }
|
|
2148
2668
|
.table .row-check .checkbox { display: inline-flex; }
|
|
2149
2669
|
.table .row-expand { width: 40px; text-align: center; }
|
|
2150
|
-
.table-empty { padding: 60px 20px; text-align: center; color: var(--fg-muted); }
|
|
2670
|
+
.table-empty { padding: 60px 20px; text-align: center; color: var(--lmn-table-fg-muted, var(--fg-muted)); }
|
|
2151
2671
|
/* Expand button */
|
|
2152
2672
|
.expand-btn {
|
|
2153
2673
|
width: 22px; height: 22px;
|
|
2154
2674
|
border: none;
|
|
2155
2675
|
border-radius: var(--r-sm);
|
|
2156
|
-
background: var(--bg);
|
|
2157
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
2158
|
-
color: var(--fg-subtle);
|
|
2676
|
+
background: var(--lmn-table-bg, var(--bg));
|
|
2677
|
+
box-shadow: var(--lmn-table-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
2678
|
+
color: var(--lmn-table-fg-subtle, var(--fg-subtle));
|
|
2159
2679
|
display: inline-flex; align-items: center; justify-content: center;
|
|
2160
2680
|
cursor: pointer;
|
|
2161
2681
|
transition: transform var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
|
|
2162
2682
|
}
|
|
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); }
|
|
2683
|
+
.expand-btn:hover { color: var(--lmn-table-accent-ink, var(--accent-ink)); box-shadow: var(--lmn-table-neu-shadow-control, var(--neu-shadow-control)); }
|
|
2684
|
+
.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
2685
|
/* Expanded row panel */
|
|
2166
2686
|
.table tbody tr.expanded-row td {
|
|
2167
2687
|
padding: 14px 18px;
|
|
2168
|
-
border-bottom: 1px solid var(--divider);
|
|
2169
|
-
background: color-mix(in oklch, var(--bg-sunken) 25%, transparent);
|
|
2688
|
+
border-bottom: 1px solid var(--lmn-table-divider, var(--divider));
|
|
2689
|
+
background: color-mix(in oklch, var(--lmn-table-bg-sunken, var(--bg-sunken)) 25%, transparent);
|
|
2170
2690
|
}
|
|
2171
2691
|
.expanded-panel {
|
|
2172
2692
|
padding: 14px 16px;
|
|
2173
2693
|
border-radius: var(--r-md);
|
|
2174
|
-
background: var(--bg);
|
|
2175
|
-
box-shadow: var(--neu-shadow-inset);
|
|
2176
|
-
color: var(--fg);
|
|
2694
|
+
background: var(--lmn-table-bg, var(--bg));
|
|
2695
|
+
box-shadow: var(--lmn-table-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2696
|
+
color: var(--lmn-table-fg, var(--fg));
|
|
2177
2697
|
font-size: 13px;
|
|
2178
2698
|
}
|
|
2179
2699
|
/* Radio-style row selector */
|
|
@@ -2182,30 +2702,30 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2182
2702
|
border-radius: 50%;
|
|
2183
2703
|
border: none;
|
|
2184
2704
|
padding: 0;
|
|
2185
|
-
background: var(--bg);
|
|
2186
|
-
box-shadow: var(--neu-shadow-inset);
|
|
2705
|
+
background: var(--lmn-table-bg, var(--bg));
|
|
2706
|
+
box-shadow: var(--lmn-table-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2187
2707
|
display: inline-flex; align-items: center; justify-content: center;
|
|
2188
2708
|
cursor: pointer;
|
|
2189
2709
|
transition: box-shadow var(--dur-fast) var(--ease);
|
|
2190
2710
|
}
|
|
2191
2711
|
.table .row-check .radio-dot:disabled { opacity: 0.5; cursor: not-allowed; }
|
|
2192
2712
|
.table .row-check .radio-dot.checked {
|
|
2193
|
-
box-shadow: var(--neu-shadow-control);
|
|
2713
|
+
box-shadow: var(--lmn-table-neu-shadow-control, var(--neu-shadow-control));
|
|
2194
2714
|
}
|
|
2195
2715
|
.table .row-check .radio-dot.checked::after {
|
|
2196
2716
|
content: "";
|
|
2197
2717
|
width: 8px; height: 8px;
|
|
2198
2718
|
border-radius: 50%;
|
|
2199
|
-
background: var(--accent);
|
|
2719
|
+
background: var(--lmn-table-accent, var(--accent));
|
|
2200
2720
|
}
|
|
2201
2721
|
/* Filter button on header */
|
|
2202
2722
|
.table th.filterable .filter-ind {
|
|
2203
2723
|
display: inline-flex;
|
|
2204
2724
|
width: 18px; height: 18px;
|
|
2205
2725
|
border-radius: 5px;
|
|
2206
|
-
background: var(--bg);
|
|
2207
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
2208
|
-
color: var(--fg-subtle);
|
|
2726
|
+
background: var(--lmn-table-bg, var(--bg));
|
|
2727
|
+
box-shadow: var(--lmn-table-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
2728
|
+
color: var(--lmn-table-fg-subtle, var(--fg-subtle));
|
|
2209
2729
|
align-items: center; justify-content: center;
|
|
2210
2730
|
margin-left: 6px;
|
|
2211
2731
|
cursor: pointer;
|
|
@@ -2214,19 +2734,19 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2214
2734
|
padding: 0;
|
|
2215
2735
|
transition: color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
|
|
2216
2736
|
}
|
|
2217
|
-
.table th.filterable .filter-ind:hover { color: var(--fg); }
|
|
2737
|
+
.table th.filterable .filter-ind:hover { color: var(--lmn-table-fg, var(--fg)); }
|
|
2218
2738
|
.table th.filterable .filter-ind.active {
|
|
2219
|
-
color: var(--accent-ink);
|
|
2220
|
-
box-shadow: var(--neu-shadow-inset);
|
|
2739
|
+
color: var(--lmn-table-accent-ink, var(--accent-ink));
|
|
2740
|
+
box-shadow: var(--lmn-table-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2221
2741
|
}
|
|
2222
2742
|
/* Filter popover panel (portaled to body) */
|
|
2223
2743
|
.table-filter-panel {
|
|
2224
2744
|
z-index: 1001;
|
|
2225
2745
|
min-width: 200px;
|
|
2226
2746
|
max-width: 260px;
|
|
2227
|
-
background: var(--bg);
|
|
2747
|
+
background: var(--lmn-table-bg, var(--bg));
|
|
2228
2748
|
border-radius: var(--r-md);
|
|
2229
|
-
box-shadow: var(--neu-shadow-float);
|
|
2749
|
+
box-shadow: var(--lmn-table-neu-shadow-float, var(--neu-shadow-float));
|
|
2230
2750
|
padding: 10px;
|
|
2231
2751
|
animation: menuIn var(--dur) var(--ease);
|
|
2232
2752
|
}
|
|
@@ -2245,12 +2765,12 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2245
2765
|
padding: 6px 8px;
|
|
2246
2766
|
border-radius: var(--r-sm);
|
|
2247
2767
|
font-size: 13px;
|
|
2248
|
-
color: var(--fg);
|
|
2768
|
+
color: var(--lmn-table-fg, var(--fg));
|
|
2249
2769
|
cursor: pointer;
|
|
2250
2770
|
transition: background var(--dur-fast) var(--ease);
|
|
2251
2771
|
}
|
|
2252
2772
|
.table-filter-item:hover {
|
|
2253
|
-
background: color-mix(in oklch, var(--accent-soft) 40%, transparent);
|
|
2773
|
+
background: color-mix(in oklch, var(--lmn-table-accent-soft, var(--accent-soft)) 40%, transparent);
|
|
2254
2774
|
}
|
|
2255
2775
|
.table-filter-actions {
|
|
2256
2776
|
display: flex;
|
|
@@ -2258,24 +2778,35 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2258
2778
|
gap: 6px;
|
|
2259
2779
|
margin-top: 6px;
|
|
2260
2780
|
padding-top: 8px;
|
|
2261
|
-
border-top: 1px solid var(--divider);
|
|
2781
|
+
border-top: 1px solid var(--lmn-table-divider, var(--divider));
|
|
2262
2782
|
}
|
|
2263
2783
|
.table-filter-actions .tf-btn {
|
|
2264
2784
|
border: none;
|
|
2265
2785
|
padding: 6px 12px;
|
|
2266
2786
|
border-radius: var(--r-sm);
|
|
2267
|
-
background: var(--bg);
|
|
2268
|
-
box-shadow: var(--neu-shadow-control);
|
|
2787
|
+
background: var(--lmn-table-bg, var(--bg));
|
|
2788
|
+
box-shadow: var(--lmn-table-neu-shadow-control, var(--neu-shadow-control));
|
|
2269
2789
|
font-size: 12px;
|
|
2270
2790
|
font-family: inherit;
|
|
2271
|
-
color: var(--fg);
|
|
2791
|
+
color: var(--lmn-table-fg, var(--fg));
|
|
2272
2792
|
cursor: pointer;
|
|
2273
2793
|
transition: box-shadow var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
|
|
2274
2794
|
}
|
|
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); }
|
|
2795
|
+
.table-filter-actions .tf-btn:hover { box-shadow: var(--lmn-table-neu-shadow-inset, var(--neu-shadow-inset)); }
|
|
2796
|
+
.table-filter-actions .tf-btn.primary { color: var(--lmn-table-accent-ink, var(--accent-ink)); font-weight: 600; }
|
|
2797
|
+
.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)); }
|
|
2798
|
+
.table-filter-actions .tf-btn.ghost:hover { box-shadow: var(--lmn-table-neu-shadow-inset, var(--neu-shadow-inset)); }
|
|
2799
|
+
.table-sr-only {
|
|
2800
|
+
position: absolute;
|
|
2801
|
+
width: 1px;
|
|
2802
|
+
height: 1px;
|
|
2803
|
+
padding: 0;
|
|
2804
|
+
margin: -1px;
|
|
2805
|
+
overflow: hidden;
|
|
2806
|
+
clip: rect(0, 0, 0, 0);
|
|
2807
|
+
white-space: nowrap;
|
|
2808
|
+
border: 0;
|
|
2809
|
+
}
|
|
2279
2810
|
/* Built-in pagination bar */
|
|
2280
2811
|
.table-pagination {
|
|
2281
2812
|
margin-top: 12px;
|
|
@@ -2283,8 +2814,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2283
2814
|
/* ============ TablePro ============ */
|
|
2284
2815
|
.table-card {
|
|
2285
2816
|
border-radius: var(--r-lg);
|
|
2286
|
-
background: var(--bg);
|
|
2287
|
-
box-shadow: var(--neu-shadow-control);
|
|
2817
|
+
background: var(--lmn-table-pro-bg, var(--bg));
|
|
2818
|
+
box-shadow: var(--lmn-table-pro-neu-shadow-control, var(--neu-shadow-control));
|
|
2288
2819
|
overflow: hidden;
|
|
2289
2820
|
}
|
|
2290
2821
|
.table-card .table-wrap { background: transparent; box-shadow: none; border-radius: 0; }
|
|
@@ -2292,7 +2823,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2292
2823
|
.table-card .table-pagination {
|
|
2293
2824
|
margin-top: 0;
|
|
2294
2825
|
padding: 6px 16px;
|
|
2295
|
-
border-top: 1px solid var(--divider);
|
|
2826
|
+
border-top: 1px solid var(--lmn-table-pro-divider, var(--divider));
|
|
2296
2827
|
background: transparent;
|
|
2297
2828
|
}
|
|
2298
2829
|
.table-toolbar {
|
|
@@ -2300,7 +2831,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2300
2831
|
align-items: center;
|
|
2301
2832
|
gap: var(--gap-3);
|
|
2302
2833
|
padding: 14px 16px;
|
|
2303
|
-
border-bottom: 1px solid var(--divider);
|
|
2834
|
+
border-bottom: 1px solid var(--lmn-table-pro-divider, var(--divider));
|
|
2304
2835
|
}
|
|
2305
2836
|
.table-toolbar .table-title {
|
|
2306
2837
|
font-size: 14px;
|
|
@@ -2322,7 +2853,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2322
2853
|
}
|
|
2323
2854
|
.table-footer {
|
|
2324
2855
|
padding: 10px 16px;
|
|
2325
|
-
border-top: 1px solid var(--divider);
|
|
2856
|
+
border-top: 1px solid var(--lmn-table-pro-divider, var(--divider));
|
|
2326
2857
|
background: transparent;
|
|
2327
2858
|
}
|
|
2328
2859
|
/* ============ Pagination ============ */
|
|
@@ -2332,7 +2863,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2332
2863
|
justify-content: space-between;
|
|
2333
2864
|
padding: 12px 14px;
|
|
2334
2865
|
font-size: 12px;
|
|
2335
|
-
color: var(--fg-muted);
|
|
2866
|
+
color: var(--lmn-pagination-fg-muted, var(--fg-muted));
|
|
2336
2867
|
gap: 12px;
|
|
2337
2868
|
flex-wrap: wrap;
|
|
2338
2869
|
}
|
|
@@ -2342,24 +2873,24 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2342
2873
|
padding: 0 10px;
|
|
2343
2874
|
border: none;
|
|
2344
2875
|
border-radius: var(--r-sm);
|
|
2345
|
-
background: var(--bg);
|
|
2346
|
-
box-shadow: var(--neu-shadow-control);
|
|
2876
|
+
background: var(--lmn-pagination-bg, var(--bg));
|
|
2877
|
+
box-shadow: var(--lmn-pagination-neu-shadow-control, var(--neu-shadow-control));
|
|
2347
2878
|
display: inline-flex; align-items: center; justify-content: center;
|
|
2348
2879
|
cursor: pointer;
|
|
2349
2880
|
font-size: 12px;
|
|
2350
2881
|
font-family: inherit;
|
|
2351
2882
|
font-variant-numeric: tabular-nums;
|
|
2352
|
-
color: var(--fg);
|
|
2883
|
+
color: var(--lmn-pagination-fg, var(--fg));
|
|
2353
2884
|
transition: all var(--dur-fast) var(--ease);
|
|
2354
2885
|
}
|
|
2355
|
-
.pagination .pg:hover { color: var(--accent-ink); }
|
|
2886
|
+
.pagination .pg:hover { color: var(--lmn-pagination-accent-ink, var(--accent-ink)); }
|
|
2356
2887
|
.pagination .pg.active {
|
|
2357
|
-
box-shadow: var(--neu-shadow-inset);
|
|
2358
|
-
color: var(--accent-ink);
|
|
2888
|
+
box-shadow: var(--lmn-pagination-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2889
|
+
color: var(--lmn-pagination-accent-ink, var(--accent-ink));
|
|
2359
2890
|
font-weight: 700;
|
|
2360
2891
|
}
|
|
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); }
|
|
2892
|
+
.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)); }
|
|
2893
|
+
.pagination .ellipsis { padding: 0 4px; color: var(--lmn-pagination-fg-subtle, var(--fg-subtle)); }
|
|
2363
2894
|
/* size changer — compact Select inline with the page buttons */
|
|
2364
2895
|
.pagination .pg-size-changer { margin-left: 8px; min-width: 108px; }
|
|
2365
2896
|
/* quick jumper */
|
|
@@ -2368,36 +2899,37 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2368
2899
|
align-items: center;
|
|
2369
2900
|
gap: 6px;
|
|
2370
2901
|
margin-left: 8px;
|
|
2371
|
-
color: var(--fg-muted);
|
|
2902
|
+
color: var(--lmn-pagination-fg-muted, var(--fg-muted));
|
|
2372
2903
|
font-size: 12px;
|
|
2373
2904
|
}
|
|
2374
|
-
.pagination .pg-jumper-label { color: var(--fg-muted); }
|
|
2905
|
+
.pagination .pg-jumper-label { color: var(--lmn-pagination-fg-muted, var(--fg-muted)); }
|
|
2375
2906
|
.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;
|
|
2907
|
+
width: 52px;
|
|
2908
|
+
}
|
|
2909
|
+
.pagination .pg-jumper-input .input {
|
|
2386
2910
|
font-variant-numeric: tabular-nums;
|
|
2387
2911
|
text-align: center;
|
|
2388
|
-
outline: none;
|
|
2389
|
-
transition: box-shadow var(--dur-fast) var(--ease);
|
|
2390
2912
|
}
|
|
2391
|
-
|
|
2392
|
-
|
|
2913
|
+
@media (max-width: 480px) {
|
|
2914
|
+
.pagination {
|
|
2915
|
+
align-items: flex-start;
|
|
2916
|
+
padding-inline: 8px;
|
|
2917
|
+
}
|
|
2918
|
+
.pagination .pg-controls {
|
|
2919
|
+
flex-wrap: wrap;
|
|
2920
|
+
}
|
|
2921
|
+
.pagination .pg-size-changer,
|
|
2922
|
+
.pagination .pg-jumper {
|
|
2923
|
+
margin-left: 0;
|
|
2924
|
+
}
|
|
2393
2925
|
}
|
|
2394
2926
|
/* ============ List ============ */
|
|
2395
2927
|
.list {
|
|
2396
2928
|
display: flex;
|
|
2397
2929
|
flex-direction: column;
|
|
2398
|
-
background: var(--bg);
|
|
2930
|
+
background: var(--lmn-list-bg, var(--bg));
|
|
2399
2931
|
border-radius: var(--r-lg);
|
|
2400
|
-
box-shadow: var(--neu-shadow-inset);
|
|
2932
|
+
box-shadow: var(--lmn-list-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2401
2933
|
padding: 8px;
|
|
2402
2934
|
}
|
|
2403
2935
|
.list-item {
|
|
@@ -2408,15 +2940,31 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2408
2940
|
border-radius: var(--r-sm);
|
|
2409
2941
|
transition: all var(--dur-fast) var(--ease);
|
|
2410
2942
|
}
|
|
2943
|
+
.list-item-trigger {
|
|
2944
|
+
display: flex;
|
|
2945
|
+
align-items: center;
|
|
2946
|
+
gap: 12px;
|
|
2947
|
+
flex: 1;
|
|
2948
|
+
min-width: 0;
|
|
2949
|
+
}
|
|
2950
|
+
button.list-item-trigger {
|
|
2951
|
+
border: 0;
|
|
2952
|
+
padding: 0;
|
|
2953
|
+
background: transparent;
|
|
2954
|
+
color: inherit;
|
|
2955
|
+
font: inherit;
|
|
2956
|
+
text-align: left;
|
|
2957
|
+
cursor: pointer;
|
|
2958
|
+
}
|
|
2411
2959
|
.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; }
|
|
2960
|
+
.list-item.clickable:hover { background: var(--lmn-list-bg, var(--bg)); box-shadow: var(--lmn-list-neu-shadow-subtle, var(--neu-shadow-subtle)); }
|
|
2961
|
+
.list-item.selected { box-shadow: var(--lmn-list-neu-shadow-control, var(--neu-shadow-control)); background: var(--lmn-list-bg, var(--bg)); }
|
|
2962
|
+
.list.with-dividers .list-item + .list-item { border-top: 1px solid var(--lmn-list-divider, var(--divider)); border-radius: 0; }
|
|
2415
2963
|
.list-item-meta { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
|
|
2416
2964
|
.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; }
|
|
2965
|
+
.list-item-desc { font-size: 12px; color: var(--lmn-list-fg-muted, var(--fg-muted)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
|
2418
2966
|
.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; }
|
|
2967
|
+
.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
2968
|
/* ============ Spin ============ */
|
|
2421
2969
|
.spin {
|
|
2422
2970
|
width: 14px;
|
|
@@ -2427,17 +2975,17 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2427
2975
|
animation: spin 0.8s linear infinite;
|
|
2428
2976
|
display: inline-block;
|
|
2429
2977
|
}
|
|
2430
|
-
.spin.accent { color: var(--accent); }
|
|
2431
|
-
.spin.success { color: var(--success); }
|
|
2432
|
-
.spin.warning { color: var(--warning); }
|
|
2433
|
-
.spin.danger { color: var(--danger); }
|
|
2978
|
+
.spin.accent { color: var(--lmn-spin-accent, var(--accent)); }
|
|
2979
|
+
.spin.success { color: var(--lmn-spin-success, var(--success)); }
|
|
2980
|
+
.spin.warning { color: var(--lmn-spin-warning, var(--warning)); }
|
|
2981
|
+
.spin.danger { color: var(--lmn-spin-danger, var(--danger)); }
|
|
2434
2982
|
.spin.ring {
|
|
2435
2983
|
position: relative;
|
|
2436
2984
|
display: inline-block;
|
|
2437
2985
|
border: none;
|
|
2438
2986
|
border-radius: 50%;
|
|
2439
|
-
background: var(--bg);
|
|
2440
|
-
box-shadow: var(--neu-shadow-inset);
|
|
2987
|
+
background: var(--lmn-spin-bg, var(--bg));
|
|
2988
|
+
box-shadow: var(--lmn-spin-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2441
2989
|
animation: none;
|
|
2442
2990
|
}
|
|
2443
2991
|
.spin.ring::before {
|
|
@@ -2479,9 +3027,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2479
3027
|
height: 0.4em;
|
|
2480
3028
|
border-radius: 999px;
|
|
2481
3029
|
background: radial-gradient(circle at 32% 28%,
|
|
2482
|
-
color-mix(in oklch, currentColor 40%, var(--bg)),
|
|
3030
|
+
color-mix(in oklch, currentColor 40%, var(--lmn-spin-bg, var(--bg))),
|
|
2483
3031
|
currentColor 62%,
|
|
2484
|
-
color-mix(in oklch, currentColor 82%, var(--fg)) 100%);
|
|
3032
|
+
color-mix(in oklch, currentColor 82%, var(--lmn-spin-fg, var(--fg))) 100%);
|
|
2485
3033
|
box-shadow:
|
|
2486
3034
|
0 0.06em 0.14em color-mix(in oklch, currentColor 45%, transparent),
|
|
2487
3035
|
0 0 0.35em color-mix(in oklch, currentColor 50%, transparent);
|
|
@@ -2498,15 +3046,20 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2498
3046
|
display: inline-flex;
|
|
2499
3047
|
align-items: center;
|
|
2500
3048
|
gap: 8px;
|
|
2501
|
-
color: var(--fg-muted);
|
|
3049
|
+
color: var(--lmn-spin-fg-muted, var(--fg-muted));
|
|
2502
3050
|
}
|
|
2503
3051
|
.spin-label { font-size: 12px; }
|
|
3052
|
+
@media (prefers-reduced-motion: reduce) {
|
|
3053
|
+
.spin,
|
|
3054
|
+
.spin.ring::before,
|
|
3055
|
+
.spin.dots i { animation: none; }
|
|
3056
|
+
}
|
|
2504
3057
|
/* ============ Empty ============ */
|
|
2505
3058
|
.empty {
|
|
2506
3059
|
padding: 60px 20px;
|
|
2507
3060
|
display: grid; place-items: center;
|
|
2508
3061
|
gap: 12px;
|
|
2509
|
-
color: var(--fg-muted);
|
|
3062
|
+
color: var(--lmn-empty-fg-muted, var(--fg-muted));
|
|
2510
3063
|
text-align: center;
|
|
2511
3064
|
}
|
|
2512
3065
|
.empty.sm { padding: 28px 16px; gap: 8px; }
|
|
@@ -2521,25 +3074,25 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2521
3074
|
.empty-ico {
|
|
2522
3075
|
width: 56px; height: 56px;
|
|
2523
3076
|
border-radius: var(--r-lg);
|
|
2524
|
-
background: var(--bg);
|
|
2525
|
-
box-shadow: var(--neu-shadow-inset);
|
|
3077
|
+
background: var(--lmn-empty-bg, var(--bg));
|
|
3078
|
+
box-shadow: var(--lmn-empty-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2526
3079
|
display: grid; place-items: center;
|
|
2527
|
-
color: var(--fg-subtle);
|
|
3080
|
+
color: var(--lmn-empty-fg-subtle, var(--fg-subtle));
|
|
2528
3081
|
}
|
|
2529
|
-
.empty-title { font-size: 14px; font-weight: 600; color: var(--fg); }
|
|
3082
|
+
.empty-title { font-size: 14px; font-weight: 600; color: var(--lmn-empty-fg, var(--fg)); }
|
|
2530
3083
|
.empty-desc { font-size: 12px; }
|
|
2531
3084
|
.empty-action { margin-top: 8px; }
|
|
2532
3085
|
/* ============ Skeleton ============ */
|
|
2533
3086
|
.skeleton {
|
|
2534
3087
|
display: block;
|
|
2535
|
-
background: color-mix(in oklch, var(--accent-soft) 55%, var(--bg-sunken));
|
|
3088
|
+
background: color-mix(in oklch, var(--lmn-skeleton-accent-soft, var(--accent-soft)) 55%, var(--lmn-skeleton-bg-sunken, var(--bg-sunken)));
|
|
2536
3089
|
border-radius: var(--r-sm);
|
|
2537
3090
|
}
|
|
2538
3091
|
.skeleton.wave {
|
|
2539
3092
|
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)));
|
|
3093
|
+
color-mix(in oklch, var(--lmn-skeleton-accent-soft, var(--accent-soft)) 35%, var(--lmn-skeleton-bg-sunken, var(--bg-sunken))),
|
|
3094
|
+
color-mix(in oklch, var(--lmn-skeleton-accent-soft, var(--accent-soft)) 75%, var(--lmn-skeleton-bg-sunken, var(--bg-sunken))),
|
|
3095
|
+
color-mix(in oklch, var(--lmn-skeleton-accent-soft, var(--accent-soft)) 35%, var(--lmn-skeleton-bg-sunken, var(--bg-sunken))));
|
|
2543
3096
|
background-size: 200% 100%;
|
|
2544
3097
|
animation: skel-wave 1.4s ease-in-out infinite;
|
|
2545
3098
|
}
|
|
@@ -2568,6 +3121,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2568
3121
|
.skeleton-box .skeleton-row {
|
|
2569
3122
|
display: block;
|
|
2570
3123
|
}
|
|
3124
|
+
@media (prefers-reduced-motion: reduce) {
|
|
3125
|
+
.skeleton.wave,
|
|
3126
|
+
.skeleton.pulse { animation: none; }
|
|
3127
|
+
}
|
|
2571
3128
|
/* ============ DatePicker ============ */
|
|
2572
3129
|
.date-picker {
|
|
2573
3130
|
position: relative;
|
|
@@ -2586,7 +3143,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2586
3143
|
width: 100%;
|
|
2587
3144
|
}
|
|
2588
3145
|
.date-picker.open .input-wrap {
|
|
2589
|
-
box-shadow: var(--neu-shadow-inset);
|
|
3146
|
+
box-shadow: var(--lmn-date-picker-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2590
3147
|
}
|
|
2591
3148
|
.date-picker-panel {
|
|
2592
3149
|
position: fixed;
|
|
@@ -2594,8 +3151,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2594
3151
|
width: 344px;
|
|
2595
3152
|
padding: var(--gap-3);
|
|
2596
3153
|
border-radius: var(--r-md);
|
|
2597
|
-
background: var(--bg);
|
|
2598
|
-
box-shadow: var(--neu-shadow-float);
|
|
3154
|
+
background: var(--lmn-date-picker-bg, var(--bg));
|
|
3155
|
+
box-shadow: var(--lmn-date-picker-neu-shadow-float, var(--neu-shadow-float));
|
|
2599
3156
|
animation: menuIn var(--dur) var(--ease);
|
|
2600
3157
|
}
|
|
2601
3158
|
.date-picker-panel .calendar {
|
|
@@ -2613,7 +3170,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2613
3170
|
gap: var(--gap-2);
|
|
2614
3171
|
margin-top: var(--gap-3);
|
|
2615
3172
|
padding-top: var(--gap-3);
|
|
2616
|
-
border-top: 1px solid var(--divider);
|
|
3173
|
+
border-top: 1px solid var(--lmn-date-picker-divider, var(--divider));
|
|
2617
3174
|
}
|
|
2618
3175
|
.date-picker-footer-spacer {
|
|
2619
3176
|
flex: 1;
|
|
@@ -2637,7 +3194,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2637
3194
|
width: 100%;
|
|
2638
3195
|
}
|
|
2639
3196
|
.date-time-picker.open .input-wrap {
|
|
2640
|
-
box-shadow: var(--neu-shadow-inset);
|
|
3197
|
+
box-shadow: var(--lmn-date-time-picker-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2641
3198
|
}
|
|
2642
3199
|
.date-time-picker-panel {
|
|
2643
3200
|
position: fixed;
|
|
@@ -2645,10 +3202,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2645
3202
|
width: 476px;
|
|
2646
3203
|
padding: var(--gap-2) var(--gap-3);
|
|
2647
3204
|
border-radius: var(--r-md);
|
|
2648
|
-
background: var(--bg);
|
|
3205
|
+
background: var(--lmn-date-time-picker-bg, var(--bg));
|
|
2649
3206
|
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);
|
|
3207
|
+
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),
|
|
3208
|
+
inset 0 0 0 1px var(--lmn-date-time-picker-divider, var(--divider));
|
|
2652
3209
|
animation: menuIn var(--dur) var(--ease);
|
|
2653
3210
|
}
|
|
2654
3211
|
.date-time-picker-body {
|
|
@@ -2706,8 +3263,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2706
3263
|
grid-template-columns: repeat(3, minmax(0, 1fr));
|
|
2707
3264
|
padding: 8px;
|
|
2708
3265
|
border-radius: var(--r-sm);
|
|
2709
|
-
background: var(--bg);
|
|
2710
|
-
box-shadow: inset 0 0 0 1px var(--divider);
|
|
3266
|
+
background: var(--lmn-date-time-picker-bg, var(--bg));
|
|
3267
|
+
box-shadow: inset 0 0 0 1px var(--lmn-date-time-picker-divider, var(--divider));
|
|
2711
3268
|
overflow: hidden;
|
|
2712
3269
|
}
|
|
2713
3270
|
.date-time-picker-panel.without-second .date-time-picker-time-columns {
|
|
@@ -2717,7 +3274,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2717
3274
|
min-width: 0;
|
|
2718
3275
|
}
|
|
2719
3276
|
.date-time-picker-time-column + .date-time-picker-time-column {
|
|
2720
|
-
border-left: 1px solid var(--divider);
|
|
3277
|
+
border-left: 1px solid var(--lmn-date-time-picker-divider, var(--divider));
|
|
2721
3278
|
}
|
|
2722
3279
|
.date-time-picker-time-label {
|
|
2723
3280
|
height: 20px;
|
|
@@ -2725,7 +3282,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2725
3282
|
place-items: center;
|
|
2726
3283
|
font-size: var(--fs-xs);
|
|
2727
3284
|
font-weight: 700;
|
|
2728
|
-
color: var(--fg-muted);
|
|
3285
|
+
color: var(--lmn-date-time-picker-fg-muted, var(--fg-muted));
|
|
2729
3286
|
}
|
|
2730
3287
|
.date-time-picker-time-list {
|
|
2731
3288
|
display: flex;
|
|
@@ -2750,7 +3307,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2750
3307
|
border: none;
|
|
2751
3308
|
border-radius: 7px;
|
|
2752
3309
|
background: transparent;
|
|
2753
|
-
color: var(--fg);
|
|
3310
|
+
color: var(--lmn-date-time-picker-fg, var(--fg));
|
|
2754
3311
|
cursor: pointer;
|
|
2755
3312
|
font: 600 var(--fs-md) var(--font-mono);
|
|
2756
3313
|
transition:
|
|
@@ -2759,17 +3316,17 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2759
3316
|
box-shadow var(--dur-fast) var(--ease);
|
|
2760
3317
|
}
|
|
2761
3318
|
.date-time-picker-time-option:hover:not(:disabled) {
|
|
2762
|
-
color: var(--accent-ink);
|
|
2763
|
-
background: var(--bg);
|
|
2764
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
3319
|
+
color: var(--lmn-date-time-picker-accent-ink, var(--accent-ink));
|
|
3320
|
+
background: var(--lmn-date-time-picker-bg, var(--bg));
|
|
3321
|
+
box-shadow: var(--lmn-date-time-picker-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
2765
3322
|
}
|
|
2766
3323
|
.date-time-picker-time-option.selected {
|
|
2767
|
-
color: var(--accent-ink);
|
|
2768
|
-
background: var(--bg);
|
|
2769
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
3324
|
+
color: var(--lmn-date-time-picker-accent-ink, var(--accent-ink));
|
|
3325
|
+
background: var(--lmn-date-time-picker-bg, var(--bg));
|
|
3326
|
+
box-shadow: var(--lmn-date-time-picker-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
2770
3327
|
}
|
|
2771
3328
|
.date-time-picker-time-option:disabled {
|
|
2772
|
-
color: var(--fg-subtle);
|
|
3329
|
+
color: var(--lmn-date-time-picker-fg-subtle, var(--fg-subtle));
|
|
2773
3330
|
cursor: not-allowed;
|
|
2774
3331
|
opacity: 0.45;
|
|
2775
3332
|
}
|
|
@@ -2779,7 +3336,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2779
3336
|
gap: var(--gap-2);
|
|
2780
3337
|
margin-top: var(--gap-2);
|
|
2781
3338
|
padding-top: var(--gap-2);
|
|
2782
|
-
border-top: 1px solid var(--divider);
|
|
3339
|
+
border-top: 1px solid var(--lmn-date-time-picker-divider, var(--divider));
|
|
2783
3340
|
}
|
|
2784
3341
|
.date-time-picker-footer-spacer {
|
|
2785
3342
|
flex: 1;
|
|
@@ -2813,10 +3370,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2813
3370
|
}
|
|
2814
3371
|
/* ============ Calendar ============ */
|
|
2815
3372
|
.calendar {
|
|
2816
|
-
background: var(--bg);
|
|
3373
|
+
background: var(--lmn-calendar-bg, var(--bg));
|
|
2817
3374
|
border-radius: var(--r-lg);
|
|
2818
3375
|
padding: var(--gap-4);
|
|
2819
|
-
box-shadow: var(--neu-shadow-panel);
|
|
3376
|
+
box-shadow: var(--lmn-calendar-neu-shadow-panel, var(--neu-shadow-panel));
|
|
2820
3377
|
width: 320px;
|
|
2821
3378
|
}
|
|
2822
3379
|
.calendar-head {
|
|
@@ -2827,11 +3384,11 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2827
3384
|
font-size: 14px; font-weight: 600;
|
|
2828
3385
|
display: inline-flex; align-items: center; gap: 8px;
|
|
2829
3386
|
cursor: pointer; padding: 6px 10px; border-radius: var(--r-sm);
|
|
2830
|
-
border: none; background: transparent; color: var(--fg);
|
|
3387
|
+
border: none; background: transparent; color: var(--lmn-calendar-fg, var(--fg));
|
|
2831
3388
|
font-family: inherit;
|
|
2832
3389
|
transition: all var(--dur-fast) var(--ease);
|
|
2833
3390
|
}
|
|
2834
|
-
.calendar-title:hover { background: var(--bg); box-shadow: var(--neu-shadow-subtle); }
|
|
3391
|
+
.calendar-title:hover { background: var(--lmn-calendar-bg, var(--bg)); box-shadow: var(--lmn-calendar-neu-shadow-subtle, var(--neu-shadow-subtle)); }
|
|
2835
3392
|
.calendar-title.static {
|
|
2836
3393
|
cursor: default;
|
|
2837
3394
|
}
|
|
@@ -2849,7 +3406,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2849
3406
|
border-radius: var(--r-sm);
|
|
2850
3407
|
padding: 6px 8px;
|
|
2851
3408
|
background: transparent;
|
|
2852
|
-
color: var(--fg);
|
|
3409
|
+
color: var(--lmn-calendar-fg, var(--fg));
|
|
2853
3410
|
cursor: pointer;
|
|
2854
3411
|
font: 600 14px var(--font-sans);
|
|
2855
3412
|
transition:
|
|
@@ -2858,9 +3415,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2858
3415
|
box-shadow var(--dur-fast) var(--ease);
|
|
2859
3416
|
}
|
|
2860
3417
|
.calendar-title-part:hover {
|
|
2861
|
-
color: var(--accent-ink);
|
|
2862
|
-
background: var(--bg);
|
|
2863
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
3418
|
+
color: var(--lmn-calendar-accent-ink, var(--accent-ink));
|
|
3419
|
+
background: var(--lmn-calendar-bg, var(--bg));
|
|
3420
|
+
box-shadow: var(--lmn-calendar-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
2864
3421
|
}
|
|
2865
3422
|
.calendar-grid {
|
|
2866
3423
|
display: grid;
|
|
@@ -2871,7 +3428,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2871
3428
|
text-align: center;
|
|
2872
3429
|
font-size: 10px;
|
|
2873
3430
|
font-weight: 600;
|
|
2874
|
-
color: var(--fg-subtle);
|
|
3431
|
+
color: var(--lmn-calendar-fg-subtle, var(--fg-subtle));
|
|
2875
3432
|
text-transform: uppercase;
|
|
2876
3433
|
letter-spacing: 0.06em;
|
|
2877
3434
|
padding: 8px 0;
|
|
@@ -2881,7 +3438,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2881
3438
|
aspect-ratio: 1;
|
|
2882
3439
|
display: grid; place-items: center;
|
|
2883
3440
|
font-size: 12px;
|
|
2884
|
-
color: var(--fg);
|
|
3441
|
+
color: var(--lmn-calendar-fg, var(--fg));
|
|
2885
3442
|
border-radius: var(--r-sm);
|
|
2886
3443
|
cursor: pointer;
|
|
2887
3444
|
border: none;
|
|
@@ -2889,22 +3446,22 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2889
3446
|
font-family: inherit;
|
|
2890
3447
|
transition: all var(--dur-fast) var(--ease);
|
|
2891
3448
|
}
|
|
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); }
|
|
3449
|
+
.calendar-cell.out { color: var(--lmn-calendar-fg-subtle, var(--fg-subtle)); opacity: 0.5; }
|
|
3450
|
+
.calendar-cell:hover { background: var(--lmn-calendar-bg, var(--bg)); box-shadow: var(--lmn-calendar-neu-shadow-subtle, var(--neu-shadow-subtle)); }
|
|
3451
|
+
.calendar-cell.today { font-weight: 700; color: var(--lmn-calendar-accent-ink, var(--accent-ink)); }
|
|
2895
3452
|
.calendar-cell.today::after {
|
|
2896
3453
|
content: ""; position: absolute; bottom: 4px; left: 50%;
|
|
2897
3454
|
width: 4px; height: 4px; border-radius: 999px;
|
|
2898
|
-
background: var(--accent);
|
|
3455
|
+
background: var(--lmn-calendar-accent, var(--accent));
|
|
2899
3456
|
transform: translateX(-50%);
|
|
2900
3457
|
}
|
|
2901
3458
|
.calendar-cell.selected {
|
|
2902
|
-
background: var(--bg);
|
|
2903
|
-
box-shadow: var(--neu-shadow-inset);
|
|
2904
|
-
color: var(--accent-ink);
|
|
3459
|
+
background: var(--lmn-calendar-bg, var(--bg));
|
|
3460
|
+
box-shadow: var(--lmn-calendar-neu-shadow-inset, var(--neu-shadow-inset));
|
|
3461
|
+
color: var(--lmn-calendar-accent-ink, var(--accent-ink));
|
|
2905
3462
|
font-weight: 600;
|
|
2906
3463
|
}
|
|
2907
|
-
.calendar-cell.disabled { color: var(--fg-subtle); opacity: 0.4; cursor: not-allowed; }
|
|
3464
|
+
.calendar-cell.disabled { color: var(--lmn-calendar-fg-subtle, var(--fg-subtle)); opacity: 0.4; cursor: not-allowed; }
|
|
2908
3465
|
.calendar-cell.disabled:hover { background: transparent; box-shadow: none; }
|
|
2909
3466
|
.calendar-select-grid {
|
|
2910
3467
|
display: grid;
|
|
@@ -2918,7 +3475,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2918
3475
|
border: none;
|
|
2919
3476
|
border-radius: var(--r-sm);
|
|
2920
3477
|
background: transparent;
|
|
2921
|
-
color: var(--fg);
|
|
3478
|
+
color: var(--lmn-calendar-fg, var(--fg));
|
|
2922
3479
|
cursor: pointer;
|
|
2923
3480
|
font: 600 var(--fs-md) var(--font-mono);
|
|
2924
3481
|
transition:
|
|
@@ -2927,17 +3484,17 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2927
3484
|
box-shadow var(--dur-fast) var(--ease);
|
|
2928
3485
|
}
|
|
2929
3486
|
.calendar-select-option:hover:not(:disabled) {
|
|
2930
|
-
color: var(--accent-ink);
|
|
2931
|
-
background: var(--bg);
|
|
2932
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
3487
|
+
color: var(--lmn-calendar-accent-ink, var(--accent-ink));
|
|
3488
|
+
background: var(--lmn-calendar-bg, var(--bg));
|
|
3489
|
+
box-shadow: var(--lmn-calendar-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
2933
3490
|
}
|
|
2934
3491
|
.calendar-select-option.selected {
|
|
2935
|
-
color: var(--accent-ink);
|
|
2936
|
-
background: var(--bg);
|
|
2937
|
-
box-shadow: var(--neu-shadow-inset);
|
|
3492
|
+
color: var(--lmn-calendar-accent-ink, var(--accent-ink));
|
|
3493
|
+
background: var(--lmn-calendar-bg, var(--bg));
|
|
3494
|
+
box-shadow: var(--lmn-calendar-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2938
3495
|
}
|
|
2939
3496
|
.calendar-select-option.disabled {
|
|
2940
|
-
color: var(--fg-subtle);
|
|
3497
|
+
color: var(--lmn-calendar-fg-subtle, var(--fg-subtle));
|
|
2941
3498
|
cursor: not-allowed;
|
|
2942
3499
|
opacity: 0.4;
|
|
2943
3500
|
}
|
|
@@ -2959,7 +3516,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2959
3516
|
width: 100%;
|
|
2960
3517
|
}
|
|
2961
3518
|
.time-picker.open .input-wrap {
|
|
2962
|
-
box-shadow: var(--neu-shadow-inset);
|
|
3519
|
+
box-shadow: var(--lmn-time-picker-neu-shadow-inset, var(--neu-shadow-inset));
|
|
2963
3520
|
}
|
|
2964
3521
|
.time-picker-panel {
|
|
2965
3522
|
position: fixed;
|
|
@@ -2967,10 +3524,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2967
3524
|
width: 300px;
|
|
2968
3525
|
padding: 10px;
|
|
2969
3526
|
border-radius: var(--r-md);
|
|
2970
|
-
background: var(--bg);
|
|
3527
|
+
background: var(--lmn-time-picker-bg, var(--bg));
|
|
2971
3528
|
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);
|
|
3529
|
+
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),
|
|
3530
|
+
inset 0 0 0 1px var(--lmn-time-picker-divider, var(--divider));
|
|
2974
3531
|
animation: menuIn var(--dur) var(--ease);
|
|
2975
3532
|
}
|
|
2976
3533
|
.time-picker-panel.without-second {
|
|
@@ -2983,12 +3540,12 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
2983
3540
|
gap: 0;
|
|
2984
3541
|
padding: 8px;
|
|
2985
3542
|
border-radius: var(--r-sm);
|
|
2986
|
-
background: var(--bg);
|
|
2987
|
-
box-shadow: inset 0 0 0 1px var(--divider);
|
|
3543
|
+
background: var(--lmn-time-picker-bg, var(--bg));
|
|
3544
|
+
box-shadow: inset 0 0 0 1px var(--lmn-time-picker-divider, var(--divider));
|
|
2988
3545
|
overflow: hidden;
|
|
2989
3546
|
}
|
|
2990
3547
|
.time-picker-column + .time-picker-column {
|
|
2991
|
-
border-left: 1px solid var(--divider);
|
|
3548
|
+
border-left: 1px solid var(--lmn-time-picker-divider, var(--divider));
|
|
2992
3549
|
}
|
|
2993
3550
|
.time-picker-panel.without-second .time-picker-columns {
|
|
2994
3551
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
@@ -3004,7 +3561,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3004
3561
|
place-items: center;
|
|
3005
3562
|
font-size: var(--fs-xs);
|
|
3006
3563
|
font-weight: 700;
|
|
3007
|
-
color: var(--fg-muted);
|
|
3564
|
+
color: var(--lmn-time-picker-fg-muted, var(--fg-muted));
|
|
3008
3565
|
}
|
|
3009
3566
|
.time-picker-list {
|
|
3010
3567
|
display: flex;
|
|
@@ -3034,7 +3591,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3034
3591
|
border: none;
|
|
3035
3592
|
border-radius: 7px;
|
|
3036
3593
|
background: transparent;
|
|
3037
|
-
color: var(--fg);
|
|
3594
|
+
color: var(--lmn-time-picker-fg, var(--fg));
|
|
3038
3595
|
cursor: pointer;
|
|
3039
3596
|
font: 600 var(--fs-md) var(--font-mono);
|
|
3040
3597
|
transition:
|
|
@@ -3043,17 +3600,17 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3043
3600
|
box-shadow var(--dur-fast) var(--ease);
|
|
3044
3601
|
}
|
|
3045
3602
|
.time-picker-option:hover:not(:disabled) {
|
|
3046
|
-
color: var(--accent-ink);
|
|
3047
|
-
background: var(--bg);
|
|
3048
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
3603
|
+
color: var(--lmn-time-picker-accent-ink, var(--accent-ink));
|
|
3604
|
+
background: var(--lmn-time-picker-bg, var(--bg));
|
|
3605
|
+
box-shadow: var(--lmn-time-picker-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
3049
3606
|
}
|
|
3050
3607
|
.time-picker-option.selected {
|
|
3051
|
-
background: var(--bg);
|
|
3052
|
-
color: var(--accent-ink);
|
|
3053
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
3608
|
+
background: var(--lmn-time-picker-bg, var(--bg));
|
|
3609
|
+
color: var(--lmn-time-picker-accent-ink, var(--accent-ink));
|
|
3610
|
+
box-shadow: var(--lmn-time-picker-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
3054
3611
|
}
|
|
3055
3612
|
.time-picker-option:disabled {
|
|
3056
|
-
color: var(--fg-subtle);
|
|
3613
|
+
color: var(--lmn-time-picker-fg-subtle, var(--fg-subtle));
|
|
3057
3614
|
cursor: not-allowed;
|
|
3058
3615
|
opacity: 0.45;
|
|
3059
3616
|
}
|
|
@@ -3063,7 +3620,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3063
3620
|
gap: 6px;
|
|
3064
3621
|
margin-top: 8px;
|
|
3065
3622
|
padding: 8px 0 0;
|
|
3066
|
-
border-top: 1px solid var(--divider);
|
|
3623
|
+
border-top: 1px solid var(--lmn-time-picker-divider, var(--divider));
|
|
3067
3624
|
}
|
|
3068
3625
|
.time-picker-footer-spacer {
|
|
3069
3626
|
flex: 1;
|
|
@@ -3077,9 +3634,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3077
3634
|
display: inline-block;
|
|
3078
3635
|
position: relative;
|
|
3079
3636
|
border-radius: var(--r-md);
|
|
3080
|
-
background: var(--bg);
|
|
3637
|
+
background: var(--lmn-image-bg, var(--bg));
|
|
3081
3638
|
padding: 6px;
|
|
3082
|
-
box-shadow: var(--neu-shadow-control);
|
|
3639
|
+
box-shadow: var(--lmn-image-neu-shadow-control, var(--neu-shadow-control));
|
|
3083
3640
|
overflow: hidden;
|
|
3084
3641
|
line-height: 0;
|
|
3085
3642
|
}
|
|
@@ -3099,8 +3656,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3099
3656
|
position: relative;
|
|
3100
3657
|
overflow: hidden;
|
|
3101
3658
|
border-radius: calc(var(--r-md) - 4px);
|
|
3102
|
-
box-shadow: var(--neu-shadow-inset);
|
|
3103
|
-
background: var(--bg-sunken);
|
|
3659
|
+
box-shadow: var(--lmn-image-neu-shadow-inset, var(--neu-shadow-inset));
|
|
3660
|
+
background: var(--lmn-image-bg-sunken, var(--bg-sunken));
|
|
3104
3661
|
}
|
|
3105
3662
|
.n-image.raw .n-image-frame {
|
|
3106
3663
|
border-radius: 0;
|
|
@@ -3123,11 +3680,11 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3123
3680
|
.n-image-placeholder {
|
|
3124
3681
|
position: absolute; inset: 0;
|
|
3125
3682
|
display: grid; place-items: center;
|
|
3126
|
-
color: var(--fg-subtle);
|
|
3683
|
+
color: var(--lmn-image-fg-subtle, var(--fg-subtle));
|
|
3127
3684
|
background:
|
|
3128
3685
|
repeating-linear-gradient(45deg,
|
|
3129
3686
|
transparent 0 10px,
|
|
3130
|
-
color-mix(in oklch, var(--fg-subtle) 8%, transparent) 10px 11px);
|
|
3687
|
+
color-mix(in oklch, var(--lmn-image-fg-subtle, var(--fg-subtle)) 8%, transparent) 10px 11px);
|
|
3131
3688
|
transition: opacity var(--dur) var(--ease);
|
|
3132
3689
|
}
|
|
3133
3690
|
.n-image-placeholder.loaded { opacity: 0; pointer-events: none; }
|
|
@@ -3147,7 +3704,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3147
3704
|
transform: translateY(-4px);
|
|
3148
3705
|
transition: opacity var(--dur) var(--ease), transform var(--dur) var(--ease);
|
|
3149
3706
|
}
|
|
3150
|
-
.n-image:hover .image-actions
|
|
3707
|
+
.n-image:hover .image-actions,
|
|
3708
|
+
.n-image:focus-within .image-actions { opacity: 1; transform: translateY(0); }
|
|
3151
3709
|
.image-actions .ia-btn {
|
|
3152
3710
|
width: 26px;
|
|
3153
3711
|
height: 26px;
|
|
@@ -3185,7 +3743,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3185
3743
|
transition: opacity var(--dur) var(--ease), transform var(--dur) var(--ease);
|
|
3186
3744
|
pointer-events: none;
|
|
3187
3745
|
}
|
|
3188
|
-
.n-image:hover .image-hint
|
|
3746
|
+
.n-image:hover .image-hint,
|
|
3747
|
+
.n-image:focus-visible .image-hint { opacity: 1; transform: translateY(0); }
|
|
3189
3748
|
.image-preview-overlay {
|
|
3190
3749
|
position: fixed; inset: 0;
|
|
3191
3750
|
background: var(--image-preview-mask-bg, var(--mask-bg));
|
|
@@ -3200,8 +3759,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3200
3759
|
outline: none;
|
|
3201
3760
|
}
|
|
3202
3761
|
.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));
|
|
3762
|
+
--image-preview-toolbar-ink: color-mix(in oklch, var(--lmn-image-accent, var(--accent)) 42%, var(--lmn-image-fg-muted, var(--fg-muted)));
|
|
3763
|
+
--image-preview-toolbar-ink-hover: color-mix(in oklch, var(--lmn-image-accent, var(--accent)) 48%, var(--lmn-image-fg, var(--fg)));
|
|
3205
3764
|
position: absolute;
|
|
3206
3765
|
top: var(--gap-5);
|
|
3207
3766
|
left: 50%;
|
|
@@ -3213,12 +3772,12 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3213
3772
|
padding: 6px;
|
|
3214
3773
|
overflow-x: auto;
|
|
3215
3774
|
color: var(--image-preview-toolbar-ink);
|
|
3216
|
-
border: 1px solid color-mix(in oklch, var(--accent) 14%, var(--border));
|
|
3775
|
+
border: 1px solid color-mix(in oklch, var(--lmn-image-accent, var(--accent)) 14%, var(--lmn-image-border, var(--border)));
|
|
3217
3776
|
border-radius: var(--r-pill);
|
|
3218
|
-
background: color-mix(in oklch, var(--bg-raised) 92%, var(--accent-soft));
|
|
3777
|
+
background: color-mix(in oklch, var(--lmn-image-bg-raised, var(--bg-raised)) 92%, var(--lmn-image-accent-soft, var(--accent-soft)));
|
|
3219
3778
|
box-shadow:
|
|
3220
|
-
var(--neu-float),
|
|
3221
|
-
0 0 0 1px color-mix(in oklch, var(--accent-glow) 22%, transparent);
|
|
3779
|
+
var(--lmn-image-neu-float, var(--neu-float)),
|
|
3780
|
+
0 0 0 1px color-mix(in oklch, var(--lmn-image-accent-glow, var(--accent-glow)) 22%, transparent);
|
|
3222
3781
|
backdrop-filter: blur(18px) saturate(1.2);
|
|
3223
3782
|
transform: translateX(-50%);
|
|
3224
3783
|
}
|
|
@@ -3230,14 +3789,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3230
3789
|
}
|
|
3231
3790
|
.image-preview-toolbar .btn.ghost:hover {
|
|
3232
3791
|
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);
|
|
3792
|
+
background: color-mix(in oklch, var(--lmn-image-accent-soft, var(--accent-soft)) 36%, var(--lmn-image-bg, var(--bg)));
|
|
3793
|
+
box-shadow: var(--lmn-image-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
3235
3794
|
}
|
|
3236
3795
|
.image-preview-toolbar .btn.ghost:active,
|
|
3237
3796
|
.image-preview-toolbar .btn.ghost.pressed {
|
|
3238
3797
|
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);
|
|
3798
|
+
background: color-mix(in oklch, var(--lmn-image-accent-soft, var(--accent-soft)) 48%, var(--lmn-image-bg, var(--bg)));
|
|
3799
|
+
box-shadow: var(--lmn-image-neu-shadow-inset-strong, var(--neu-shadow-inset-strong));
|
|
3241
3800
|
}
|
|
3242
3801
|
.image-preview-scale {
|
|
3243
3802
|
min-width: 48px;
|
|
@@ -3263,7 +3822,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3263
3822
|
max-width: 80vw;
|
|
3264
3823
|
max-height: 80vh;
|
|
3265
3824
|
border-radius: var(--r-lg);
|
|
3266
|
-
box-shadow: var(--neu-shadow-float);
|
|
3825
|
+
box-shadow: var(--lmn-image-neu-shadow-float, var(--neu-shadow-float));
|
|
3267
3826
|
transform-origin: center;
|
|
3268
3827
|
transition: transform var(--dur-fast) var(--ease);
|
|
3269
3828
|
user-select: none;
|
|
@@ -3284,9 +3843,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3284
3843
|
display: inline-block;
|
|
3285
3844
|
position: relative;
|
|
3286
3845
|
border-radius: var(--r-sm);
|
|
3287
|
-
background: var(--bg);
|
|
3846
|
+
background: var(--lmn-image-bg, var(--bg));
|
|
3288
3847
|
padding: 6px;
|
|
3289
|
-
box-shadow: var(--neu-shadow-control);
|
|
3848
|
+
box-shadow: var(--lmn-image-neu-shadow-control, var(--neu-shadow-control));
|
|
3290
3849
|
overflow: hidden;
|
|
3291
3850
|
line-height: 0;
|
|
3292
3851
|
}
|
|
@@ -3307,8 +3866,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3307
3866
|
width: 100%;
|
|
3308
3867
|
overflow: hidden;
|
|
3309
3868
|
border-radius: var(--r-sm);
|
|
3310
|
-
background: var(--bg-sunken);
|
|
3311
|
-
box-shadow: var(--neu-shadow-inset);
|
|
3869
|
+
background: var(--lmn-image-bg-sunken, var(--bg-sunken));
|
|
3870
|
+
box-shadow: var(--lmn-image-neu-shadow-inset, var(--neu-shadow-inset));
|
|
3312
3871
|
}
|
|
3313
3872
|
.n-sprite-image.raw .n-sprite-image-frame,
|
|
3314
3873
|
.n-layered-image.raw .n-layered-image-frame {
|
|
@@ -3345,8 +3904,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3345
3904
|
height: var(--ctrl-h);
|
|
3346
3905
|
padding: 0 36px 0 var(--ctrl-pad-x);
|
|
3347
3906
|
border-radius: var(--r-md);
|
|
3348
|
-
background: var(--bg);
|
|
3349
|
-
box-shadow: var(--neu-shadow-control);
|
|
3907
|
+
background: var(--lmn-cascader-bg, var(--bg));
|
|
3908
|
+
box-shadow: var(--lmn-cascader-neu-shadow-control, var(--neu-shadow-control));
|
|
3350
3909
|
display: inline-flex;
|
|
3351
3910
|
align-items: center;
|
|
3352
3911
|
font-size: 13px;
|
|
@@ -3354,11 +3913,18 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3354
3913
|
cursor: pointer;
|
|
3355
3914
|
position: relative;
|
|
3356
3915
|
border: none;
|
|
3357
|
-
color: var(--fg);
|
|
3916
|
+
color: var(--lmn-cascader-fg, var(--fg));
|
|
3358
3917
|
text-align: left;
|
|
3359
3918
|
}
|
|
3360
|
-
.cascader-trigger.placeholder { color: var(--fg-subtle); }
|
|
3361
|
-
.cascader
|
|
3919
|
+
.cascader-trigger.placeholder { color: var(--lmn-cascader-fg-subtle, var(--fg-subtle)); }
|
|
3920
|
+
.cascader-value {
|
|
3921
|
+
flex: 1;
|
|
3922
|
+
min-width: 0;
|
|
3923
|
+
overflow: hidden;
|
|
3924
|
+
white-space: nowrap;
|
|
3925
|
+
text-overflow: ellipsis;
|
|
3926
|
+
}
|
|
3927
|
+
.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
3928
|
.cascader-clear {
|
|
3363
3929
|
position: absolute;
|
|
3364
3930
|
right: 30px;
|
|
@@ -3367,25 +3933,27 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3367
3933
|
width: 20px;
|
|
3368
3934
|
height: 20px;
|
|
3369
3935
|
border-radius: 999px;
|
|
3370
|
-
background: var(--bg);
|
|
3371
|
-
box-shadow: var(--neu-shadow-control);
|
|
3936
|
+
background: var(--lmn-cascader-bg, var(--bg));
|
|
3937
|
+
box-shadow: var(--lmn-cascader-neu-shadow-control, var(--neu-shadow-control));
|
|
3372
3938
|
display: inline-grid;
|
|
3373
3939
|
place-items: center;
|
|
3374
|
-
color: var(--fg-subtle);
|
|
3940
|
+
color: var(--lmn-cascader-fg-subtle, var(--fg-subtle));
|
|
3375
3941
|
opacity: 0;
|
|
3376
3942
|
transition: all var(--dur-fast) var(--ease);
|
|
3377
3943
|
}
|
|
3378
3944
|
.cascader:hover .cascader-clear { opacity: 1; }
|
|
3379
|
-
.cascader-clear:hover { color: var(--accent-ink); box-shadow: var(--neu-shadow-inset); }
|
|
3945
|
+
.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
3946
|
.cascader-panel {
|
|
3381
3947
|
z-index: 1000;
|
|
3382
3948
|
display: flex;
|
|
3383
|
-
background: var(--bg);
|
|
3949
|
+
background: var(--lmn-cascader-bg, var(--bg));
|
|
3384
3950
|
border-radius: var(--r-md);
|
|
3385
|
-
box-shadow: var(--neu-shadow-float);
|
|
3951
|
+
box-shadow: var(--lmn-cascader-neu-shadow-float, var(--neu-shadow-float));
|
|
3386
3952
|
padding: 6px;
|
|
3387
3953
|
animation: menuIn var(--dur) var(--ease);
|
|
3388
3954
|
gap: 4px;
|
|
3955
|
+
max-width: calc(100vw - 16px);
|
|
3956
|
+
overflow-x: auto;
|
|
3389
3957
|
}
|
|
3390
3958
|
.cascader-panel.with-search {
|
|
3391
3959
|
flex-direction: column;
|
|
@@ -3397,20 +3965,20 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3397
3965
|
}
|
|
3398
3966
|
.cascader-search {
|
|
3399
3967
|
padding: 4px 2px 8px;
|
|
3400
|
-
border-bottom: 1px solid var(--divider);
|
|
3968
|
+
border-bottom: 1px solid var(--lmn-cascader-divider, var(--divider));
|
|
3401
3969
|
}
|
|
3402
3970
|
.cascader-search-list {
|
|
3403
3971
|
display: flex;
|
|
3404
3972
|
flex-direction: column;
|
|
3405
3973
|
gap: 4px;
|
|
3406
|
-
max-height:
|
|
3974
|
+
max-height: var(--cascader-list-height, 280px);
|
|
3407
3975
|
overflow-y: auto;
|
|
3408
3976
|
padding: 4px;
|
|
3409
3977
|
}
|
|
3410
3978
|
.cascader-search-item {
|
|
3411
3979
|
border: none;
|
|
3412
3980
|
background: transparent;
|
|
3413
|
-
color: var(--fg);
|
|
3981
|
+
color: var(--lmn-cascader-fg, var(--fg));
|
|
3414
3982
|
border-radius: var(--r-sm);
|
|
3415
3983
|
padding: 8px 10px;
|
|
3416
3984
|
display: flex;
|
|
@@ -3422,26 +3990,26 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3422
3990
|
cursor: pointer;
|
|
3423
3991
|
}
|
|
3424
3992
|
.cascader-search-item:hover {
|
|
3425
|
-
background: var(--bg);
|
|
3426
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
3427
|
-
color: var(--accent-ink);
|
|
3993
|
+
background: var(--lmn-cascader-bg, var(--bg));
|
|
3994
|
+
box-shadow: var(--lmn-cascader-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
3995
|
+
color: var(--lmn-cascader-accent-ink, var(--accent-ink));
|
|
3428
3996
|
}
|
|
3429
|
-
.cascader-path-sep { color: var(--fg-subtle); }
|
|
3997
|
+
.cascader-path-sep { color: var(--lmn-cascader-fg-subtle, var(--fg-subtle)); }
|
|
3430
3998
|
.cascader-empty {
|
|
3431
3999
|
padding: 24px 12px;
|
|
3432
4000
|
text-align: center;
|
|
3433
|
-
color: var(--fg-muted);
|
|
4001
|
+
color: var(--lmn-cascader-fg-muted, var(--fg-muted));
|
|
3434
4002
|
font-size: 12px;
|
|
3435
4003
|
}
|
|
3436
4004
|
.cascader-col {
|
|
3437
4005
|
min-width: 160px;
|
|
3438
|
-
max-height: 280px;
|
|
4006
|
+
max-height: var(--cascader-list-height, 280px);
|
|
3439
4007
|
overflow-y: auto;
|
|
3440
4008
|
padding: 4px;
|
|
3441
4009
|
border-radius: var(--r-sm);
|
|
3442
4010
|
}
|
|
3443
4011
|
.cascader-col + .cascader-col {
|
|
3444
|
-
border-left: 1px solid var(--divider);
|
|
4012
|
+
border-left: 1px solid var(--lmn-cascader-divider, var(--divider));
|
|
3445
4013
|
margin-left: 2px;
|
|
3446
4014
|
padding-left: 6px;
|
|
3447
4015
|
}
|
|
@@ -3449,7 +4017,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3449
4017
|
padding: 8px 10px;
|
|
3450
4018
|
border-radius: var(--r-sm);
|
|
3451
4019
|
font-size: 13px;
|
|
3452
|
-
color: var(--fg);
|
|
4020
|
+
color: var(--lmn-cascader-fg, var(--fg));
|
|
3453
4021
|
cursor: pointer;
|
|
3454
4022
|
display: flex;
|
|
3455
4023
|
align-items: center;
|
|
@@ -3468,27 +4036,36 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3468
4036
|
line-height: 0;
|
|
3469
4037
|
flex-shrink: 0;
|
|
3470
4038
|
}
|
|
4039
|
+
.cascader-panel.custom-options .cascader-col {
|
|
4040
|
+
min-width: 240px;
|
|
4041
|
+
}
|
|
4042
|
+
.cascader-item-label,
|
|
4043
|
+
.cascader-item-custom {
|
|
4044
|
+
flex: 1;
|
|
4045
|
+
min-width: 0;
|
|
4046
|
+
text-align: left;
|
|
4047
|
+
}
|
|
3471
4048
|
.cascader-icon img {
|
|
3472
4049
|
display: block;
|
|
3473
4050
|
width: 15px;
|
|
3474
4051
|
height: 15px;
|
|
3475
4052
|
object-fit: contain;
|
|
3476
4053
|
}
|
|
3477
|
-
.cascader-item:hover { background: var(--bg); box-shadow: var(--neu-shadow-subtle); color: var(--accent-ink); }
|
|
4054
|
+
.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
4055
|
.cascader-item.active {
|
|
3479
|
-
background: var(--bg);
|
|
3480
|
-
box-shadow: var(--neu-shadow-inset);
|
|
3481
|
-
color: var(--accent-ink);
|
|
4056
|
+
background: var(--lmn-cascader-bg, var(--bg));
|
|
4057
|
+
box-shadow: var(--lmn-cascader-neu-shadow-inset, var(--neu-shadow-inset));
|
|
4058
|
+
color: var(--lmn-cascader-accent-ink, var(--accent-ink));
|
|
3482
4059
|
font-weight: 500;
|
|
3483
4060
|
}
|
|
3484
|
-
.cascader-item .chev { margin-left: auto; color: var(--fg-subtle); display: inline-flex; }
|
|
3485
|
-
.cascader-item.active .chev { color: var(--accent); }
|
|
4061
|
+
.cascader-item .chev { margin-left: auto; color: var(--lmn-cascader-fg-subtle, var(--fg-subtle)); display: inline-flex; }
|
|
4062
|
+
.cascader-item.active .chev { color: var(--lmn-cascader-accent, var(--accent)); }
|
|
3486
4063
|
/* ============================================================================
|
|
3487
4064
|
* Typography
|
|
3488
4065
|
* ========================================================================== */
|
|
3489
4066
|
.typo-root {
|
|
3490
4067
|
font-family: var(--font-sans);
|
|
3491
|
-
color: var(--fg);
|
|
4068
|
+
color: var(--lmn-typography-fg, var(--fg));
|
|
3492
4069
|
line-height: 1.7;
|
|
3493
4070
|
font-size: 14px;
|
|
3494
4071
|
}
|
|
@@ -3499,16 +4076,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3499
4076
|
.typo-root > .typo-title:first-child { margin-top: 0; }
|
|
3500
4077
|
/* ---- Base ---- */
|
|
3501
4078
|
.typo {
|
|
3502
|
-
color: var(--fg);
|
|
4079
|
+
color: var(--lmn-typography-fg, var(--fg));
|
|
3503
4080
|
font-family: var(--font-sans);
|
|
3504
4081
|
word-wrap: break-word;
|
|
3505
4082
|
}
|
|
3506
4083
|
/* 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; }
|
|
4084
|
+
.typo.secondary { color: var(--lmn-typography-fg-muted, var(--fg-muted)); }
|
|
4085
|
+
.typo.success { color: var(--lmn-typography-success, var(--success)); }
|
|
4086
|
+
.typo.warning { color: var(--lmn-typography-warning, var(--warning)); }
|
|
4087
|
+
.typo.danger { color: var(--lmn-typography-danger, var(--danger)); }
|
|
4088
|
+
.typo.disabled { color: var(--lmn-typography-fg-subtle, var(--fg-subtle)); cursor: not-allowed; user-select: none; }
|
|
3512
4089
|
/* Decorations */
|
|
3513
4090
|
.typo.strong { font-weight: 600; }
|
|
3514
4091
|
.typo.italic { font-style: italic; }
|
|
@@ -3516,7 +4093,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3516
4093
|
.typo.del { text-decoration: line-through; text-decoration-thickness: 1.5px; }
|
|
3517
4094
|
/* mark / code / kbd render their own elements; we still color the shell */
|
|
3518
4095
|
.typo mark {
|
|
3519
|
-
background: color-mix(in oklch, var(--warning)
|
|
4096
|
+
background: color-mix(in oklch, var(--lmn-typography-warning, var(--warning)) 33%, transparent);
|
|
3520
4097
|
color: inherit;
|
|
3521
4098
|
padding: 0 3px;
|
|
3522
4099
|
border-radius: 3px;
|
|
@@ -3526,9 +4103,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3526
4103
|
font-size: 0.88em;
|
|
3527
4104
|
padding: 1px 6px;
|
|
3528
4105
|
border-radius: 5px;
|
|
3529
|
-
background: var(--bg-sunken);
|
|
3530
|
-
box-shadow: var(--neu-shadow-inset);
|
|
3531
|
-
color: var(--accent-ink);
|
|
4106
|
+
background: var(--lmn-typography-bg-sunken, var(--bg-sunken));
|
|
4107
|
+
box-shadow: var(--lmn-typography-neu-shadow-inset, var(--neu-shadow-inset));
|
|
4108
|
+
color: var(--lmn-typography-accent-ink, var(--accent-ink));
|
|
3532
4109
|
margin: 0 2px;
|
|
3533
4110
|
}
|
|
3534
4111
|
.typo kbd {
|
|
@@ -3536,10 +4113,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3536
4113
|
font-size: 0.82em;
|
|
3537
4114
|
padding: 1px 7px;
|
|
3538
4115
|
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);
|
|
4116
|
+
background: var(--lmn-typography-bg-raised, var(--bg-raised));
|
|
4117
|
+
box-shadow: var(--lmn-typography-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
4118
|
+
border: 1px solid var(--lmn-typography-border, var(--border));
|
|
4119
|
+
color: var(--lmn-typography-fg, var(--fg));
|
|
3543
4120
|
margin: 0 2px;
|
|
3544
4121
|
line-height: 1.4;
|
|
3545
4122
|
display: inline-block;
|
|
@@ -3551,7 +4128,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3551
4128
|
font-weight: 700;
|
|
3552
4129
|
letter-spacing: -0.01em;
|
|
3553
4130
|
line-height: 1.25;
|
|
3554
|
-
color: var(--fg);
|
|
4131
|
+
color: var(--lmn-typography-fg, var(--fg));
|
|
3555
4132
|
margin: 0;
|
|
3556
4133
|
}
|
|
3557
4134
|
.typo-title.h1 { font-size: 32px; letter-spacing: -0.02em; }
|
|
@@ -3565,13 +4142,22 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3565
4142
|
font-size: 14px;
|
|
3566
4143
|
line-height: 1.75;
|
|
3567
4144
|
margin: 0;
|
|
3568
|
-
color: var(--fg);
|
|
4145
|
+
color: var(--lmn-typography-fg, var(--fg));
|
|
3569
4146
|
}
|
|
3570
4147
|
/* ---- Text ---- */
|
|
3571
4148
|
.typo-text { font-size: inherit; line-height: inherit; }
|
|
3572
4149
|
/* ---- Link ---- */
|
|
4150
|
+
.typo-link-group {
|
|
4151
|
+
display: inline-flex;
|
|
4152
|
+
align-items: center;
|
|
4153
|
+
max-width: 100%;
|
|
4154
|
+
vertical-align: baseline;
|
|
4155
|
+
}
|
|
4156
|
+
.typo-link-group > .typo-link { min-width: 0; }
|
|
4157
|
+
.typo-link-group > .typo-action,
|
|
4158
|
+
.typo-link-group > .typo-expand { flex: 0 0 auto; }
|
|
3573
4159
|
.typo-link {
|
|
3574
|
-
color: var(--accent-ink);
|
|
4160
|
+
color: var(--lmn-typography-accent-ink, var(--accent-ink));
|
|
3575
4161
|
text-decoration: none;
|
|
3576
4162
|
transition: color var(--dur-fast) var(--ease), text-decoration-color var(--dur-fast) var(--ease);
|
|
3577
4163
|
cursor: pointer;
|
|
@@ -3580,14 +4166,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3580
4166
|
align-items: center;
|
|
3581
4167
|
gap: 3px;
|
|
3582
4168
|
}
|
|
3583
|
-
.typo-link:hover { color: var(--accent); text-decoration: underline; }
|
|
4169
|
+
.typo-link:hover { color: var(--lmn-typography-accent, var(--accent)); text-decoration: underline; }
|
|
3584
4170
|
.typo-link:focus-visible {
|
|
3585
|
-
outline: 2px solid var(--accent-glow);
|
|
4171
|
+
outline: 2px solid var(--lmn-typography-accent-glow, var(--accent-glow));
|
|
3586
4172
|
outline-offset: 2px;
|
|
3587
4173
|
border-radius: 2px;
|
|
3588
4174
|
}
|
|
3589
4175
|
.typo-link.disabled {
|
|
3590
|
-
color: var(--fg-subtle);
|
|
4176
|
+
color: var(--lmn-typography-fg-subtle, var(--fg-subtle));
|
|
3591
4177
|
cursor: not-allowed;
|
|
3592
4178
|
pointer-events: auto;
|
|
3593
4179
|
text-decoration: none;
|
|
@@ -3610,26 +4196,31 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3610
4196
|
margin-left: 5px;
|
|
3611
4197
|
border-radius: 6px;
|
|
3612
4198
|
cursor: pointer;
|
|
3613
|
-
color: var(--fg-subtle);
|
|
4199
|
+
color: var(--lmn-typography-fg-subtle, var(--fg-subtle));
|
|
3614
4200
|
line-height: 1;
|
|
3615
4201
|
transition: color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
|
|
3616
4202
|
vertical-align: -0.18em;
|
|
3617
4203
|
user-select: none;
|
|
4204
|
+
padding: 0;
|
|
4205
|
+
border: none;
|
|
4206
|
+
background: transparent;
|
|
4207
|
+
font: inherit;
|
|
3618
4208
|
}
|
|
3619
4209
|
.typo-action > svg {
|
|
3620
4210
|
display: block;
|
|
3621
4211
|
flex-shrink: 0;
|
|
3622
4212
|
}
|
|
3623
4213
|
.typo-action:hover {
|
|
3624
|
-
color: var(--accent-ink);
|
|
3625
|
-
background: var(--bg);
|
|
3626
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
4214
|
+
color: var(--lmn-typography-accent-ink, var(--accent-ink));
|
|
4215
|
+
background: var(--lmn-typography-bg, var(--bg));
|
|
4216
|
+
box-shadow: var(--lmn-typography-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
3627
4217
|
}
|
|
3628
4218
|
.typo-action:focus-visible {
|
|
3629
|
-
outline: 2px solid var(--accent-glow);
|
|
4219
|
+
outline: 2px solid var(--lmn-typography-accent-glow, var(--accent-glow));
|
|
3630
4220
|
outline-offset: 1px;
|
|
3631
4221
|
}
|
|
3632
|
-
.typo-copy.copied { color: var(--success); }
|
|
4222
|
+
.typo-copy.copied { color: var(--lmn-typography-success, var(--success)); }
|
|
4223
|
+
.typo-copy.error { color: var(--lmn-typography-danger, var(--danger)); }
|
|
3633
4224
|
/* Editable text trigger overlays */
|
|
3634
4225
|
.typo-edit-text-trigger {
|
|
3635
4226
|
cursor: text;
|
|
@@ -3638,14 +4229,32 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3638
4229
|
padding: 0 2px;
|
|
3639
4230
|
margin: 0 -2px;
|
|
3640
4231
|
}
|
|
3641
|
-
.typo-edit-text-trigger:hover { background: color-mix(in oklch, var(--accent) 8%, transparent); }
|
|
4232
|
+
.typo-edit-text-trigger:hover { background: color-mix(in oklch, var(--lmn-typography-accent, var(--accent)) 8%, transparent); }
|
|
3642
4233
|
/* ---- Editor (input / textarea) ---- */
|
|
3643
4234
|
.typo.editing { display: block; }
|
|
4235
|
+
.typo-editor-wrap {
|
|
4236
|
+
display: inline-flex;
|
|
4237
|
+
align-items: center;
|
|
4238
|
+
gap: var(--gap-1);
|
|
4239
|
+
width: 100%;
|
|
4240
|
+
max-width: 100%;
|
|
4241
|
+
}
|
|
4242
|
+
.typo-editor-wrap > .typo-editor { min-width: 0; }
|
|
4243
|
+
.typo-enter {
|
|
4244
|
+
flex: 0 0 auto;
|
|
4245
|
+
margin-left: 0;
|
|
4246
|
+
}
|
|
4247
|
+
.typo.typo-link-editor-shell {
|
|
4248
|
+
display: inline-flex;
|
|
4249
|
+
min-width: 0;
|
|
4250
|
+
flex: 1 1 auto;
|
|
4251
|
+
}
|
|
4252
|
+
.typo.typo-link-editing-anchor { display: none; }
|
|
3644
4253
|
.typo-editor {
|
|
3645
4254
|
font: inherit;
|
|
3646
4255
|
color: inherit;
|
|
3647
|
-
background: var(--bg-sunken);
|
|
3648
|
-
box-shadow: var(--neu-shadow-inset-strong);
|
|
4256
|
+
background: var(--lmn-typography-bg-sunken, var(--bg-sunken));
|
|
4257
|
+
box-shadow: var(--lmn-typography-neu-shadow-inset-strong, var(--neu-shadow-inset-strong));
|
|
3649
4258
|
border: none;
|
|
3650
4259
|
outline: none;
|
|
3651
4260
|
width: 100%;
|
|
@@ -3660,7 +4269,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3660
4269
|
font-family: inherit;
|
|
3661
4270
|
}
|
|
3662
4271
|
.typo-editor:focus {
|
|
3663
|
-
box-shadow: var(--neu-shadow-inset-strong), 0 0 0 3px var(--accent-glow);
|
|
4272
|
+
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
4273
|
}
|
|
3665
4274
|
/* ---- Ellipsis ---- */
|
|
3666
4275
|
.typo.ellipsis {
|
|
@@ -3692,23 +4301,59 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3692
4301
|
-webkit-box-orient: vertical;
|
|
3693
4302
|
overflow: hidden;
|
|
3694
4303
|
}
|
|
4304
|
+
/* 后缀与裁切正文分栏,确保后缀不进入 overflow / line-clamp 区域。 */
|
|
4305
|
+
.typo.ellipsis-with-suffix {
|
|
4306
|
+
display: inline-flex;
|
|
4307
|
+
align-items: flex-end;
|
|
4308
|
+
max-width: 100%;
|
|
4309
|
+
min-width: 0;
|
|
4310
|
+
vertical-align: bottom;
|
|
4311
|
+
}
|
|
4312
|
+
.typo-paragraph.ellipsis-with-suffix,
|
|
4313
|
+
.typo-title.ellipsis-with-suffix {
|
|
4314
|
+
display: flex;
|
|
4315
|
+
}
|
|
4316
|
+
.typo-ellipsis-content {
|
|
4317
|
+
flex: 0 1 auto;
|
|
4318
|
+
min-width: 0;
|
|
4319
|
+
max-width: 100%;
|
|
4320
|
+
}
|
|
4321
|
+
.typo-ellipsis-content.ellipsis {
|
|
4322
|
+
display: block;
|
|
4323
|
+
overflow: hidden;
|
|
4324
|
+
white-space: nowrap;
|
|
4325
|
+
text-overflow: ellipsis;
|
|
4326
|
+
}
|
|
4327
|
+
.typo-ellipsis-content.ellipsis-multi {
|
|
4328
|
+
display: -webkit-box;
|
|
4329
|
+
-webkit-box-orient: vertical;
|
|
4330
|
+
overflow: hidden;
|
|
4331
|
+
}
|
|
3695
4332
|
.typo-expand {
|
|
3696
4333
|
margin-left: 4px;
|
|
3697
|
-
color: var(--accent-ink);
|
|
4334
|
+
color: var(--lmn-typography-accent-ink, var(--accent-ink));
|
|
3698
4335
|
cursor: pointer;
|
|
3699
4336
|
font-size: 0.92em;
|
|
3700
4337
|
user-select: none;
|
|
4338
|
+
padding: 0;
|
|
4339
|
+
border: none;
|
|
4340
|
+
background: transparent;
|
|
4341
|
+
font: inherit;
|
|
4342
|
+
}
|
|
4343
|
+
.typo-expand:hover { color: var(--lmn-typography-accent, var(--accent)); text-decoration: underline; text-underline-offset: 3px; }
|
|
4344
|
+
.typo-suffix {
|
|
4345
|
+
flex: none;
|
|
4346
|
+
margin-left: 0.25em;
|
|
3701
4347
|
}
|
|
3702
|
-
.typo-expand:hover { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
|
|
3703
4348
|
.typo-ellipsis-tooltip {
|
|
3704
4349
|
display: block;
|
|
3705
4350
|
box-sizing: border-box;
|
|
3706
4351
|
max-width: min(520px, calc(100vw - 32px));
|
|
3707
4352
|
padding: 7px 10px;
|
|
3708
4353
|
border-radius: var(--r-sm);
|
|
3709
|
-
background: var(--bg-sunken);
|
|
3710
|
-
color: var(--fg);
|
|
3711
|
-
box-shadow: var(--neu-shadow-control);
|
|
4354
|
+
background: var(--lmn-typography-bg-sunken, var(--bg-sunken));
|
|
4355
|
+
color: var(--lmn-typography-fg, var(--fg));
|
|
4356
|
+
box-shadow: var(--lmn-typography-neu-shadow-control, var(--neu-shadow-control));
|
|
3712
4357
|
font-size: 12px;
|
|
3713
4358
|
font-weight: 500;
|
|
3714
4359
|
line-height: 1.55;
|
|
@@ -3724,11 +4369,6 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3724
4369
|
animation: fadeIn var(--dur) var(--ease);
|
|
3725
4370
|
z-index: 1000;
|
|
3726
4371
|
}
|
|
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
4372
|
/* ============================================================================
|
|
3733
4373
|
* Container & trigger
|
|
3734
4374
|
* ========================================================================== */
|
|
@@ -3742,16 +4382,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3742
4382
|
gap: 8px;
|
|
3743
4383
|
padding: 4px;
|
|
3744
4384
|
border: none;
|
|
3745
|
-
background: var(--bg);
|
|
3746
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
4385
|
+
background: var(--lmn-color-picker-bg, var(--bg));
|
|
4386
|
+
box-shadow: var(--lmn-color-picker-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
3747
4387
|
border-radius: 10px;
|
|
3748
4388
|
cursor: pointer;
|
|
3749
4389
|
transition: box-shadow var(--dur) var(--ease);
|
|
3750
|
-
color: var(--fg);
|
|
4390
|
+
color: var(--lmn-color-picker-fg, var(--fg));
|
|
3751
4391
|
font: inherit;
|
|
3752
4392
|
}
|
|
3753
4393
|
.cp-trigger:hover:not(:disabled) {
|
|
3754
|
-
box-shadow: var(--neu-shadow-panel);
|
|
4394
|
+
box-shadow: var(--lmn-color-picker-neu-shadow-panel, var(--neu-shadow-panel));
|
|
3755
4395
|
}
|
|
3756
4396
|
.cp-trigger:disabled {
|
|
3757
4397
|
opacity: 0.5;
|
|
@@ -3768,12 +4408,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3768
4408
|
font: inherit;
|
|
3769
4409
|
}
|
|
3770
4410
|
.cp-custom-trigger:disabled { opacity: 0.5; cursor: not-allowed; }
|
|
4411
|
+
.cp-custom-trigger[aria-disabled="true"] { opacity: 0.5; cursor: not-allowed; }
|
|
3771
4412
|
.cp-swatch {
|
|
3772
4413
|
display: inline-block;
|
|
3773
4414
|
width: 22px;
|
|
3774
4415
|
height: 22px;
|
|
3775
4416
|
border-radius: 6px;
|
|
3776
|
-
box-shadow: inset 0 0 0 1px
|
|
4417
|
+
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
4418
|
background-clip: padding-box;
|
|
3778
4419
|
}
|
|
3779
4420
|
.cp-trigger.sm .cp-swatch { width: 18px; height: 18px; border-radius: 5px; }
|
|
@@ -3786,7 +4427,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3786
4427
|
.cp-text {
|
|
3787
4428
|
font-family: var(--font-mono);
|
|
3788
4429
|
font-size: 12px;
|
|
3789
|
-
color: var(--fg-muted);
|
|
4430
|
+
color: var(--lmn-color-picker-fg-muted, var(--fg-muted));
|
|
3790
4431
|
padding-right: 6px;
|
|
3791
4432
|
}
|
|
3792
4433
|
/* ============================================================================
|
|
@@ -3797,9 +4438,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3797
4438
|
z-index: 1000;
|
|
3798
4439
|
width: 232px;
|
|
3799
4440
|
padding: 12px;
|
|
3800
|
-
background: var(--bg);
|
|
4441
|
+
background: var(--lmn-color-picker-bg, var(--bg));
|
|
3801
4442
|
border-radius: var(--r-md);
|
|
3802
|
-
box-shadow: var(--neu-shadow-float);
|
|
4443
|
+
box-shadow: var(--lmn-color-picker-neu-shadow-float, var(--neu-shadow-float));
|
|
3803
4444
|
display: flex;
|
|
3804
4445
|
flex-direction: column;
|
|
3805
4446
|
gap: 10px;
|
|
@@ -3822,6 +4463,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3822
4463
|
cursor: crosshair;
|
|
3823
4464
|
touch-action: none;
|
|
3824
4465
|
user-select: none;
|
|
4466
|
+
box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--lmn-color-picker-fg, var(--fg)) 10%, transparent);
|
|
3825
4467
|
}
|
|
3826
4468
|
.cp-board-white,
|
|
3827
4469
|
.cp-board-black {
|
|
@@ -3863,7 +4505,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3863
4505
|
hsl(300, 100%, 50%),
|
|
3864
4506
|
hsl(360, 100%, 50%)
|
|
3865
4507
|
);
|
|
3866
|
-
box-shadow: inset 0 0 0 1px
|
|
4508
|
+
box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--lmn-color-picker-fg, var(--fg)) 10%, transparent);
|
|
3867
4509
|
cursor: pointer;
|
|
3868
4510
|
touch-action: none;
|
|
3869
4511
|
user-select: none;
|
|
@@ -3894,16 +4536,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3894
4536
|
padding: 0 10px;
|
|
3895
4537
|
border: none;
|
|
3896
4538
|
outline: none;
|
|
3897
|
-
background: var(--bg-sunken);
|
|
3898
|
-
box-shadow: var(--neu-shadow-inset);
|
|
4539
|
+
background: var(--lmn-color-picker-bg-sunken, var(--bg-sunken));
|
|
4540
|
+
box-shadow: var(--lmn-color-picker-neu-shadow-inset, var(--neu-shadow-inset));
|
|
3899
4541
|
border-radius: 7px;
|
|
3900
4542
|
font-family: var(--font-mono);
|
|
3901
4543
|
font-size: 12px;
|
|
3902
|
-
color: var(--fg);
|
|
4544
|
+
color: var(--lmn-color-picker-fg, var(--fg));
|
|
3903
4545
|
text-transform: lowercase;
|
|
3904
4546
|
}
|
|
3905
4547
|
.cp-input:focus {
|
|
3906
|
-
box-shadow: var(--neu-shadow-inset), 0 0 0 2px var(--accent-soft);
|
|
4548
|
+
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
4549
|
}
|
|
3908
4550
|
.cp-presets {
|
|
3909
4551
|
display: grid;
|
|
@@ -3917,30 +4559,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3917
4559
|
border: none;
|
|
3918
4560
|
padding: 0;
|
|
3919
4561
|
cursor: pointer;
|
|
3920
|
-
box-shadow: inset 0 0 0 1px
|
|
4562
|
+
box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--lmn-color-picker-fg, var(--fg)) 10%, transparent);
|
|
3921
4563
|
transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
|
|
3922
4564
|
}
|
|
3923
4565
|
.cp-preset:hover {
|
|
3924
4566
|
transform: scale(1.1);
|
|
3925
4567
|
}
|
|
3926
4568
|
.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);
|
|
4569
|
+
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
4570
|
}
|
|
3945
4571
|
/* ============ TitleBar (Electron) ============ */
|
|
3946
4572
|
.titlebar {
|
|
@@ -3949,15 +4575,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3949
4575
|
gap: var(--gap-3);
|
|
3950
4576
|
padding: 0 var(--gap-3);
|
|
3951
4577
|
height: 40px;
|
|
3952
|
-
background: var(--bg);
|
|
4578
|
+
background: var(--lmn-app-shell-bg, var(--bg));
|
|
3953
4579
|
-webkit-app-region: drag;
|
|
3954
4580
|
user-select: none;
|
|
3955
|
-
border-bottom: 1px solid var(--divider);
|
|
4581
|
+
border-bottom: 1px solid var(--lmn-app-shell-divider, var(--divider));
|
|
3956
4582
|
position: relative;
|
|
3957
4583
|
z-index: 5;
|
|
3958
4584
|
overflow: visible;
|
|
3959
4585
|
}
|
|
3960
4586
|
.titlebar.windows { padding-right: 0; }
|
|
4587
|
+
.titlebar.no-drag { -webkit-app-region: no-drag; }
|
|
3961
4588
|
.titlebar-title {
|
|
3962
4589
|
display: inline-flex;
|
|
3963
4590
|
align-items: center;
|
|
@@ -3985,8 +4612,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3985
4612
|
width: 13px; height: 13px;
|
|
3986
4613
|
border: none; padding: 0;
|
|
3987
4614
|
border-radius: 999px;
|
|
3988
|
-
background: var(--bg);
|
|
3989
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
4615
|
+
background: var(--lmn-app-shell-bg, var(--bg));
|
|
4616
|
+
box-shadow: var(--lmn-app-shell-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
3990
4617
|
position: relative;
|
|
3991
4618
|
cursor: pointer;
|
|
3992
4619
|
transition: transform var(--dur-fast) var(--ease);
|
|
@@ -3995,13 +4622,18 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
3995
4622
|
content: "";
|
|
3996
4623
|
position: absolute; inset: 2px;
|
|
3997
4624
|
border-radius: 999px;
|
|
3998
|
-
background: var(--dot, var(--fg-subtle));
|
|
4625
|
+
background: var(--dot, var(--lmn-app-shell-fg-subtle, var(--fg-subtle)));
|
|
3999
4626
|
opacity: 0.85;
|
|
4000
4627
|
}
|
|
4001
4628
|
.win-controls.mac .win-btn.close { --dot: #ff5f57; }
|
|
4002
4629
|
.win-controls.mac .win-btn.minimize { --dot: #febc2e; }
|
|
4003
4630
|
.win-controls.mac .win-btn.maximize { --dot: #28c840; }
|
|
4004
4631
|
.win-controls.mac .win-btn:hover { transform: scale(1.08); }
|
|
4632
|
+
.win-controls .win-btn:disabled {
|
|
4633
|
+
opacity: 0.45;
|
|
4634
|
+
cursor: default;
|
|
4635
|
+
pointer-events: none;
|
|
4636
|
+
}
|
|
4005
4637
|
/* Windows controls */
|
|
4006
4638
|
.win-controls.windows {
|
|
4007
4639
|
display: inline-flex;
|
|
@@ -4016,7 +4648,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4016
4648
|
padding: 0;
|
|
4017
4649
|
border-radius: 8px;
|
|
4018
4650
|
background: transparent;
|
|
4019
|
-
color: var(--fg-muted);
|
|
4651
|
+
color: var(--lmn-app-shell-fg-muted, var(--fg-muted));
|
|
4020
4652
|
display: inline-grid;
|
|
4021
4653
|
place-items: center;
|
|
4022
4654
|
cursor: pointer;
|
|
@@ -4026,11 +4658,11 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4026
4658
|
overflow: visible;
|
|
4027
4659
|
}
|
|
4028
4660
|
.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); }
|
|
4661
|
+
.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
4662
|
.win-controls.windows .win-btn.close:hover {
|
|
4031
|
-
background: var(--danger);
|
|
4663
|
+
background: var(--lmn-app-shell-danger, var(--danger));
|
|
4032
4664
|
color: white;
|
|
4033
|
-
box-shadow: 2px 2px 4px color-mix(in oklch, var(--danger) 30%, var(--shadow-dark));
|
|
4665
|
+
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
4666
|
}
|
|
4035
4667
|
/* ============ Sidebar ============ */
|
|
4036
4668
|
.sidebar {
|
|
@@ -4038,23 +4670,24 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4038
4670
|
flex-direction: column;
|
|
4039
4671
|
width: 220px;
|
|
4040
4672
|
padding: 12px;
|
|
4041
|
-
background: var(--bg);
|
|
4042
|
-
border-right: 1px solid var(--divider);
|
|
4673
|
+
background: var(--lmn-app-shell-bg, var(--bg));
|
|
4674
|
+
border-right: 1px solid var(--lmn-app-shell-divider, var(--divider));
|
|
4043
4675
|
flex-shrink: 0;
|
|
4044
4676
|
overflow-y: auto;
|
|
4045
4677
|
gap: 4px;
|
|
4046
4678
|
}
|
|
4047
4679
|
.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); }
|
|
4680
|
+
.sidebar-header { padding: 4px 8px 12px; border-bottom: 1px solid var(--lmn-app-shell-divider, var(--divider)); margin-bottom: 8px; }
|
|
4681
|
+
.sidebar-footer { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--lmn-app-shell-divider, var(--divider)); }
|
|
4050
4682
|
.sidebar-nav { display: flex; flex-direction: column; gap: 2px; }
|
|
4683
|
+
.sidebar-children { display: flex; flex-direction: column; gap: 2px; }
|
|
4051
4684
|
.sidebar-item {
|
|
4052
4685
|
display: flex; align-items: center; gap: 10px;
|
|
4053
|
-
padding: 10px 12px;
|
|
4686
|
+
padding: 10px 12px 10px calc(12px + var(--sidebar-indent, 0px));
|
|
4054
4687
|
border: none;
|
|
4055
4688
|
border-radius: var(--r-sm);
|
|
4056
4689
|
background: transparent;
|
|
4057
|
-
color: var(--fg-muted);
|
|
4690
|
+
color: var(--lmn-app-shell-fg-muted, var(--fg-muted));
|
|
4058
4691
|
font-size: 13px;
|
|
4059
4692
|
font-family: inherit;
|
|
4060
4693
|
text-align: left;
|
|
@@ -4062,11 +4695,11 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4062
4695
|
width: 100%;
|
|
4063
4696
|
transition: all var(--dur-fast) var(--ease);
|
|
4064
4697
|
}
|
|
4065
|
-
.sidebar-item:hover { color: var(--fg); background: var(--bg); box-shadow: var(--neu-shadow-subtle); }
|
|
4698
|
+
.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
4699
|
.sidebar-item.active {
|
|
4067
|
-
color: var(--accent-ink);
|
|
4068
|
-
background: var(--bg);
|
|
4069
|
-
box-shadow: var(--neu-shadow-inset);
|
|
4700
|
+
color: var(--lmn-app-shell-accent-ink, var(--accent-ink));
|
|
4701
|
+
background: var(--lmn-app-shell-bg, var(--bg));
|
|
4702
|
+
box-shadow: var(--lmn-app-shell-neu-shadow-inset, var(--neu-shadow-inset));
|
|
4070
4703
|
font-weight: 500;
|
|
4071
4704
|
}
|
|
4072
4705
|
.sidebar-icon { display: inline-flex; flex-shrink: 0; }
|
|
@@ -4075,18 +4708,29 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4075
4708
|
font-size: 11px;
|
|
4076
4709
|
padding: 1px 7px;
|
|
4077
4710
|
border-radius: 999px;
|
|
4078
|
-
background: var(--accent);
|
|
4711
|
+
background: var(--lmn-app-shell-accent, var(--accent));
|
|
4079
4712
|
color: white;
|
|
4080
4713
|
font-weight: 600;
|
|
4081
4714
|
}
|
|
4715
|
+
.sidebar-expand {
|
|
4716
|
+
display: inline-flex;
|
|
4717
|
+
flex-shrink: 0;
|
|
4718
|
+
color: var(--lmn-app-shell-fg-subtle, var(--fg-subtle));
|
|
4719
|
+
transition: transform var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
|
|
4720
|
+
}
|
|
4721
|
+
.sidebar-expand.open {
|
|
4722
|
+
color: var(--lmn-app-shell-accent, var(--accent));
|
|
4723
|
+
transform: rotate(180deg);
|
|
4724
|
+
}
|
|
4082
4725
|
/* ============ AppShell ============ */
|
|
4083
4726
|
.app-shell {
|
|
4084
4727
|
display: flex;
|
|
4085
4728
|
flex-direction: column;
|
|
4086
4729
|
width: 100%;
|
|
4087
4730
|
height: 100vh;
|
|
4088
|
-
|
|
4089
|
-
|
|
4731
|
+
height: 100dvh;
|
|
4732
|
+
background: var(--lmn-app-shell-bg, var(--bg));
|
|
4733
|
+
color: var(--lmn-app-shell-fg, var(--fg));
|
|
4090
4734
|
overflow: hidden;
|
|
4091
4735
|
position: relative;
|
|
4092
4736
|
}
|
|
@@ -4100,6 +4744,289 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4100
4744
|
min-width: 0;
|
|
4101
4745
|
overflow: auto;
|
|
4102
4746
|
}
|
|
4747
|
+
@media (max-width: 720px) {
|
|
4748
|
+
.titlebar-center {
|
|
4749
|
+
position: static;
|
|
4750
|
+
flex: 1;
|
|
4751
|
+
min-width: 0;
|
|
4752
|
+
justify-content: center;
|
|
4753
|
+
overflow: hidden;
|
|
4754
|
+
transform: none;
|
|
4755
|
+
}
|
|
4756
|
+
.titlebar-title,
|
|
4757
|
+
.titlebar-center,
|
|
4758
|
+
.titlebar-actions {
|
|
4759
|
+
max-width: 34%;
|
|
4760
|
+
}
|
|
4761
|
+
.sidebar:not(.collapsed) { width: 180px; }
|
|
4762
|
+
}
|
|
4763
|
+
/* ============ Splitter ============ */
|
|
4764
|
+
.splitter {
|
|
4765
|
+
display: flex;
|
|
4766
|
+
width: 100%;
|
|
4767
|
+
height: 100%;
|
|
4768
|
+
min-width: 0;
|
|
4769
|
+
min-height: 0;
|
|
4770
|
+
}
|
|
4771
|
+
.splitter.horizontal { flex-direction: row; }
|
|
4772
|
+
.splitter.vertical { flex-direction: column; }
|
|
4773
|
+
.splitter.dragging { cursor: col-resize; user-select: none; }
|
|
4774
|
+
.splitter.dragging.vertical { cursor: row-resize; }
|
|
4775
|
+
.splitter-panel {
|
|
4776
|
+
min-width: 0;
|
|
4777
|
+
min-height: 0;
|
|
4778
|
+
overflow: auto;
|
|
4779
|
+
}
|
|
4780
|
+
.splitter-panel.first { flex-shrink: 0; }
|
|
4781
|
+
.splitter-panel.second { flex: 1; }
|
|
4782
|
+
.splitter-handle {
|
|
4783
|
+
flex-shrink: 0;
|
|
4784
|
+
position: relative;
|
|
4785
|
+
display: flex;
|
|
4786
|
+
align-items: center;
|
|
4787
|
+
justify-content: center;
|
|
4788
|
+
background: transparent;
|
|
4789
|
+
transition: background var(--dur-fast) var(--ease);
|
|
4790
|
+
outline: none;
|
|
4791
|
+
}
|
|
4792
|
+
.splitter.horizontal > .splitter-handle {
|
|
4793
|
+
width: 6px;
|
|
4794
|
+
cursor: col-resize;
|
|
4795
|
+
}
|
|
4796
|
+
.splitter.vertical > .splitter-handle {
|
|
4797
|
+
height: 6px;
|
|
4798
|
+
cursor: row-resize;
|
|
4799
|
+
}
|
|
4800
|
+
.splitter-handle:hover,
|
|
4801
|
+
.splitter.dragging > .splitter-handle {
|
|
4802
|
+
background: var(--lmn-splitter-accent-soft, var(--accent-soft));
|
|
4803
|
+
}
|
|
4804
|
+
.splitter-handle:focus-visible {
|
|
4805
|
+
box-shadow: inset 0 0 0 2px var(--lmn-splitter-accent-glow, var(--accent-glow));
|
|
4806
|
+
border-radius: var(--r-xs);
|
|
4807
|
+
}
|
|
4808
|
+
.splitter-handle-grip {
|
|
4809
|
+
display: block;
|
|
4810
|
+
background: var(--lmn-splitter-divider, var(--divider));
|
|
4811
|
+
border-radius: 999px;
|
|
4812
|
+
transition: background var(--dur-fast) var(--ease);
|
|
4813
|
+
}
|
|
4814
|
+
.splitter.horizontal > .splitter-handle > .splitter-handle-grip {
|
|
4815
|
+
width: 2px;
|
|
4816
|
+
height: 28px;
|
|
4817
|
+
}
|
|
4818
|
+
.splitter.vertical > .splitter-handle > .splitter-handle-grip {
|
|
4819
|
+
width: 28px;
|
|
4820
|
+
height: 2px;
|
|
4821
|
+
}
|
|
4822
|
+
.splitter-handle:hover > .splitter-handle-grip,
|
|
4823
|
+
.splitter.dragging > .splitter-handle > .splitter-handle-grip {
|
|
4824
|
+
background: var(--lmn-splitter-accent, var(--accent));
|
|
4825
|
+
}
|
|
4826
|
+
/* ============ StatusBar ============ */
|
|
4827
|
+
.statusbar {
|
|
4828
|
+
display: flex;
|
|
4829
|
+
align-items: center;
|
|
4830
|
+
position: relative;
|
|
4831
|
+
height: 26px;
|
|
4832
|
+
padding: 0 10px;
|
|
4833
|
+
background: var(--lmn-status-bar-bg, var(--bg));
|
|
4834
|
+
border-top: 1px solid var(--lmn-status-bar-divider, var(--divider));
|
|
4835
|
+
color: var(--lmn-status-bar-fg-muted, var(--fg-muted));
|
|
4836
|
+
font-size: 11.5px;
|
|
4837
|
+
user-select: none;
|
|
4838
|
+
flex-shrink: 0;
|
|
4839
|
+
gap: 8px;
|
|
4840
|
+
}
|
|
4841
|
+
.statusbar-section {
|
|
4842
|
+
display: inline-flex;
|
|
4843
|
+
align-items: center;
|
|
4844
|
+
gap: 2px;
|
|
4845
|
+
min-width: 0;
|
|
4846
|
+
}
|
|
4847
|
+
.statusbar-section.left { margin-right: auto; }
|
|
4848
|
+
.statusbar-section.right { margin-left: auto; }
|
|
4849
|
+
.statusbar-section.center {
|
|
4850
|
+
position: absolute;
|
|
4851
|
+
left: 50%;
|
|
4852
|
+
transform: translateX(-50%);
|
|
4853
|
+
}
|
|
4854
|
+
.statusbar-item {
|
|
4855
|
+
display: inline-flex;
|
|
4856
|
+
align-items: center;
|
|
4857
|
+
gap: 5px;
|
|
4858
|
+
height: 20px;
|
|
4859
|
+
padding: 0 8px;
|
|
4860
|
+
border: none;
|
|
4861
|
+
background: transparent;
|
|
4862
|
+
color: inherit;
|
|
4863
|
+
font: inherit;
|
|
4864
|
+
border-radius: var(--r-xs);
|
|
4865
|
+
transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
|
|
4866
|
+
white-space: nowrap;
|
|
4867
|
+
}
|
|
4868
|
+
.statusbar-item.clickable { cursor: pointer; }
|
|
4869
|
+
.statusbar-item.clickable:hover { background: var(--lmn-status-bar-bg-sunken, var(--bg-sunken)); color: var(--lmn-status-bar-fg, var(--fg)); }
|
|
4870
|
+
.statusbar-item.tone-muted { color: var(--lmn-status-bar-fg-subtle, var(--fg-subtle)); }
|
|
4871
|
+
.statusbar-item.tone-accent { color: var(--lmn-status-bar-accent-ink, var(--accent-ink)); }
|
|
4872
|
+
.statusbar-item.tone-success { color: var(--lmn-status-bar-success, var(--success)); }
|
|
4873
|
+
.statusbar-item.tone-warning { color: var(--lmn-status-bar-warning, var(--warning)); }
|
|
4874
|
+
.statusbar-item.tone-danger { color: var(--lmn-status-bar-danger, var(--danger)); }
|
|
4875
|
+
.statusbar-item-icon { display: inline-flex; flex-shrink: 0; }
|
|
4876
|
+
.statusbar-item-label { overflow: hidden; text-overflow: ellipsis; }
|
|
4877
|
+
@media (max-width: 640px) {
|
|
4878
|
+
.statusbar-section.center {
|
|
4879
|
+
position: static;
|
|
4880
|
+
min-width: 0;
|
|
4881
|
+
margin-inline: auto;
|
|
4882
|
+
transform: none;
|
|
4883
|
+
}
|
|
4884
|
+
.statusbar-section.left,
|
|
4885
|
+
.statusbar-section.right {
|
|
4886
|
+
max-width: 38%;
|
|
4887
|
+
overflow: hidden;
|
|
4888
|
+
}
|
|
4889
|
+
}
|
|
4890
|
+
.timeline {
|
|
4891
|
+
display: flex;
|
|
4892
|
+
flex-direction: column;
|
|
4893
|
+
font-size: 14px;
|
|
4894
|
+
color: var(--lmn-timeline-fg, var(--fg));
|
|
4895
|
+
}
|
|
4896
|
+
/* ---- Item layout ---- */
|
|
4897
|
+
.timeline-item {
|
|
4898
|
+
display: grid;
|
|
4899
|
+
grid-template-columns: 1fr auto 1fr;
|
|
4900
|
+
gap: 0 var(--gap-3);
|
|
4901
|
+
min-height: 60px;
|
|
4902
|
+
min-width: 0;
|
|
4903
|
+
position: relative;
|
|
4904
|
+
}
|
|
4905
|
+
/* Left mode: label hidden, content on right */
|
|
4906
|
+
.timeline-left .timeline-item-label {
|
|
4907
|
+
display: none;
|
|
4908
|
+
}
|
|
4909
|
+
.timeline-left .timeline-item {
|
|
4910
|
+
grid-template-columns: auto 1fr;
|
|
4911
|
+
}
|
|
4912
|
+
/* Right mode: content on left, label hidden */
|
|
4913
|
+
.timeline-right .timeline-item-label {
|
|
4914
|
+
display: none;
|
|
4915
|
+
}
|
|
4916
|
+
.timeline-right .timeline-item {
|
|
4917
|
+
grid-template-columns: 1fr auto;
|
|
4918
|
+
direction: rtl;
|
|
4919
|
+
}
|
|
4920
|
+
.timeline-right .timeline-item-content,
|
|
4921
|
+
.timeline-right .timeline-item-head {
|
|
4922
|
+
direction: ltr;
|
|
4923
|
+
}
|
|
4924
|
+
/* Alternate mode */
|
|
4925
|
+
.timeline-alternate .timeline-item-left .timeline-item-label {
|
|
4926
|
+
text-align: right;
|
|
4927
|
+
color: var(--lmn-timeline-fg-muted, var(--fg-muted));
|
|
4928
|
+
}
|
|
4929
|
+
.timeline-alternate .timeline-item-left .timeline-item-content {
|
|
4930
|
+
text-align: left;
|
|
4931
|
+
}
|
|
4932
|
+
.timeline-alternate .timeline-item-right .timeline-item-label {
|
|
4933
|
+
text-align: left;
|
|
4934
|
+
}
|
|
4935
|
+
.timeline-alternate .timeline-item-right .timeline-item-content {
|
|
4936
|
+
text-align: right;
|
|
4937
|
+
color: var(--lmn-timeline-fg-muted, var(--fg-muted));
|
|
4938
|
+
}
|
|
4939
|
+
.timeline-alternate .timeline-item-right {
|
|
4940
|
+
direction: rtl;
|
|
4941
|
+
}
|
|
4942
|
+
.timeline-alternate .timeline-item-right .timeline-item-head,
|
|
4943
|
+
.timeline-alternate .timeline-item-right .timeline-item-content,
|
|
4944
|
+
.timeline-alternate .timeline-item-right .timeline-item-label {
|
|
4945
|
+
direction: ltr;
|
|
4946
|
+
}
|
|
4947
|
+
/* ---- Head (dot + tail) ---- */
|
|
4948
|
+
.timeline-item-head {
|
|
4949
|
+
display: flex;
|
|
4950
|
+
flex-direction: column;
|
|
4951
|
+
align-items: center;
|
|
4952
|
+
position: relative;
|
|
4953
|
+
}
|
|
4954
|
+
.timeline-item-dot {
|
|
4955
|
+
width: 12px;
|
|
4956
|
+
height: 12px;
|
|
4957
|
+
border-radius: var(--r-pill);
|
|
4958
|
+
box-shadow: var(--lmn-timeline-neu-shadow-control, var(--neu-shadow-control));
|
|
4959
|
+
flex-shrink: 0;
|
|
4960
|
+
display: flex;
|
|
4961
|
+
align-items: center;
|
|
4962
|
+
justify-content: center;
|
|
4963
|
+
position: relative;
|
|
4964
|
+
z-index: 1;
|
|
4965
|
+
margin-top: var(--timeline-dot-offset, 4px);
|
|
4966
|
+
}
|
|
4967
|
+
.timeline-item-dot.accent { background: var(--lmn-timeline-accent, var(--accent)); }
|
|
4968
|
+
.timeline-item-dot.success { background: var(--lmn-timeline-success, var(--success)); }
|
|
4969
|
+
.timeline-item-dot.warning { background: var(--lmn-timeline-warning, var(--warning)); }
|
|
4970
|
+
.timeline-item-dot.danger { background: var(--lmn-timeline-danger, var(--danger)); }
|
|
4971
|
+
.timeline-item-dot.info { background: var(--lmn-timeline-info, var(--info)); }
|
|
4972
|
+
.timeline-item-dot.muted { background: var(--lmn-timeline-fg-subtle, var(--fg-subtle)); }
|
|
4973
|
+
/* Pending dot: clear default fill, Spin handles its own visuals */
|
|
4974
|
+
.timeline-item-dot.pending {
|
|
4975
|
+
background: transparent;
|
|
4976
|
+
box-shadow: none;
|
|
4977
|
+
border: none;
|
|
4978
|
+
}
|
|
4979
|
+
.timeline-item-tail {
|
|
4980
|
+
width: 2px;
|
|
4981
|
+
flex: 1;
|
|
4982
|
+
background: var(--lmn-timeline-divider, var(--divider));
|
|
4983
|
+
margin-top: var(--gap-1);
|
|
4984
|
+
margin-bottom: 0;
|
|
4985
|
+
border-radius: 1px;
|
|
4986
|
+
}
|
|
4987
|
+
/* ---- Content ---- */
|
|
4988
|
+
.timeline-item-content {
|
|
4989
|
+
padding-bottom: var(--gap-5);
|
|
4990
|
+
line-height: 1.6;
|
|
4991
|
+
min-width: var(--timeline-content-min-width, 0);
|
|
4992
|
+
}
|
|
4993
|
+
.timeline-item-last .timeline-item-content {
|
|
4994
|
+
padding-bottom: 0;
|
|
4995
|
+
}
|
|
4996
|
+
.timeline-item-label {
|
|
4997
|
+
padding-bottom: var(--gap-5);
|
|
4998
|
+
line-height: 1.6;
|
|
4999
|
+
color: var(--lmn-timeline-fg-muted, var(--fg-muted));
|
|
5000
|
+
font-size: 13px;
|
|
5001
|
+
min-width: 0;
|
|
5002
|
+
}
|
|
5003
|
+
/* ---- Pending animation ---- */
|
|
5004
|
+
.timeline-item-pending .timeline-item-content {
|
|
5005
|
+
color: var(--lmn-timeline-fg-muted, var(--fg-muted));
|
|
5006
|
+
}
|
|
5007
|
+
/* When dot has custom content (Spin / Icon), expand to fit */
|
|
5008
|
+
.timeline-item-dot:has(> *) {
|
|
5009
|
+
width: auto;
|
|
5010
|
+
height: auto;
|
|
5011
|
+
background: transparent !important;
|
|
5012
|
+
box-shadow: none;
|
|
5013
|
+
border-radius: 0;
|
|
5014
|
+
border: none;
|
|
5015
|
+
}
|
|
5016
|
+
@media (max-width: 640px) {
|
|
5017
|
+
.timeline-alternate .timeline-item {
|
|
5018
|
+
grid-template-columns: auto minmax(0, 1fr);
|
|
5019
|
+
direction: ltr;
|
|
5020
|
+
}
|
|
5021
|
+
.timeline-alternate .timeline-item-label {
|
|
5022
|
+
display: none;
|
|
5023
|
+
}
|
|
5024
|
+
.timeline-alternate .timeline-item-head,
|
|
5025
|
+
.timeline-alternate .timeline-item-content {
|
|
5026
|
+
direction: ltr;
|
|
5027
|
+
text-align: left;
|
|
5028
|
+
}
|
|
5029
|
+
}
|
|
4103
5030
|
/* ============ ThemePanel ============ */
|
|
4104
5031
|
.theme-panel {
|
|
4105
5032
|
width: min(100%, 340px);
|
|
@@ -4109,9 +5036,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4109
5036
|
box-sizing: border-box;
|
|
4110
5037
|
padding: var(--gap-4);
|
|
4111
5038
|
border-radius: var(--r-xl);
|
|
4112
|
-
color: var(--fg);
|
|
4113
|
-
background: var(--bg);
|
|
4114
|
-
box-shadow: var(--neu-shadow-lift);
|
|
5039
|
+
color: var(--lmn-theme-panel-fg, var(--fg));
|
|
5040
|
+
background: var(--lmn-theme-panel-bg, var(--bg));
|
|
5041
|
+
box-shadow: var(--lmn-theme-panel-neu-shadow-lift, var(--neu-shadow-lift));
|
|
4115
5042
|
}
|
|
4116
5043
|
.theme-panel.compact {
|
|
4117
5044
|
width: min(100%, 300px);
|
|
@@ -4128,13 +5055,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4128
5055
|
align-items: center;
|
|
4129
5056
|
gap: 8px;
|
|
4130
5057
|
min-width: 0;
|
|
4131
|
-
color: var(--fg);
|
|
5058
|
+
color: var(--lmn-theme-panel-fg, var(--fg));
|
|
4132
5059
|
font-size: 14px;
|
|
4133
5060
|
font-weight: 700;
|
|
4134
5061
|
}
|
|
4135
5062
|
.theme-panel-title svg {
|
|
4136
5063
|
flex: 0 0 auto;
|
|
4137
|
-
color: var(--accent);
|
|
5064
|
+
color: var(--lmn-theme-panel-accent, var(--accent));
|
|
4138
5065
|
}
|
|
4139
5066
|
.theme-panel-title span {
|
|
4140
5067
|
min-width: 0;
|
|
@@ -4144,14 +5071,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4144
5071
|
}
|
|
4145
5072
|
.theme-panel-desc {
|
|
4146
5073
|
font-size: 12px;
|
|
4147
|
-
color: var(--fg-muted);
|
|
5074
|
+
color: var(--lmn-theme-panel-fg-muted, var(--fg-muted));
|
|
4148
5075
|
}
|
|
4149
5076
|
.theme-panel-row {
|
|
4150
5077
|
display: flex;
|
|
4151
5078
|
flex-direction: column;
|
|
4152
5079
|
gap: 8px;
|
|
4153
5080
|
padding-top: var(--gap-3);
|
|
4154
|
-
border-top: 1px solid var(--divider);
|
|
5081
|
+
border-top: 1px solid var(--lmn-theme-panel-divider, var(--divider));
|
|
4155
5082
|
}
|
|
4156
5083
|
.theme-panel-head + .theme-panel-row,
|
|
4157
5084
|
.theme-panel-row:first-child {
|
|
@@ -4165,7 +5092,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4165
5092
|
gap: 10px;
|
|
4166
5093
|
font-size: 12px;
|
|
4167
5094
|
font-weight: 600;
|
|
4168
|
-
color: var(--fg);
|
|
5095
|
+
color: var(--lmn-theme-panel-fg, var(--fg));
|
|
4169
5096
|
}
|
|
4170
5097
|
.theme-panel-label > span:last-child:not(:first-child) {
|
|
4171
5098
|
min-width: 0;
|
|
@@ -4175,9 +5102,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4175
5102
|
white-space: nowrap;
|
|
4176
5103
|
padding: 2px 8px;
|
|
4177
5104
|
border-radius: var(--r-pill);
|
|
4178
|
-
color: var(--accent-ink);
|
|
4179
|
-
background: var(--bg);
|
|
4180
|
-
box-shadow: var(--neu-shadow-inset);
|
|
5105
|
+
color: var(--lmn-theme-panel-accent-ink, var(--accent-ink));
|
|
5106
|
+
background: var(--lmn-theme-panel-bg, var(--bg));
|
|
5107
|
+
box-shadow: var(--lmn-theme-panel-neu-shadow-inset, var(--neu-shadow-inset));
|
|
4181
5108
|
font-family: var(--font-mono);
|
|
4182
5109
|
font-size: 11px;
|
|
4183
5110
|
font-weight: 500;
|
|
@@ -4201,9 +5128,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4201
5128
|
flex-direction: column;
|
|
4202
5129
|
gap: 8px;
|
|
4203
5130
|
padding: 9px;
|
|
4204
|
-
color: var(--fg-muted);
|
|
4205
|
-
background: var(--bg);
|
|
4206
|
-
box-shadow: var(--neu-shadow-control);
|
|
5131
|
+
color: var(--lmn-theme-panel-fg-muted, var(--fg-muted));
|
|
5132
|
+
background: var(--lmn-theme-panel-bg, var(--bg));
|
|
5133
|
+
box-shadow: var(--lmn-theme-panel-neu-shadow-control, var(--neu-shadow-control));
|
|
4207
5134
|
text-align: left;
|
|
4208
5135
|
white-space: normal;
|
|
4209
5136
|
transition:
|
|
@@ -4212,18 +5139,18 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4212
5139
|
transform var(--dur-fast) var(--ease);
|
|
4213
5140
|
}
|
|
4214
5141
|
.theme-panel .theme-panel-preset.btn:hover {
|
|
4215
|
-
color: var(--fg);
|
|
4216
|
-
box-shadow: var(--neu-shadow-panel);
|
|
5142
|
+
color: var(--lmn-theme-panel-fg, var(--fg));
|
|
5143
|
+
box-shadow: var(--lmn-theme-panel-neu-shadow-panel, var(--neu-shadow-panel));
|
|
4217
5144
|
transform: translateY(-1px);
|
|
4218
5145
|
}
|
|
4219
5146
|
.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);
|
|
5147
|
+
color: var(--lmn-theme-panel-accent-ink, var(--accent-ink));
|
|
5148
|
+
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
5149
|
transform: none;
|
|
4223
5150
|
}
|
|
4224
5151
|
.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);
|
|
5152
|
+
color: var(--lmn-theme-panel-accent-ink, var(--accent-ink));
|
|
5153
|
+
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
5154
|
}
|
|
4228
5155
|
.theme-panel .theme-panel-preset-shell.deletable .theme-panel-preset.btn {
|
|
4229
5156
|
padding-right: 28px;
|
|
@@ -4236,9 +5163,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4236
5163
|
height: 22px;
|
|
4237
5164
|
min-width: 22px;
|
|
4238
5165
|
padding: 0;
|
|
4239
|
-
color: var(--fg-subtle);
|
|
4240
|
-
background: var(--bg);
|
|
4241
|
-
box-shadow: var(--neu-shadow-control);
|
|
5166
|
+
color: var(--lmn-theme-panel-fg-subtle, var(--fg-subtle));
|
|
5167
|
+
background: var(--lmn-theme-panel-bg, var(--bg));
|
|
5168
|
+
box-shadow: var(--lmn-theme-panel-neu-shadow-control, var(--neu-shadow-control));
|
|
4242
5169
|
opacity: 0;
|
|
4243
5170
|
transform: scale(0.92);
|
|
4244
5171
|
}
|
|
@@ -4248,7 +5175,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4248
5175
|
transform: scale(1);
|
|
4249
5176
|
}
|
|
4250
5177
|
.theme-panel .theme-panel-preset-delete.btn:hover {
|
|
4251
|
-
box-shadow: var(--neu-shadow-inset);
|
|
5178
|
+
box-shadow: var(--lmn-theme-panel-neu-shadow-inset, var(--neu-shadow-inset));
|
|
4252
5179
|
}
|
|
4253
5180
|
.theme-panel-preset-ink {
|
|
4254
5181
|
display: grid;
|
|
@@ -4260,7 +5187,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4260
5187
|
height: 18px;
|
|
4261
5188
|
min-width: 0;
|
|
4262
5189
|
border-radius: var(--r-pill);
|
|
4263
|
-
box-shadow: inset 0 0 0 1px var(--divider);
|
|
5190
|
+
box-shadow: inset 0 0 0 1px var(--lmn-theme-panel-divider, var(--divider));
|
|
4264
5191
|
}
|
|
4265
5192
|
.theme-panel-preset-copy {
|
|
4266
5193
|
display: flex;
|
|
@@ -4283,7 +5210,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4283
5210
|
overflow: hidden;
|
|
4284
5211
|
text-overflow: ellipsis;
|
|
4285
5212
|
white-space: nowrap;
|
|
4286
|
-
color: var(--fg-subtle);
|
|
5213
|
+
color: var(--lmn-theme-panel-fg-subtle, var(--fg-subtle));
|
|
4287
5214
|
font-size: 10px;
|
|
4288
5215
|
font-weight: 500;
|
|
4289
5216
|
}
|
|
@@ -4299,10 +5226,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4299
5226
|
min-width: 28px;
|
|
4300
5227
|
padding: 0;
|
|
4301
5228
|
border-radius: var(--r-pill);
|
|
4302
|
-
box-shadow: var(--neu-shadow-subtle);
|
|
5229
|
+
box-shadow: var(--lmn-theme-panel-neu-shadow-subtle, var(--neu-shadow-subtle));
|
|
4303
5230
|
}
|
|
4304
5231
|
.theme-panel-swatch.active {
|
|
4305
|
-
box-shadow: var(--neu-shadow-inset), 0 0 0 2px var(--accent-glow);
|
|
5232
|
+
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
5233
|
}
|
|
4307
5234
|
.theme-panel .radio-group.segmented {
|
|
4308
5235
|
width: 100%;
|
|
@@ -4316,8 +5243,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4316
5243
|
gap: 10px;
|
|
4317
5244
|
padding: 10px;
|
|
4318
5245
|
border-radius: var(--r-md);
|
|
4319
|
-
background: var(--bg);
|
|
4320
|
-
box-shadow: var(--neu-shadow-inset);
|
|
5246
|
+
background: var(--lmn-theme-panel-bg, var(--bg));
|
|
5247
|
+
box-shadow: var(--lmn-theme-panel-neu-shadow-inset, var(--neu-shadow-inset));
|
|
4321
5248
|
}
|
|
4322
5249
|
.theme-panel-create-head {
|
|
4323
5250
|
display: flex;
|
|
@@ -4332,13 +5259,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4332
5259
|
gap: 2px;
|
|
4333
5260
|
}
|
|
4334
5261
|
.theme-panel-create-head span {
|
|
4335
|
-
color: var(--fg);
|
|
5262
|
+
color: var(--lmn-theme-panel-fg, var(--fg));
|
|
4336
5263
|
font-size: 12px;
|
|
4337
5264
|
font-weight: 700;
|
|
4338
5265
|
}
|
|
4339
5266
|
.theme-panel-create-head small {
|
|
4340
5267
|
min-width: 0;
|
|
4341
|
-
color: var(--fg-subtle);
|
|
5268
|
+
color: var(--lmn-theme-panel-fg-subtle, var(--fg-subtle));
|
|
4342
5269
|
font-family: var(--font-mono);
|
|
4343
5270
|
font-size: 10px;
|
|
4344
5271
|
overflow: hidden;
|
|
@@ -4350,7 +5277,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4350
5277
|
display: flex;
|
|
4351
5278
|
flex-direction: column;
|
|
4352
5279
|
gap: 6px;
|
|
4353
|
-
color: var(--fg-subtle);
|
|
5280
|
+
color: var(--lmn-theme-panel-fg-subtle, var(--fg-subtle));
|
|
4354
5281
|
font-family: var(--font-mono);
|
|
4355
5282
|
font-size: 10px;
|
|
4356
5283
|
}
|
|
@@ -4390,15 +5317,15 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4390
5317
|
gap: 10px;
|
|
4391
5318
|
padding: 10px;
|
|
4392
5319
|
border-radius: var(--r-md);
|
|
4393
|
-
background: var(--bg);
|
|
4394
|
-
box-shadow: var(--neu-shadow-inset);
|
|
5320
|
+
background: var(--lmn-theme-panel-bg, var(--bg));
|
|
5321
|
+
box-shadow: var(--lmn-theme-panel-neu-shadow-inset, var(--neu-shadow-inset));
|
|
4395
5322
|
}
|
|
4396
5323
|
.theme-panel-advanced-actions {
|
|
4397
5324
|
display: flex;
|
|
4398
5325
|
flex-direction: column;
|
|
4399
5326
|
gap: 8px;
|
|
4400
5327
|
padding-top: 10px;
|
|
4401
|
-
border-top: 1px solid var(--divider);
|
|
5328
|
+
border-top: 1px solid var(--lmn-theme-panel-divider, var(--divider));
|
|
4402
5329
|
}
|
|
4403
5330
|
.theme-panel-save-as-field {
|
|
4404
5331
|
display: grid;
|
|
@@ -4407,7 +5334,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4407
5334
|
align-items: center;
|
|
4408
5335
|
}
|
|
4409
5336
|
.theme-panel-save-as-field > span {
|
|
4410
|
-
color: var(--fg-muted);
|
|
5337
|
+
color: var(--lmn-theme-panel-fg-muted, var(--fg-muted));
|
|
4411
5338
|
font-size: 11px;
|
|
4412
5339
|
font-weight: 800;
|
|
4413
5340
|
white-space: nowrap;
|
|
@@ -4420,7 +5347,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4420
5347
|
}
|
|
4421
5348
|
.theme-panel-advanced-footer > span {
|
|
4422
5349
|
min-width: 0;
|
|
4423
|
-
color: var(--fg-subtle);
|
|
5350
|
+
color: var(--lmn-theme-panel-fg-subtle, var(--fg-subtle));
|
|
4424
5351
|
font-family: var(--font-mono);
|
|
4425
5352
|
font-size: 10px;
|
|
4426
5353
|
overflow: hidden;
|
|
@@ -4444,11 +5371,11 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4444
5371
|
gap: 10px;
|
|
4445
5372
|
padding: 7px 9px;
|
|
4446
5373
|
border-radius: var(--preview-radius, var(--r-md));
|
|
4447
|
-
color: var(--preview-fg, var(--fg));
|
|
4448
|
-
background: var(--preview-bg, var(--bg));
|
|
5374
|
+
color: var(--preview-fg, var(--lmn-theme-panel-fg, var(--fg)));
|
|
5375
|
+
background: var(--preview-bg, var(--lmn-theme-panel-bg, var(--bg)));
|
|
4449
5376
|
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));
|
|
5377
|
+
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))),
|
|
5378
|
+
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
5379
|
font-family: var(--preview-font, var(--font-sans));
|
|
4453
5380
|
font-size: 12px;
|
|
4454
5381
|
font-weight: 700;
|
|
@@ -4471,10 +5398,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4471
5398
|
width: 20px;
|
|
4472
5399
|
height: 20px;
|
|
4473
5400
|
border-radius: var(--r-pill);
|
|
4474
|
-
background: var(--preview-accent, var(--accent));
|
|
5401
|
+
background: var(--preview-accent, var(--lmn-theme-panel-accent, var(--accent)));
|
|
4475
5402
|
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));
|
|
5403
|
+
inset 1px 1px 2px color-mix(in oklch, var(--preview-accent, var(--lmn-theme-panel-accent, var(--accent))) 50%, white),
|
|
5404
|
+
0 0 0 4px var(--preview-accent-glow, var(--lmn-theme-panel-accent-glow, var(--accent-glow)));
|
|
4478
5405
|
}
|
|
4479
5406
|
.theme-panel-create-actions {
|
|
4480
5407
|
display: grid;
|
|
@@ -4492,7 +5419,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4492
5419
|
flex-direction: column;
|
|
4493
5420
|
gap: 8px;
|
|
4494
5421
|
padding-top: 10px;
|
|
4495
|
-
border-top: 1px solid var(--divider);
|
|
5422
|
+
border-top: 1px solid var(--lmn-theme-panel-divider, var(--divider));
|
|
4496
5423
|
}
|
|
4497
5424
|
.theme-panel-advanced-section.compact {
|
|
4498
5425
|
padding-top: 0;
|
|
@@ -4506,13 +5433,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4506
5433
|
}
|
|
4507
5434
|
.theme-panel-advanced-title span {
|
|
4508
5435
|
min-width: 0;
|
|
4509
|
-
color: var(--fg);
|
|
5436
|
+
color: var(--lmn-theme-panel-fg, var(--fg));
|
|
4510
5437
|
font-size: 11px;
|
|
4511
5438
|
font-weight: 700;
|
|
4512
5439
|
}
|
|
4513
5440
|
.theme-panel-advanced-title small {
|
|
4514
5441
|
min-width: 0;
|
|
4515
|
-
color: var(--fg-subtle);
|
|
5442
|
+
color: var(--lmn-theme-panel-fg-subtle, var(--fg-subtle));
|
|
4516
5443
|
font-family: var(--font-mono);
|
|
4517
5444
|
font-size: 9px;
|
|
4518
5445
|
overflow: hidden;
|
|
@@ -4538,13 +5465,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4538
5465
|
gap: 2px;
|
|
4539
5466
|
}
|
|
4540
5467
|
.theme-panel-token-label span {
|
|
4541
|
-
color: var(--fg-muted);
|
|
5468
|
+
color: var(--lmn-theme-panel-fg-muted, var(--fg-muted));
|
|
4542
5469
|
font-size: 10px;
|
|
4543
5470
|
font-weight: 650;
|
|
4544
5471
|
white-space: nowrap;
|
|
4545
5472
|
}
|
|
4546
5473
|
.theme-panel-token-label code {
|
|
4547
|
-
color: var(--fg-subtle);
|
|
5474
|
+
color: var(--lmn-theme-panel-fg-subtle, var(--fg-subtle));
|
|
4548
5475
|
font-family: var(--font-mono);
|
|
4549
5476
|
font-size: 9px;
|
|
4550
5477
|
overflow: hidden;
|
|
@@ -4583,13 +5510,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
|
|
|
4583
5510
|
width: 24px;
|
|
4584
5511
|
height: 24px;
|
|
4585
5512
|
border-radius: 7px;
|
|
4586
|
-
box-shadow: var(--neu-shadow-inset), inset 0 0 0 1px var(--border);
|
|
5513
|
+
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
5514
|
transition:
|
|
4588
5515
|
box-shadow var(--dur-fast) var(--ease),
|
|
4589
5516
|
transform var(--dur-fast) var(--ease);
|
|
4590
5517
|
}
|
|
4591
5518
|
.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);
|
|
5519
|
+
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
5520
|
transform: translateY(-1px);
|
|
4594
5521
|
}
|
|
4595
5522
|
.theme-panel-token-input .input-wrap,
|