Yehowshua/ZIm
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improve chat rendering

Browse source
This commit is contained in:
Mikayla 2023-10-05 11:58:41 -07:00
parent 44ada52185
commit f57d563578
No known key found for this signature in database
3 changed files with 213 additions and 109 deletions
Download patch file Download diff file Expand all files Collapse all files

69
styles/src/style_tree/chat_panel.ts
View file

@ -5,6 +5,7 @@ import {
} from "./components"
import { icon_button } from "../component/icon_button"
import { useTheme } from "../theme"
import { interactive } from "../element"
export default function chat_panel(): any {
const theme = useTheme()
@ -27,11 +28,23 @@ export default function chat_panel(): any {
return {
background: background(layer),
list: {
margin: {
left: SPACING,
right: SPACING,
avatar: {
icon_width: 24,
icon_height: 24,
corner_radius: 4,
outer_width: 24,
outer_corner_radius: 16,
},
avatar_container: {
padding: {
right: 6,
left: 2,
top: 2,
bottom: 2,
}
},
list: {
},
channel_select: {
header: {
@ -79,6 +92,22 @@ export default function chat_panel(): any {
},
},
message: {
...interactive({
base: {
margin: { top: SPACING },
padding: {
top: 4,
bottom: 4,
left: SPACING / 2,
right: SPACING / 3,
}
},
state: {
hovered: {
background: background(layer, "hovered"),
},
},
}),
body: text(layer, "sans", "base"),
sender: {
margin: {
@ -87,7 +116,6 @@ export default function chat_panel(): any {
...text(layer, "sans", "base", { weight: "bold" }),
},
timestamp: text(layer, "sans", "base", "disabled"),
margin: { top: SPACING }
},
last_message_bottom_spacing: SPACING,
continuation_message: {
@ -99,7 +127,21 @@ export default function chat_panel(): any {
...text(layer, "sans", "base", { weight: "bold" }),
},
timestamp: text(layer, "sans", "base", "disabled"),
...interactive({
base: {
padding: {
top: 4,
bottom: 4,
left: SPACING / 2,
right: SPACING / 3,
}
},
state: {
hovered: {
background: background(layer, "hovered"),
},
},
}),
},
pending_message: {
body: text(layer, "sans", "base"),
@ -110,6 +152,21 @@ export default function chat_panel(): any {
...text(layer, "sans", "base", "disabled"),
},
timestamp: text(layer, "sans", "base"),
...interactive({
base: {
padding: {
top: 4,
bottom: 4,
left: SPACING / 2,
right: SPACING / 3,
}
},
state: {
hovered: {
background: background(layer, "hovered"),
},
},
}),
},
sign_in_prompt: {
default: text(layer, "sans", "base"),