diff --git a/AppWarning.qml b/AppWarning.qml new file mode 100644 index 0000000..c0761a2 --- /dev/null +++ b/AppWarning.qml @@ -0,0 +1,103 @@ +import QtQuick +import QtQuick.Controls +import QtQuick.Layouts + +Rectangle { + id: warningAlert + + // Customizable properties + property string alertTitle: "Warning" + property string alertMessage: "This is a warning message about a dangerous operation." + property bool showIcon: true + property bool closable: true + property bool showTitle: true + + // Size properties + implicitHeight: contentLayout.implicitHeight + 24 // Padding + radius: Theme.radius + + // Warning style colors - already had these + color: "#fffbe6" // Light yellow background + border.color: "#ffe58f" // Yellow border + border.width: 1 + + RowLayout { + id: contentLayout + anchors { + left: parent.left + right: parent.right + top: parent.top + margins: 12 + } + spacing: 12 + + // Warning icon + Rectangle { + id: iconContainer + visible: showIcon + width: 16 + height: 16 + color: "transparent" + + Text { + anchors.centerIn: parent + text: "⚠️" + font.pixelSize: 16 + color: "#faad14" + } + } + + // Content area + ColumnLayout { + Layout.fillWidth: true + spacing: 4 + + // Title + Text { + id: titleText + visible: showTitle + text: alertTitle + font.bold: true + font.pixelSize: 14 + color: "#613400" + } + + // Message + Text { + id: messageText + text: alertMessage + wrapMode: Text.WordWrap + Layout.fillWidth: true + color: "#613400" + font.pixelSize: 12 + } + } + + // Close button + Rectangle { + id: closeButton + visible: closable + width: 16 + height: 16 + color: "transparent" + + Text { + anchors.centerIn: parent + text: "×" + font.pixelSize: 16 + color: "#613400" + } + + MouseArea { + anchors.fill: parent + cursorShape: Qt.PointingHandCursor + onClicked: warningAlert.visible = false + + // Hover effect + hoverEnabled: true + onEntered: closeButton.color = "#ffeeb5" + onExited: closeButton.color = "transparent" + } + } + } +} diff --git a/CMakeLists.txt b/CMakeLists.txt index c4ca762..740a3b1 100644 --- a/CMakeLists.txt +++ b/CMakeLists.txt @@ -27,6 +27,7 @@ set(plain_qml_files AppTextField.qml AppImage.qml AppLink.qml + AppWarning.qml ) set(qml_singletons Fonts.qml diff --git a/gallery/Main.qml b/gallery/Main.qml index ffa5615..d6d8978 100644 --- a/gallery/Main.qml +++ b/gallery/Main.qml @@ -120,5 +120,9 @@ AppWindow { width: 100 radius: 20 } + + AppWarning { + Layout.fillWidth: true + } } }