supernets/hardlounge
supernets/hardlounge
4
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Make sidebar logo scroll with networks, wrap logos in div element

Browse Source
This commit is contained in:
Jérémie Astori 2018-04-14 18:16:03 -04:00
parent bff38efd50
commit 8137ece450
No known key found for this signature in database
GPG Key ID: B9A4F245CD67BDE8
2 changed files with 25 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
client/css/style.css
View File

@ -501,6 +501,18 @@ kbd {
width: 220px;
}
#sidebar .scrollable-area {
overflow-x: auto;
flex-grow: 1;
touch-action: pan-y;
overscroll-behavior: contain;
-webkit-overflow-scrolling: touch;
}
#sidebar .logo-container {
text-align: center;
}
#sidebar .logo,
#sidebar .logo-inverted {
height: 45px;
@ -559,12 +571,6 @@ background on hover (unless active) */
#sidebar .networks {
padding-top: 5px;
touch-action: pan-y;
overscroll-behavior: contain;
-webkit-overflow-scrolling: touch;
flex-grow: 1;
overflow: auto;
overflow-x: hidden;
}
#sidebar .networks:empty {
@ -2278,6 +2284,10 @@ part/quit messages where we don't load previews (adds a blank line otherwise) */
opacity: 0;
}
#sidebar .logo-container {
margin-top: 5px;
}
#sidebar button,
#sidebar .chan,
#sidebar .empty,

6
client/index.html.tpl
View File

@ -50,11 +50,15 @@
<body class="signed-out<%- public ? " public" : "" %>" data-transports="<%- JSON.stringify(transports) %>">
<div id="viewport" role="tablist">
<aside id="sidebar">
<div class="scrollable-area">
<div class="logo-container">
<img src="img/logo-<%- public ? 'horizontal-' : '' %>transparent-bg.svg" class="logo" alt="The Lounge">
<img src="img/logo-<%- public ? 'horizontal-' : '' %>transparent-bg-inverted.svg" class="logo-inverted" alt="The Lounge">
</div>
<div class="networks"></div>
<div class="empty">
You're not connected to any networks yet.
You are not connected to any networks yet.
</div>
</div>
<footer id="footer">
<span class="tooltipped tooltipped-n tooltipped-no-touch" aria-label="Sign in"><button class="icon sign-in" data-target="#sign-in" aria-label="Sign in" role="tab" aria-controls="sign-in" aria-selected="false"></button></span>