CrescentLeaf/LingChair
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

chore: 重构旧前端

Browse Source
This commit is contained in:
CrescentLeaf
2025-04-13 23:30:05 +08:00
parent fdf6987889
commit c03649d705
5 changed files with 110 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
client/ui/App.jsx
View File

@@ -1,5 +1,7 @@
export default function App() {
return (
<div></div>
<div>
</div>
)
}

3
client/ui/chat/ChatFragment.jsx Normal file
View File

@@ -0,0 +1,3 @@
export default function ChatFragment() {
}

67
client/ui/chat/Message.jsx Normal file
View File

@@ -0,0 +1,67 @@
export default function Message({ direction = 'left', children }) {
return (
<div
slot="trigger"
style={{
width: "100%",
display: "flex",
justifyContent: "flex-start",
flexDirection: "column"
}}>
<div
style={{
display: "flex",
justifyContent: "flex-start"
}}>
{
// 发送者昵称(左)
direction == 'left' && <span
style={{
alignSelf: "center",
fontSize: "90%"
}}></span>
}
{
// 发送者头像
}
<mdui-avatar
style={{
width: "43px",
height: "43px",
margin: "11px"
}}>
</mdui-avatar>
{
// 发送者昵称(右)
direction == 'right' && <span
style={{
alignSelf: "center",
fontSize: "90%"
}}>
</span>
}
</div>
<mdui-card
variant="elevated"
style={{
maxWidth: (window.matchMedia('(pointer: fine)') && "50%") || (window.matchMedia('(pointer: coarse)') && "77%"),
minWidth: "0%",
marginLeft: "55px",
marginTop: "-5px",
padding: "15px",
alignSelf: "flex-start"
}}>
{
// 消息内容
children
}
<span
id="msg"
style={{
fontSize: "94%"
}}>
</span>
</mdui-card>
</div>
)
}

14
client/ui/chat/MessageContainer.jsx Normal file
View File

@@ -0,0 +1,14 @@
export default function MessageContainer({ children }) {
return (
<div style={{
display: 'flex',
flexDirection: 'column',
justifyContent: 'flex-end',
alignItems: 'center',
paddingTop: '10px',
paddingBottom: '14px'
}}>
{children}
</div>
)
}

23
client/ui/chat/SystemMessage.jsx Normal file
View File

@@ -0,0 +1,23 @@
export default function SystemMessage({ children }) {
return (
<div style={{
width: '100%',
flexDirection: 'column',
display: 'flex',
marginTop: '25px',
marginBottom: '20px',
}}>
<mdui-card variant="filled"
style={{
alignSelf: 'center',
paddingTop: '9px',
paddingBottom: '9px',
paddingLeft: '18px',
paddingRight: '18px',
fontSize: '92%',
}}>
{children}
</mdui-card>
</div>
)
}