diff --git a/.config/quickshell/ii/modules/sidebarLeft/AiChat.qml b/.config/quickshell/ii/modules/sidebarLeft/AiChat.qml index 78a0b816c..271096f88 100644 --- a/.config/quickshell/ii/modules/sidebarLeft/AiChat.qml +++ b/.config/quickshell/ii/modules/sidebarLeft/AiChat.qml @@ -361,43 +361,11 @@ Inline w/ backslash and round brackets \\(e^{i\\pi} + 1 = 0\\) } } - Item { // Placeholder when list is empty - opacity: Ai.messageIDs.length === 0 ? 1 : 0 - visible: opacity > 0 - anchors.fill: parent - - Behavior on opacity { - animation: Appearance.animation.elementMoveEnter.numberAnimation.createObject(this) - } - - ColumnLayout { - anchors.centerIn: parent - spacing: 5 - - CookieWrappedMaterialSymbol { - Layout.alignment: Qt.AlignHCenter - iconSize: 60 - text: "neurology" - } - StyledText { - id: widgetNameText - Layout.alignment: Qt.AlignHCenter - font.pixelSize: Appearance.font.pixelSize.larger - font.family: Appearance.font.family.title - color: Appearance.m3colors.m3outline - horizontalAlignment: Text.AlignHCenter - text: Translation.tr("Large language models") - } - StyledText { - id: widgetDescriptionText - Layout.fillWidth: true - font.pixelSize: Appearance.font.pixelSize.small - color: Appearance.m3colors.m3outline - horizontalAlignment: Text.AlignLeft - wrapMode: Text.Wrap - text: Translation.tr("Type /key to get started with online models\nCtrl+O to expand the sidebar\nCtrl+P to detach sidebar into a window") - } - } + PagePlaceholder { + shown: Ai.messageIDs.length === 0 + icon: "neurology" + title: Translation.tr("Large language models") + description: Translation.tr("Type /key to get started with online models\nCtrl+O to expand the sidebar\nCtrl+P to detach sidebar into a window") } } diff --git a/.config/quickshell/ii/modules/sidebarLeft/Anime.qml b/.config/quickshell/ii/modules/sidebarLeft/Anime.qml index 1b6b47acc..dbfd90d8e 100644 --- a/.config/quickshell/ii/modules/sidebarLeft/Anime.qml +++ b/.config/quickshell/ii/modules/sidebarLeft/Anime.qml @@ -185,34 +185,12 @@ Item { } } - Item { // Placeholder when list is empty - opacity: root.responses.length === 0 ? 1 : 0 - visible: opacity > 0 - anchors.fill: parent - - Behavior on opacity { - animation: Appearance.animation.elementMoveEnter.numberAnimation.createObject(this) - } - - ColumnLayout { - anchors.centerIn: parent - spacing: 5 - - CookieWrappedMaterialSymbol { - Layout.alignment: Qt.AlignHCenter - iconSize: 60 - text: "bookmark_heart" - } - StyledText { - id: widgetNameText - Layout.alignment: Qt.AlignHCenter - font.pixelSize: Appearance.font.pixelSize.larger - font.family: Appearance.font.family.title - color: Appearance.m3colors.m3outline - horizontalAlignment: Text.AlignHCenter - text: Translation.tr("Anime boorus") - } - } + PagePlaceholder { + id: placeholderItem + shown: root.responses.length === 0 + icon: "bookmark_heart" + title: Translation.tr("Anime boorus") + description: "" } Item { // Queries awaiting response diff --git a/.config/quickshell/ii/modules/sidebarLeft/PagePlaceholder.qml b/.config/quickshell/ii/modules/sidebarLeft/PagePlaceholder.qml new file mode 100644 index 000000000..9c41e64d0 --- /dev/null +++ b/.config/quickshell/ii/modules/sidebarLeft/PagePlaceholder.qml @@ -0,0 +1,53 @@ +import QtQuick +import QtQuick.Layouts +import qs.modules.common +import qs.modules.common.widgets + +Item { + id: root + + property bool shown: true + property alias icon: cookieWrappedMaterialSymbol.text + property alias title: widgetNameText.text + property alias description: widgetDescriptionText.text + + opacity: shown ? 1 : 0 + visible: opacity > 0 + anchors { + fill: parent + topMargin: -30 * (1 - opacity) + bottomMargin: 30 * (1 - opacity) + } + + Behavior on opacity { + animation: Appearance.animation.elementMoveEnter.numberAnimation.createObject(this) + } + + ColumnLayout { + anchors.centerIn: parent + spacing: 5 + + CookieWrappedMaterialSymbol { + id: cookieWrappedMaterialSymbol + Layout.alignment: Qt.AlignHCenter + iconSize: 60 + rotation: -60 * (1 - root.opacity) + } + StyledText { + id: widgetNameText + Layout.alignment: Qt.AlignHCenter + font.pixelSize: Appearance.font.pixelSize.larger + font.family: Appearance.font.family.title + color: Appearance.m3colors.m3outline + horizontalAlignment: Text.AlignHCenter + } + StyledText { + id: widgetDescriptionText + Layout.fillWidth: true + font.pixelSize: Appearance.font.pixelSize.small + color: Appearance.m3colors.m3outline + horizontalAlignment: Text.AlignLeft + wrapMode: Text.Wrap + } + } +}