diff options
| -rw-r--r-- | Button/Btn.ui.qml | 25 | ||||
| -rw-r--r-- | Button/Primary.ui.qml | 30 | ||||
| -rw-r--r-- | Eduport.qrc | 1 | ||||
| -rw-r--r-- | imports/Bootstrap/Bootstrap.qml | 39 |
4 files changed, 61 insertions, 34 deletions
diff --git a/Button/Btn.ui.qml b/Button/Btn.ui.qml new file mode 100644 index 0000000..cdf730b --- /dev/null +++ b/Button/Btn.ui.qml @@ -0,0 +1,25 @@ +import QtQuick 2.15 +import QtQuick.Controls 2.15 +import Bootstrap 5.3 + +Button { + id: button + horizontalPadding: Bootstrap.btnPaddingX + verticalPadding: Bootstrap.btnPaddingY + font: Bootstrap.btnFont + contentItem: Text { + text: button.text + font: button.font + color: Bootstrap.btnColor + horizontalAlignment: Text.AlignHCenter + verticalAlignment: Text.AlignVCenter + } + background: Rectangle { + color: Bootstrap.btnBg + border { + width: Bootstrap.btnBorderWidth + color: Bootstrap.btnBorderColor + } + radius: Bootstrap.btnBorderRadius + } +} diff --git a/Button/Primary.ui.qml b/Button/Primary.ui.qml index 831430a..dec0148 100644 --- a/Button/Primary.ui.qml +++ b/Button/Primary.ui.qml @@ -2,27 +2,21 @@ import QtQuick 2.15 import QtQuick.Controls 2.15 import Bootstrap 5.3 -Button { +Btn { id: button - horizontalPadding: 16 - verticalPadding: 8 - font: Bootstrap.btnFont - contentItem: Text { - text: button.text - font: button.font - color: Bootstrap.btnColor - horizontalAlignment: Text.AlignHCenter - verticalAlignment: Text.AlignVCenter - } background: Rectangle { - color: button.down ? Bootstrap.btnActiveBG : button.enabled - ? Bootstrap.btnBg : Bootstrap.btnDisabledBg + color: button.down ? Bootstrap.btnPrimaryActiveBG + : button.enabled + ? Bootstrap.btnPrimaryBg + : Bootstrap.btnPrimaryDisabledBg border { - color: button.down ? Bootstrap.btnActiveBorderColor - : button.enabled ? Bootstrap.btnBorderColor - : Bootstrap.btnDisabledBorderColor - width: 1 + color: button.down + ? Bootstrap.btnPrimaryActiveBorderColor + : button.enabled + ? Bootstrap.btnPrimaryBorderColor + : Bootstrap.btnPrimaryDisabledBorderColor + width: Bootstrap.btnBorderWidth } - radius: 5.2 + radius: Bootstrap.btnBorderRadius } } diff --git a/Eduport.qrc b/Eduport.qrc index f2fbe9b..d165114 100644 --- a/Eduport.qrc +++ b/Eduport.qrc @@ -16,6 +16,7 @@ <file>Label/H1.ui.qml</file> <file>Label/Display6.ui.qml</file> <file>TextField/Input.ui.qml</file> + <file>Button/Btn.ui.qml</file> <file>Button/Primary.ui.qml</file> </qresource> </RCC> diff --git a/imports/Bootstrap/Bootstrap.qml b/imports/Bootstrap/Bootstrap.qml index 57051ba..31c6aa3 100644 --- a/imports/Bootstrap/Bootstrap.qml +++ b/imports/Bootstrap/Bootstrap.qml @@ -4,13 +4,30 @@ import QtQuick 2.15 QtObject { readonly property real badgeFontSize: 13.6 + readonly property real btnPaddingX: 16 + readonly property real btnPaddingY: 8 + readonly property font btnFont: Qt.font({ + family: haveRoboto ? "Roboto" : medium.name, + weight: Font.Medium, + pointSize: 15 + }) readonly property color btnColor: "#ffffff" - readonly property color btnBg: "#066ac9" - readonly property color btnBorderColor: "#066ac9" - readonly property color btnActiveBg: "#0555a1" - readonly property color btnActiveBorderColor: "#055097" - readonly property color btnDisabledBg: "#a6066ac9" - readonly property color btnDisabledBorderColor: "#a6066ac9" + readonly property color btnBg: "transparent" + readonly property real btnBorderWidth: 1 + readonly property color btnBorderColor: "transparent" + readonly property real btnBorderRadius: 5.2 + readonly property color btnPrimaryBg: "#066ac9" + readonly property color btnPrimaryBorderColor: "#066ac9" + readonly property color btnPrimaryActiveBg: "#0555a1" + readonly property color btnPrimaryActiveBorderColor: "#055097" + readonly property color btnPrimaryDisabledBg: "#a6066ac9" + readonly property color btnPrimaryDisabledBorderColor: "#a6066ac9" + + readonly property font bodyFont: Qt.font({ + family: haveRoboto ? "Roboto" : regular.name, + weight: Font.Normal, + pointSize: 15 + }) readonly property bool haveRoboto: Qt.platform.os === "android" || Qt.platform.os === "linux" @@ -23,14 +40,4 @@ QtObject { readonly property FontLoader regular: FontLoader { source: haveRoboto ? "" : "../../Roboto/Roboto-Regular.ttf" } - readonly property font bodyFont: Qt.font({ - family: haveRoboto ? "Roboto" : regular.name, - weight: Font.Normal, - pointSize: 15 - }) - readonly property font btnFont: Qt.font({ - family: haveRoboto ? "Roboto" : medium.name, - weight: Font.Medium, - pointSize: 15 - }) } |