diff --git a/index.html b/index.html index 2fd5907..b386807 100644 --- a/index.html +++ b/index.html @@ -21,6 +21,13 @@ + + + + diff --git a/public/icons/svg/chevron-down_lighten.svg b/public/icons/svg/chevron-down_lighten.svg new file mode 100644 index 0000000..35e7e61 --- /dev/null +++ b/public/icons/svg/chevron-down_lighten.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/icons/svg/close_lighten.svg b/public/icons/svg/close_lighten.svg new file mode 100644 index 0000000..5074f98 --- /dev/null +++ b/public/icons/svg/close_lighten.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/icons/svg/copy2_lighten.svg b/public/icons/svg/copy2_lighten.svg new file mode 100644 index 0000000..5044690 --- /dev/null +++ b/public/icons/svg/copy2_lighten.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/icons/svg/copy_lighten.svg b/public/icons/svg/copy_lighten.svg new file mode 100644 index 0000000..9771036 --- /dev/null +++ b/public/icons/svg/copy_lighten.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/icons/svg/dark_mode.svg b/public/icons/svg/dark_mode.svg new file mode 100644 index 0000000..7216e1b --- /dev/null +++ b/public/icons/svg/dark_mode.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/public/icons/svg/edit_lighten.svg b/public/icons/svg/edit_lighten.svg new file mode 100644 index 0000000..6ce0287 --- /dev/null +++ b/public/icons/svg/edit_lighten.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/libertai.svg b/public/icons/svg/libertai_full.svg similarity index 100% rename from src/assets/libertai.svg rename to public/icons/svg/libertai_full.svg diff --git a/public/icons/svg/libertai_full_lighten.svg b/public/icons/svg/libertai_full_lighten.svg new file mode 100644 index 0000000..46c9798 --- /dev/null +++ b/public/icons/svg/libertai_full_lighten.svg @@ -0,0 +1,27 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/icons/svg/light_mode.svg b/public/icons/svg/light_mode.svg new file mode 100644 index 0000000..dd587a1 --- /dev/null +++ b/public/icons/svg/light_mode.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/public/icons/msg.svg b/public/icons/svg/msg.svg similarity index 100% rename from public/icons/msg.svg rename to public/icons/svg/msg.svg diff --git a/public/icons/msg_active.svg b/public/icons/svg/msg_active.svg similarity index 100% rename from public/icons/msg_active.svg rename to public/icons/svg/msg_active.svg diff --git a/public/icons/svg/msg_lighten.svg b/public/icons/svg/msg_lighten.svg new file mode 100644 index 0000000..1014ed9 --- /dev/null +++ b/public/icons/svg/msg_lighten.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/powered-by.svg b/public/icons/svg/powered-by.svg similarity index 100% rename from src/assets/powered-by.svg rename to public/icons/svg/powered-by.svg diff --git a/public/icons/svg/powered-by_lighten.svg b/public/icons/svg/powered-by_lighten.svg new file mode 100644 index 0000000..6e1a947 --- /dev/null +++ b/public/icons/svg/powered-by_lighten.svg @@ -0,0 +1,23 @@ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/icons/svg/settings_lighten.svg b/public/icons/svg/settings_lighten.svg new file mode 100644 index 0000000..3cea9de --- /dev/null +++ b/public/icons/svg/settings_lighten.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/icons/svg/star_lighten.svg b/public/icons/svg/star_lighten.svg new file mode 100644 index 0000000..316df94 --- /dev/null +++ b/public/icons/svg/star_lighten.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/components/ModelSelector.vue b/src/components/ModelSelector.vue new file mode 100644 index 0000000..8f68ad9 --- /dev/null +++ b/src/components/ModelSelector.vue @@ -0,0 +1,61 @@ + + + diff --git a/src/components/PersonaDialog.vue b/src/components/PersonaDialog.vue index 1ccb4fa..c54f778 100644 --- a/src/components/PersonaDialog.vue +++ b/src/components/PersonaDialog.vue @@ -1,32 +1,39 @@ + + diff --git a/src/css/app.scss b/src/css/app.scss index 797d88b..33c8a67 100644 --- a/src/css/app.scss +++ b/src/css/app.scss @@ -49,31 +49,113 @@ U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } +body { + font-family: 'mulish'; +} + /* Quasar */ +.body--light { + /* ... */ + .engine-message { + background-color: $secondary; + } + + .message-content { + color: $purple700; + } + + .q-toggle { + .q-toggle__track { + background-color: $purple700; + opacity: 0.7; + } + } + + .personas-dropdown { + border: 1px solid $secondary; + } + + .text-light { + color: $primary; + } +} + +.body--dark { + /* ... */ + .q-dark, + .text-primary { + color: $dark-text-color !important; + } + + .bg-primary { + background-color: $primary-dark !important; + } + + .btn-gradient { + background-image: inherit; + background-color: $primary-dark !important; + } + + .engine-message { + } + + .message-content { + color: $dark-text-color; + } + + .personas-dropdown { + background-color: $secondary; + } + + .text-light { + color: $primary; + } + aside { + & .item-history { + border: inherit; + color: $dark-text-color; + } + } + + .q-item--dark { + color: $dark-text-color; + } + + .border-primary-highlight { + border: 1px solid $primary; + } + + .bg-purple-50 { + background-color: $primary-dark !important; + color: $purple50 !important; + } +} +/* Quasar */ .q-tooltip { background-color: $primary; } +/* fix broken avatar radius */ +.q-avatar__content { + border-radius: 50%; +} + /* TEXT */ .text-semibold { font-weight: 600; } -.text-light { - color: #644df9; -} - .text-purple700, .text-purple-700 { - font-family: 'Mulish'; - color: $purple700; + color: $purple700 !important; } .font-mulish { - font-family: 'Mulish'; + font-family: 'Mulish' !important; } + .border-primary-highlight { - border: 1px solid #644df9; + border: 1px solid $border-color; } .dyn-container { @@ -124,17 +206,24 @@ input { -webkit-background-clip: text !important; } -/* fix broken avatar radius */ -.q-avatar__content { - border-radius: 50%; -} .rounded-img img { border-radius: 50%; } + .avatar { border-radius: 50%; } -.personas-dropdown { - border: 2px solid $secondary; +.icon-md > svg, +.icon-md img { + width: 0.8em; + height: 0.8em; +} + +.bull-date { + color: $dark-text-color; +} +.bull-date::before { + content: '● '; + margin-left: 5px; } diff --git a/src/css/quasar.variables.scss b/src/css/quasar.variables.scss index c276359..b8d76b3 100644 --- a/src/css/quasar.variables.scss +++ b/src/css/quasar.variables.scss @@ -14,12 +14,15 @@ //$primary: #3e3096; $primary: #644df9; +$primary-dark: #9895ba; //$secondary: #251d53; $secondary: #eeeef8; $accent: #9c27b0; $dark: #1c1834; +$dark: #030014; $dark-page: #030014; +$dark-text-color: #9895ba; $positive: #21ba45; $negative: #c10015; @@ -29,6 +32,8 @@ $warning: #f2c037; $purple700: #3a2986; $purple50: #f7f6ff; +$border-color: #dee1ff; + // change default font $typography-font-family: 'Noto Sans Mono', 'Poppins', sans-serif; diff --git a/src/layouts/MainLayout.vue b/src/layouts/MainLayout.vue index 25ca373..95ec083 100644 --- a/src/layouts/MainLayout.vue +++ b/src/layouts/MainLayout.vue @@ -3,50 +3,24 @@ - + - + +
- - - - - - - {{ model.name }} - - - - - @@ -67,6 +41,8 @@ >{{ addressPoints.toFixed(0) }} Points + +
@@ -74,26 +50,32 @@ - Libertai + Libertai - + New Chat - - +
+ + + + + New Chat + +
- + - + - + @@ -176,7 +170,7 @@ - aleph.im + aleph.im @@ -193,7 +187,6 @@ import { storeToRefs } from 'pinia'; // Import State import { useChatsStore } from '../stores/chats-store'; -import { useModelsStore } from '../stores/models-store'; import { useAccount } from '../stores/account'; import { usePoints } from 'src/stores/points'; import { useRoute, useRouter } from 'vue-router'; @@ -201,6 +194,8 @@ import { useRoute, useRouter } from 'vue-router'; // Import Components import AccountButton from 'src/components/AccountButton.vue'; import PersonaDialog from 'src/components/PersonaDialog.vue'; +import ToggleTheme from 'src/components/ToggleTheme.vue'; +import ModelSelector from 'src/components/ModelSelector.vue'; const leftDrawerOpen = ref(false); // Control whether the advanced persona customization is shown @@ -210,7 +205,6 @@ const deleteChatConfirmAction = ref(false); const deleteChatId = ref(null); // Setup Stores -const modelsStore = useModelsStore(); const chatsStore = useChatsStore(); const account = useAccount(); const points = usePoints(); diff --git a/src/pages/Chat.vue b/src/pages/Chat.vue index 01eae99..a4f9b99 100644 --- a/src/pages/Chat.vue +++ b/src/pages/Chat.vue @@ -1,13 +1,13 @@