opensource/univer
3
0
Fork 0
mirror of https://github.com/dream-num/univer.git synced 2026-09-24 15:32:18 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore: replace readable-tailwind with better-tailwindcss and add tailwindcss-animate plugin (#5356)

Browse Source
This commit is contained in:
白熱
2025-06-11 17:28:27 +08:00
committed by GitHub
parent 61ff824174
commit 5e4f5315a8
77 changed files with 752 additions and 666 deletions
Download Patch File Download Diff File Expand all files Collapse all files
common/shared/eslint/index.js
+23 -7
View File
@@ -1,5 +1,7 @@
const os = require('node:os');
const path = require('node:path');
const eslintPluginBetterTailwindcss = require('eslint-plugin-better-tailwindcss');
const jsdoc = require('eslint-plugin-jsdoc');
const eslintPluginReadableTailwind = require('eslint-plugin-readable-tailwind');
const noExternalImportsInFacade = require('./plugins/no-external-imports-in-facade');
const noFacadeImportsOutsideFacade = require('./plugins/no-facade-imports-outside-facade');
const noSelfPackageImports = require('./plugins/no-self-package-imports');
@@ -224,6 +226,9 @@ exports.facadePreset = () => {
};
exports.tailwindcssPreset = () => {
const isWindows = os.platform() === 'win32';
const lineBreakStyle = isWindows ? 'windows' : 'unix';
return {
files: ['**/*.{jsx,tsx}'],
languageOptions: {
@@ -234,14 +239,25 @@ exports.tailwindcssPreset = () => {
},
},
plugins: {
'readable-tailwind': eslintPluginReadableTailwind,
'better-tailwindcss': eslintPluginBetterTailwindcss,
},
settings: {
'better-tailwindcss': {
tailwindConfig: path.resolve(__dirname, '../tailwind/tailwind.config.ts'),
},
},
rules: {
...eslintPluginReadableTailwind.configs.warning.rules,
...eslintPluginReadableTailwind.configs.error.rules,
'jsonc/sort-keys': ['warn'],
'readable-tailwind/multiline': ['warn', { printWidth: 120, group: 'newLine' }],
'react-hooks/rules-of-hooks': 'off',
// enable all recommended rules to warn
...eslintPluginBetterTailwindcss.configs['recommended-warn'].rules,
// enable all recommended rules to error
...eslintPluginBetterTailwindcss.configs['recommended-error'].rules,
'better-tailwindcss/multiline': ['warn', {
printWidth: 120,
group: 'newLine',
lineBreakStyle,
}],
'better-tailwindcss/no-unregistered-classes': 'off',
'better-tailwindcss/no-conflicting-classes': 'off',
},
};
};
common/shared/package.json
+5 -5
View File
@@ -25,16 +25,16 @@
"univer-cli": "bin/index.ts"
},
"dependencies": {
"@typescript-eslint/parser": "^8.32.1",
"@vitejs/plugin-react": "^4.5.0",
"@typescript-eslint/parser": "^8.34.0",
"@vitejs/plugin-react": "^4.5.2",
"@vitejs/plugin-vue": "^5.2.4",
"@vitest/coverage-istanbul": "^3.1.4",
"autoprefixer": "^10.4.21",
"eslint-plugin-readable-tailwind": "^1.9.1",
"eslint-plugin-better-tailwindcss": "^3.1.0",
"fs-extra": "^11.3.0",
"happy-dom": "17.4.7",
"happy-dom": "18.0.1",
"javascript-obfuscator": "^4.1.1",
"postcss-preset-env": "^10.1.6",
"postcss-preset-env": "^10.2.2",
"sort-keys": "^5.1.0",
"tailwind-scrollbar": "^4.0.2",
"tailwindcss": "^3.4.17",
package.json
+2 -1
View File
@@ -49,7 +49,7 @@
"@commitlint/cli": "^19.8.1",
"@commitlint/config-conventional": "^19.8.1",
"@eslint-react/eslint-plugin": "^1.51.3",
"@playwright/test": "^1.52.0",
"@playwright/test": "^1.53.0",
"@release-it-plugins/workspaces": "^4.2.0",
"@release-it/conventional-changelog": "^9.0.4",
"@storybook/react": "8.6.14",
@@ -77,6 +77,7 @@
"react-dom": "^19.1.0",
"release-it": "^17.11.0",
"serve": "^14.2.4",
"tailwindcss": "^3.4.17",
"tsx": "^4.19.4",
"turbo": "^2.5.4",
"typescript": "^5.8.3",
packages-experimental/debugger/src/views/Fab.tsx
+1 -1
View File
@@ -79,8 +79,8 @@ export function Fab() {
univer-flex univer-size-9 univer-cursor-pointer univer-items-center univer-justify-center
univer-rounded-full univer-bg-white univer-text-base univer-text-gray-900 univer-shadow
univer-outline-none univer-transition-shadow
dark:!univer-bg-gray-900 dark:!univer-text-gray-200
hover:univer-ring-1 hover:univer-ring-primary-400
dark:!univer-bg-gray-900 dark:!univer-text-gray-200
`, borderClassName)}
type="button"
>
packages-experimental/debugger/src/views/watermark/WatermarkTextSetting.tsx
+3 -3
View File
@@ -101,8 +101,8 @@ export function WatermarkTextSetting(props: IWatermarkTextSettingProps) {
>
<a
className={`
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`}
>
<FontColorDoubleIcon extend={{ colorChannel1: config.color ?? '#2c53f1' }} />
@@ -110,8 +110,8 @@ export function WatermarkTextSetting(props: IWatermarkTextSettingProps) {
</Dropdown>
<a
className={clsx(`
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`, {
'univer-bg-gray-200 dark:!univer-bg-gray-600': config.bold,
})}
@@ -121,8 +121,8 @@ export function WatermarkTextSetting(props: IWatermarkTextSettingProps) {
</a>
<a
className={clsx(`
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`, {
'univer-bg-gray-200 dark:!univer-bg-gray-600': config.italic,
})}
packages-experimental/uni-formula-ui/src/views/components/DocFormulaPopup.tsx
+2 -2
View File
@@ -132,8 +132,8 @@ function DocFormula(props: { popupInfo: IUniFormulaPopupInfo }) {
return (
<div
className={clsx(`
univer-box-border univer-flex univer-h-12 univer-w-[482px] univer-items-center univer-gap-x-2
univer-overflow-hidden univer-rounded-lg u univer-border-gray-200 univer-bg-white univer-p-2
u univer-box-border univer-flex univer-h-12 univer-w-[482px] univer-items-center univer-gap-x-2
univer-overflow-hidden univer-rounded-lg univer-border-gray-200 univer-bg-white univer-p-2
univer-shadow-lg
dark:!univer-bg-gray-900
`, borderClassName)}
packages-experimental/uni-sheets-ui/src/views/uni-sheet-bar/UniSheetBar.tsx
+4 -4
View File
@@ -111,8 +111,8 @@ export function UniSheetBar() {
className={clsx(`
univer-flex univer-h-8 univer-cursor-pointer univer-items-center univer-rounded-lg
univer-px-1 univer-py-0
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`, activeKey === item.sheetId ? 'univer-text-primary-500' : '')}
onClick={() => handleSheetActiveChange(item.sheetId)}
>
@@ -131,12 +131,12 @@ export function UniSheetBar() {
<button
type="button"
className={`
univer-relative univer-mt-4 univer-flex univer-h-8 univer-items-center univer-justify-center
univer-rounded-lg univer-border-0 univer-bg-transparent univer-text-primary-600
before:absolute before:left-0 before:top-0 before:h-full before:w-full before:bg-gray-100
before:content-['']
dark:hover:!univer-bg-gray-700
univer-relative univer-mt-4 univer-flex univer-h-8 univer-items-center univer-justify-center
univer-rounded-lg univer-border-0 univer-bg-transparent univer-text-primary-600
hover:univer-cursor-pointer hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`}
onClick={handleSheetAdd}
packages-experimental/uni-slides-ui/src/views/UniSlideSideBar.tsx
+2 -2
View File
@@ -128,12 +128,12 @@ export function UniSlideSideBar() {
<button
type="button"
className={`
before:absolute before:left-0 before:top-0 before:h-px before:content-[''] before:univer-bg-gray-200
univer-relative univer-mt-4 univer-flex univer-h-8 univer-cursor-pointer univer-items-center
univer-justify-center univer-rounded-lg univer-border-0 univer-bg-transparent univer-px-1
univer-text-primary-500
before:absolute before:left-0 before:top-0 before:h-px before:content-[''] before:univer-bg-gray-200
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`}
onClick={handleAppendSlide}
>
packages-experimental/uniui/src/views/uni-controls/UniControls.tsx
+2 -2
View File
@@ -152,8 +152,8 @@ export const UniControls = ({ zoom, onItemClick }: { zoom: number; onItemClick?:
univer-relative univer-box-border univer-cursor-pointer univer-rounded univer-py-1
univer-pl-9 univer-text-gray-900 univer-no-underline univer-transition-colors
univer-duration-200
dark:!univer-text-white dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:!univer-text-white dark:hover:!univer-bg-gray-700
`, item === zoomPercent ? 'univer-bg-gray-100' : '')}
onClick={() => onZoomMenuChange(item)}
>
@@ -180,8 +180,8 @@ export const UniControls = ({ zoom, onItemClick }: { zoom: number; onItemClick?:
univer-h-7 univer-w-[55px] univer-cursor-pointer univer-rounded univer-text-center univer-text-xs
univer-leading-loose univer-text-gray-700 univer-no-underline univer-transition-all
univer-duration-200
group-data-[open=true]:univer-bg-gray-200
hover:univer-bg-gray-200
group-data-[open=true]:univer-bg-gray-200
`}
>
{zoomPercent}
packages-experimental/uniui/src/views/uni-toolbar/UniFormulaBar.tsx
+2 -2
View File
@@ -80,8 +80,8 @@ export const UniFormulaBar = () => {
</div>
<div
className={clsx(`
univer-absolute univer-left-0 univer-top-0 univer-z-10 univer-h-full univer-w-full univer-bg-white
dark:!univer-bg-dark
univer-absolute univer-left-0 univer-top-0 univer-z-10 univer-h-full univer-w-full univer-bg-white
`, {
'univer-hidden': !visible,
})}
@@ -196,7 +196,7 @@ export function FormulaBar() {
`}
>
<div
className={clsx('univer-flex univer-univer-grow-0 univer-shrink-0 univer-px-1.5', {
className={clsx('univer-univer-grow-0 univer-flex univer-shrink-0 univer-px-1.5', {
'univer-cursor-not-allowed univer-text-gray-200': disable,
})}
>
packages/design/src/components/accordion/Accordion.tsx
+2 -2
View File
@@ -52,9 +52,9 @@ export function Accordion(props: IAccordionProps) {
univer-box-border univer-flex univer-w-full univer-cursor-pointer univer-items-center
univer-gap-1.5 univer-border-none univer-bg-transparent univer-p-4 univer-text-left
univer-text-gray-700
dark:!univer-text-gray-200 dark:hover:!univer-text-white
focus:univer-outline-none
hover:univer-text-gray-900
focus:univer-outline-none
dark:!univer-text-gray-200 dark:hover:!univer-text-white
`}
type="button"
onClick={() => toggleItem(index)}
packages/design/src/components/button/Button.tsx
+6 -6
View File
@@ -26,40 +26,40 @@ export const buttonVariants = cva(
univer-box-border univer-inline-flex univer-cursor-pointer univer-select-none univer-items-center
univer-justify-center univer-gap-2 univer-whitespace-nowrap univer-rounded-md univer-border univer-border-solid
univer-text-sm univer-font-medium univer-transition-colors
[&_svg]:univer-pointer-events-none [&_svg]:univer-size-4 [&_svg]:univer-shrink-0
disabled:univer-pointer-events-none disabled:univer-cursor-not-allowed disabled:univer-opacity-50
[&_svg]:univer-pointer-events-none [&_svg]:univer-size-4 [&_svg]:univer-shrink-0
`,
{
variants: {
variant: {
default: `
univer-border-gray-200 univer-bg-white univer-text-gray-700
hover:univer-bg-gray-100
active:univer-bg-gray-200
dark:!univer-border-gray-600 dark:!univer-bg-gray-700 dark:!univer-text-white
dark:hover:!univer-bg-gray-600 dark:active:!univer-bg-gray-700
hover:univer-bg-gray-100
`,
primary: `
univer-border-primary-600 univer-bg-primary-600 univer-text-white
active:univer-bg-primary-700
hover:univer-bg-primary-500
active:univer-bg-primary-700
`,
danger: `
univer-border-red-500 univer-bg-red-500 univer-text-white
active:univer-border-red-600 active:univer-bg-red-600
hover:univer-border-red-400 hover:univer-bg-red-400
active:univer-border-red-600 active:univer-bg-red-600
`,
text: `
univer-border-transparent univer-bg-transparent univer-text-gray-900
hover:univer-bg-gray-100
active:univer-bg-gray-200
dark:!univer-text-white dark:hover:!univer-bg-gray-700 dark:active:!univer-bg-gray-600
hover:univer-bg-gray-100
`,
link: `
univer-underline-current univer-border-transparent univer-bg-transparent univer-text-primary-600
univer-underline-offset-4
active:univer-text-primary-700
hover:univer-text-primary-500 hover:univer-underline
active:univer-text-primary-700
`,
},
size: {
packages/design/src/components/cascader-list/CascaderList.tsx
+1 -1
View File
@@ -111,9 +111,9 @@ export function CascaderList(props: ICascaderListProps) {
className={clsx(`
univer-overflow-auto-y univer-grid univer-h-full univer-max-h-80 univer-grid-flow-col univer-rounded
univer-py-2 univer-text-gray-900
dark:!univer-text-white
[&>ul:not(:last-child)]:univer-border-0 [&>ul:not(:last-child)]:univer-border-r
[&>ul:not(:last-child)]:univer-border-solid [&>ul:not(:last-child)]:univer-border-r-gray-200
dark:!univer-text-white
`, borderClassName, scrollbarClassName, wrapperClassName)}
>
{activeOptions.map((options, index) =>
packages/design/src/components/color-picker/ColorInput.tsx
+1 -1
View File
@@ -158,12 +158,12 @@ export function ColorInput({ hsv, onChange }: IColorInputProps) {
return (
<div
className={`
dark:![&_input]:univer-border-gray-600 dark:![&_input]:univer-text-white
univer-flex univer-gap-2
[&_input]:univer-box-border [&_input]:univer-flex [&_input]:univer-h-7 [&_input]:univer-items-center
[&_input]:univer-rounded [&_input]:univer-border [&_input]:univer-border-solid
[&_input]:univer-border-gray-200 [&_input]:univer-bg-transparent [&_input]:univer-px-1.5
[&_input]:univer-text-sm [&_input]:univer-text-gray-700 [&_input]:univer-outline-none
dark:![&_input]:univer-border-gray-600 dark:![&_input]:univer-text-white
`}
>
<div className="univer-relative univer-flex univer-flex-1 univer-gap-2">
packages/design/src/components/color-picker/ColorPicker.tsx
+1 -1
View File
@@ -99,8 +99,8 @@ export function ColorPicker({ format = 'hex', value = '#000000', onChange }: ICo
<a
className={`
univer-cursor-pointer univer-gap-2 univer-text-sm univer-text-gray-900 univer-transition-opacity
dark:!univer-text-white
hover:univer-opacity-80
dark:!univer-text-white
`}
onClick={() => setVisible(true)}
>
packages/design/src/components/color-picker/__tests__/__snapshots__/index.spec.tsx.snap
+2 -2
View File
@@ -265,8 +265,8 @@ exports[`ColorPicker > should render correctly 1`] = `
<a
class="
univer-cursor-pointer univer-gap-2 univer-text-sm univer-text-gray-900 univer-transition-opacity
dark:!univer-text-white
hover:univer-opacity-80
dark:!univer-text-white
"
/>
</div>
@@ -539,8 +539,8 @@ exports[`ColorPicker > should render with value 1`] = `
<a
class="
univer-cursor-pointer univer-gap-2 univer-text-sm univer-text-gray-900 univer-transition-opacity
dark:!univer-text-white
hover:univer-opacity-80
dark:!univer-text-white
"
/>
</div>
packages/design/src/components/dialog/DialogPrimitive.tsx
+9 -9
View File
@@ -38,8 +38,8 @@ const DialogOverlay = forwardRef<
className={clsx(
`
univer-bg-black/80 univer-fixed univer-inset-0 univer-z-[1050]
data-[state=closed]:univer-animate-out data-[state=closed]:univer-fade-out-0
data-[state=open]:univer-animate-in data-[state=open]:univer-fade-in-0
data-[state=closed]:univer-animate-out data-[state=closed]:univer-fade-out-0
`,
className
)}
@@ -62,17 +62,17 @@ const DialogContent = forwardRef<
ref={ref}
className={clsx(
`
univer-fixed univer-left-1/2 univer-top-1/2 univer-z-[1050] univer-box-border univer-grid
univer-w-full univer-max-w-lg -univer-translate-x-1/2 -univer-translate-y-1/2 univer-gap-4
univer-bg-white univer-px-6 univer-py-4 univer-text-gray-500 univer-shadow-md univer-duration-200
dark:!univer-bg-gray-700 dark:!univer-text-gray-400
data-[state=closed]:univer-animate-out data-[state=closed]:univer-fade-out-0
data-[state=closed]:univer-zoom-out-95 data-[state=closed]:univer-slide-out-to-left-1/2
data-[state=closed]:univer-slide-out-to-top-[48%]
data-[state=open]:univer-animate-in data-[state=open]:univer-fade-in-0
data-[state=open]:univer-zoom-in-95 data-[state=open]:univer-slide-in-from-left-1/2
data-[state=open]:univer-slide-in-from-top-[48%]
data-[state=closed]:univer-animate-out data-[state=closed]:univer-fade-out-0
data-[state=closed]:univer-zoom-out-95 data-[state=closed]:univer-slide-out-to-left-1/2
data-[state=closed]:univer-slide-out-to-top-[48%]
univer-fixed univer-left-1/2 univer-top-1/2 univer-z-[1050] univer-box-border univer-grid
univer-w-full univer-max-w-lg -univer-translate-x-1/2 -univer-translate-y-1/2 univer-gap-4
univer-bg-white univer-px-6 univer-py-4 univer-text-gray-500 univer-shadow-md univer-duration-200
sm:!univer-rounded-lg
dark:!univer-bg-gray-700 dark:!univer-text-gray-400
`,
borderClassName,
className
@@ -85,8 +85,8 @@ const DialogContent = forwardRef<
className={`
univer-absolute univer-right-4 univer-top-4 univer-size-6 univer-cursor-pointer univer-rounded-sm
univer-border-none univer-bg-transparent univer-p-0 univer-transition-opacity
disabled:univer-pointer-events-none
hover:univer-opacity-100
disabled:univer-pointer-events-none
`}
onClick={onClickClose}
>
packages/design/src/components/dropdown-menu/DropdownMenuPrimitive.tsx
+26 -26
View File
@@ -102,10 +102,10 @@ function DropdownMenuSubTrigger({
`
univer-flex univer-cursor-default univer-select-none univer-items-center univer-justify-between
univer-gap-2 univer-rounded univer-px-2 univer-py-1.5 univer-text-sm univer-outline-none
[&_svg]:univer-pointer-events-none [&_svg]:univer-size-4 [&_svg]:univer-shrink-0
dark:focus:!univer-bg-gray-600 dark:data-[state=open]:!univer-bg-gray-600
data-[state=open]:univer-bg-gray-100
focus:univer-bg-gray-100
data-[state=open]:univer-bg-gray-100
dark:focus:!univer-bg-gray-600 dark:data-[state=open]:!univer-bg-gray-600
[&_svg]:univer-pointer-events-none [&_svg]:univer-size-4 [&_svg]:univer-shrink-0
`,
className
)}
@@ -126,18 +126,18 @@ function DropdownMenuSubContent({
data-slot="dropdown-menu-sub-content"
className={clsx(
`
univer-z-[1080] univer-box-border univer-max-h-[var(--radix-popper-available-height)]
univer-overflow-y-auto univer-rounded-md univer-bg-white univer-p-1.5 univer-text-gray-900
univer-shadow-md
dark:!univer-bg-gray-700 dark:!univer-text-white
data-[state=open]:univer-animate-in data-[state=open]:univer-fade-in-0
data-[state=open]:univer-zoom-in-95
data-[state=closed]:univer-animate-out data-[state=closed]:univer-fade-out-0
data-[state=closed]:univer-zoom-out-95
data-[side=bottom]:univer-slide-in-from-top-2
data-[side=left]:univer-slide-in-from-right-2
data-[side=right]:univer-slide-in-from-left-2
data-[side=top]:univer-slide-in-from-bottom-2
data-[state=closed]:univer-animate-out data-[state=closed]:univer-fade-out-0
data-[state=closed]:univer-zoom-out-95
data-[state=open]:univer-animate-in data-[state=open]:univer-fade-in-0
data-[state=open]:univer-zoom-in-95
univer-z-[1080] univer-box-border univer-max-h-[var(--radix-popper-available-height)]
univer-overflow-y-auto univer-rounded-md univer-bg-white univer-p-1.5 univer-text-gray-900
univer-shadow-md
dark:!univer-bg-gray-700 dark:!univer-text-white
`,
borderClassName,
scrollbarClassName,
@@ -160,18 +160,18 @@ function DropdownMenuContent({
sideOffset={sideOffset}
className={clsx(
`
univer-z-[1080] univer-box-border univer-max-h-[var(--radix-popper-available-height)]
univer-overflow-y-auto univer-rounded-md univer-bg-white univer-p-1.5 univer-text-gray-900
univer-shadow-md
dark:!univer-bg-gray-700 dark:!univer-text-white
data-[state=open]:univer-animate-in data-[state=open]:univer-fade-in-0
data-[state=open]:univer-zoom-in-95
data-[state=closed]:univer-animate-out data-[state=closed]:univer-fade-out-0
data-[state=closed]:univer-zoom-out-95
data-[side=bottom]:univer-slide-in-from-top-2
data-[side=left]:univer-slide-in-from-right-2
data-[side=right]:univer-slide-in-from-left-2
data-[side=top]:univer-slide-in-from-bottom-2
data-[state=closed]:univer-animate-out data-[state=closed]:univer-fade-out-0
data-[state=closed]:univer-zoom-out-95
data-[state=open]:univer-animate-in data-[state=open]:univer-fade-in-0
data-[state=open]:univer-zoom-in-95
univer-z-[1080] univer-box-border univer-max-h-[var(--radix-popper-available-height)]
univer-overflow-y-auto univer-rounded-md univer-bg-white univer-p-1.5 univer-text-gray-900
univer-shadow-md
dark:!univer-bg-gray-700 dark:!univer-text-white
`,
borderClassName,
scrollbarClassName,
@@ -201,10 +201,10 @@ function DropdownMenuItem({
`
univer-relative univer-flex univer-cursor-default univer-select-none univer-items-center univer-gap-2
univer-rounded univer-px-2 univer-py-1.5 univer-text-sm univer-outline-none univer-transition-colors
[&>svg]:univer-size-4 [&>svg]:univer-shrink-0
dark:focus:!univer-bg-gray-600
data-[disabled]:univer-pointer-events-none data-[disabled]:univer-opacity-50
focus:univer-bg-gray-100
data-[disabled]:univer-pointer-events-none data-[disabled]:univer-opacity-50
dark:focus:!univer-bg-gray-600
[&>svg]:univer-size-4 [&>svg]:univer-shrink-0
`,
className
)}
@@ -227,9 +227,9 @@ function DropdownMenuCheckboxItem({
`
univer-relative univer-flex univer-cursor-default univer-select-none univer-items-center
univer-rounded univer-py-1.5 univer-pr-2 univer-text-sm univer-outline-none univer-transition-colors
dark:focus:!univer-bg-gray-600
data-[disabled]:univer-pointer-events-none data-[disabled]:univer-opacity-50
focus:univer-bg-gray-100
data-[disabled]:univer-pointer-events-none data-[disabled]:univer-opacity-50
dark:focus:!univer-bg-gray-600
`,
{
'univer-pl-8': !hideIndicator,
@@ -272,9 +272,9 @@ function DropdownMenuRadioItem({
`
univer-relative univer-flex univer-cursor-default univer-select-none univer-items-center
univer-rounded univer-py-1.5 univer-pr-2 univer-text-sm univer-outline-none univer-transition-colors
dark:focus:!univer-bg-gray-600
data-[disabled]:univer-pointer-events-none data-[disabled]:univer-opacity-50
focus:univer-bg-gray-100
data-[disabled]:univer-pointer-events-none data-[disabled]:univer-opacity-50
dark:focus:!univer-bg-gray-600
`,
{
'univer-pl-8': !hideIndicator,
packages/design/src/components/dropdown/Dropdown.stories.tsx
+1 -1
View File
@@ -57,8 +57,8 @@ export const Playground = {
<a
className={clsx(`
univer-cursor-pointer univer-rounded-lg univer-px-4 univer-py-2 univer-transition-all
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`, borderClassName)}
>
Click me
packages/design/src/components/dropdown/PopoverPrimitive.tsx
+7 -7
View File
@@ -45,17 +45,17 @@ function PopoverContent({
sideOffset={sideOffset}
className={clsx(
`
univer-z-[1080] univer-max-h-[var(--radix-popper-available-height)] univer-overflow-y-auto
univer-rounded-md univer-bg-white univer-text-gray-900 univer-shadow-md univer-outline-hidden
dark:!univer-bg-gray-900 dark:!univer-text-white dark:focus-visible:univer-border-gray-600
univer-outline-hidden univer-z-[1080] univer-max-h-[var(--radix-popper-available-height)]
univer-overflow-y-auto univer-rounded-md univer-bg-white univer-text-gray-900 univer-shadow-md
data-[state=open]:univer-animate-in data-[state=open]:univer-fade-in-0
data-[state=open]:univer-zoom-in-95
data-[state=closed]:univer-animate-out data-[state=closed]:univer-fade-out-0
data-[state=closed]:univer-zoom-out-95
data-[side=bottom]:univer-slide-in-from-top-2
data-[side=left]:univer-slide-in-from-right-2
data-[side=right]:univer-slide-in-from-left-2
data-[side=top]:univer-slide-in-from-bottom-2
data-[state=closed]:univer-animate-out data-[state=closed]:univer-fade-out-0
data-[state=closed]:univer-zoom-out-95
data-[state=open]:univer-animate-in data-[state=open]:univer-fade-in-0
data-[state=open]:univer-zoom-in-95
dark:!univer-bg-gray-900 dark:!univer-text-white dark:focus-visible:!univer-border-gray-600
`,
borderClassName,
scrollbarClassName,
packages/design/src/components/form-layout/FormLayout.tsx
+1 -1
View File
@@ -80,9 +80,9 @@ export const FormLayout = (props: IFormLayoutProps) => {
? (
<div
className={clsx(`
last:univer-mb-0
[&_[data-u-comp=input]]:univer-w-full
[&_[data-u-comp=select]]:univer-w-full
last:univer-mb-0
`, {
'[&_[data-u-comp=input]]:univer-border-red-500': error,
'[&_[data-u-comp=select]]:univer-border-red-500': error,
packages/design/src/components/gallery/Gallery.tsx
+14 -12
View File
@@ -83,18 +83,20 @@ export function Gallery(props: IGalleryProps) {
{/* Content */}
<div className="univer-relative">
<img
className={`
univer-max-h-[40vh] univer-max-w-[60vw] univer-transition-transform univer-duration-300
univer-ease-out
`}
style={{
transform: `scale(${zoomLevel})`,
}}
src={activeImage}
alt="gallery"
draggable={false}
/>
{activeImage && (
<img
className={`
univer-max-h-[40vh] univer-max-w-[60vw] univer-transition-transform univer-duration-300
univer-ease-out
`}
style={{
transform: `scale(${zoomLevel})`,
}}
src={activeImage}
alt="gallery"
draggable={false}
/>
)}
</div>
{/* Toolbar */}
packages/design/src/components/hover-card/HoverCard.stories.tsx
+1 -1
View File
@@ -58,8 +58,8 @@ export const Playground = {
<a
className={clsx(`
univer-cursor-pointer univer-rounded-lg univer-px-4 univer-py-2 univer-transition-all
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`, borderClassName)}
>
Click me
packages/design/src/components/hover-card/HoverCardPrimitive.tsx
+6 -6
View File
@@ -36,16 +36,16 @@ const HoverCardContent = forwardRef<
sideOffset={sideOffset}
className={clsx(
`
univer-z-[1080] univer-w-64 univer-origin-[--radix-hover-card-content-transform-origin] univer-rounded-md
univer-bg-white univer-text-gray-900 univer-shadow-md univer-outline-none
dark:!univer-bg-gray-900 dark:!univer-text-white
data-[state=open]:univer-animate-in data-[state=open]:univer-fade-in-0 data-[state=open]:univer-zoom-in-95
data-[state=closed]:univer-animate-out data-[state=closed]:univer-fade-out-0
data-[state=closed]:univer-zoom-out-95
data-[side=bottom]:univer-slide-in-from-top-2
data-[side=left]:univer-slide-in-from-right-2
data-[side=right]:univer-slide-in-from-left-2
data-[side=top]:univer-slide-in-from-bottom-2
data-[state=closed]:univer-animate-out data-[state=closed]:univer-fade-out-0
data-[state=closed]:univer-zoom-out-95
data-[state=open]:univer-animate-in data-[state=open]:univer-fade-in-0 data-[state=open]:univer-zoom-in-95
univer-z-[1080] univer-w-64 univer-origin-[--radix-hover-card-content-transform-origin] univer-rounded-md
univer-bg-white univer-text-gray-900 univer-shadow-md univer-outline-none
dark:!univer-bg-gray-900 dark:!univer-text-white
`,
borderClassName,
className
packages/design/src/components/input/Input.tsx
+3 -3
View File
@@ -27,9 +27,9 @@ type InputProps = InputHTMLAttributes<HTMLInputElement>;
export const inputVariants = cva(
`
univer-box-border univer-w-full univer-rounded-md univer-bg-white univer-transition-colors univer-duration-200
dark:!univer-bg-gray-700 dark:!univer-text-white dark:focus:!univer-ring-primary-900
focus:univer-border-primary-600 focus:univer-outline-none focus:univer-ring-2 focus:univer-ring-primary-50
placeholder:univer-text-gray-400
focus:univer-border-primary-600 focus:univer-outline-none focus:univer-ring-2 focus:univer-ring-primary-50
dark:!univer-bg-gray-700 dark:!univer-text-white dark:focus:!univer-ring-primary-900
`,
{
variants: {
@@ -170,8 +170,8 @@ export const Input = forwardRef<HTMLInputElement, IInputProps>(
univer-flex univer-size-4 univer-cursor-pointer univer-items-center
univer-rounded-full univer-border-none univer-bg-transparent univer-p-1
univer-text-gray-400 univer-transition-colors univer-duration-200
focus:univer-outline-none
hover:univer-text-gray-500
focus:univer-outline-none
`}
>
<CloseIcon className="univer-size-3" />
packages/design/src/components/menu/Menu.tsx
+2 -2
View File
@@ -70,7 +70,7 @@ export function TinyMenuGroup({ items }: ITinyMenuGroupProps) {
return (
<div
className={`
univer-flex univer-flex-wrap univer-gap-2.5 univer-menu-item-group univer-p-1 univer-pl-0 univer-pr-0
univer-menu-item-group univer-flex univer-flex-wrap univer-gap-2.5 univer-p-1 univer-pl-0 univer-pr-0
`}
>
{items.map((item) => {
@@ -80,8 +80,8 @@ export function TinyMenuGroup({ items }: ITinyMenuGroupProps) {
className={clsx(`
univer-flex univer-size-6 univer-cursor-pointer univer-items-center univer-justify-center
univer-rounded-md
dark:hover:!univer-bg-gray-900
hover:univer-bg-gray-50
dark:hover:!univer-bg-gray-900
`, {
'univer-bg-gray-50 dark:!univer-bg-gray-900': item.active,
}, item.className)}
packages/design/src/components/message/Message.tsx
+3 -3
View File
@@ -58,9 +58,9 @@ const Message = ({ content, type = MessageType.Info }: IMessageProps) => {
<div
className={clsx(
`
univer-min-w-[320px] univer-max-w-[480px] univer-rounded-xl univer-border univer-border-solid
univer-border-gray-200 univer-bg-white univer-p-4 univer-font-sans univer-shadow-md
univer-transition-all univer-duration-300 univer-animate-in univer-fade-in univer-slide-in-from-top-4
univer-animate-in univer-fade-in univer-slide-in-from-top-4 univer-min-w-[320px] univer-max-w-[480px]
univer-rounded-xl univer-border univer-border-solid univer-border-gray-200 univer-bg-white univer-p-4
univer-font-sans univer-shadow-md univer-transition-all univer-duration-300
dark:!univer-border-gray-600 dark:!univer-bg-gray-700
`
)}
packages/design/src/components/pager/Pager.tsx
+2 -2
View File
@@ -71,8 +71,8 @@ export function Pager(props: IPagerProps) {
data-u-comp="pager-left-arrow"
className={`
univer-inline-flex univer-size-4 univer-cursor-pointer univer-items-center univer-rounded
dark:hover:!univer-bg-gray-600
hover:univer-bg-gray-50
dark:hover:!univer-bg-gray-600
`}
role="button"
onClick={onClickLeftArrow}
@@ -84,8 +84,8 @@ export function Pager(props: IPagerProps) {
data-u-comp="pager-right-arrow"
className={`
univer-inline-flex univer-size-4 univer-cursor-pointer univer-items-center univer-rounded
dark:hover:!univer-bg-gray-600
hover:univer-bg-gray-50
dark:hover:!univer-bg-gray-600
`}
role="button"
onClick={onClickRightArrow}
packages/design/src/components/segmented/Segmented.tsx
+3 -3
View File
@@ -106,8 +106,8 @@ export function Segmented<T extends ItemValue = ItemValue>({
>
<div
className={`
univer-absolute univer-h-6 univer-rounded-md univer-bg-white univer-shadow-sm univer-transition-all
univer-duration-200 univer-animate-univer-slide
univer-animate-univer-slide univer-absolute univer-h-6 univer-rounded-md univer-bg-white
univer-shadow-sm univer-transition-all univer-duration-200
dark:!univer-bg-gray-700 dark:!univer-text-gray-400
`}
style={slideStyle}
@@ -125,7 +125,7 @@ export function Segmented<T extends ItemValue = ItemValue>({
univer-transition-colors
`, {
'univer-text-gray-900 dark:!univer-text-white': selectedItem === item.value,
'univer-text-gray-500 dark:hover:!univer-text-white hover:univer-text-gray-900': selectedItem !== item.value,
'univer-text-gray-500 hover:univer-text-gray-900 dark:hover:!univer-text-white': selectedItem !== item.value,
})}
type="button"
onClick={() => handleClick(item.value)}
packages/design/src/components/select-list/SelectList.tsx
+1 -1
View File
@@ -97,8 +97,8 @@ export function SelectList(props: ISelectListProps) {
univer-relative univer-block univer-cursor-pointer univer-select-none univer-rounded
univer-py-1.5 univer-pl-8 univer-pr-2 univer-text-sm univer-text-gray-900
univer-transition-colors
dark:!univer-text-white dark:hover:!univer-bg-gray-600
hover:univer-bg-gray-100
dark:!univer-text-white dark:hover:!univer-bg-gray-600
`, optionClassName, {
'univer-bg-gray-200 dark:!univer-bg-gray-500': checked,
})}
packages/design/src/components/select/Select.tsx
+1 -1
View File
@@ -146,7 +146,7 @@ export function Select(props: ISelectProps) {
return (
<DropdownMenu
className="univer-w-[var(--radix-popper-anchor-width)] univer-min-w-36 max-h"
className="max-h univer-w-[var(--radix-popper-anchor-width)] univer-min-w-36"
align="start"
open={open}
items={items}
packages/design/src/components/separator/Separator.tsx
+1 -1
View File
@@ -32,9 +32,9 @@ function Separator({
className={clsx(
`
univer-shrink-0 univer-bg-gray-200
dark:!univer-bg-gray-600
data-[orientation=horizontal]:univer-h-px data-[orientation=horizontal]:univer-w-full
data-[orientation=vertical]:univer-h-full data-[orientation=vertical]:univer-w-px
dark:!univer-bg-gray-600
`,
className
)}
packages/design/src/components/toaster/Toaster.tsx
+2 -2
View File
@@ -23,12 +23,12 @@ const Toaster = ({ visibleToasts, ...props }: IToasterProps) => {
return (
<Sonner
className={`
dark:![&_[data-description]]:univer-text-gray-200
[&_[data-description]]:univer-text-sm [&_[data-description]]:univer-text-gray-600
[&_[data-icon]]:univer-self-baseline
[&_[data-icon]>svg]:univer-relative [&_[data-icon]>svg]:univer-top-1
[&_[data-icon]]:univer-self-baseline
[&_[data-sonner-toast]]:univer-shadow-md
[&_[data-title]]:univer-text-sm [&_[data-title]]:univer-text-gray-900
dark:![&_[data-description]]:univer-text-gray-200
`}
toastOptions={{
classNames: {
packages/design/src/components/tooltip/TooltipPrimitive.tsx
+5 -5
View File
@@ -35,15 +35,15 @@ const TooltipContent = forwardRef<
sideOffset={sideOffset}
className={clsx(
`
univer-z-[1080] univer-box-border univer-w-fit univer-text-balance univer-rounded-lg
univer-bg-gray-700 univer-px-3 univer-py-2.5 univer-text-xs univer-font-medium univer-text-white
univer-animate-in univer-fade-in-0 univer-zoom-in-95
univer-animate-in univer-fade-in-0 univer-zoom-in-95 univer-z-[1080] univer-box-border univer-w-fit
univer-text-balance univer-rounded-lg univer-bg-gray-700 univer-px-3 univer-py-2.5 univer-text-xs
univer-font-medium univer-text-white
data-[state=closed]:univer-animate-out data-[state=closed]:univer-fade-out-0
data-[state=closed]:univer-zoom-out-95
data-[side=bottom]:univer-slide-in-from-top-2
data-[side=left]:univer-slide-in-from-right-2
data-[side=right]:univer-slide-in-from-left-2
data-[side=top]:univer-slide-in-from-bottom-2
data-[state=closed]:univer-animate-out data-[state=closed]:univer-fade-out-0
data-[state=closed]:univer-zoom-out-95
`,
className
)}
packages/docs-quick-insert-ui/src/views/menu/index.tsx
+1 -1
View File
@@ -80,8 +80,8 @@ export const QuickInsertButton = ({ className = '' }: IQuickInsertButtonProps) =
className={clsx(`
univer-mr-1 univer-flex univer-cursor-pointer univer-items-center univer-gap-2.5 univer-rounded-full
univer-p-1.5 univer-shadow-sm
dark:!univer-text-gray-200 dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:!univer-text-gray-200 dark:hover:!univer-bg-gray-700
`, borderClassName, {
'univer-bg-gray-100 dark:!univer-bg-gray-700': editPopup,
'univer-bg-white dark:!univer-bg-gray-900': !editPopup,
packages/docs-ui/src/components/paragraph-menu/index.tsx
+1 -1
View File
@@ -66,8 +66,8 @@ export const ParagraphMenu = ({ popup }: { popup: IPopup }) => {
className={clsx(`
univer-mr-1 univer-inline-flex univer-h-7 univer-cursor-pointer univer-items-center univer-gap-1
univer-rounded-full univer-px-2.5 univer-py-0
dark:hover:!univer-bg-gray-600
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-600
`, borderClassName, {
'univer-bg-gray-100 dark:!univer-bg-gray-700': visible,
'univer-bg-white dark:!univer-bg-gray-700': !visible,
packages/docs-ui/src/views/paragraph-setting/Setting.tsx
+8 -8
View File
@@ -106,9 +106,9 @@ export function ParagraphSetting() {
<Tooltip title={item.label} key={item.value} placement="bottom">
<span
className={clsx(`
hover:univer-bg-black/60
univer-flex univer-cursor-pointer univer-items-center univer-justify-center
univer-rounded univer-bg-none univer-px-3 univer-py-1
hover:univer-bg-black/60
`, {
'univer-bg-blend-color-dodge/90': horizontalAlignValue === item.value,
})}
@@ -123,14 +123,14 @@ export function ParagraphSetting() {
</div>
<div className="univer-t-4 univer-text-sm univer-font-medium">{localeService.t('doc.paragraphSetting.indentation')}</div>
<div>
<div className="univer-flex univer-justify-between univer-item-center">
<div className="univer-item-center univer-flex univer-justify-between">
<div className="univer-mt-3 univer-text-xs">
{localeService.t('doc.paragraphSetting.left')}
(px)
</div>
<AutoFocusInputNumber className="univer-mt-4" value={indentStart} onChange={(v) => setIndentStart(v ?? 0)} />
</div>
<div className="univer-flex univer-justify-between univer-item-center">
<div className="univer-item-center univer-flex univer-justify-between">
<div className="univer-mt-3 univer-text-xs">
{localeService.t('doc.paragraphSetting.right')}
@@ -138,7 +138,7 @@ export function ParagraphSetting() {
</div>
<AutoFocusInputNumber className="univer-mt-4" value={indentEnd} onChange={(v) => setIndentEnd(v ?? 0)} />
</div>
<div className="univer-flex univer-justify-between univer-item-center">
<div className="univer-item-center univer-flex univer-justify-between">
<div className="univer-mt-3 univer-text-xs">
{localeService.t('doc.paragraphSetting.firstLine')}
@@ -146,7 +146,7 @@ export function ParagraphSetting() {
</div>
<AutoFocusInputNumber className="univer-mt-4" value={indentFirstLine} onChange={(v) => setIndentFirstLine(v ?? 0)} />
</div>
<div className="univer-flex univer-justify-between univer-item-center">
<div className="univer-item-center univer-flex univer-justify-between">
<div className="univer-mt-3 univer-text-xs">
{localeService.t('doc.paragraphSetting.hanging')}
@@ -157,7 +157,7 @@ export function ParagraphSetting() {
</div>
<div className="univer-t-4 univer-text-sm univer-font-medium">{localeService.t('doc.paragraphSetting.spacing')}</div>
<div>
<div className="univer-flex univer-justify-betweenuniver-item-center">
<div className="univer-justify-betweenuniver-item-center univer-flex">
<div className="univer-mt-3 univer-text-xs">
{localeService.t('doc.paragraphSetting.before')}
@@ -165,7 +165,7 @@ export function ParagraphSetting() {
</div>
<AutoFocusInputNumber className="univer-mt-4" value={spaceAbove} onChange={(v) => setSpaceAbove(v ?? 0)} />
</div>
<div className="univer-flex univer-justify-between univer-item-center">
<div className="univer-item-center univer-flex univer-justify-between">
<div className="univer-mt-3 univer-text-xs">
{localeService.t('doc.paragraphSetting.after')}
@@ -173,7 +173,7 @@ export function ParagraphSetting() {
</div>
<AutoFocusInputNumber className="univer-mt-4" value={spaceBelow} onChange={(v) => setSpaceBelow(v ?? 0)} />
</div>
<div className="univer-flex univer-justify-between item-center">
<div className="item-center univer-flex univer-justify-between">
<div className="univer-mt-3 univer-text-xs">{localeService.t('doc.paragraphSetting.lineSpace')}</div>
<div
className="univer-mt-4 univer-flex univer-w-[162px] univer-flex-col univer-gap-1.5"
packages/drawing-ui/src/views/image-popup-menu/ImagePopupMenu.tsx
+1 -1
View File
@@ -91,8 +91,8 @@ export function ImagePopupMenu(props: IImagePopupMenuProps) {
<div
className={clsx(`
univer-flex univer-items-center univer-gap-2 univer-rounded univer-p-1
dark:hover:!univer-bg-gray-800
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-800
`, borderClassName, {
'univer-bg-gray-100 dark:!univer-bg-gray-800': visible,
'univer-bg-white dark:!univer-bg-gray-900': !visible,
packages/find-replace/src/views/dialog/FindReplaceDialog.tsx
+1 -1
View File
@@ -85,8 +85,8 @@ export const FindDialog = forwardRef(function FindDialogImpl(_props, ref) {
<div className="univer-mt-4 univer-text-center">
<a
className={`
univer-cursor-pointer univer-text-sm univer-text-primary-500 univer-transition-colors
hover:univer-text-primary-500/80
univer-cursor-pointer univer-text-sm univer-text-primary-500 univer-transition-colors
`}
onClick={revealReplace}
>
packages/sheets-conditional-formatting-ui/src/components/color-picker/index.tsx
+1 -1
View File
@@ -56,8 +56,8 @@ export const ColorPicker = (props: IColorPickerProps) => {
<span
className={clsx(`
univer-flex univer-cursor-pointer univer-items-center univer-rounded univer-p-1
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`, className)}
>
{renderIcon()}
packages/sheets-conditional-formatting-ui/src/components/panel/rule-edit/ColorScale.tsx
+3 -3
View File
@@ -71,10 +71,10 @@ const TextInput = (props: { id: string; type: CFValueType | 'none'; value: numbe
className={clsx(`
univer-box-border univer-h-8 univer-w-full univer-cursor-pointer univer-items-center
univer-rounded-lg univer-bg-white univer-pt-2 univer-transition-colors
hover:univer-border-primary-600
dark:!univer-bg-gray-700 dark:!univer-text-white
[&>div:first-child]:univer-px-2.5
[&>div]:univer-h-5 [&>div]:univer-ring-transparent
dark:!univer-bg-gray-700 dark:!univer-text-white
hover:univer-border-primary-600
`, borderClassName)}
initValue={formulaInitValue as any}
unitId={unitId}
@@ -306,8 +306,8 @@ export const ColorScaleStyleEditor = (props: IStyleEditorProps) => {
</div>
<div
className={`
univer-mt-3 univer-text-xs
univer-text-gray-600dark:!univer-text-gray-200
univer-mt-3 univer-text-xs
`}
>
{localeService.t('sheet.cf.panel.medianValue')}
packages/sheets-conditional-formatting-ui/src/components/panel/rule-edit/DataBar.tsx
+2 -2
View File
@@ -67,10 +67,10 @@ const InputText = (props: { disabled?: boolean; id: string; className: string; t
className={clsx(`
univer-box-border univer-h-8 univer-w-full univer-cursor-pointer univer-items-center
univer-rounded-lg univer-bg-white univer-pt-2 univer-transition-colors
hover:univer-border-primary-600
dark:!univer-bg-gray-700 dark:!univer-text-white
[&>div:first-child]:univer-px-2.5
[&>div]:univer-h-5 [&>div]:univer-ring-transparent
dark:!univer-bg-gray-700 dark:!univer-text-white
hover:univer-border-primary-600
`, borderClassName)}
initValue={v as any}
unitId={unitId}
packages/sheets-conditional-formatting-ui/src/components/panel/rule-edit/Formula.tsx
+2 -2
View File
@@ -110,10 +110,10 @@ export const FormulaStyleEditor = (props: IStyleEditorProps) => {
className={clsx(`
univer-box-border univer-h-8 univer-w-full univer-cursor-pointer univer-items-center
univer-rounded-lg univer-bg-white univer-pt-2 univer-transition-colors
hover:univer-border-primary-600
dark:!univer-bg-gray-700 dark:!univer-text-white
[&>div:first-child]:univer-px-2.5
[&>div]:univer-h-5 [&>div]:univer-ring-transparent
dark:!univer-bg-gray-700 dark:!univer-text-white
hover:univer-border-primary-600
`, borderClassName)}
errorText={formulaError}
isFocus={isFocusFormulaEditor}
packages/sheets-conditional-formatting-ui/src/components/panel/rule-edit/IconSet.tsx
+3 -3
View File
@@ -129,8 +129,8 @@ const IconGroupList = forwardRef<HTMLDivElement, IIconGroupListProps>((props, re
<a
className={`
univer-cursor-pointer univer-rounded
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`}
>
{groupItem.list.map((base64, index) => (
@@ -193,8 +193,8 @@ const IconItemList = (props: { onClick: (iconType: IIconType, iconId: string) =>
className={`
univer-mb-2 univer-mr-2 univer-flex univer-cursor-pointer univer-items-center
univer-justify-center univer-rounded
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`}
>
<img
@@ -309,8 +309,8 @@ const IconSetRuleEdit = (props: {
univer-box-border univer-flex univer-h-8 univer-w-full univer-items-center
univer-justify-between univer-rounded-md univer-bg-white univer-px-4 univer-py-2
univer-text-xs univer-text-gray-600 univer-transition-all
dark:!univer-text-gray-200
hover:univer-border-primary-600
dark:!univer-text-gray-200
`, borderClassName)}
>
{icon
packages/sheets-conditional-formatting-ui/src/components/panel/rule-list/index.tsx
+2 -2
View File
@@ -381,8 +381,8 @@ export const RuleList = (props: IRuleListProps) => {
className={clsx(`
univer-group univer-relative univer-flex univer-items-center
univer-justify-between univer-rounded univer-py-2 univer-pl-5 univer-pr-8
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`, {
'univer-bg-gray-100 dark:!univer-bg-gray-700': draggingId === index,
})}
@@ -430,8 +430,8 @@ export const RuleList = (props: IRuleListProps) => {
univer-absolute univer-right-1 univer-hidden univer-size-6
univer-cursor-pointer univer-items-center univer-justify-center
univer-rounded
group-hover:univer-flex
hover:univer-bg-gray-200
group-hover:univer-flex
`, {
'univer-flex univer-items-center univer-justify-center': draggingId === index,
})}
packages/sheets-crosshair-highlight/src/views/components/CrosshairHighlight.tsx
+1 -1
View File
@@ -41,9 +41,9 @@ export function CrosshairOverlay(props: ICrosshairOverlayProps) {
<div
key={color}
className={clsx(`
hover:univer-ring-primary-600/40 hover:univer-ring-[1.5px]
univer-box-border univer-size-5 univer-cursor-pointer univer-rounded univer-ring-offset-1
univer-transition-shadow
hover:univer-ring-[1.5px] hover:univer-ring-primary-600/40
`, borderClassName, {
'univer-ring-[1.5px] univer-ring-primary-600 hover:univer-ring-primary-600': color === currentColor,
})}
packages/sheets-data-validation-ui/src/views/components/formula-input/CustomFormulaInput.tsx
+2 -2
View File
@@ -39,10 +39,10 @@ export function CustomFormulaInput(props: IFormulaInputProps) {
className={clsx(`
univer-box-border univer-h-8 univer-w-full univer-cursor-pointer univer-items-center univer-rounded-lg
univer-bg-white univer-pt-2 univer-transition-colors
hover:univer-border-primary-600
dark:!univer-bg-gray-700 dark:!univer-text-white
[&>div:first-child]:univer-px-2.5
[&>div]:univer-h-5 [&>div]:univer-ring-transparent
dark:!univer-bg-gray-700 dark:!univer-text-white
hover:univer-border-primary-600
`, borderClassName)}
initValue={value?.formula1 ?? '=' as any}
unitId={unitId}
packages/sheets-data-validation-ui/src/views/components/formula-input/ListFormulaInput.tsx
+6 -6
View File
@@ -106,8 +106,8 @@ const ColorSelect = (props: IColorSelectProps) => {
univer-box-border univer-inline-flex univer-h-8 univer-w-16 univer-cursor-pointer univer-items-center
univer-justify-between univer-gap-2 univer-rounded-lg univer-bg-white univer-px-2.5
univer-transition-colors univer-duration-200
dark:!univer-bg-gray-700 dark:!univer-text-white
hover:univer-border-primary-600
dark:!univer-bg-gray-700 dark:!univer-text-white
`, borderClassName)}
>
<div
@@ -356,10 +356,10 @@ export function ListFormulaInput(props: IFormulaInputProps) {
className={clsx(`
univer-box-border univer-h-8 univer-w-full univer-cursor-pointer univer-items-center
univer-rounded-lg univer-bg-white univer-pt-2 univer-transition-colors
hover:univer-border-primary-600
dark:!univer-bg-gray-700 dark:!univer-text-white
[&>div:first-child]:univer-px-2.5
[&>div]:univer-h-5 [&>div]:univer-ring-transparent
dark:!univer-bg-gray-700 dark:!univer-text-white
hover:univer-border-primary-600
`, borderClassName)}
initValue={formulaStr as any}
unitId={unitId}
@@ -412,10 +412,10 @@ export function ListFormulaInput(props: IFormulaInputProps) {
/>
<a
className={`
univer-flex univer-w-fit univer-cursor-pointer univer-flex-row univer-items-center
univer-rounded univer-p-1 univer-px-2 univer-text-sm univer-text-primary
dark:hover:!univer-bg-gray-800
univer-text-primary univer-flex univer-w-fit univer-cursor-pointer univer-flex-row
univer-items-center univer-rounded univer-p-1 univer-px-2 univer-text-sm
hover:univer-bg-primary-50
dark:hover:!univer-bg-gray-800
`}
onClick={handleAdd}
>
packages/sheets-data-validation-ui/src/views/components/item/index.tsx
+5 -5
View File
@@ -77,12 +77,12 @@ export const DataValidationItem = (props: IDataValidationDetailProps) => {
<div
className={clsx(
`
univer-rounded-md univer-bg-secondary univer-relative univer--ml-2 univer--mr-2 univer-box-border
univer-flex univer-w-[287px] univer-cursor-pointer univer-flex-col univer-justify-between
univer-overflow-hidden univer-p-2 univer-pr-9
univer-bg-secondary univer-relative univer--ml-2 univer--mr-2 univer-box-border univer-flex
univer-w-[287px] univer-cursor-pointer univer-flex-col univer-justify-between univer-overflow-hidden
univer-rounded-md univer-p-2 univer-pr-9
`,
{
'dark:hover:!univer-bg-gray-700 hover:univer-bg-gray-50': !disable,
'hover:univer-bg-gray-50 dark:hover:!univer-bg-gray-700': !disable,
'univer-opacity-50': disable,
}
)}
@@ -126,8 +126,8 @@ export const DataValidationItem = (props: IDataValidationDetailProps) => {
className={`
univer-absolute univer-right-2 univer-top-[19px] univer-flex univer-h-5 univer-w-5
univer-items-center univer-justify-center univer-rounded
dark:!univer-text-gray-300 dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-200
dark:!univer-text-gray-300 dark:hover:!univer-bg-gray-700
`}
onClick={handleDelete}
>
packages/sheets-formula-ui/src/views/formula-editor/help-function/HelpFunction.tsx
+5 -4
View File
@@ -135,8 +135,9 @@ export function HelpFunction(props: IHelpFunctionProps) {
>
<div
className={clsx(`
univer-box-border univer-flex univer-items-center univer-justify-between univer-px-4
univer-py-3 univer-text-xs univer-font-medium univer-text-gray-900 univer-wrap-anywhere
univer-wrap-anywhere univer-box-border univer-flex univer-items-center
univer-justify-between univer-px-4 univer-py-3 univer-text-xs univer-font-medium
univer-text-gray-900
dark:!univer-text-white
`, borderTopClassName)}
>
@@ -153,8 +154,8 @@ export function HelpFunction(props: IHelpFunctionProps) {
univer-items-center univer-justify-center univer-rounded univer-bg-transparent
univer-p-0 univer-text-xs univer-text-gray-500 univer-outline-none
univer-transition-colors
dark:hover:!univer-bg-gray-600
hover:univer-bg-gray-200
dark:hover:!univer-bg-gray-600
`}
style={{ transform: contentVisible ? 'rotateZ(-90deg)' : 'rotateZ(90deg)' }}
onClick={() => setContentVisible(!contentVisible)}
@@ -167,8 +168,8 @@ export function HelpFunction(props: IHelpFunctionProps) {
univer-items-center univer-justify-center univer-rounded univer-bg-transparent
univer-p-0 univer-text-xs univer-text-gray-600 univer-outline-none
univer-transition-colors
dark:!univer-text-gray-200 dark:hover:!univer-bg-gray-600
hover:univer-bg-gray-300
dark:!univer-text-gray-200 dark:hover:!univer-bg-gray-600
`}
onClick={onClose}
>
packages/sheets-hyper-link-ui/src/views/CellLinkPopup/index.tsx
+3 -3
View File
@@ -113,8 +113,8 @@ export const CellLinkPopupPure = (props: ICellLinkPopupPureProps) => {
className={clsx(`
univer-ml-2 univer-flex univer-size-6 univer-cursor-pointer univer-flex-row
univer-items-center univer-justify-center univer-rounded univer-text-base
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`, { 'univer-text-red-500': isError })}
onClick={() => {
if (isError) {
@@ -144,8 +144,8 @@ export const CellLinkPopupPure = (props: ICellLinkPopupPureProps) => {
className={`
univer-ml-2 univer-flex univer-size-6 univer-cursor-pointer univer-flex-row
univer-items-center univer-justify-center univer-rounded univer-text-base
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`}
onClick={() => {
commandService.executeCommand(OpenHyperLinkEditPanelOperation.id, {
@@ -166,8 +166,8 @@ export const CellLinkPopupPure = (props: ICellLinkPopupPureProps) => {
className={`
univer-ml-2 univer-flex univer-size-6 univer-cursor-pointer univer-flex-row
univer-items-center univer-justify-center univer-rounded univer-text-base
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`}
onClick={() => {
const commandId = (type === HyperLinkEditSourceType.EDITING || type === HyperLinkEditSourceType.ZEN_EDITOR) ? CancelRichHyperLinkCommand.id : CancelHyperLinkCommand.id;
packages/sheets-note-ui/src/views/note.tsx
+1 -1
View File
@@ -131,8 +131,8 @@ export const SheetsNote = (props: { popup: IPopup<{ location: ISheetLocationBase
className={clsx(`
univer-resize-both univer-ml-px univer-rounded-md univer-bg-white univer-p-2 univer-text-gray-900
univer-shadow
dark:!univer-bg-gray-800 dark:!univer-text-white
focus:univer-outline-none
dark:!univer-bg-gray-800 dark:!univer-text-white
`, borderClassName, scrollbarClassName)}
style={{ width: note.width, height: note.height }}
value={note.note}
packages/sheets-numfmt-ui/src/views/components/Currency.tsx
+1 -1
View File
@@ -95,7 +95,7 @@ export const CurrencyPanel: FC<IBusinessComponentProps> = (props) => {
</div>
</div>
</div>
<div className="univer-mt-4 label">
<div className="label univer-mt-4">
{t('sheet.numfmt.negType')}
</div>
packages/sheets-numfmt-ui/src/views/components/MoreNumfmtType.tsx
+1 -1
View File
@@ -87,8 +87,8 @@ export const Options = () => {
className={`
univer-flex univer-h-7 univer-items-center univer-justify-between univer-gap-6 univer-rounded
univer-px-2 univer-text-sm
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`}
onClick={() => {
handleOnclick(index);
packages/sheets-sort-ui/src/views/CustomSortPanel.tsx
+2 -2
View File
@@ -256,8 +256,8 @@ export function SortOptionItem(props: ISortOptionItemProps) {
univer-relative univer-box-border univer-flex univer-h-7 univer-cursor-pointer
univer-list-none univer-items-center univer-justify-between univer-rounded
univer-px-2 univer-text-sm univer-transition-all
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`}
>
<span className="univer-max-w-[220px] univer-truncate">
@@ -305,7 +305,7 @@ export function SortOptionItem(props: ISortOptionItemProps) {
<Radio value={SortType.DESC}>{localeService.t('sheets-sort.general.sort-desc')}</Radio>
</RadioGroup>
</div>
<div className="univer-absolute univer-right-0 univer-cursor-pointer univer-text-sm univer-s-[14px]">
<div className="univer-s-[14px] univer-absolute univer-right-0 univer-cursor-pointer univer-text-sm">
{showDelete && <DeleteEmptyIcon onClick={() => onChange(null, currentIndex)} />}
</div>
</div>
packages/sheets-table-ui/src/views/components/SheetTableAnchor.tsx
+2 -2
View File
@@ -135,8 +135,8 @@ export const SheetTableAnchor = () => {
<div
key={item.tableId}
className={clsx(`
univer-absolute univer-box-border univer-cursor-pointer univer-items-center univer-rounded-xl
univer-pl-2 univer-pr-2 univer-shadow-xs
univer-shadow-xs univer-absolute univer-box-border univer-cursor-pointer univer-items-center
univer-rounded-xl univer-pl-2 univer-pr-2
`, borderClassName, {
'univer-flex': !shouldHidden,
'univer-hidden': shouldHidden,
packages/sheets-table-ui/src/views/components/SheetTableConditionPanel.tsx
+2 -2
View File
@@ -110,9 +110,9 @@ export const SheetTableConditionPanel = (props: IConditionFilterProps) => {
univer-box-border univer-flex univer-h-8 univer-w-full univer-items-center univer-justify-between
univer-rounded-md univer-bg-white univer-px-2 univer-text-sm univer-transition-colors
univer-duration-200
dark:!univer-bg-gray-700 dark:!univer-text-white
focus:univer-border-primary-600 focus:univer-outline-none focus:univer-ring-2
hover:univer-border-primary-600
focus:univer-border-primary-600 focus:univer-outline-none focus:univer-ring-2
dark:!univer-bg-gray-700 dark:!univer-text-white
`, borderClassName)}
>
<span>
packages/sheets-table-ui/src/views/components/SheetTableFilterPanel.tsx
+1 -1
View File
@@ -201,7 +201,7 @@ export function SheetTableFilterPanel() {
</div>
<div
className={`
univer-mt-4 univer-inline-flex univer-flex-shrink-0 univer-flex-grow-0 univer-flex-wrap-nowrap
univer-flex-wrap-nowrap univer-mt-4 univer-inline-flex univer-flex-shrink-0 univer-flex-grow-0
univer-justify-between univer-overflow-hidden
`}
>
packages/sheets-ui/src/components/border-panel/BorderPanel.tsx
+4 -4
View File
@@ -104,8 +104,8 @@ export function BorderPanel(props: IBorderPanelProps) {
className={clsx(`
univer-flex univer-size-6 univer-cursor-pointer univer-items-center univer-justify-center
univer-justify-self-center univer-rounded
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`, {
'univer-bg-gray-200 dark:!univer-bg-gray-600': borderStyleManagerService.getBorderInfo().type === item.value,
})}
@@ -134,8 +134,8 @@ export function BorderPanel(props: IBorderPanelProps) {
className={`
univer-flex univer-cursor-pointer univer-items-center univer-gap-2 univer-rounded
univer-border-none univer-bg-transparent univer-p-1
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`}
type="button"
>
@@ -162,8 +162,8 @@ export function BorderPanel(props: IBorderPanelProps) {
className={`
univer-flex univer-cursor-pointer univer-items-center
univer-justify-center univer-rounded univer-px-1 univer-py-2
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`}
onClick={() => handleClick(item.value, 'style')}
>
@@ -184,8 +184,8 @@ export function BorderPanel(props: IBorderPanelProps) {
className={`
univer-flex univer-cursor-pointer univer-items-center univer-gap-2 univer-rounded
univer-border-none univer-bg-transparent univer-p-1
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`}
type="button"
>
packages/sheets-ui/src/views/auto-fill-popup-menu/AutoFillPopupMenu.tsx
+1 -1
View File
@@ -201,8 +201,8 @@ export function AutoFillPopupMenu() {
<div
className={clsx(`
univer-flex univer-items-center univer-gap-2 univer-rounded univer-p-1
dark:hover:!univer-bg-gray-800
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-800
`, borderClassName, {
'univer-bg-gray-100 dark:!univer-bg-gray-800': visible,
'univer-bg-white dark:!univer-bg-gray-900': !visible,
packages/sheets-ui/src/views/clipboard/ClipboardPopupMenu.tsx
+1 -1
View File
@@ -160,8 +160,8 @@ export const ClipboardPopupMenu = () => {
<div
className={clsx(`
univer-flex univer-items-center univer-gap-2 univer-rounded univer-p-1
dark:hover:!univer-bg-gray-800
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-800
`, borderClassName, {
'univer-bg-gray-100 dark:!univer-bg-gray-800': visible,
'univer-bg-white dark:!univer-bg-gray-900': !visible,
packages/sheets-ui/src/views/defined-name/DefinedName.tsx
+3 -3
View File
@@ -52,8 +52,8 @@ export function DefinedName({ disable }: { disable: boolean }) {
className={clsx(`
univer-box-border univer-h-full univer-w-full univer-appearance-none univer-px-1.5
univer-text-gray-900
dark:!univer-border-r-gray-700 dark:!univer-bg-gray-900 dark:!univer-text-white
focus:univer-outline-none
dark:!univer-border-r-gray-700 dark:!univer-bg-gray-900 dark:!univer-text-white
`, borderRightClassName, {
'univer-cursor-not-allowed': disable,
})}
@@ -74,10 +74,10 @@ export function DefinedName({ disable }: { disable: boolean }) {
className={clsx(`
univer-absolute univer-right-0 univer-top-0 univer-flex univer-h-full univer-cursor-pointer
univer-items-center univer-justify-center univer-px-1 univer-transition-colors univer-duration-200
dark:!univer-text-white dark:hover:!univer-bg-gray-800
hover:univer-bg-gray-100
dark:!univer-text-white dark:hover:!univer-bg-gray-800
`, {
'univer-cursor-not-allowed univer-text-gray-300 dark:!univer-text-gray-700 hover:univer-bg-transparent': disable,
'univer-cursor-not-allowed univer-text-gray-300 hover:univer-bg-transparent dark:!univer-text-gray-700': disable,
})}
>
<MoreDownIcon />
packages/sheets-ui/src/views/defined-name/DefinedNameContainer.tsx
+8 -8
View File
@@ -218,8 +218,8 @@ export const DefinedNameContainer = () => {
className={clsx(`
univer-group univer-relative univer-flex univer-cursor-default univer-select-none
univer-items-center univer-justify-between univer-rounded-md univer-p-2
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-50
dark:hover:!univer-bg-gray-700
`, {
'univer-hidden': definedName.id === editorKey,
})}
@@ -254,9 +254,9 @@ export const DefinedNameContainer = () => {
-univer-translate-y-1/2 univer-cursor-pointer univer-items-center
univer-justify-center univer-rounded univer-p-1 univer-text-xs
univer-text-primary-600
dark:hover:!univer-bg-gray-600
group-hover:univer-flex
hover:univer-bg-gray-100
group-hover:univer-flex
dark:hover:!univer-bg-gray-600
`}
onClick={(e) => {
e.stopPropagation();
@@ -269,13 +269,13 @@ export const DefinedNameContainer = () => {
<Tooltip title={localeService.t('definedName.deleteButton')} placement="top">
<a
className={`
univer-absolute univer-text-xs univer-text-error univer-right-5 univer-top-1/2
univer-hidden -univer-translate-y-1/2 univer-cursor-pointer
univer-items-center univer-justify-center univer-rounded univer-p-1
univer-text-error univer-absolute univer-right-5 univer-top-1/2 univer-hidden
-univer-translate-y-1/2 univer-cursor-pointer univer-items-center
univer-justify-center univer-rounded univer-p-1 univer-text-xs
univer-text-red-600
dark:hover:!univer-bg-gray-600
group-hover:univer-flex
hover:univer-bg-gray-100
group-hover:univer-flex
dark:hover:!univer-bg-gray-600
`}
onClick={(e) => {
e.stopPropagation();
packages/sheets-ui/src/views/defined-name/DefinedNameInput.tsx
+2 -2
View File
@@ -246,10 +246,10 @@ export const DefinedNameInput = (props: IDefinedNameInputProps) => {
className={clsx(`
univer-box-border univer-h-8 univer-w-full univer-cursor-pointer univer-items-center
univer-rounded-lg univer-bg-white univer-pt-2 univer-transition-colors
hover:univer-border-primary-600
dark:!univer-bg-gray-700 dark:!univer-text-white
[&>div:first-child]:univer-px-2.5
[&>div]:univer-h-5 [&>div]:univer-ring-transparent
dark:!univer-bg-gray-700 dark:!univer-text-white
hover:univer-border-primary-600
`, borderClassName)}
initValue={formulaOrRefStringValue as any}
unitId={unitId}
packages/sheets-ui/src/views/defined-name/DefinedNameOverlay.tsx
+2 -2
View File
@@ -103,8 +103,8 @@ export function DefinedNameOverlay() {
key={index}
className={`
univer-cursor-pointer univer-px-2 univer-transition-colors univer-duration-200
dark:hover:!univer-bg-gray-600
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-600
`}
onClick={() => { focusDefinedName(definedName); }}
>
@@ -141,8 +141,8 @@ export function DefinedNameOverlay() {
<div
className={`
univer-cursor-pointer univer-p-2 univer-transition-colors univer-duration-200
dark:hover:!univer-bg-gray-600
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-600
`}
onClick={openSlider}
>
packages/sheets-ui/src/views/dropdown/list-dropdown/index.tsx
+2 -2
View File
@@ -112,8 +112,8 @@ const SelectList = (props: ISelectListProps) => {
className={`
univer-mt-1 univer-flex univer-cursor-pointer univer-flex-row univer-items-center
univer-justify-between univer-rounded-md univer-px-1.5 univer-py-1
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-50
dark:hover:!univer-bg-gray-700
`}
onClick={handleClick}
>
@@ -162,8 +162,8 @@ const SelectList = (props: ISelectListProps) => {
className={`
univer-block univer-cursor-pointer univer-rounded univer-px-1.5 univer-py-1
univer-text-xs
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-200
dark:hover:!univer-bg-gray-700
`}
onClick={onEdit}
>
packages/sheets-ui/src/views/formula-bar/FormulaBar.tsx
+3 -3
View File
@@ -298,7 +298,7 @@ export function FormulaBar(props: IProps) {
univer-text-base
dark:!univer-text-white
`, {
'univer-cursor-pointer univer-text-green-600 dark:!univer-text-green-400 dark:hover:!univer-bg-gray-700 hover:univer-bg-gray-100': iconActivated,
'univer-cursor-pointer univer-text-green-600 hover:univer-bg-gray-100 dark:!univer-text-green-400 dark:hover:!univer-bg-gray-700': iconActivated,
})}
onClick={handleCloseBtnClick}
>
@@ -310,7 +310,7 @@ export function FormulaBar(props: IProps) {
univer-text-base
dark:!univer-text-white
`, {
'univer-cursor-pointer univer-text-red-600 dark:!univer-text-red-400 dark:hover:!univer-bg-gray-700 hover:univer-bg-gray-100': iconActivated,
'univer-cursor-pointer univer-text-red-600 hover:univer-bg-gray-100 dark:!univer-text-red-400 dark:hover:!univer-bg-gray-700': iconActivated,
})}
onClick={handleConfirmBtnClick}
>
@@ -320,8 +320,8 @@ export function FormulaBar(props: IProps) {
className={`
univer-flex univer-cursor-pointer univer-items-center univer-justify-center univer-rounded
univer-p-1 univer-text-base
dark:!univer-text-white dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:!univer-text-white dark:hover:!univer-bg-gray-700
`}
onClick={handlerFxBtnClick}
>
packages/sheets-ui/src/views/permission/panel-detail/PermissionDetailFooterPart.tsx
+1 -1
View File
@@ -58,7 +58,7 @@ export const PermissionDetailFooterPart = (props: IPermissionDetailFooterPartPro
const subUnitId = worksheet.getSheetId();
return (
<div className="univer-mt-auto univer-flex univer-flex-row-reverse univer-py-5 univer-gap-2">
<div className="univer-mt-auto univer-flex univer-flex-row-reverse univer-gap-2 univer-py-5">
<Button
variant="primary"
onClick={async () => {
packages/sheets-ui/src/views/permission/panel-list/index.tsx
+1 -2
View File
@@ -382,9 +382,8 @@ export function SheetPermissionPanelList() {
<Tooltip title={rule.description}>
<div
className={`
univer-text-3 univer-max-w-64 univer-overflow-hidden
univer-text-3 univer-mt-2] univer-max-w-64 univer-overflow-hidden
univer-text-ellipsis univer-whitespace-nowrap univer-text-gray-400
univer-mt-2]
`}
>
{rule.description}
packages/sheets-ui/src/views/sheet-bar/sheet-bar-tabs/SheetBarItem.tsx
+1 -1
View File
@@ -67,8 +67,8 @@ export function SheetBarItem(props: IBaseSheetBarProps) {
`
: `
univer-font-medium univer-text-gray-900
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`)}
style={{
backgroundColor: !currentSelected && color ? color : '',
packages/slides-ui/src/components/image-popup-menu/ImagePopupMenu.tsx
+1 -1
View File
@@ -110,8 +110,8 @@ export function SlideImagePopupMenu(props: IImagePopupMenuProps) {
<div
className={clsx(`
univer-flex univer-items-center univer-gap-2 univer-rounded univer-p-1
dark:hover:!univer-bg-gray-800
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-800
`, borderClassName, {
'univer-bg-gray-100 dark:!univer-bg-gray-800': visible,
'univer-bg-white dark:!univer-bg-gray-900': !visible,
packages/thread-comment-ui/src/views/thread-comment-tree/index.tsx
+2 -2
View File
@@ -418,8 +418,8 @@ export const ThreadCommentTree = (props: IThreadCommentTreeProps) => {
className={clsx(`
univer-ml-1 univer-inline-flex univer-h-6 univer-w-6 univer-cursor-pointer
univer-items-center univer-justify-center univer-rounded-[3px] univer-text-base
dark:hover:!univer-bg-gray-800
hover:univer-bg-gray-50
dark:hover:!univer-bg-gray-800
`, {
'univer-text-green-500': resolved,
})}
@@ -433,8 +433,8 @@ export const ThreadCommentTree = (props: IThreadCommentTreeProps) => {
className={`
univer-ml-1 univer-inline-flex univer-h-6 univer-w-6 univer-cursor-pointer
univer-items-center univer-justify-center univer-rounded-[3px] univer-text-base
dark:hover:!univer-bg-gray-800
hover:univer-bg-gray-50
dark:hover:!univer-bg-gray-800
`}
onClick={handleDeleteRoot}
>
packages/ui/src/components/slider/Slider.tsx
+1 -1
View File
@@ -203,7 +203,7 @@ export function Slider(props: ISliderProps) {
univer-absolute univer-top-[calc(50%-6px)] univer-size-3 -univer-translate-x-1/2
univer-rounded-full univer-border-none univer-bg-white univer-shadow univer-transition-colors
`, {
'univer-cursor-pointer hover:univer-gray-200': !disabled,
'hover:univer-gray-200 univer-cursor-pointer': !disabled,
'univer-cursor-not-allowed': disabled,
})}
role="handle"
packages/ui/src/views/components/ribbon/Ribbon.tsx
+1 -1
View File
@@ -331,8 +331,8 @@ export function Ribbon(props: IRibbonProps) {
className={`
univer-box-border univer-flex univer-cursor-pointer univer-items-center
univer-gap-2.5 univer-rounded-lg univer-px-2 univer-py-1.5
dark:hover:!univer-bg-gray-700
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`}
onClick={() => handleSelectTab(group)}
>
packages/ui/src/views/components/ribbon/ToolbarItem.tsx
+10 -10
View File
@@ -107,11 +107,11 @@ export const ToolbarItem = forwardRef<ITooltipWrapperRef, IDisplayMenuItem<IMenu
data-u-command={id}
data-disabled={disabled}
className={clsx(`
univer-group univer-relative univer-flex univer-h-6 univer-cursor-pointer univer-items-center
univer-rounded univer-pr-5 univer-text-sm univer-transition-colors univer-animate-in
univer-fade-in
dark:hover:!univer-bg-gray-700
univer-animate-in univer-fade-in univer-group univer-relative univer-flex univer-h-6
univer-cursor-pointer univer-items-center univer-rounded univer-pr-5 univer-text-sm
univer-transition-colors
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`, {
'univer-text-gray-900 dark:!univer-text-white': !disabled,
'univer-pointer-events-none univer-cursor-not-allowed univer-text-gray-300 dark:!univer-text-gray-600': disabled,
@@ -121,8 +121,8 @@ export const ToolbarItem = forwardRef<ITooltipWrapperRef, IDisplayMenuItem<IMenu
className={clsx(`
univer-relative univer-z-[1] univer-flex univer-h-full univer-items-center univer-rounded-l
univer-px-1 univer-transition-colors
dark:hover:!univer-bg-gray-600
hover:univer-bg-gray-200
dark:hover:!univer-bg-gray-600
`, {
'univer-bg-gray-200 dark:!univer-bg-gray-500': activated,
'univer-bg-gray-100': activated && disabled,
@@ -151,8 +151,8 @@ export const ToolbarItem = forwardRef<ITooltipWrapperRef, IDisplayMenuItem<IMenu
univer-absolute univer-right-0 univer-top-0 univer-box-border univer-flex univer-h-6
univer-w-5 univer-items-center univer-justify-center univer-rounded-r
univer-transition-colors
dark:hover:!univer-bg-gray-600
hover:univer-bg-gray-200
dark:hover:!univer-bg-gray-600
`, {
'univer-pointer-events-none univer-cursor-not-allowed univer-text-gray-300 dark:!univer-text-gray-600': disabled,
'univer-bg-gray-200 dark:!univer-bg-gray-500': activated,
@@ -178,11 +178,11 @@ export const ToolbarItem = forwardRef<ITooltipWrapperRef, IDisplayMenuItem<IMenu
<div
data-u-command={id}
className={clsx(`
univer-relative univer-flex univer-h-6 univer-cursor-pointer univer-items-center univer-gap-2
univer-whitespace-nowrap univer-rounded univer-px-1 univer-transition-colors univer-animate-in
univer-fade-in
dark:hover:!univer-bg-gray-700
univer-animate-in univer-fade-in univer-relative univer-flex univer-h-6 univer-cursor-pointer
univer-items-center univer-gap-2 univer-whitespace-nowrap univer-rounded univer-px-1
univer-transition-colors
hover:univer-bg-gray-100
dark:hover:!univer-bg-gray-700
`, {
'univer-text-gray-900 dark:!univer-text-white': !disabled,
'univer-pointer-events-none univer-cursor-not-allowed univer-text-gray-300 dark:!univer-text-gray-600': disabled,
packages/ui/src/views/components/zen-zone/ZenZone.tsx
+1 -1
View File
@@ -55,7 +55,7 @@ export function ZenZone() {
return (
<section
className={clsx('univer-absolute univer-z-[-1] univer-flex', {
'univer-inset-0 univer-z-[100] univer-bg-gray-100 univer-animate-in univer-fade-in': visible,
'univer-animate-in univer-fade-in univer-inset-0 univer-z-[100] univer-bg-gray-100': visible,
'univer-hidden': hidden,
})}
>
pnpm-lock.yaml
Generated
+503 -436
View File
File diff suppressed because it is too large Load Diff