LogalDeveloper/owncast
0
Fork 0
Code Activity

style message items

Browse Source
This commit is contained in:
Ginger Wong
2020-06-09 14:12:50 -07:00
parent 6da9b7c889
commit 21c3520e00
3 changed files with 28 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
webroot/index.html
View File

@@ -53,19 +53,17 @@
<div id="chat-container"> <div id="chat-container">
<div id="messages-container"> <div id="messages-container">
<div v-for="(message, index) in messages"> <div v-for="(message, index) in messages">
<div class="bg-white shadow-md px-8 pt-6 pb-8 mb-4">
<div class="flex items-center"> <div class="message flex">
<img <img
v-bind:src="message.image" v-bind:src="message.image"
class="w-10 h-10 rounded-full mr-4 border-black-500" class="message-avatar rounded-full"
style="padding: 5px; background-color: #ececec;"
/> />
<div class="text-sm"> <div class="message-content">
<p class="text-700">{{ message.author }}</p> <p class="message-author">{{ message.author }}</p>
<p class="text-gray-600"v-html="message.linkedText()"></p> <p class="message-text"v-html="message.linkedText()"></p>
</div> </div>
</div>
</div> </div>
</div> </div>
</div> </div>

2
webroot/js/app.js
View File

@@ -98,7 +98,7 @@ function setupWebsocket() {
setupApp() setupApp()
getStatus() getStatus()
setupWebsocket() // setupWebsocket()
// setInterval(getStatus, 5000) // setInterval(getStatus, 5000)
// HLS Video setup // HLS Video setup

22
webroot/styles/layout.css
View File

@@ -96,7 +96,27 @@ header h1 {
margin-bottom: 0; margin-bottom: 0;
} }
.message {
padding: .85em;
align-items: flex-start;
}
.message-avatar {
height: 2.5em;
width: 2.5em;
margin-right: .75em;
/* background-color: rgba(236, 236, 236, .5); */
background-color: rgba(0,0,0, .75);
}
.message-content {
font-size: .85em;
}
.message-author {
font-weight: 600;
}
.message-text {
color: #ccc;
font-weight: 100;
}
.no-chat .left-col { .no-chat .left-col {