sidebar: make ai and booru suggestion description clearer

This commit is contained in:
end-4
2025-06-30 21:32:06 +02:00
parent 5ffcf98487
commit bf936cd0d7
6 changed files with 68 additions and 66 deletions
@@ -131,7 +131,7 @@ Singleton {
property color colSecondaryHover: ColorUtils.mix(m3colors.m3secondary, colLayer1Hover, 0.85)
property color colSecondaryActive: ColorUtils.mix(m3colors.m3secondary, colLayer1Active, 0.4)
property color colSecondaryContainer: m3colors.m3secondaryContainer
property color colSecondaryContainerHover: ColorUtils.mix(m3colors.m3secondaryContainer, colLayer1Hover, 0.6)
property color colSecondaryContainerHover: ColorUtils.mix(m3colors.m3secondaryContainer, m3colors.m3onSecondaryContainer, 0.90)
property color colSecondaryContainerActive: ColorUtils.mix(m3colors.m3secondaryContainer, colLayer1Active, 0.54)
property color colOnSecondaryContainer: m3colors.m3onSecondaryContainer
property color colSurfaceContainerLow: ColorUtils.transparentize(m3colors.m3surfaceContainerLow, root.contentTransparency)
@@ -171,7 +171,7 @@ Singleton {
}
property QtObject pixelSize: QtObject {
property int smallest: 10
property int smaller: 13
property int smaller: 12
property int small: 15
property int normal: 16
property int large: 17
@@ -9,8 +9,8 @@ Rectangle {
id: root
property string key
property real horizontalPadding: 7
property real verticalPadding: 2
property real horizontalPadding: 6
property real verticalPadding: 1
property real borderWidth: 1
property real extraBottomBorderWidth: 2
property color borderColor: Appearance.colors.colOnLayer0
@@ -250,33 +250,8 @@ Inline w/ backslash and round brackets \\(e^{i\\pi} + 1 = 0\\)
}
}
Item { // Suggestion description
visible: descriptionText.text.length > 0
Layout.fillWidth: true
implicitHeight: descriptionBackground.implicitHeight
Rectangle {
id: descriptionBackground
color: Appearance.colors.colTooltip
anchors.left: parent.left
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
implicitHeight: descriptionText.implicitHeight + 5 * 2
radius: Appearance.rounding.verysmall
StyledText {
id: descriptionText
anchors.left: parent.left
anchors.right: parent.right
anchors.leftMargin: 10
anchors.rightMargin: 10
anchors.verticalCenter: parent.verticalCenter
font.pixelSize: Appearance.font.pixelSize.smaller
color: Appearance.colors.colOnTooltip
wrapMode: Text.Wrap
text: root.suggestionList[suggestions.selectedIndex]?.description ?? ""
}
}
DescriptionBox {
text: root.suggestionList[suggestions.selectedIndex]?.description ?? ""
}
FlowButtonGroup { // Suggestions
@@ -294,7 +269,7 @@ Inline w/ backslash and round brackets \\(e^{i\\pi} + 1 = 0\\)
}
delegate: ApiCommandButton {
id: commandButton
colBackground: suggestions.selectedIndex === index ? Appearance.colors.colLayer2Hover : Appearance.colors.colLayer2
colBackground: suggestions.selectedIndex === index ? Appearance.colors.colSecondaryContainerHover : Appearance.colors.colSecondaryContainer
bounce: false
contentItem: StyledText {
font.pixelSize: Appearance.font.pixelSize.small
@@ -6,14 +6,11 @@ import "root:/modules/common/functions/fuzzysort.js" as Fuzzy
import "root:/modules/common/functions/string_utils.js" as StringUtils
import "root:/modules/common/functions/file_utils.js" as FileUtils
import "./anime/"
import Qt.labs.platform
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import Qt5Compat.GraphicalEffects
import Quickshell.Io
import Quickshell
import Quickshell.Hyprland
Item {
id: root
@@ -251,33 +248,8 @@ Item {
}
}
Item { // Tag suggestion description
visible: tagDescriptionText.text.length > 0
Layout.fillWidth: true
implicitHeight: tagDescriptionBackground.implicitHeight
Rectangle {
id: tagDescriptionBackground
color: Appearance.colors.colTooltip
anchors.left: parent.left
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
implicitHeight: tagDescriptionText.implicitHeight + 5 * 2
radius: Appearance.rounding.verysmall
StyledText {
id: tagDescriptionText
anchors.left: parent.left
anchors.right: parent.right
anchors.leftMargin: 10
anchors.rightMargin: 10
anchors.verticalCenter: parent.verticalCenter
font.pixelSize: Appearance.font.pixelSize.smaller
color: Appearance.colors.colOnTooltip
wrapMode: Text.Wrap
text: root.suggestionList[tagSuggestions.selectedIndex]?.description ?? ""
}
}
DescriptionBox { // Tag suggestion description
text: root.suggestionList[tagSuggestions.selectedIndex]?.description ?? ""
}
FlowButtonGroup { // Tag suggestions
@@ -295,7 +267,7 @@ Item {
}
delegate: ApiCommandButton {
id: tagButton
colBackground: tagSuggestions.selectedIndex === index ? Appearance.colors.colLayer2Hover : Appearance.colors.colLayer2
colBackground: tagSuggestions.selectedIndex === index ? Appearance.colors.colSecondaryContainerHover : Appearance.colors.colSecondaryContainer
bounce: false
contentItem: RowLayout {
anchors.centerIn: parent
@@ -303,7 +275,7 @@ Item {
StyledText {
Layout.fillWidth: false
font.pixelSize: Appearance.font.pixelSize.small
color: Appearance.m3colors.m3onSurface
color: Appearance.colors.colOnSecondaryContainer
horizontalAlignment: Text.AlignRight
text: modelData.displayName ?? modelData.name
}
@@ -311,7 +283,7 @@ Item {
Layout.fillWidth: false
visible: modelData.count !== undefined
font.pixelSize: Appearance.font.pixelSize.smaller
color: Appearance.m3colors.m3outline
color: Appearance.colors.colOnSecondaryContainer
horizontalAlignment: Text.AlignLeft
text: modelData.count ?? ""
}
@@ -16,7 +16,7 @@ GroupButton {
baseWidth: contentItem.implicitWidth + horizontalPadding * 2
clickedWidth: baseWidth + 20
baseHeight: contentItem.implicitHeight + verticalPadding * 2
buttonRadius: down ? Appearance.rounding.small : baseHeight / 2
buttonRadius: down ? Appearance.rounding.verysmall : Appearance.rounding.small
colBackground: Appearance.colors.colLayer2
colBackgroundHover: Appearance.colors.colLayer2Hover
@@ -0,0 +1,55 @@
import "root:/services"
import "root:/modules/common"
import "root:/modules/common/widgets"
import QtQuick
import QtQuick.Layouts
Item { // Tag suggestion description
id: root
property alias text: tagDescriptionText.text
visible: tagDescriptionText.text.length > 0
Layout.fillWidth: true
implicitHeight: tagDescriptionBackground.implicitHeight
Rectangle {
id: tagDescriptionBackground
color: Appearance.colors.colLayer2
anchors.fill: parent
radius: Appearance.rounding.verysmall
implicitHeight: descriptionRow.implicitHeight + 5 * 2
RowLayout {
id: descriptionRow
spacing: 4
anchors {
fill: parent
leftMargin: 10
rightMargin: 10
}
StyledText {
id: tagDescriptionText
Layout.fillWidth: true
font.pixelSize: Appearance.font.pixelSize.smaller
color: Appearance.colors.colOnLayer2
wrapMode: Text.Wrap
}
KeyboardKey {
key: "↑"
}
KeyboardKey {
key: "↓"
}
StyledText {
text: qsTr("or")
font.pixelSize: Appearance.font.pixelSize.smaller
}
KeyboardKey {
id: tagDescriptionKey
key: "Tab"
Layout.alignment: Qt.AlignVCenter
}
}
}
}