Skip to content

fix: adjust menu item height, separator spacing and dark mode - #711

Merged
18202781743 merged 1 commit into
linuxdeepin:v25-flowstylefrom
zqq-dora:v25-flowstyle
Sep 28, 2026
Merged

18202781743 merged 1 commit into
linuxdeepin:v25-flowstylefrom
zqq-dora:v25-flowstyle

Conversation

@zqq-dora

@zqq-dora zqq-dora commented Sep 24, 2026 •

Copy link
Copy Markdown

Summary

  1. Reduce menu item height from 30px to 26px for compact layout
  2. Add menu item padding property (3px) to constrain content height
  3. Reduce menu top/bottom padding from 8px to 6px
  4. Set separator top/bottom padding to 3px for proper spacing
  5. Add normalDark color for separator to fix invisible separator in dark mode
  6. Add palette: D.DTK.palette binding in Menu.qml to fix greyed-out highlight color when popup window is not active
  7. Disable hover highlight for disabled menu items in MenuItem.qml

Files Changed

  • qt6/src/qml/FlowStyle.qml — menu height/padding/separator style values and dark mode separator color
  • qt6/src/qml/Menu.qml — palette binding fix
  • qt6/src/qml/MenuItem.qml — padding source and disabled highlight fix

Root Cause

  • Separator in dark mode: The lineColor palette in FlowStyle.qml was missing the normalDark property, so the separator fell back to the light-mode color (Qt.rgba(0, 0, 0, 0.1)) which is nearly invisible on dark backgrounds.
  • Greyed-out highlight: Menu.qml was missing the palette: D.DTK.palette binding that Popup.qml already had. Without it, the highlight color used the default window palette instead of the DTK theme palette when the popup window was not active.
  • Disabled item highlight: MenuItem.qml applied the highlighted state based purely on hovered, without checking enabled, so disabled items still showed a hover highlight effect.

概述(中文)

  1. 菜单项高度从 30px 调整为 26px,使布局更紧凑
  2. 添加菜单项 padding 属性(3px),限制内容高度不超出 26px
  3. 菜单上下边距从 8px 调整为 6px
  4. 分割线上下间距设置为 3px,保证合理的间距
  5. 添加分割线深色模式颜色,修复深色模式下分割线不可见的问题
  6. Menu.qml 中添加 palette 绑定,修复菜单高亮颜色置灰的问题
  7. MenuItem.qml 中禁用项不再显示 hover 高亮效果

根本原因

  • 深色模式分割线不可见:FlowStyle.qml 中 lineColor 调色板缺少 normalDark 属性,导致深色模式下分割线回退使用浅色模式颜色(Qt.rgba(0, 0, 0, 0.1)),在深色背景上几乎不可见。
  • 高亮颜色置灰:Menu.qml 缺少 palette: D.DTK.palette 绑定(Popup.qml 中已有此绑定)。缺少该绑定时,弹出窗口非激活状态下高亮颜色使用默认窗口调色板而非 DTK 主题调色板。
  • 禁用项高亮:MenuItem.qml 中 highlighted 状态仅基于 hovered 判断,未检查 enabled,导致禁用项仍显示 hover 高亮效果。

Summary by Sourcery

Improve menu layout and theming while correcting separator, popup highlight, and disabled-item hover behavior.

Bug Fixes:

  • Fix separator visibility in dark mode by applying an appropriate dark-theme separator color.
  • Use the DTK palette for menu popups so inactive menu highlights retain the theme color.
  • Prevent disabled menu items from displaying hover highlights.

Enhancements:

  • Make menus more compact by reducing item height and menu spacing while adding consistent item and separator padding.

@deepin-ci-robot

Copy link
Copy Markdown
Contributor

Hi @zqq-dora. Thanks for your PR.

I'm waiting for a linuxdeepin member to verify that this patch is reasonable to test. If it is, they should reply with /ok-to-test on its own line. Until that is done, I will not automatically test new commits in this PR, but the usual testing commands by org members will still work. Regular contributors should join the org to skip this step.

Once the patch is verified, the new status will be reflected by the ok-to-test label.

I understand the commands that are listed here.

Details

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes/test-infra repository.

@sourcery-ai

sourcery-ai Bot commented Sep 24, 2026

Copy link
Copy Markdown
Reviewer's guide (collapsed on small PRs)

Reviewer's Guide

This PR compacts menu layout, adds consistent separator spacing and dark-mode coloring, binds menus to the DTK palette to preserve highlight colors in inactive popups, and suppresses hover highlighting for disabled items.

File-Level Changes

