supernets/hardlounge
supernets/hardlounge
4
Fork 0
Code Issues 1 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; 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,
#sidebar .logo-inverted { #sidebar .logo-inverted {
height: 45px; height: 45px;
@ -559,12 +571,6 @@ background on hover (unless active) */
#sidebar .networks { #sidebar .networks {
padding-top: 5px; 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 { #sidebar .networks:empty {
@ -2278,6 +2284,10 @@ part/quit messages where we don't load previews (adds a blank line otherwise) */
opacity: 0; opacity: 0;
} }
#sidebar .logo-container {
margin-top: 5px;
}
#sidebar button, #sidebar button,
#sidebar .chan, #sidebar .chan,
#sidebar .empty, #sidebar .empty,

14
client/index.html.tpl
View File

@ -50,11 +50,15 @@
<body class="signed-out<%- public ? " public" : "" %>" data-transports="<%- JSON.stringify(transports) %>"> <body class="signed-out<%- public ? " public" : "" %>" data-transports="<%- JSON.stringify(transports) %>">
<div id="viewport" role="tablist"> <div id="viewport" role="tablist">
<aside id="sidebar"> <aside id="sidebar">
<img src="img/logo-<%- public ? 'horizontal-' : '' %>transparent-bg.svg" class="logo" alt="The Lounge"> <div class="scrollable-area">
<img src="img/logo-<%- public ? 'horizontal-' : '' %>transparent-bg-inverted.svg" class="logo-inverted" alt="The Lounge"> <div class="logo-container">
<div class="networks"></div> <img src="img/logo-<%- public ? 'horizontal-' : '' %>transparent-bg.svg" class="logo" alt="The Lounge">
<div class="empty"> <img src="img/logo-<%- public ? 'horizontal-' : '' %>transparent-bg-inverted.svg" class="logo-inverted" alt="The Lounge">
You're not connected to any networks yet. </div>
<div class="networks"></div>
<div class="empty">
You are not connected to any networks yet.
</div>
</div> </div>
<footer id="footer"> <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> <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>