diff --git a/shell/lock/LockSurface.qml b/shell/lock/LockSurface.qml index df5204c..bde96a9 100644 --- a/shell/lock/LockSurface.qml +++ b/shell/lock/LockSurface.qml @@ -297,19 +297,46 @@ WlSessionLockSurface { } } } + } + } - // Spacer before widgets - Item { - width: 1 - height: 8 - visible: _mprisCard.visible || _volumeCard.visible - } + // Right column - widgets, slides in from right + Item { + id: _widgetCol + anchors.right: parent.right + anchors.rightMargin: 48 + anchors.verticalCenter: parent.verticalCenter + width: 280 + height: _widgetContent.implicitHeight + visible: _mprisCard.visible || _volumeCard.visible + + opacity: 0 + property real _slideX: 80 + + NumberAnimation on opacity { + to: 1 + duration: 400 + easing.type: Easing.OutCubic + } + NumberAnimation on _slideX { + to: 0 + duration: 500 + easing.type: Easing.OutCubic + } + + transform: Translate { + x: _widgetCol._slideX + } + + Column { + id: _widgetContent + width: parent.width + spacing: 12 // Media widget Rectangle { id: _mprisCard - anchors.horizontalCenter: parent.horizontalCenter - width: 280 + width: parent.width height: _mprisContent.implicitHeight + 16 radius: S.Theme.radius + 2 color: Qt.rgba(S.Theme.base01.r, S.Theme.base01.g, S.Theme.base01.b, 0.7) @@ -343,8 +370,7 @@ WlSessionLockSurface { // Volume widget Rectangle { id: _volumeCard - anchors.horizontalCenter: parent.horizontalCenter - width: 280 + width: parent.width height: _volumeContent.implicitHeight + 16 radius: S.Theme.radius + 2 color: Qt.rgba(S.Theme.base01.r, S.Theme.base01.g, S.Theme.base01.b, 0.7) @@ -430,6 +456,20 @@ WlSessionLockSurface { duration: 200 easing.type: Easing.InCubic } + NumberAnimation { + target: _widgetCol + property: "opacity" + to: 0 + duration: 200 + easing.type: Easing.InCubic + } + NumberAnimation { + target: _widgetCol + property: "_slideX" + to: 80 + duration: 200 + easing.type: Easing.InCubic + } NumberAnimation { target: root property: "_bgOpacity"