andrew
befed8ff96
Introduce a new production desktop shell at `shells/desktop/shell` built with C++20, Qt Quick/QML, and LayerShellQt, including top bar, launcher, desktop surfaces, shell state, and mock app data. Add the shared `packages/nebula-ui` QML module (theme, controls, focus, icons) and wire it into the shell build. Retire the old GTK/WebKit native host by removing `shells/desktop/native`, move the React shell UI to `shells/desktop/prototype-react` as an archived design reference, and update root/compositor/session documentation to reflect the new Linux-only production architecture and temporary Sway role.
135 lines
3.7 KiB
QML
135 lines
3.7 KiB
QML
import QtQuick
|
|
import Nebula.UI
|
|
|
|
Item {
|
|
id: root
|
|
|
|
property string variant: "tile"
|
|
property var item
|
|
signal selected(var item)
|
|
|
|
readonly property bool rowVariant: variant === "row"
|
|
readonly property int iconSize: rowVariant ? 32 : (variant === "recent" ? 32 : 40)
|
|
readonly property int glyphSize: rowVariant ? 16 : 18
|
|
|
|
implicitWidth: rowVariant ? parent ? parent.width : 200 : 90
|
|
implicitHeight: rowVariant ? 48 : 78
|
|
Accessible.role: Accessible.Button
|
|
Accessible.name: item ? item.name : ""
|
|
Accessible.onPressAction: root.selected(item)
|
|
|
|
Rectangle {
|
|
anchors.fill: parent
|
|
radius: Theme.radiusMedium
|
|
color: hover.containsMouse ? Theme.tileHover : "transparent"
|
|
|
|
Behavior on color {
|
|
ColorAnimation {
|
|
duration: Theme.animationFast
|
|
}
|
|
}
|
|
}
|
|
|
|
Column {
|
|
visible: !root.rowVariant
|
|
anchors.fill: parent
|
|
anchors.topMargin: 10
|
|
anchors.bottomMargin: 8
|
|
anchors.leftMargin: 6
|
|
anchors.rightMargin: 6
|
|
spacing: 8
|
|
|
|
Rectangle {
|
|
width: root.iconSize
|
|
height: root.iconSize
|
|
radius: root.variant === "recent" ? 9 : 11
|
|
anchors.horizontalCenter: parent.horizontalCenter
|
|
color: Theme.iconWell
|
|
|
|
Rectangle {
|
|
anchors.fill: parent
|
|
radius: parent.radius
|
|
color: "transparent"
|
|
border.color: Theme.iconWellHighlight
|
|
border.width: 1
|
|
}
|
|
|
|
NebulaIcon {
|
|
anchors.centerIn: parent
|
|
name: item && item.glyph ? item.glyph : "folder"
|
|
size: root.glyphSize
|
|
color: item && item.tint ? item.tint : Theme.accent
|
|
}
|
|
}
|
|
|
|
Text {
|
|
width: parent.width
|
|
text: item ? item.name : ""
|
|
color: Theme.textPrimary
|
|
font.family: Theme.fontFamily
|
|
font.pixelSize: Theme.fontSizeApp
|
|
elide: Text.ElideRight
|
|
horizontalAlignment: Text.AlignHCenter
|
|
}
|
|
}
|
|
|
|
Row {
|
|
visible: root.rowVariant
|
|
anchors.fill: parent
|
|
anchors.margins: 8
|
|
spacing: 10
|
|
|
|
Rectangle {
|
|
width: root.iconSize
|
|
height: root.iconSize
|
|
radius: 9
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
color: Theme.iconWell
|
|
|
|
NebulaIcon {
|
|
anchors.centerIn: parent
|
|
name: item && (item.glyph || item.kind) ? (item.glyph || item.kind) : "folder"
|
|
size: root.glyphSize
|
|
color: item && item.tint ? item.tint : Theme.accent
|
|
}
|
|
}
|
|
|
|
Column {
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
width: parent.width - root.iconSize - 10
|
|
spacing: 1
|
|
|
|
Text {
|
|
width: parent.width
|
|
text: item ? item.name : ""
|
|
color: Theme.textPrimary
|
|
font.family: Theme.fontFamily
|
|
font.pixelSize: Theme.fontSizeApp
|
|
elide: Text.ElideRight
|
|
}
|
|
|
|
Text {
|
|
width: parent.width
|
|
visible: item && item.subtitle ? true : false
|
|
text: item && item.subtitle ? item.subtitle : ""
|
|
color: Theme.textTertiary
|
|
font.family: Theme.fontFamily
|
|
font.pixelSize: Theme.fontSizeSmall
|
|
elide: Text.ElideRight
|
|
}
|
|
}
|
|
}
|
|
|
|
MouseArea {
|
|
id: hover
|
|
anchors.fill: parent
|
|
hoverEnabled: true
|
|
cursorShape: Qt.PointingHandCursor
|
|
onClicked: root.selected(item)
|
|
}
|
|
|
|
FocusFrame {
|
|
radius: Theme.radiusMedium
|
|
}
|
|
}
|