fix: remove the overlap caused by border-b #5160
Conversation
lonewolfyx
requested review from
anncwb,
vince292007 and
mynetfan
as code owners
|
|
Warning There were issues while running some tools. Please review the errors and either fix the tool’s configuration or disable the tool if it’s a critical failure. 🔧 eslint
packages/effects/common-ui/src/ui/dashboard/workbench/workbench-project.vueOops! Something went wrong! :( ESLint: 9.16.0 Error [ERR_MODULE_NOT_FOUND]: Cannot find module '/node_modules/@vben/eslint-config/dist/index.mjs' imported from /eslint.config.mjs WalkthroughThe pull request introduces minor visual styling modifications to two Vue components in the workbench dashboard area. The changes involve removing the Changes
Poem
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (1)
packages/effects/common-ui/src/ui/dashboard/workbench/workbench-quick-nav.vue (1)
41-41: Consider extracting the complex grid item classes into a computed propertyThe class string combines multiple styling concerns (borders, spacing, interactions). Consider improving maintainability by extracting it into a computed property.
<script setup lang="ts"> // ... existing imports and props ... +const getItemClasses = (index: number) => { + return { + 'flex-col-center border-border group w-1/3 cursor-pointer border-r border-t py-8 hover:shadow-xl': true, + 'border-r-0': index % 3 === 2, + 'pb-4': index > 2, + 'border-b-0': index < 3, + } +} </script> <template> <!-- ... --> <div - class="flex-col-center border-border group w-1/3 cursor-pointer border-r border-t py-8 hover:shadow-xl" - :class="{ - 'border-r-0': index % 3 === 2, - 'pb-4': index > 2, - 'border-b-0': index < 3, - }" + :class="getItemClasses(index)" @click="$emit('click', item)" >
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
packages/effects/common-ui/src/ui/dashboard/workbench/workbench-project.vue(1 hunks)packages/effects/common-ui/src/ui/dashboard/workbench/workbench-quick-nav.vue(1 hunks)
✅ Files skipped from review due to trivial changes (1)
- packages/effects/common-ui/src/ui/dashboard/workbench/workbench-project.vue
🔇 Additional comments (1)
packages/effects/common-ui/src/ui/dashboard/workbench/workbench-quick-nav.vue (1)
41-41: LGTM! Border styling fix effectively prevents overlap
The border styling approach correctly eliminates double borders by:
- Using border-r and border-t as base borders
- Removing right border (border-r-0) for end-of-row items
- Removing bottom border (border-b-0) for first row items
This creates a clean grid layout without border overlaps.
Description
工作台中的项目以及快捷导航 card 存在双重 border
links: https://www.vben.pro/#/workspace
Type of change
Please delete options that are not relevant.
Summary by CodeRabbit