third-party-mirrors/Discord-History-Tracker
1
0
Fork 0
mirror of https://github.com/chylex/Discord-History-Tracker.git synced 2025-06-14 14:22:32 +03:00
Code Issues Projects Releases Wiki Activity

Work on menu and channel list layout and styles in renderer

Browse Source
This commit is contained in:
chylex 2016-10-27 15:44:25 +02:00
parent a459943351
commit 178c230d2c
2 changed files with 45 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
src/renderer/scr.discord.js
View File

@ -5,9 +5,26 @@ var DISCORD = (function(){
return { return {
setup: function(){ setup: function(){
templateChannelServer = new TEMPLATE("<div data-channel='{id}'><strong class='name'>{name}</strong> <span class='msgcount'>({msgcount})</span><br><span class='server'>{server.name} ({server.type})</span></div>"); templateChannelServer = new TEMPLATE([
templateChannelPrivate = new TEMPLATE("<div data-channel='{id}'><strong class='name'>{name}</strong> <span class='msgcount'>({msgcount})</span><br><span class='server'>({server.type})</span></div>"); "<div data-channel='{id}'>",
templateMessage = new TEMPLATE("<div><h2><strong class='username'>{user.name}</strong><span class='time'>{timestamp}</span></h2><div class='message'>{contents}</div></div>"); "<div class='info'><strong class='name'>#{name}</strong><span class='msgcount'>{msgcount}</span></div>",
"<span class='server'>{server.name} ({server.type})</span>",
"</div>"
].join(""));
templateChannelPrivate = new TEMPLATE([
"<div data-channel='{id}'>",
"<div class='info'><strong class='name'>{name}</strong><span class='msgcount'>{msgcount}</span></div>",
"<span class='server'>({server.type})</span>",
"</div>"
].join(""));
templateMessage = new TEMPLATE([
"<div>",
"<h2><strong class='username'>{user.name}</strong><span class='time'>{timestamp}</span></h2>",
"<div class='message'>{contents}</div>",
"</div>"
].join(""));
}, },
getChannelHTML: function(channel){ getChannelHTML: function(channel){
@ -16,6 +33,7 @@ var DISCORD = (function(){
switch(value){ switch(value){
case "SERVER": return "server"; case "SERVER": return "server";
case "GROUP": return "group"; case "GROUP": return "group";
case "DM": return "user";
} }
} }
}); });

33
src/renderer/style.css
View File

@ -13,9 +13,9 @@ body {
} }
#menu { #menu {
width: 16vw; width: 15vw;
min-width: 225px; min-width: 215px;
max-width: 350px; max-width: 300px;
height: 100vh; height: 100vh;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -41,20 +41,35 @@ body {
#channels > div { #channels > div {
cursor: pointer; cursor: pointer;
color: #eee; color: #eee;
padding: 8px; padding: 10px 12px;
text-align: center; font-size: 15px;
} }
#channels > div:hover, #channels > div.active { #channels > div:hover, #channels > div.active {
background-color: #282B30; background-color: #282B30;
} }
#channels br { #channels .info {
margin-bottom: 3px; display: flex;
height: 16px;
margin-bottom: 4px;
} }
#channels .server { #channels .name {
font-size: 14px; flex-grow: 1;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
#channels .msgcount {
flex-shrink: 1;
background-color: rgba(255, 255, 255, 0.08);
border-radius: 4px;
margin-left: 4px;
margin-top: 1px;
padding: 2px 5px;
font-size: 11px;
} }
#messages { #messages {