mirror of
https://github.com/nomic-ai/gpt4all.git
synced 2025-07-31 07:16:59 +00:00
improve UI layout
Signed-off-by: Jared Van Bortel <jared@nomic.ai>
This commit is contained in:
Jared Van Bortel
parent
5b41b1c0dc
commit
d41a08c627
@ -39,25 +39,26 @@ ColumnLayout {
|
||||
ScrollBar.vertical.policy: ScrollBar.AsNeeded
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
contentWidth: availableWidth
|
||||
clip: true
|
||||
GridLayout {
|
||||
rows: 2
|
||||
columns: 3
|
||||
rowSpacing: 20
|
||||
columnSpacing: 20
|
||||
Flow {
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
spacing: 20
|
||||
bottomPadding: 20
|
||||
property int childWidth: 330 * theme.fontScale
|
||||
property int childHeight: 400 + 166 * theme.fontScale
|
||||
RemoteModelCard {
|
||||
Layout.preferredWidth: 600
|
||||
Layout.minimumHeight: 700
|
||||
Layout.alignment: Qt.AlignTop | Qt.AlignLeft
|
||||
width: parent.childWidth
|
||||
height: parent.childHeight
|
||||
providerBaseUrl: "https://api.groq.com/openai/v1/"
|
||||
providerName: qsTr("Groq")
|
||||
providerImage: "qrc:/gpt4all/icons/groq.svg"
|
||||
providerDesc: qsTr('Groq offers a high-performance AI inference engine designed for low-latency and efficient processing. Optimized for real-time applications, Groq’s technology is ideal for users who need fast responses from open large language models and other AI workloads.<br><br>Get your API key: <a href="https://console.groq.com/keys">https://groq.com/</a>')
|
||||
}
|
||||
RemoteModelCard {
|
||||
Layout.preferredWidth: 600
|
||||
Layout.minimumHeight: 700
|
||||
Layout.alignment: Qt.AlignTop | Qt.AlignLeft
|
||||
width: parent.childWidth
|
||||
height: parent.childHeight
|
||||
providerBaseUrl: "https://api.openai.com/v1/"
|
||||
providerName: qsTr("OpenAI")
|
||||
providerImage: "qrc:/gpt4all/icons/openai.svg"
|
||||
@ -73,18 +74,16 @@ ColumnLayout {
|
||||
}
|
||||
}
|
||||
RemoteModelCard {
|
||||
Layout.preferredWidth: 600
|
||||
Layout.minimumHeight: 700
|
||||
Layout.alignment: Qt.AlignTop | Qt.AlignLeft
|
||||
width: parent.childWidth
|
||||
height: parent.childHeight
|
||||
providerBaseUrl: "https://api.mistral.ai/v1/"
|
||||
providerName: qsTr("Mistral")
|
||||
providerImage: "qrc:/gpt4all/icons/mistral.svg"
|
||||
providerDesc: qsTr('Mistral AI specializes in efficient, open-weight language models optimized for various natural language processing tasks. Their models are designed for flexibility and performance, making them a solid option for applications requiring scalable AI solutions.<br><br>Get your API key: <a href="https://mistral.ai/">https://mistral.ai/</a>')
|
||||
}
|
||||
RemoteModelCard {
|
||||
Layout.preferredWidth: 600
|
||||
Layout.minimumHeight: 700
|
||||
Layout.alignment: Qt.AlignTop | Qt.AlignLeft
|
||||
width: parent.childWidth
|
||||
height: parent.childHeight
|
||||
providerIsCustom: true
|
||||
providerName: qsTr("Custom")
|
||||
providerImage: "qrc:/gpt4all/icons/antenna_3.svg"
|
||||
|
||||
@ -20,7 +20,7 @@ import localdocs
|
||||
Rectangle {
|
||||
property alias providerName: providerNameLabel.text
|
||||
property alias providerImage: myimage.source
|
||||
property alias providerDesc: providerDescLabel.helpText
|
||||
property alias providerDesc: providerDescLabel.text
|
||||
property string providerBaseUrl: ""
|
||||
property bool providerIsCustom: false
|
||||
property var filterModels: function(names) {
|
||||
@ -31,7 +31,7 @@ Rectangle {
|
||||
radius: 10
|
||||
border.width: 1
|
||||
border.color: theme.controlBorder
|
||||
implicitHeight: topColumn.height + bottomColumn.height + 60
|
||||
implicitHeight: topColumn.height + bottomColumn.height + 33 * theme.fontScale
|
||||
|
||||
ColumnLayout {
|
||||
id: topColumn
|
||||
@ -39,30 +39,22 @@ Rectangle {
|
||||
anchors.right: parent.right
|
||||
anchors.top: parent.top
|
||||
anchors.margins: 20
|
||||
spacing: 30
|
||||
spacing: 15 * theme.fontScale
|
||||
RowLayout {
|
||||
Layout.alignment: Qt.AlignTop
|
||||
spacing: 10
|
||||
Rectangle {
|
||||
id: rec
|
||||
color: "transparent"
|
||||
Layout.preferredWidth: 48
|
||||
Layout.preferredHeight: 48
|
||||
Item {
|
||||
Layout.preferredWidth: 27 * theme.fontScale
|
||||
Layout.preferredHeight: 27 * theme.fontScale
|
||||
Layout.alignment: Qt.AlignLeft
|
||||
|
||||
Image {
|
||||
id: myimage
|
||||
anchors.centerIn: parent
|
||||
sourceSize.width: rec.width
|
||||
sourceSize.height: rec.height
|
||||
sourceSize.width: parent.width
|
||||
sourceSize.height: parent.height
|
||||
mipmap: true
|
||||
visible: false
|
||||
fillMode: Image.PreserveAspectFit
|
||||
|
||||
}
|
||||
|
||||
ColorOverlay {
|
||||
anchors.fill: myimage
|
||||
source: myimage
|
||||
}
|
||||
}
|
||||
|
||||
@ -73,9 +65,19 @@ Rectangle {
|
||||
}
|
||||
}
|
||||
|
||||
MySettingsLabel {
|
||||
Label {
|
||||
id: providerDescLabel
|
||||
onLinkActivated: function(link) { Qt.openUrlExternally(link) }
|
||||
Layout.fillWidth: true
|
||||
wrapMode: Text.Wrap
|
||||
color: theme.settingsTitleTextColor
|
||||
font.pixelSize: theme.fontSizeLarge
|
||||
onLinkActivated: function(link) { Qt.openUrlExternally(link); }
|
||||
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
acceptedButtons: Qt.NoButton // pass clicks to parent
|
||||
cursorShape: parent.hoveredLink ? Qt.PointingHandCursor : Qt.ArrowCursor
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -98,6 +100,7 @@ Rectangle {
|
||||
MyTextField {
|
||||
id: apiKeyField
|
||||
Layout.fillWidth: true
|
||||
font.pixelSize: theme.fontSizeLarge
|
||||
wrapMode: Text.WrapAnywhere
|
||||
function showError() {
|
||||
messageToast.show(qsTr("ERROR: $API_KEY is empty."));
|
||||
@ -128,6 +131,7 @@ Rectangle {
|
||||
MyTextField {
|
||||
id: baseUrlField
|
||||
Layout.fillWidth: true
|
||||
font.pixelSize: theme.fontSizeLarge
|
||||
wrapMode: Text.WrapAnywhere
|
||||
function showError() {
|
||||
messageToast.show(qsTr("ERROR: $BASE_URL is empty."));
|
||||
@ -152,6 +156,7 @@ Rectangle {
|
||||
MyTextField {
|
||||
id: modelNameField
|
||||
Layout.fillWidth: true
|
||||
font.pixelSize: theme.fontSizeLarge
|
||||
wrapMode: Text.WrapAnywhere
|
||||
function showError() {
|
||||
messageToast.show(qsTr("ERROR: $MODEL_NAME is empty."))
|
||||
|
||||
Loading…
Reference in New Issue
Block a user