Change Details Files
Tighten menu and separator layout through centralized style values.
  • Reduce menu item height and introduce dedicated item padding.
  • Reduce menu top padding and add separator line spacing.
qt6/src/qml/FlowStyle.qml
qt6/src/qml/MenuItem.qml
Correct separator rendering across light and dark themes.
  • Define a light contrasting separator color for dark mode via the palette's normalDark value.
qt6/src/qml/FlowStyle.qml
Ensure menu visuals use the DTK theme and respect disabled state.
  • Bind the menu to the DTK palette for consistent popup highlight colors.
  • Prevent disabled items from entering the highlighted state.
qt6/src/qml/Menu.qml
qt6/src/qml/MenuItem.qml

Tips and commands

Interacting with Sourcery

  • Trigger a new review: Comment @sourcery-ai review on the pull request.
  • Continue discussions: Reply directly to Sourcery's review comments.
  • Generate a GitHub issue from a review comment: Ask Sourcery to create an
    issue from a review comment by replying to it. You can also reply to a
    review comment with @sourcery-ai issue to create an issue from it.
  • Generate a pull request title: Write @sourcery-ai anywhere in the pull
    request title to generate a title at any time. You can also comment
    @sourcery-ai title on the pull request to (re-)generate the title at any time.
  • Generate a pull request summary: Write @sourcery-ai summary anywhere in
    the pull request body to generate a PR summary at any time exactly where you
    want it. You can also comment @sourcery-ai summary on the pull request to
    (re-)generate the summary at any time.
  • Generate reviewer's guide: Comment @sourcery-ai guide on the pull
    request to (re-)generate the reviewer's guide at any time.
  • Resolve all Sourcery comments: Comment @sourcery-ai resolve on the
    pull request to resolve all Sourcery comments. Useful if you've already
    addressed all the comments and don't want to see them anymore.
  • Dismiss all Sourcery reviews: Comment @sourcery-ai dismiss on the pull
    request to dismiss all existing Sourcery reviews. Especially useful if you
    want to start fresh with a new review - don't forget to comment
    @sourcery-ai review to trigger a new review!

Customizing Your Experience

Access your dashboard to:

  • Enable or disable review features such as the Sourcery-generated pull request
    summary, the reviewer's guide, and others.
  • Change the review language.
  • Add, remove or edit custom review instructions.
  • Adjust other review settings.

Getting Help

@sourcery-ai sourcery-ai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hey - I've reviewed your changes and they look great!


Sourcery is free for open source - if you like our reviews please consider sharing them ✨

Comment thread qt6/src/qml/Menu.qml Outdated
1. Reduce menu item height from 30px to 26px for compact layout
2. Add menu item padding property (3px) to constrain content height
3. Reduce menu top/bottom padding from 8px to 6px
4. Set separator top/bottom padding to 3px for proper spacing
5. Add normalDark color for separator to fix invisible separator in
   dark mode
6. Disable highlight for disabled menu items in MenuItem.qml
7. Update SPDX copyright year in MenuItem.qml

Log: Fix menu styling and dark mode rendering issues

Influence:
1. Verify menu item height is 26px and content fits within bounds
2. Verify separator appears with 3px padding above and below
3. Verify separator is visible in dark mode
4. Verify disabled menu items show no hover highlight effect
5. Verify menu top/bottom edge padding is 6px

fix: 调整菜单项高度、分割线间距及深色模式样式

1. 菜单项高度从30px调整为26px,使布局更紧凑
2. 添加菜单项padding属性(3px),限制内容高度不超出26px
3. 菜单上下边距从8px调整为6px
4. 分割线上下间距设置为3px,保证合理的间距
5. 添加分割线深色模式颜色,修复深色模式下分割线不可见的问题
6. MenuItem.qml中禁用项不再显示hover高亮效果
7. 更新MenuItem.qml的SPDX版权年份

Log: 修复菜单样式及深色模式渲染问题

Influence:
1. 验证菜单项高度为26px,内容不超出边界
2. 验证分割线上下间距为3px
3. 验证深色模式下分割线可见
4. 验证禁用菜单项不显示hover高亮效果
5. 验证菜单上下边距为6px
@deepin-ci-robot

Copy link
Copy Markdown
Contributor

[APPROVALNOTIFIER] This PR is NOT APPROVED

This pull-request has been approved by: 18202781743, zqq-dora

The full list of commands accepted by this bot can be found here.

Details Needs approval from an approver in each of these files:

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

@18202781743
18202781743 merged commit d7830c1 into linuxdeepin:v25-flowstyle Sep 28, 2026
18 of 19 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants