diff options
Diffstat (limited to 'components')
| -rw-r--r-- | components/controls/CollapsibleSection.qml | 40 |
1 files changed, 38 insertions, 2 deletions
diff --git a/components/controls/CollapsibleSection.qml b/components/controls/CollapsibleSection.qml index 2df169a..7cb14a0 100644 --- a/components/controls/CollapsibleSection.qml +++ b/components/controls/CollapsibleSection.qml @@ -70,8 +70,15 @@ ColumnLayout { Item { Layout.fillWidth: true - Layout.preferredHeight: (root.expanded && root.description !== "") ? descriptionText.implicitHeight + Appearance.spacing.smaller + Appearance.spacing.small : 0 - clip: true + Layout.preferredHeight: (root.expanded && root.description !== "") ? Math.min(descriptionText.implicitHeight + Appearance.spacing.smaller + Appearance.spacing.small, maxDescriptionHeight) : 0 + + readonly property real maxDescriptionHeight: 60 + + layer.enabled: true + layer.smooth: true + layer.effect: OpacityMask { + maskSource: descriptionMask + } Behavior on Layout.preferredHeight { Anim { @@ -79,6 +86,34 @@ ColumnLayout { } } + Item { + id: descriptionMask + anchors.fill: parent + layer.enabled: true + visible: false + + Rectangle { + anchors.fill: parent + + gradient: Gradient { + orientation: Gradient.Vertical + + GradientStop { + position: 0.0 + color: Qt.rgba(0, 0, 0, 1) + } + GradientStop { + position: 0.7 + color: Qt.rgba(0, 0, 0, 1) + } + GradientStop { + position: 1.0 + color: Qt.rgba(0, 0, 0, 0) + } + } + } + } + StyledText { id: descriptionText anchors.left: parent.left @@ -90,6 +125,7 @@ ColumnLayout { text: root.description color: Colours.palette.m3onSurfaceVariant font.pointSize: Appearance.font.size.small + wrapMode: Text.Wrap opacity: (root.expanded && root.description !== "") ? 1.0 : 0.0 Behavior on opacity { |