forked from Shinonome/dots-hyprland
fancier tabs
This commit is contained in:
@@ -0,0 +1,67 @@
|
||||
import "root:/modules/common"
|
||||
import "root:/modules/common/widgets"
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import Quickshell.Io
|
||||
import Quickshell.Widgets
|
||||
|
||||
TabButton {
|
||||
id: button
|
||||
property string buttonText
|
||||
property string buttonIcon
|
||||
property bool selected: false
|
||||
property int tabContentWidth: contentItem.children[0].implicitWidth
|
||||
height: buttonBackground.height
|
||||
|
||||
PointingHandInteraction {}
|
||||
|
||||
background: Rectangle {
|
||||
id: buttonBackground
|
||||
radius: Appearance.rounding.small
|
||||
implicitHeight: 50
|
||||
color: (button.down ? Appearance.colors.colLayer1Active : button.hovered ? Appearance.colors.colLayer1Hover : Appearance.transparentize(Appearance.colors.colLayer1Hover, 1))
|
||||
|
||||
Behavior on color {
|
||||
ColorAnimation {
|
||||
duration: Appearance.animation.elementDecel.duration
|
||||
easing.type: Appearance.animation.elementDecel.type
|
||||
}
|
||||
}
|
||||
}
|
||||
contentItem: Item {
|
||||
anchors.centerIn: buttonBackground
|
||||
ColumnLayout {
|
||||
anchors.centerIn: parent
|
||||
spacing: 0
|
||||
MaterialSymbol {
|
||||
visible: buttonIcon?.length > 0
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
text: buttonIcon
|
||||
font.pixelSize: 24
|
||||
color: selected ? Appearance.m3colors.m3primary : Appearance.colors.colOnLayer1
|
||||
Behavior on color {
|
||||
ColorAnimation {
|
||||
duration: Appearance.animation.elementDecel.duration
|
||||
easing.type: Appearance.animation.elementDecel.type
|
||||
}
|
||||
}
|
||||
}
|
||||
StyledText {
|
||||
id: buttonTextWidget
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
font.pixelSize: Appearance.font.pixelSize.small
|
||||
color: selected ? Appearance.m3colors.m3primary : Appearance.colors.colOnLayer1
|
||||
text: buttonText
|
||||
Behavior on color {
|
||||
ColorAnimation {
|
||||
duration: Appearance.animation.elementDecel.duration
|
||||
easing.type: Appearance.animation.elementDecel.type
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
+7
-6
@@ -12,6 +12,7 @@ TabButton {
|
||||
property string buttonIcon
|
||||
property bool selected: false
|
||||
height: buttonBackground.height
|
||||
property int tabContentWidth: buttonBackground.width - buttonBackground.radius*2
|
||||
|
||||
PointingHandInteraction {}
|
||||
|
||||
@@ -27,9 +28,6 @@ TabButton {
|
||||
easing.type: Appearance.animation.elementDecel.type
|
||||
}
|
||||
}
|
||||
|
||||
// border.color: button.activeFocus ? Appearance.m3colors.m3secondary : Appearance.transparentize(Appearance.m3colors.m3secondary, 1)
|
||||
// border.width: button.activeFocus ? 2 : 0
|
||||
}
|
||||
contentItem: Item {
|
||||
anchors.centerIn: buttonBackground
|
||||
@@ -37,9 +35,11 @@ TabButton {
|
||||
anchors.centerIn: parent
|
||||
spacing: 0
|
||||
MaterialSymbol {
|
||||
visible: buttonIcon?.length > 0
|
||||
Layout.rightMargin: 5
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
text: buttonIcon
|
||||
font.pixelSize: Appearance.font.pixelSize.larger
|
||||
font.pixelSize: Appearance.font.pixelSize.huge
|
||||
color: selected ? Appearance.m3colors.m3primary : Appearance.colors.colOnLayer1
|
||||
Behavior on color {
|
||||
ColorAnimation {
|
||||
@@ -50,9 +50,10 @@ TabButton {
|
||||
}
|
||||
StyledText {
|
||||
id: buttonTextWidget
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
text: buttonText
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
font.pixelSize: Appearance.font.pixelSize.small
|
||||
color: selected ? Appearance.m3colors.m3primary : Appearance.colors.colOnLayer1
|
||||
text: buttonText
|
||||
Behavior on color {
|
||||
ColorAnimation {
|
||||
duration: Appearance.animation.elementDecel.duration
|
||||
Reference in New Issue
Block a user