Archives/gpt4all
2
0
Fork 0
mirror of https://github.com/nomic-ai/gpt4all synced 2024-11-02 09:40:42 +00:00
Code Issues Packages Projects Releases Wiki Activity

Consolidate all colors to a central theme object.

Browse Source
This commit is contained in:
Adam Treat 2023-04-23 09:42:35 -04:00
parent 652e00ea15
commit e06cff8b48
9 changed files with 163 additions and 116 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
CMakeLists.txt
View File

@ -65,7 +65,7 @@ qt_add_executable(chat
) )
qt_add_qml_module(chat qt_add_qml_module(chat
URI gpt4all-chat URI gpt4all
VERSION 1.0 VERSION 1.0
QML_FILES QML_FILES
main.qml main.qml
@ -74,6 +74,7 @@ qt_add_qml_module(chat
qml/ThumbsDownDialog.qml qml/ThumbsDownDialog.qml
qml/SettingsDialog.qml qml/SettingsDialog.qml
qml/PopupDialog.qml qml/PopupDialog.qml
qml/Theme.qml
RESOURCES RESOURCES
icons/send_message.svg icons/send_message.svg
icons/stop_generating.svg icons/stop_generating.svg

2
main.cpp
View File

@ -21,7 +21,7 @@ int main(int argc, char *argv[])
qmlRegisterSingletonInstance("llm", 1, 0, "LLM", LLM::globalInstance()); qmlRegisterSingletonInstance("llm", 1, 0, "LLM", LLM::globalInstance());
qmlRegisterSingletonInstance("download", 1, 0, "Download", Download::globalInstance()); qmlRegisterSingletonInstance("download", 1, 0, "Download", Download::globalInstance());
qmlRegisterSingletonInstance("network", 1, 0, "Network", Network::globalInstance()); qmlRegisterSingletonInstance("network", 1, 0, "Network", Network::globalInstance());
const QUrl url(u"qrc:/gpt4all-chat/main.qml"_qs); const QUrl url(u"qrc:/gpt4all/main.qml"_qs);
QObject::connect(&engine, &QQmlApplicationEngine::objectCreated, QObject::connect(&engine, &QQmlApplicationEngine::objectCreated,
&app, [url](QObject *obj, const QUrl &objUrl) { &app, [url](QObject *obj, const QUrl &objUrl) {

95
main.qml
View File

@ -12,7 +12,12 @@ Window {
height: 720 height: 720
visible: true visible: true
title: qsTr("GPT4All v") + Qt.application.version title: qsTr("GPT4All v") + Qt.application.version
color: "#d1d5db"
Theme {
id: theme
}
color: theme.textColor
Item { Item {
Accessible.role: Accessible.Window Accessible.role: Accessible.Window
@ -25,7 +30,7 @@ Window {
anchors.right: parent.right anchors.right: parent.right
anchors.top: parent.top anchors.top: parent.top
height: 100 height: 100
color: "#202123" color: theme.backgroundDarkest
Item { Item {
anchors.centerIn: parent anchors.centerIn: parent
@ -34,12 +39,12 @@ Window {
Label { Label {
id: modelLabel id: modelLabel
color: "#d1d5db" color: theme.textColor
padding: 20 padding: 20
font.pixelSize: 24 font.pixelSize: 24
text: "" text: ""
background: Rectangle { background: Rectangle {
color: "#202123" color: theme.backgroundDarkest
} }
horizontalAlignment: TextInput.AlignRight horizontalAlignment: TextInput.AlignRight
} }
@ -62,7 +67,7 @@ Window {
rightPadding: 10 rightPadding: 10
text: comboBox.displayText text: comboBox.displayText
font: comboBox.font font: comboBox.font
color: "#d1d5db" color: theme.textColor
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
elide: Text.ElideRight elide: Text.ElideRight
@ -71,13 +76,13 @@ Window {
width: comboBox.width width: comboBox.width
contentItem: Text { contentItem: Text {
text: modelData text: modelData
color: "#d1d5db" color: theme.textColor
font: control.font font: control.font
elide: Text.ElideRight elide: Text.ElideRight
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
} }
background: Rectangle { background: Rectangle {
color: highlighted ? "#343541" : "#242528" color: highlighted ? theme.backgroundLight : theme.backgroundDark
} }
highlighted: comboBox.highlightedIndex === index highlighted: comboBox.highlightedIndex === index
} }
@ -96,12 +101,12 @@ Window {
} }
background: Rectangle { background: Rectangle {
color: "#242528" color: theme.backgroundDark
} }
} }
background: Rectangle { background: Rectangle {
color: "#242528" color: theme.backgroundDark
} }
onActivated: { onActivated: {
@ -147,7 +152,7 @@ Window {
Rectangle { Rectangle {
id: bar1 id: bar1
color: "#7d7d8e" color: theme.backgroundLightest
width: parent.width width: parent.width
height: 8 height: 8
radius: 2 radius: 2
@ -157,7 +162,7 @@ Window {
Rectangle { Rectangle {
id: bar2 id: bar2
anchors.centerIn: parent anchors.centerIn: parent
color: "#7d7d8e" color: theme.backgroundLightest
width: parent.width width: parent.width
height: 8 height: 8
radius: 2 radius: 2
@ -167,7 +172,7 @@ Window {
Rectangle { Rectangle {
id: bar3 id: bar3
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
color: "#7d7d8e" color: theme.backgroundLightest
width: parent.width width: parent.width
height: 8 height: 8
radius: 2 radius: 2
@ -212,7 +217,7 @@ Window {
anchors.fill: parent anchors.fill: parent
color: "transparent" color: "transparent"
visible: Network.isActive visible: Network.isActive
border.color: "#7d7d8e" border.color: theme.backgroundLightest
border.width: 1 border.width: 1
radius: 10 radius: 10
} }
@ -220,7 +225,7 @@ Window {
anchors.centerIn: parent anchors.centerIn: parent
width: 50 width: 50
height: 50 height: 50
source: "qrc:/gpt4all-chat/icons/network.svg" source: "qrc:/gpt4all/icons/network.svg"
} }
} }
@ -256,7 +261,7 @@ Window {
anchors.centerIn: parent anchors.centerIn: parent
width: 40 width: 40
height: 40 height: 40
source: "qrc:/gpt4all-chat/icons/settings.svg" source: "qrc:/gpt4all/icons/settings.svg"
} }
} }
@ -302,7 +307,7 @@ Window {
anchors.centerIn: parent anchors.centerIn: parent
width: 40 width: 40
height: 40 height: 40
source: "qrc:/gpt4all-chat/icons/copy.svg" source: "qrc:/gpt4all/icons/copy.svg"
} }
} }
@ -384,7 +389,7 @@ Window {
anchors.centerIn: parent anchors.centerIn: parent
width: 40 width: 40
height: 40 height: 40
source: "qrc:/gpt4all-chat/icons/regenerate.svg" source: "qrc:/gpt4all/icons/regenerate.svg"
} }
} }
@ -410,16 +415,16 @@ Window {
above where this application resides on your filesystem.<br><br> above where this application resides on your filesystem.<br><br>
If you can't start it manually, then I'm afraid you'll have to<br> If you can't start it manually, then I'm afraid you'll have to<br>
reinstall.") reinstall.")
color: "#d1d5db" color: theme.textColor
Accessible.role: Accessible.Dialog Accessible.role: Accessible.Dialog
Accessible.name: text Accessible.name: text
Accessible.description: qsTr("Dialog indicating an error") Accessible.description: qsTr("Dialog indicating an error")
} }
background: Rectangle { background: Rectangle {
anchors.fill: parent anchors.fill: parent
color: "#202123" color: theme.backgroundDarkest
border.width: 1 border.width: 1
border.color: "white" border.color: theme.dialogBorder
radius: 10 radius: 10
} }
} }
@ -444,7 +449,7 @@ Window {
background: Rectangle { background: Rectangle {
height: parent.height height: parent.height
color: "#202123" color: theme.backgroundDarkest
} }
Item { Item {
@ -462,7 +467,7 @@ Window {
anchors.top: parent.top anchors.top: parent.top
wrapMode: Text.WordWrap wrapMode: Text.WordWrap
text: qsTr("Chat lists of specific conversations coming soon! Check back often for new features :)") text: qsTr("Chat lists of specific conversations coming soon! Check back often for new features :)")
color: "#d1d5db" color: theme.textColor
Accessible.role: Accessible.Paragraph Accessible.role: Accessible.Paragraph
Accessible.name: qsTr("Coming soon") Accessible.name: qsTr("Coming soon")
@ -479,7 +484,7 @@ Window {
wrapMode: Text.WordWrap wrapMode: Text.WordWrap
text: qsTr("Check out our discord channel <a href=\"https://discord.gg/4M2QFmTt2k\">https://discord.gg/4M2QFmTt2k</a>") text: qsTr("Check out our discord channel <a href=\"https://discord.gg/4M2QFmTt2k\">https://discord.gg/4M2QFmTt2k</a>")
onLinkActivated: { Qt.openUrlExternally("https://discord.gg/4M2QFmTt2k") } onLinkActivated: { Qt.openUrlExternally("https://discord.gg/4M2QFmTt2k") }
color: "#d1d5db" color: theme.textColor
linkColor: "#1e8cda" linkColor: "#1e8cda"
Accessible.role: Accessible.Link Accessible.role: Accessible.Link
@ -496,7 +501,7 @@ Window {
wrapMode: Text.WordWrap wrapMode: Text.WordWrap
text: qsTr("Thanks to <a href=\"https://home.nomic.ai\">nomic.ai</a> and the community for contributing so much great data and energy!") text: qsTr("Thanks to <a href=\"https://home.nomic.ai\">nomic.ai</a> and the community for contributing so much great data and energy!")
onLinkActivated: { Qt.openUrlExternally("https://home.nomic.ai") } onLinkActivated: { Qt.openUrlExternally("https://home.nomic.ai") }
color: "#d1d5db" color: theme.textColor
linkColor: "#1e8cda" linkColor: "#1e8cda"
Accessible.role: Accessible.Paragraph Accessible.role: Accessible.Paragraph
@ -513,7 +518,7 @@ Window {
contentItem: Text { contentItem: Text {
text: qsTr("Check for updates...") text: qsTr("Check for updates...")
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
color: "#d1d5db" color: theme.textColor
Accessible.role: Accessible.Button Accessible.role: Accessible.Button
Accessible.name: text Accessible.name: text
@ -522,10 +527,10 @@ Window {
background: Rectangle { background: Rectangle {
opacity: .5 opacity: .5
border.color: "#7d7d8e" border.color: theme.backgroundLightest
border.width: 1 border.width: 1
radius: 10 radius: 10
color: "#343541" color: theme.backgroundLight
} }
onClicked: { onClicked: {
@ -543,7 +548,7 @@ Window {
contentItem: Text { contentItem: Text {
text: qsTr("Download new models...") text: qsTr("Download new models...")
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
color: "#d1d5db" color: theme.textColor
Accessible.role: Accessible.Button Accessible.role: Accessible.Button
Accessible.name: text Accessible.name: text
@ -552,10 +557,10 @@ Window {
background: Rectangle { background: Rectangle {
opacity: .5 opacity: .5
border.color: "#7d7d8e" border.color: theme.backgroundLightest
border.width: 1 border.width: 1
radius: 10 radius: 10
color: "#343541" color: theme.backgroundLight
} }
onClicked: { onClicked: {
@ -568,7 +573,7 @@ Window {
Rectangle { Rectangle {
id: conversation id: conversation
color: "#343541" color: theme.backgroundLight
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
@ -589,7 +594,7 @@ Window {
Rectangle { Rectangle {
anchors.fill: parent anchors.fill: parent
color: "#444654" color: theme.backgroundLighter
ListView { ListView {
id: listView id: listView
@ -603,7 +608,7 @@ Window {
delegate: TextArea { delegate: TextArea {
text: currentResponse ? LLM.response : (value ? value : "") text: currentResponse ? LLM.response : (value ? value : "")
width: listView.width width: listView.width
color: "#d1d5db" color: theme.textColor
wrapMode: Text.WordWrap wrapMode: Text.WordWrap
focus: false focus: false
readOnly: true readOnly: true
@ -611,7 +616,7 @@ Window {
cursorVisible: currentResponse ? (LLM.response !== "" ? LLM.responseInProgress : false) : false cursorVisible: currentResponse ? (LLM.response !== "" ? LLM.responseInProgress : false) : false
cursorPosition: text.length cursorPosition: text.length
background: Rectangle { background: Rectangle {
color: name === qsTr("Response: ") ? "#444654" : "#343541" color: name === qsTr("Response: ") ? theme.backgroundLighter : theme.backgroundLight
} }
Accessible.role: Accessible.Paragraph Accessible.role: Accessible.Paragraph
@ -644,7 +649,7 @@ Window {
width: 30 width: 30
height: 30 height: 30
radius: 5 radius: 5
color: name === qsTr("Response: ") ? "#10a37f" : "#ec86bf" color: name === qsTr("Response: ") ? theme.assistantColor : theme.userColor
Text { Text {
anchors.centerIn: parent anchors.centerIn: parent
@ -693,7 +698,7 @@ Window {
opacity: thumbsUpState || thumbsUpState == thumbsDownState ? 1.0 : 0.2 opacity: thumbsUpState || thumbsUpState == thumbsDownState ? 1.0 : 0.2
background: Image { background: Image {
anchors.fill: parent anchors.fill: parent
source: "qrc:/gpt4all-chat/icons/thumbs_up.svg" source: "qrc:/gpt4all/icons/thumbs_up.svg"
} }
onClicked: { onClicked: {
if (thumbsUpState && !thumbsDownState) if (thumbsUpState && !thumbsDownState)
@ -726,7 +731,7 @@ Window {
] ]
background: Image { background: Image {
anchors.fill: parent anchors.fill: parent
source: "qrc:/gpt4all-chat/icons/thumbs_down.svg" source: "qrc:/gpt4all/icons/thumbs_down.svg"
} }
onClicked: { onClicked: {
thumbsDownDialog.open() thumbsDownDialog.open()
@ -774,7 +779,7 @@ Window {
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left anchors.left: parent.left
anchors.leftMargin: 15 anchors.leftMargin: 15
source: LLM.responseInProgress ? "qrc:/gpt4all-chat/icons/stop_generating.svg" : "qrc:/gpt4all-chat/icons/regenerate.svg" source: LLM.responseInProgress ? "qrc:/gpt4all/icons/stop_generating.svg" : "qrc:/gpt4all/icons/regenerate.svg"
} }
leftPadding: 50 leftPadding: 50
onClicked: { onClicked: {
@ -809,17 +814,17 @@ Window {
padding: 15 padding: 15
contentItem: Text { contentItem: Text {
text: LLM.responseInProgress ? qsTr("Stop generating") : qsTr("Regenerate response") text: LLM.responseInProgress ? qsTr("Stop generating") : qsTr("Regenerate response")
color: "#d1d5db" color: theme.textColor
Accessible.role: Accessible.Button Accessible.role: Accessible.Button
Accessible.name: text Accessible.name: text
Accessible.description: qsTr("Controls generation of the response") Accessible.description: qsTr("Controls generation of the response")
} }
background: Rectangle { background: Rectangle {
opacity: .5 opacity: .5
border.color: "#7d7d8e" border.color: theme.backgroundLightest
border.width: 1 border.width: 1
radius: 10 radius: 10
color: "#343541" color: theme.backgroundLight
} }
} }
@ -833,14 +838,14 @@ Window {
TextArea { TextArea {
id: textInput id: textInput
color: "#dadadc" color: theme.textColor
padding: 20 padding: 20
enabled: LLM.isModelLoaded enabled: LLM.isModelLoaded
font.pixelSize: 24 font.pixelSize: 24
placeholderText: qsTr("Send a message...") placeholderText: qsTr("Send a message...")
placeholderTextColor: "#7d7d8e" placeholderTextColor: theme.backgroundLightest
background: Rectangle { background: Rectangle {
color: "#40414f" color: theme.backgroundLighter
radius: 10 radius: 10
} }
Accessible.role: Accessible.EditableText Accessible.role: Accessible.EditableText
@ -892,7 +897,7 @@ Window {
background: Image { background: Image {
anchors.centerIn: parent anchors.centerIn: parent
source: "qrc:/gpt4all-chat/icons/send_message.svg" source: "qrc:/gpt4all/icons/send_message.svg"
} }
Accessible.role: Accessible.Button Accessible.role: Accessible.Button

22
qml/ModelDownloaderDialog.qml
View File

@ -14,9 +14,9 @@ Dialog {
background: Rectangle { background: Rectangle {
anchors.fill: parent anchors.fill: parent
anchors.margins: -20 anchors.margins: -20
color: "#202123" color: theme.backgroundDarkest
border.width: 1 border.width: 1
border.color: "white" border.color: theme.dialogBorder
radius: 10 radius: 10
} }
@ -35,7 +35,7 @@ Dialog {
text: "Available Models:" text: "Available Models:"
Layout.alignment: Qt.AlignLeft Layout.alignment: Qt.AlignLeft
Layout.fillWidth: true Layout.fillWidth: true
color: "#d1d5db" color: theme.textColor
} }
ListView { ListView {
@ -54,7 +54,7 @@ Dialog {
property bool downloading: false property bool downloading: false
Rectangle { Rectangle {
anchors.fill: parent anchors.fill: parent
color: index % 2 === 0 ? "#2c2f33" : "#1e2125" color: index % 2 === 0 ? theme.backgroundLight : theme.backgroundLighter
} }
Text { Text {
@ -65,7 +65,7 @@ Dialog {
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left anchors.left: parent.left
anchors.leftMargin: 10 anchors.leftMargin: 10
color: "#d1d5db" color: theme.textColor
Accessible.role: Accessible.Paragraph Accessible.role: Accessible.Paragraph
Accessible.name: qsTr("Model file") Accessible.name: qsTr("Model file")
Accessible.description: qsTr("Model file to be downloaded") Accessible.description: qsTr("Model file to be downloaded")
@ -78,7 +78,7 @@ Dialog {
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
anchors.left: modelName.right anchors.left: modelName.right
anchors.leftMargin: 10 anchors.leftMargin: 10
color: "#d1d5db" color: theme.textColor
Accessible.role: Accessible.Paragraph Accessible.role: Accessible.Paragraph
Accessible.name: qsTr("Default file") Accessible.name: qsTr("Default file")
Accessible.description: qsTr("Whether the file is the default model") Accessible.description: qsTr("Whether the file is the default model")
@ -89,7 +89,7 @@ Dialog {
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
anchors.left: isDefault.visible ? isDefault.right : modelName.right anchors.left: isDefault.visible ? isDefault.right : modelName.right
anchors.leftMargin: 10 anchors.leftMargin: 10
color: "#d1d5db" color: theme.textColor
Accessible.role: Accessible.Paragraph Accessible.role: Accessible.Paragraph
Accessible.name: qsTr("File size") Accessible.name: qsTr("File size")
Accessible.description: qsTr("The size of the file") Accessible.description: qsTr("The size of the file")
@ -101,7 +101,7 @@ Dialog {
anchors.right: itemProgressBar.left anchors.right: itemProgressBar.left
anchors.rightMargin: 10 anchors.rightMargin: 10
objectName: "speedLabel" objectName: "speedLabel"
color: "#d1d5db" color: theme.textColor
text: "" text: ""
visible: downloading visible: downloading
Accessible.role: Accessible.Paragraph Accessible.role: Accessible.Paragraph
@ -128,7 +128,7 @@ Dialog {
anchors.right: parent.right anchors.right: parent.right
anchors.rightMargin: 15 anchors.rightMargin: 15
objectName: "installedLabel" objectName: "installedLabel"
color: "#d1d5db" color: theme.textColor
text: qsTr("Already installed") text: qsTr("Already installed")
visible: modelData.installed visible: modelData.installed
Accessible.role: Accessible.Paragraph Accessible.role: Accessible.Paragraph
@ -155,10 +155,10 @@ Dialog {
} }
background: Rectangle { background: Rectangle {
opacity: .5 opacity: .5
border.color: "#7d7d8e" border.color: theme.backgroundLightest
border.width: 1 border.width: 1
radius: 10 radius: 10
color: "#343541" color: theme.backgroundLight
} }
Accessible.role: Accessible.Button Accessible.role: Accessible.Button
Accessible.name: text Accessible.name: text

30
qml/NetworkDialog.qml
View File

@ -15,6 +15,10 @@ Dialog {
width: 1024 width: 1024
height: column.height + dialogBox.height + 20 height: column.height + dialogBox.height + 20
Theme {
id: theme
}
Settings { Settings {
id: settings id: settings
property string attribution: "" property string attribution: ""
@ -36,14 +40,14 @@ Dialog {
anchors.left: parent.left anchors.left: parent.left
width: 60 width: 60
height: 60 height: 60
source: "qrc:/gpt4all-chat/icons/logo.svg" source: "qrc:/gpt4all/icons/logo.svg"
} }
Text { Text {
anchors.left: img.right anchors.left: img.right
anchors.leftMargin: 30 anchors.leftMargin: 30
anchors.verticalCenter: img.verticalCenter anchors.verticalCenter: img.verticalCenter
text: qsTr("Contribute data to the GPT4All Opensource Datalake.") text: qsTr("Contribute data to the GPT4All Opensource Datalake.")
color: "#d1d5db" color: theme.textColor
} }
} }
@ -64,14 +68,14 @@ Dialog {
When a GPT4All model responds to you and you have opted-in, you can like/dislike its response. If you dislike a response, you can suggest an alternative response. This data will be collected and aggregated in the GPT4All Datalake. When a GPT4All model responds to you and you have opted-in, you can like/dislike its response. If you dislike a response, you can suggest an alternative response. This data will be collected and aggregated in the GPT4All Datalake.
NOTE: By turning on this feature, you will be sending your data to the GPT4All Open Source Datalake. You should have no expectation of chat privacy when this feature is enabled. You should; however, have an expectation of an optional attribution if you wish. Your chat data will be openly available for anyone to download and will be used by Nomic AI to improve future GPT4All models. Nomic AI will retain all attribution information attached to your data and you will be credited as a contributor to any GPT4All model release that uses your data!") NOTE: By turning on this feature, you will be sending your data to the GPT4All Open Source Datalake. You should have no expectation of chat privacy when this feature is enabled. You should; however, have an expectation of an optional attribution if you wish. Your chat data will be openly available for anyone to download and will be used by Nomic AI to improve future GPT4All models. Nomic AI will retain all attribution information attached to your data and you will be credited as a contributor to any GPT4All model release that uses your data!")
color: "#d1d5db" color: theme.textColor
focus: false focus: false
readOnly: true readOnly: true
Accessible.role: Accessible.Paragraph Accessible.role: Accessible.Paragraph
Accessible.name: qsTr("Terms for opt-in") Accessible.name: qsTr("Terms for opt-in")
Accessible.description: qsTr("Describes what will happen when you opt-in") Accessible.description: qsTr("Describes what will happen when you opt-in")
background: Rectangle { background: Rectangle {
color: "#343541" color: theme.backgroundLight
radius: 10 radius: 10
} }
} }
@ -79,15 +83,15 @@ NOTE: By turning on this feature, you will be sending your data to the GPT4All O
TextField { TextField {
id: attribution id: attribution
color: "#dadadc" color: theme.textColor
padding: 20 padding: 20
width: parent.width width: parent.width
text: settings.attribution text: settings.attribution
font.pixelSize: 24 font.pixelSize: 24
placeholderText: qsTr("Please provide a name for attribution (optional)") placeholderText: qsTr("Please provide a name for attribution (optional)")
placeholderTextColor: "#7d7d8e" placeholderTextColor: theme.backgroundLightest
background: Rectangle { background: Rectangle {
color: "#40414f" color: theme.backgroundLighter
radius: 10 radius: 10
} }
Accessible.role: Accessible.EditableText Accessible.role: Accessible.EditableText
@ -102,9 +106,9 @@ NOTE: By turning on this feature, you will be sending your data to the GPT4All O
background: Rectangle { background: Rectangle {
anchors.fill: parent anchors.fill: parent
color: "#202123" color: theme.backgroundDarkest
border.width: 1 border.width: 1
border.color: "white" border.color: theme.dialogBorder
radius: 10 radius: 10
} }
@ -116,10 +120,10 @@ NOTE: By turning on this feature, you will be sending your data to the GPT4All O
Button { Button {
text: qsTr("Enable") text: qsTr("Enable")
background: Rectangle { background: Rectangle {
border.color: "#7d7d8e" border.color: theme.backgroundLightest
border.width: 1 border.width: 1
radius: 10 radius: 10
color: "#343541" color: theme.backgroundLight
} }
Accessible.role: Accessible.Button Accessible.role: Accessible.Button
Accessible.name: text Accessible.name: text
@ -131,10 +135,10 @@ NOTE: By turning on this feature, you will be sending your data to the GPT4All O
Button { Button {
text: qsTr("Cancel") text: qsTr("Cancel")
background: Rectangle { background: Rectangle {
border.color: "#7d7d8e" border.color: theme.backgroundLightest
border.width: 1 border.width: 1
radius: 10 radius: 10
color: "#343541" color: theme.backgroundLight
} }
Accessible.role: Accessible.Button Accessible.role: Accessible.Button
Accessible.name: text Accessible.name: text

11
qml/PopupDialog.qml
View File

@ -10,19 +10,24 @@ Dialog {
opacity: 0.9 opacity: 0.9
padding: 20 padding: 20
property alias text: textField.text property alias text: textField.text
Theme {
id: theme
}
Text { Text {
id: textField id: textField
horizontalAlignment: Text.AlignJustify horizontalAlignment: Text.AlignJustify
color: "#d1d5db" color: theme.textColor
Accessible.role: Accessible.HelpBalloon Accessible.role: Accessible.HelpBalloon
Accessible.name: text Accessible.name: text
Accessible.description: qsTr("Reveals a shortlived help balloon") Accessible.description: qsTr("Reveals a shortlived help balloon")
} }
background: Rectangle { background: Rectangle {
anchors.fill: parent anchors.fill: parent
color: "#202123" color: theme.backgroundDarkest
border.width: 1 border.width: 1
border.color: "white" border.color: theme.dialogBorder
radius: 10 radius: 10
} }

74
qml/SettingsDialog.qml
View File

@ -15,12 +15,16 @@ Dialog {
background: Rectangle { background: Rectangle {
anchors.fill: parent anchors.fill: parent
anchors.margins: -20 anchors.margins: -20
color: "#202123" color: theme.backgroundDarkest
border.width: 1 border.width: 1
border.color: "white" border.color: theme.dialogBorder
radius: 10 radius: 10
} }
Theme {
id: theme
}
property real defaultTemperature: 0.28 property real defaultTemperature: 0.28
property real defaultTopP: 0.95 property real defaultTopP: 0.95
property int defaultTopK: 40 property int defaultTopK: 40
@ -77,18 +81,19 @@ Dialog {
Label { Label {
id: tempLabel id: tempLabel
text: qsTr("Temperature:") text: qsTr("Temperature:")
color: "#d1d5db" color: theme.textColor
Layout.row: 0 Layout.row: 0
Layout.column: 0 Layout.column: 0
} }
TextField { TextField {
text: settings.temperature.toString() text: settings.temperature.toString()
color: "#d1d5db" color: theme.textColor
background: Rectangle { background: Rectangle {
implicitWidth: 150 implicitWidth: 150
color: "#40414f" color: theme.backgroundLighter
radius: 10 radius: 10
} }
padding: 10
ToolTip.text: qsTr("Temperature increases the chances of choosing less likely tokens - higher temperature gives more creative but less predictable outputs") ToolTip.text: qsTr("Temperature increases the chances of choosing less likely tokens - higher temperature gives more creative but less predictable outputs")
ToolTip.visible: hovered ToolTip.visible: hovered
Layout.row: 0 Layout.row: 0
@ -111,18 +116,19 @@ Dialog {
Label { Label {
id: topPLabel id: topPLabel
text: qsTr("Top P:") text: qsTr("Top P:")
color: "#d1d5db" color: theme.textColor
Layout.row: 1 Layout.row: 1
Layout.column: 0 Layout.column: 0
} }
TextField { TextField {
text: settings.topP.toString() text: settings.topP.toString()
color: "#d1d5db" color: theme.textColor
background: Rectangle { background: Rectangle {
implicitWidth: 150 implicitWidth: 150
color: "#40414f" color: theme.backgroundLighter
radius: 10 radius: 10
} }
padding: 10
ToolTip.text: qsTr("Only the most likely tokens up to a total probability of top_p can be chosen, prevents choosing highly unlikely tokens, aka Nucleus Sampling") ToolTip.text: qsTr("Only the most likely tokens up to a total probability of top_p can be chosen, prevents choosing highly unlikely tokens, aka Nucleus Sampling")
ToolTip.visible: hovered ToolTip.visible: hovered
Layout.row: 1 Layout.row: 1
@ -145,18 +151,19 @@ Dialog {
Label { Label {
id: topKLabel id: topKLabel
text: qsTr("Top K:") text: qsTr("Top K:")
color: "#d1d5db" color: theme.textColor
Layout.row: 2 Layout.row: 2
Layout.column: 0 Layout.column: 0
} }
TextField { TextField {
text: settings.topK.toString() text: settings.topK.toString()
color: "#d1d5db" color: theme.textColor
background: Rectangle { background: Rectangle {
implicitWidth: 150 implicitWidth: 150
color: "#40414f" color: theme.backgroundLighter
radius: 10 radius: 10
} }
padding: 10
ToolTip.text: qsTr("Only the top K most likely tokens will be chosen from") ToolTip.text: qsTr("Only the top K most likely tokens will be chosen from")
ToolTip.visible: hovered ToolTip.visible: hovered
Layout.row: 2 Layout.row: 2
@ -179,18 +186,19 @@ Dialog {
Label { Label {
id: maxLengthLabel id: maxLengthLabel
text: qsTr("Max Length:") text: qsTr("Max Length:")
color: "#d1d5db" color: theme.textColor
Layout.row: 3 Layout.row: 3
Layout.column: 0 Layout.column: 0
} }
TextField { TextField {
text: settings.maxLength.toString() text: settings.maxLength.toString()
color: "#d1d5db" color: theme.textColor
background: Rectangle { background: Rectangle {
implicitWidth: 150 implicitWidth: 150
color: "#40414f" color: theme.backgroundLighter
radius: 10 radius: 10
} }
padding: 10
ToolTip.text: qsTr("Maximum length of response in tokens") ToolTip.text: qsTr("Maximum length of response in tokens")
ToolTip.visible: hovered ToolTip.visible: hovered
Layout.row: 3 Layout.row: 3
@ -214,18 +222,19 @@ Dialog {
Label { Label {
id: batchSizeLabel id: batchSizeLabel
text: qsTr("Prompt Batch Size:") text: qsTr("Prompt Batch Size:")
color: "#d1d5db" color: theme.textColor
Layout.row: 4 Layout.row: 4
Layout.column: 0 Layout.column: 0
} }
TextField { TextField {
text: settings.promptBatchSize.toString() text: settings.promptBatchSize.toString()
color: "#d1d5db" color: theme.textColor
background: Rectangle { background: Rectangle {
implicitWidth: 150 implicitWidth: 150
color: "#40414f" color: theme.backgroundLighter
radius: 10 radius: 10
} }
padding: 10
ToolTip.text: qsTr("Amount of prompt tokens to process at once, higher values can speed up reading prompts but will use more RAM") ToolTip.text: qsTr("Amount of prompt tokens to process at once, higher values can speed up reading prompts but will use more RAM")
ToolTip.visible: hovered ToolTip.visible: hovered
Layout.row: 4 Layout.row: 4
@ -249,18 +258,19 @@ Dialog {
Label { Label {
id: nThreadsLabel id: nThreadsLabel
text: qsTr("CPU Threads") text: qsTr("CPU Threads")
color: "#d1d5db" color: theme.textColor
Layout.row: 5 Layout.row: 5
Layout.column: 0 Layout.column: 0
} }
TextField { TextField {
text: LLM.threadCount.toString() text: LLM.threadCount.toString()
color: "#d1d5db" color: theme.textColor
background: Rectangle { background: Rectangle {
implicitWidth: 150 implicitWidth: 150
color: "#40414f" color: theme.backgroundLighter
radius: 10 radius: 10
} }
padding: 10
ToolTip.text: qsTr("Amount of processing threads to use") ToolTip.text: qsTr("Amount of processing threads to use")
ToolTip.visible: hovered ToolTip.visible: hovered
Layout.row: 5 Layout.row: 5
@ -283,7 +293,7 @@ Dialog {
Label { Label {
id: promptTemplateLabel id: promptTemplateLabel
text: qsTr("Prompt Template:") text: qsTr("Prompt Template:")
color: "#d1d5db" color: theme.textColor
Layout.row: 6 Layout.row: 6
Layout.column: 0 Layout.column: 0
} }
@ -293,16 +303,17 @@ Dialog {
Layout.fillWidth: true Layout.fillWidth: true
height: 200 height: 200
color: "transparent" color: "transparent"
border.width: 1 clip: true
border.color: "#ccc"
radius: 5
Label { Label {
id: promptTemplateLabelHelp id: promptTemplateLabelHelp
visible: settings.promptTemplate.indexOf("%1") === -1 visible: settings.promptTemplate.indexOf("%1") === -1
font.bold: true font.bold: true
color: "red" color: theme.textErrorColor
text: qsTr("Prompt template must contain %1 to be replaced with the user's input.") text: qsTr("Prompt template must contain %1 to be replaced with the user's input.")
anchors.bottom: templateScrollView.top anchors.fill: templateScrollView
z: 200
padding: 10
wrapMode: TextArea.Wrap
Accessible.role: Accessible.EditableText Accessible.role: Accessible.EditableText
Accessible.name: text Accessible.name: text
} }
@ -311,12 +322,13 @@ Dialog {
anchors.fill: parent anchors.fill: parent
TextArea { TextArea {
text: settings.promptTemplate text: settings.promptTemplate
color: "#d1d5db" color: theme.textColor
background: Rectangle { background: Rectangle {
implicitWidth: 150 implicitWidth: 150
color: "#40414f" color: theme.backgroundLighter
radius: 10 radius: 10
} }
padding: 10
wrapMode: TextArea.Wrap wrapMode: TextArea.Wrap
onTextChanged: { onTextChanged: {
settings.promptTemplate = text settings.promptTemplate = text
@ -337,7 +349,7 @@ Dialog {
contentItem: Text { contentItem: Text {
text: qsTr("Restore Defaults") text: qsTr("Restore Defaults")
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
color: "#d1d5db" color: theme.textColor
Accessible.role: Accessible.Button Accessible.role: Accessible.Button
Accessible.name: text Accessible.name: text
Accessible.description: qsTr("Restores the settings dialog to a default state") Accessible.description: qsTr("Restores the settings dialog to a default state")
@ -345,10 +357,10 @@ Dialog {
background: Rectangle { background: Rectangle {
opacity: .5 opacity: .5
border.color: "#7d7d8e" border.color: theme.backgroundLightest
border.width: 1 border.width: 1
radius: 10 radius: 10
color: "#343541" color: theme.backgroundLight
} }
onClicked: { onClicked: {
settingsDialog.restoreDefaults() settingsDialog.restoreDefaults()

15
qml/Theme.qml Normal file
View File

@ -0,0 +1,15 @@
import QtCore
import QtQuick
QtObject {
property color textColor: "#d1d5db"
property color textErrorColor: "red"
property color backgroundDarkest: "#202123"
property color backgroundDark: "#242528"
property color backgroundLight: "#343541"
property color backgroundLighter: "#444654"
property color backgroundLightest: "#7d7d8e"
property color dialogBorder: "#d1d5db"
property color userColor: "#ec86bf"
property color assistantColor: "#10a37f"
}

27
qml/ThumbsDownDialog.qml
View File

@ -12,6 +12,11 @@ Dialog {
opacity: 0.9 opacity: 0.9
padding: 20 padding: 20
width: 900 width: 900
Theme {
id: theme
}
property alias response: thumbsDownNewResponse.text property alias response: thumbsDownNewResponse.text
Column { Column {
anchors.fill: parent anchors.fill: parent
@ -25,14 +30,14 @@ Dialog {
anchors.left: parent.left anchors.left: parent.left
width: 60 width: 60
height: 60 height: 60
source: "qrc:/gpt4all-chat/icons/thumbs_down.svg" source: "qrc:/gpt4all/icons/thumbs_down.svg"
} }
Text { Text {
anchors.left: img.right anchors.left: img.right
anchors.leftMargin: 30 anchors.leftMargin: 30
anchors.verticalCenter: img.verticalCenter anchors.verticalCenter: img.verticalCenter
text: qsTr("Provide feedback for negative rating") text: qsTr("Provide feedback for negative rating")
color: "#d1d5db" color: theme.textColor
} }
} }
@ -45,16 +50,16 @@ Dialog {
TextArea { TextArea {
id: thumbsDownNewResponse id: thumbsDownNewResponse
color: "#dadadc" color: theme.textColor
padding: 20 padding: 20
width: parent.width width: parent.width
height: 300 height: 300
wrapMode: Text.Wrap wrapMode: Text.Wrap
font.pixelSize: 24 font.pixelSize: 24
placeholderText: qsTr("Please provide a better response...") placeholderText: qsTr("Please provide a better response...")
placeholderTextColor: "#7d7d8e" placeholderTextColor: theme.backgroundLightest
background: Rectangle { background: Rectangle {
color: "#40414f" color: theme.backgroundLighter
radius: 10 radius: 10
} }
} }
@ -63,9 +68,9 @@ Dialog {
background: Rectangle { background: Rectangle {
anchors.fill: parent anchors.fill: parent
color: "#202123" color: theme.backgroundDarkest
border.width: 1 border.width: 1
border.color: "white" border.color: theme.dialogBorder
radius: 10 radius: 10
} }
@ -76,10 +81,10 @@ Dialog {
Button { Button {
text: qsTr("Submit") text: qsTr("Submit")
background: Rectangle { background: Rectangle {
border.color: "#7d7d8e" border.color: theme.backgroundLightest
border.width: 1 border.width: 1
radius: 10 radius: 10
color: "#343541" color: theme.backgroundLight
} }
padding: 15 padding: 15
DialogButtonBox.buttonRole: DialogButtonBox.AcceptRole DialogButtonBox.buttonRole: DialogButtonBox.AcceptRole
@ -87,10 +92,10 @@ Dialog {
Button { Button {
text: qsTr("Cancel") text: qsTr("Cancel")
background: Rectangle { background: Rectangle {
border.color: "#7d7d8e" border.color: theme.backgroundLightest
border.width: 1 border.width: 1
radius: 10 radius: 10
color: "#343541" color: theme.backgroundLight
} }
padding: 15 padding: 15
DialogButtonBox.buttonRole: DialogButtonBox.RejectRole DialogButtonBox.buttonRole: DialogButtonBox.RejectRole