136 lines
4.4 KiB
HTML
136 lines
4.4 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>ChatRD</title>
|
|
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap">
|
|
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@7.0.0/css/fontawesome.min.css">
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/simple-notify@1.0.4/dist/simple-notify.min.css">
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/animate.css@4.1.1/animate.min.css">
|
|
|
|
<link rel="stylesheet" href="css/chatrd.css">
|
|
</head>
|
|
<body>
|
|
|
|
<div id="statistics">
|
|
<div class="platform" id="twitch">
|
|
<img src="images/logo-twitch.svg" alt="">
|
|
<span class="viewers"><i class="fa-solid fa-user"></i> <span>0</span></span>
|
|
</div>
|
|
|
|
<div class="platform" id="youtube">
|
|
<img src="images/logo-youtube.svg" alt="">
|
|
<span class="viewers"><i class="fa-solid fa-user"></i> <span>0</span></span>
|
|
<span class="likes"><i class="fa-solid fa-thumbs-up"></i> <span>0</span></span>
|
|
</div>
|
|
|
|
<div class="platform" id="tiktok">
|
|
<img src="images/logo-tiktok.svg" alt="">
|
|
<span class="viewers"><i class="fa-solid fa-user"></i> <span>0</span></span>
|
|
<span class="likes"><i class="fa-solid fa-heart"></i> <span>0</span></span>
|
|
</div>
|
|
|
|
<div class="platform" id="kick">
|
|
<img src="images/logo-kick.svg" alt="">
|
|
<span class="viewers"><i class="fa-solid fa-user"></i> <span>0</span></span>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div id="container">
|
|
<div class="wrapper">
|
|
<div id="chat">
|
|
|
|
</div>
|
|
|
|
|
|
<!--<div id="chat-input">
|
|
<div id="chat-autocomplete-list"></div>
|
|
|
|
<form>
|
|
<input type="text">
|
|
</form>
|
|
|
|
<button id="chat-input-send"><i class="fa-solid fa-paper-plane"></i></button>
|
|
</div>-->
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<template id="chat-message">
|
|
|
|
<div id="" data-user="" class="item">
|
|
|
|
<div class="header">
|
|
<div class="first-message">✨</div>
|
|
<div class="shared-chat"></div>
|
|
</div>
|
|
|
|
<div class="body">
|
|
<div class="profile">
|
|
<img src="" alt="">
|
|
</div>
|
|
|
|
<div class="message">
|
|
<div class="info">
|
|
<span class="time"></span>
|
|
<span class="platform"></span>
|
|
<span class="badges"></span>
|
|
<span class="user"></span>
|
|
</div>
|
|
<div class="actual-message">
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<template id="event-message">
|
|
|
|
<div id="" data-user="" class="event">
|
|
|
|
<div class="header">
|
|
<div class="image"></div>
|
|
</div>
|
|
|
|
<div class="body">
|
|
<div class="message">
|
|
<div class="info">
|
|
<span class="platform"></span>
|
|
<span class="user"></span>
|
|
<span class="action"></span>
|
|
<span class="value"></span>
|
|
</div>
|
|
<div class="actual-message"></div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@7.0.0/js/fontawesome.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/simple-notify@1.0.4/dist/simple-notify.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/dompurify@3.2.6/dist/purify.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/@streamerbot/client@1.12.1/dist/streamerbot-client.min.js"></script>
|
|
|
|
<script src="js/lang.js"></script>
|
|
<script src="js/sb.js"></script>
|
|
<script src="js/chatrd.js"></script>
|
|
</body>
|
|
</html> |