Skip to content

fix(notification): Button text is truncated when hovering over "Clear all" in English environment with 20 font size #1431

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
deepin-bot merged 1 commit into from
Feb 5, 2026
Merged

fix(notification): Button text is truncated when hovering over "Clear all" in English environment with 20 font size #1431

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
36 changes: 29 additions & 7 deletions panels/notification/center/NotifyHeader.qml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import Qt5Compat.GraphicalEffects
import org.deepin.dtk 1.0
import org.deepin.ds.notification
import org.deepin.ds.notificationcenter
Expand Down Expand Up @@ -45,16 +46,37 @@ FocusScope {

RowLayout {
anchors.fill: parent
NotifyHeaderTitleText {
text: qsTr("Notification Center")
spacing: 8
// Title container with fade-out effect when compressed by buttons
Item {
id: titleContainer
Layout.alignment: Qt.AlignLeft
Layout.leftMargin: 18
tFont: DTK.fontManager.t4
}

Item {
Layout.fillWidth: true
Layout.preferredHeight: 1
implicitHeight: titleText.implicitHeight

// Enable opacity mask only when text overflows container
layer.enabled: titleText.implicitWidth > titleContainer.width + 5
layer.effect: OpacityMask {
maskSource: Rectangle {
width: titleContainer.width
height: titleContainer.height
// Horizontal gradient: fully visible on left, fade to transparent on right
gradient: Gradient {
orientation: Gradient.Horizontal
GradientStop { position: 0.0; color: "#FFFFFFFF" } // Fully opaque
GradientStop { position: 0.9; color: "#FFFFFFFF" } // Still opaque at 90%
GradientStop { position: 1.0; color: "#00FFFFFF" } // Fully transparent
}
}
}

NotifyHeaderTitleText {
id: titleText
text: qsTr("Notification Center")
elide: Text.ElideNone
tFont: DTK.fontManager.t4
}
}

AnimationSettingButton {
Expand Down