mirror of
https://github.com/LingChair/LingChair-V0.git
synced 2025-12-08 01:55:50 +08:00
68 lines
2.9 KiB
HTML
68 lines
2.9 KiB
HTML
<!doctype html>
|
|
<html lang="zh-cmn-Hans">
|
|
<!--
|
|
* 铃之椅 - 把选择权还给用户, 让聊天权掌握在用户手中
|
|
* Copyright 2024 满月叶
|
|
* GitHub: https://github.com/MoonLeeeaf/LingChair-Web-Client
|
|
* 本项目使用 Apache 2.0 协议开源
|
|
*
|
|
* Copyright 2024 MoonLeeeaf
|
|
*
|
|
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
* you may not use this file except in compliance with the License.
|
|
* You may obtain a copy of the License at
|
|
*
|
|
* http://www.apache.org/licenses/LICENSE-2.0
|
|
*
|
|
* Unless required by applicable law or agreed to in writing, software
|
|
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
* See the License for the specific language governing permissions and
|
|
* limitations under the License.
|
|
-->
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, shrink-to-fit=no" />
|
|
<meta name="renderer" content="webkit" />
|
|
<meta name="force-rendering" content="webkit" />
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
|
|
|
|
<!-- MDUI CSS -->
|
|
<link rel="stylesheet" href="https://unpkg.com/mdui@1.0.2/dist/css/mdui.min.css" />
|
|
<link rel="stylesheet" href="chat-message.css" />
|
|
<script src="https://unpkg.com/jquery@3.7.1/dist/jquery.min.js"></script>
|
|
<link rel="icon" href="icon.ico" />
|
|
<title>聊天气泡测试</title>
|
|
</head>
|
|
|
|
<body class="mdui-theme-teal mdui-theme-layout-auto mdui-theme-accent-teal">
|
|
|
|
<!-- 右侧样式 -->
|
|
<div class="chat-message">
|
|
<div class="message-content-with-nickname-right">
|
|
<span class="nickname">小沫</span>
|
|
<div class="message-content mdui-card">
|
|
<span>你好！这是一条较长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长的消息内容，测试消息长度自动填充效果。</span>
|
|
</div>
|
|
</div>
|
|
<img class="avatar" src="icon.ico" alt="Avatar">
|
|
</div>
|
|
|
|
<!-- 左侧样式 -->
|
|
<div class="chat-message">
|
|
<img class="avatar" src="icon.ico" alt="Avatar">
|
|
<div class="message-content-with-nickname-left">
|
|
<span class="nickname">小沫</span>
|
|
<div class="message-content mdui-card">
|
|
<span>你好！这是一条较长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长的消息内容，测试消息长度自动填充效果。</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- MDUI JavaScript -->
|
|
<script src="https://unpkg.com/mdui@1.0.2/dist/js/mdui.min.js"></script>
|
|
<script src="index.js"></script>
|
|
</body>
|
|
|
|
</html> |