diff --git a/deploy/k8s/dev/kustomization.yaml b/deploy/k8s/dev/kustomization.yaml
index 2bf66656..577eccff 100644
--- a/deploy/k8s/dev/kustomization.yaml
+++ b/deploy/k8s/dev/kustomization.yaml
@@ -257,6 +257,10 @@ generatorOptions:
+
+
+
+
diff --git a/web/index.html b/web/index.html
index fa3719ce..6ed891ea 100644
--- a/web/index.html
+++ b/web/index.html
@@ -5,6 +5,9 @@
dexorder
+
+
+
diff --git a/web/src/assets/theme.css b/web/src/assets/theme.css
index 821ce6a6..f39ce5f2 100644
--- a/web/src/assets/theme.css
+++ b/web/src/assets/theme.css
@@ -1,21 +1,21 @@
/* web/src/assets/theme.css */
:root {
- --p-primary-color: #26A69A; /* TV green */
- --p-primary-contrast-color: #131722;
- --p-surface-0: #131722; /* TV bg */
- --p-surface-50: #1a1e2b;
- --p-surface-100: #1e222d;
- --p-surface-200: #2A2E39; /* TV grid */
- --p-surface-300: #363b4a;
- --p-surface-400: #434857;
- --p-surface-700: #787B86; /* TV subtext */
- --p-surface-800: #B2B5BE;
- --p-surface-900: #D3D4DC; /* TV text */
+ --p-primary-color: #089981; /* TV green */
+ --p-primary-contrast-color: #0f0f0f;
+ --p-surface-0: #0f0f0f; /* TV bg */
+ --p-surface-50: #141414;
+ --p-surface-100: #1c1c1c; /* TV grid lines */
+ --p-surface-200: #2e2e2e; /* TV borders */
+ --p-surface-300: #3d3d3d;
+ --p-surface-400: #4d4d4d;
+ --p-surface-700: #8a8a8a; /* TV subtext */
+ --p-surface-800: #b8b8b8;
+ --p-surface-900: #dbdbdb; /* TV text */
/* Semantic trading colors */
- --color-bull: #26A69A;
- --color-bear: #EF5350;
- --color-neutral: #787B86;
+ --color-bull: #089981;
+ --color-bear: #f23645;
+ --color-neutral: #8a8a8a;
}
html, body, #app {
@@ -25,6 +25,11 @@ html, body, #app {
width: 100vw !important;
overflow: hidden;
background-color: var(--p-surface-0) !important;
+ font-family: 'IBM Plex Sans', sans-serif;
+}
+
+vue-advanced-chat {
+ font-family: 'IBM Plex Sans', sans-serif;
}
.dark {
diff --git a/web/src/components/ChatPanel.vue b/web/src/components/ChatPanel.vue
index 507d8ed0..cac656d4 100644
--- a/web/src/components/ChatPanel.vue
+++ b/web/src/components/ChatPanel.vue
@@ -356,22 +356,19 @@ const openFile = ({ file }: any) => {
window.open(file.url, '_blank')
}
-// Theme configuration for dark mode
-const chatTheme = 'dark'
-
// Styles to match TradingView dark theme
-const chatStyles = computed(() => JSON.stringify({
+const chatStyles = {
general: {
- color: '#D3D4DC',
- colorButtonClear: '#D3D4DC',
- colorButton: '#131722',
- backgroundColorButton: '#26A69A',
- backgroundInput: '#131722',
- colorPlaceholder: '#787B86',
- colorCaret: '#D3D4DC',
- colorSpinner: '#26A69A',
- borderStyle: '1px solid #2A2E39',
- backgroundScrollIcon: '#2A2E39'
+ color: '#dbdbdb',
+ colorButtonClear: '#dbdbdb',
+ colorButton: '#0f0f0f',
+ backgroundColorButton: '#089981',
+ backgroundInput: '#0f0f0f',
+ colorPlaceholder: '#8a8a8a',
+ colorCaret: '#dbdbdb',
+ colorSpinner: '#089981',
+ borderStyle: '1px solid #2e2e2e',
+ backgroundScrollIcon: '#1c1c1c'
},
container: {
border: 'none',
@@ -379,122 +376,122 @@ const chatStyles = computed(() => JSON.stringify({
boxShadow: 'none'
},
header: {
- background: '#2A2E39',
- colorRoomName: '#D3D4DC',
- colorRoomInfo: '#787B86',
+ background: '#1c1c1c',
+ colorRoomName: '#dbdbdb',
+ colorRoomInfo: '#8a8a8a',
position: 'absolute',
width: '100%'
},
footer: {
- background: '#2A2E39',
- borderStyleInput: '1px solid #2A2E39',
- borderInputSelected: '#26A69A',
- backgroundReply: '#2A2E39',
- backgroundTagActive: '#2A2E39',
- backgroundTag: '#1E222D'
+ background: '#1c1c1c',
+ borderStyleInput: '1px solid #2e2e2e',
+ borderInputSelected: '#089981',
+ backgroundReply: '#1c1c1c',
+ backgroundTagActive: '#2e2e2e',
+ backgroundTag: '#141414'
},
content: {
- background: '#131722'
+ background: '#0f0f0f'
},
sidemenu: {
- background: '#131722',
- backgroundHover: '#1E222D',
- backgroundActive: '#2A2E39',
- colorActive: '#D3D4DC',
- borderColorSearch: '#2A2E39'
+ background: '#0f0f0f',
+ backgroundHover: '#141414',
+ backgroundActive: '#1c1c1c',
+ colorActive: '#dbdbdb',
+ borderColorSearch: '#2e2e2e'
},
dropdown: {
- background: '#2A2E39',
- backgroundHover: '#363B4A'
+ background: '#1c1c1c',
+ backgroundHover: '#2e2e2e'
},
message: {
- background: '#1E222D',
- backgroundMe: '#26A69A',
- color: '#D3D4DC',
- colorStarted: '#787B86',
- backgroundDeleted: '#131722',
- backgroundSelected: '#2A2E39',
- colorDeleted: '#787B86',
- colorUsername: '#787B86',
- colorTimestamp: '#787B86',
- backgroundDate: 'rgba(0, 0, 0, 0.3)',
- colorDate: '#787B86',
- backgroundSystem: 'rgba(0, 0, 0, 0.3)',
- colorSystem: '#787B86',
- backgroundMedia: 'rgba(0, 0, 0, 0.18)',
- backgroundReply: 'rgba(0, 0, 0, 0.18)',
- colorReplyUsername: '#D3D4DC',
- colorReply: '#B2B5BE',
- colorTag: '#26A69A',
- backgroundImage: '#2A2E39',
- colorNewMessages: '#26A69A',
- backgroundScrollCounter: '#26A69A',
- colorScrollCounter: '#131722',
+ background: '#141414',
+ backgroundMe: '#089981',
+ color: '#dbdbdb',
+ colorStarted: '#8a8a8a',
+ backgroundDeleted: '#0f0f0f',
+ backgroundSelected: '#2e2e2e',
+ colorDeleted: '#8a8a8a',
+ colorUsername: '#8a8a8a',
+ colorTimestamp: '#8a8a8a',
+ backgroundDate: 'rgba(0, 0, 0, 0.4)',
+ colorDate: '#8a8a8a',
+ backgroundSystem: 'rgba(0, 0, 0, 0.4)',
+ colorSystem: '#8a8a8a',
+ backgroundMedia: 'rgba(0, 0, 0, 0.2)',
+ backgroundReply: 'rgba(0, 0, 0, 0.2)',
+ colorReplyUsername: '#dbdbdb',
+ colorReply: '#b8b8b8',
+ colorTag: '#089981',
+ backgroundImage: '#1c1c1c',
+ colorNewMessages: '#089981',
+ backgroundScrollCounter: '#089981',
+ colorScrollCounter: '#0f0f0f',
backgroundReaction: 'none',
borderStyleReaction: 'none',
- backgroundReactionHover: '#2A2E39',
+ backgroundReactionHover: '#2e2e2e',
borderStyleReactionHover: 'none',
- colorReactionCounter: '#D3D4DC',
- backgroundReactionMe: '#26A69A',
+ colorReactionCounter: '#dbdbdb',
+ backgroundReactionMe: '#089981',
borderStyleReactionMe: 'none',
- backgroundReactionHoverMe: '#26A69A',
+ backgroundReactionHoverMe: '#089981',
borderStyleReactionHoverMe: 'none',
- colorReactionCounterMe: '#131722',
- backgroundAudioRecord: '#EF5350',
+ colorReactionCounterMe: '#0f0f0f',
+ backgroundAudioRecord: '#f23645',
backgroundAudioLine: 'rgba(255, 255, 255, 0.15)',
- backgroundAudioProgress: '#26A69A',
- backgroundAudioProgressSelector: '#26A69A',
- colorFileExtension: '#787B86'
+ backgroundAudioProgress: '#089981',
+ backgroundAudioProgressSelector: '#089981',
+ colorFileExtension: '#8a8a8a'
},
markdown: {
- background: 'rgba(42, 46, 57, 0.8)',
- border: 'rgba(55, 60, 74, 0.9)',
- color: '#26A69A',
- colorMulti: '#D3D4DC'
+ background: 'rgba(28, 28, 28, 0.9)',
+ border: 'rgba(46, 46, 46, 0.9)',
+ color: '#089981',
+ colorMulti: '#dbdbdb'
},
room: {
- colorUsername: '#D3D4DC',
- colorMessage: '#787B86',
- colorTimestamp: '#787B86',
- colorStateOnline: '#26A69A',
- colorStateOffline: '#787B86',
- backgroundCounterBadge: '#26A69A',
- colorCounterBadge: '#131722'
+ colorUsername: '#dbdbdb',
+ colorMessage: '#8a8a8a',
+ colorTimestamp: '#8a8a8a',
+ colorStateOnline: '#089981',
+ colorStateOffline: '#8a8a8a',
+ backgroundCounterBadge: '#089981',
+ colorCounterBadge: '#0f0f0f'
},
emoji: {
- background: '#2A2E39'
+ background: '#1c1c1c'
},
icons: {
- search: '#787B86',
- add: '#D3D4DC',
- toggle: '#D3D4DC',
- menu: '#D3D4DC',
- close: '#787B86',
- closeImage: '#D3D4DC',
- file: '#26A69A',
- paperclip: '#787B86',
- closeOutline: '#D3D4DC',
- closePreview: '#D3D4DC',
- send: '#26A69A',
- sendDisabled: '#787B86',
- emoji: '#787B86',
- emojiReaction: '#787B86',
- document: '#26A69A',
- pencil: '#787B86',
- checkmark: '#787B86',
- checkmarkSeen: '#26A69A',
- eye: '#D3D4DC',
- dropdownMessage: '#D3D4DC',
- dropdownMessageBackground: 'rgba(0, 0, 0, 0.3)',
- dropdownRoom: '#D3D4DC',
- dropdownScroll: '#2A2E39',
- microphone: '#787B86',
- audioPlay: '#26A69A',
- audioPause: '#26A69A',
- audioCancel: '#EF5350',
- audioConfirm: '#26A69A'
+ search: '#8a8a8a',
+ add: '#dbdbdb',
+ toggle: '#dbdbdb',
+ menu: '#dbdbdb',
+ close: '#8a8a8a',
+ closeImage: '#dbdbdb',
+ file: '#089981',
+ paperclip: '#8a8a8a',
+ closeOutline: '#dbdbdb',
+ closePreview: '#dbdbdb',
+ send: '#089981',
+ sendDisabled: '#8a8a8a',
+ emoji: '#8a8a8a',
+ emojiReaction: '#8a8a8a',
+ document: '#089981',
+ pencil: '#8a8a8a',
+ checkmark: '#8a8a8a',
+ checkmarkSeen: '#089981',
+ eye: '#dbdbdb',
+ dropdownMessage: '#dbdbdb',
+ dropdownMessageBackground: 'rgba(0, 0, 0, 0.4)',
+ dropdownRoom: '#dbdbdb',
+ dropdownScroll: '#1c1c1c',
+ microphone: '#8a8a8a',
+ audioPlay: '#089981',
+ audioPause: '#089981',
+ audioCancel: '#f23645',
+ audioConfirm: '#089981'
}
-}))
+}
onMounted(() => {
wsManager.addHandler(handleMessage)
@@ -539,8 +536,7 @@ onUnmounted(() => {
:messages="JSON.stringify(messages)"
:messages-loaded="messagesLoaded"
:room-id="SESSION_ID"
- :theme="chatTheme"
- :styles="chatStyles"
+ :styles="JSON.stringify(chatStyles)"
:single-room="true"
:rooms-list-opened="false"
:show-add-room="false"