This commit is contained in:
sShemet
2025-12-31 16:57:55 +05:00
parent ade2833df7
commit d114970eec
8 changed files with 149 additions and 208 deletions

View File

@@ -1,125 +1,80 @@
<!DOCTYPE html>
<head>
<meta charset="utf-8" />
<title>template</title>
<title>SSH UltraChat</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto+Condensed">
<style>
body {
margin: 0;
padding: 0;
background-color: #494949;
display: flex;
align-items: flex-start;
justify-content: center;
height: 100vh;
font-family: "Roboto Condensed", sans-serif;
color: #fff;
}
body {
#chatwin {
height: 80vh;
max-width: 500px;
min-width: 150px;
display: flex;
flex-direction: column;
padding: 10px;
position: relative;
}
background-color: #494949;
.chatRow {
display: flex;
flex-direction: row;
margin-bottom: 5px;
width: 100%;
}
display: flex;
align-items: center;
justify-content: center;
align-content: flex-end;
font-family: "Roboto Condensed", sans-serif;
font-size: 1em;
letter-spacing: 0.1px;
color: lighter;
text-rendering: optimizeLegibility;
text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
-webkit-font-smoothing: antialiased;
}
.nameline {
color: white;
padding: 5px;
width: 25%;
text-align: center;
font-weight: bold;
}
#chatwin {
/* color: white; */
height: 100%;
min-width: 150px;
max-width: 500px;
display: flex;
flex-direction: column;
}
.msgline {
padding: 5px;
width: 75%;
color: #fff;
}
/* Сохраняем оригинальные стили фона */
.yt {
background-image: url('data:image/svg+xml,<svg width="40" height="40" viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg"><g fill="%239C92AC" fill-opacity="0.4" fill-rule="evenodd"><path d="M0 40L40 0H20L0 20M40 40V20L20 40"/></g></svg>');
background-color: #E53935A0;
}
.chatRow {
display: flex;
flex-direction: row;
margin-bottom: 1px;
.tg {
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><g fill-rule="evenodd"><g fill="%239C92AC" fill-opacity="0.4"><path opacity=".5" d="M96 95h4v1h-4v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9zm-1 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-9-10h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm9-10v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-9-10h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9z"/><path d="M6 5V0H5v5H0v1h5v94h1V6h94V5H6z"/></g></g></svg>');
background-color: #2196F3A0;
}
}
.tw {
background-color: #6034b2A0 ;
background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='60' viewBox='0 0 20 12'><g fill-rule='evenodd'><g id='charlie-brown' fill='%236441a5' fill-opacity='0.35'><path d='M9.8 12L0 2.2V.8l10 10 10-10v1.4L10.2 12h-.4zm-4 0L0 6.2V4.8L7.2 12H5.8zm8.4 0L20 6.2V4.8L12.8 12h1.4zM9.8 0l.2.2.2-.2h-.4zm-4 0L10 4.2 14.2 0h-1.4L10 2.8 7.2 0H5.8z'/></g></g></svg>");
}
.nameline {
color: white;
padding: 5px;
width: 25%;
text-align: center;
display: flex;
justify-content: center;
align-items: center;
font-weight: bold;
flex-direction: column;
vertical-align: auto;
}
.donate {
background-image: url('back-coin.jpg');
color: black !important;
}
.yt {
background-image: url('data:image/svg+xml,<svg width="40" height="40" viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg"><g fill="%239C92AC" fill-opacity="0.4" fill-rule="evenodd"><path d="M0 40L40 0H20L0 20M40 40V20L20 40"/></g></svg>');
background-color: #E53935A0;
}
.tg {
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><g fill-rule="evenodd"><g fill="%239C92AC" fill-opacity="0.4"><path opacity=".5" d="M96 95h4v1h-4v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9zm-1 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-9-10h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm9-10v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-9-10h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm9-10v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-9-10h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm9-10v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-9-10h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9z"/><path d="M6 5V0H5v5H0v1h5v94h1V6h94V5H6z"/></g></g></svg>');
background-color: #2196F3A0;
}
.tw {
background-color: #6034b2A0 ;
background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='60' viewBox='0 0 20 12'><g fill-rule='evenodd'><g id='charlie-brown' fill='%236441a5' fill-opacity='0.35'><path d='M9.8 12L0 2.2V.8l10 10 10-10v1.4L10.2 12h-.4zm-4 0L0 6.2V4.8L7.2 12H5.8zm8.4 0L20 6.2V4.8L12.8 12h1.4zM9.8 0l.2.2.2-.2h-.4zm-4 0L10 4.2 14.2 0h-1.4L10 2.8 7.2 0H5.8z'/></g></g></svg>");
}
/* <svg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'><rect fill='#6441A5' width='120' height='120'/><polygon fill='#5C3C98' fill-opacity='1' points='120 120 60 120 90 90 120 60 120 0 120 0 60 60 0 0 0 60 30 90 60 120 120 120 '/></svg> */
.donate {
background-image: url('back-coin.jpg');
/* background-size: 500px; */
color: black !important;
}
.hello {
background-color: #00bb77;
background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='59' height='59' viewBox='0 0 120 120'><polygon fill='%23000' fill-opacity='0.11' points='120 0 120 60 90 30 60 0 0 0 0 0 60 60 0 120 60 120 90 90 120 60 120 0'/></svg>");
}
.msgline {
padding: 5px;
width: 75%;
color: #fff;
}
</style>
.hello {
background-color: #00bb77;
background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='59' height='59' viewBox='0 0 120 120'><polygon fill='%23000' fill-opacity='0.11' points='120 0 120 60 90 30 60 0 0 0 0 0 60 60 0 120 60 120 90 90 120 60 120 0'/></svg>");
}
</style>
</head>
<body>
<div id="chatwin">
<!--
<div idd="1" class="chatRow">
<div class="nameline tg">Edvard Force</div>
<div class="msgline">вот Тенчу Великому зашла , он в ней быстро разобрался и втащил за один стрим )))) ждем когда до нее доберется ))))</div>
</div>
<div idd="2" class="chatRow">
<div class="nameline tg" >Диванный Воин</div>
<div class="msgline">dc или если ты действительно решишь дать бан то мышкой два клика не сделаешь?</div>
</div>
<div idd="3" class="chatRow">
<div class="nameline tg">Yoshka's Cat</div>
<div class="msgline">великий ну эта часть ванпис лутьше чем вариорсы надо признать</div>
</div>
<div idd="4" class="chatRow">
<div class="nameline yt">XAOSHammer</div>
<div class="msgline">Великий а куда друг твой пропал спец по японскому языку ?))))</div>
</div>
<div idd="5" class="chatRow">
<div class="nameline tg">Kino Konformist</div>
<div class="msgline">вот Тенчу Великому зашла , он в ней быстро разобрался и втащил за один стрим )))) ждем когда до нее доберется ))))</div>
</div>
-->
<div id="anchor"></div>
</div>
<div id="chatwin"></div>
<script src="script.js"></script>
</body>