diff --git a/AppIconButton.qml b/AppIconButton.qml new file mode 100644 index 0000000..be48d5b --- /dev/null +++ b/AppIconButton.qml @@ -0,0 +1,32 @@ +import QtQuick +import QtQuick.Controls.Basic +import QtQuick.Controls.impl // Needed for features like the Control.blend() function +import DesignSystem + +Button { + id: control + font.family: Fonts.dotrice + font.bold: true + + implicitWidth: Math.min(implicitBackgroundWidth + leftInset + rightInset, implicitContentWidth + leftPadding + rightPadding) + implicitHeight: Math.min(implicitBackgroundHeight + topInset + bottomInset, implicitContentHeight + topPadding + bottomPadding) + + required property string source + property bool useOriginalColor: false + + icon.source: control.source + icon.width: 20 + icon.height: 20 + icon.color: useOriginalColor ? "transparent" : Theme.foreground + + background: Rectangle { + // NOTE: copied from ~/Qt/6.8.3/macos/qml/QtQuick/Controls/Basic/Button.qml + implicitWidth: 100 + implicitHeight: 40 + visible: !control.flat || control.down || control.checked || control.highlighted + color: control.down ? Theme.card : "transparent" + border.width: 0 + // custom + radius: Theme.radius + } +} diff --git a/CMakeLists.txt b/CMakeLists.txt index 8cf7a22..2383b11 100644 --- a/CMakeLists.txt +++ b/CMakeLists.txt @@ -15,6 +15,7 @@ set(plain_qml_files AppPrimaryButton.qml AppSecondaryButton.qml AppGhostButton.qml + AppIconButton.qml AppCard.qml AppCaption.qml AppHeadline.qml diff --git a/gallery/Main.qml b/gallery/Main.qml index e8c1f6e..b0d9084 100644 --- a/gallery/Main.qml +++ b/gallery/Main.qml @@ -36,6 +36,13 @@ AppWindow { AppGhostButton { text: "Ghost" } + AppIconButton { + source: "qrc:/live.flowy/imports/DesignSystem/app-icons/safari.svg" + useOriginalColor: true + } + AppIconButton { + source: "qrc:/live.flowy/imports/DesignSystem/icons/terminal-duotone.svg" + } } AppCard {