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

Fix loading page styling

Browse Source
This commit is contained in:
Jérémie Astori 2019-02-15 01:40:42 -05:00
parent 013129da1f
commit 2657332919
No known key found for this signature in database
GPG Key ID: B9A4F245CD67BDE8
3 changed files with 23 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
client/css/style.css
View File

@ -888,8 +888,7 @@ background on hover (unless active) */
line-height: 1.5; line-height: 1.5;
} }
#loading, .window {
#windows .window {
background: var(--window-bg-color); background: var(--window-bg-color);
display: none; display: none;
overflow-y: auto; overflow-y: auto;
@ -899,7 +898,7 @@ background on hover (unless active) */
} }
#chat .chan, #chat .chan,
#windows .window { .window {
/* flexbox does not seem to scroll without doing this */ /* flexbox does not seem to scroll without doing this */
position: absolute; position: absolute;
bottom: 0; bottom: 0;
@ -1619,9 +1618,17 @@ part/quit messages where we don't load previews (adds a blank line otherwise) */
#loading { #loading {
font-size: 14px; font-size: 14px;
z-index: 1; height: 100%;
}
#loading .window {
height: initial;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
bottom: 5px;
left: 5px;
right: 5px;
top: 5px;
} }
#loading p { #loading p {

20
client/index.html.tpl
View File

@ -49,16 +49,18 @@
</head> </head>
<body class="signed-out<%- public ? " public" : "" %>" data-transports="<%- JSON.stringify(transports) %>"> <body class="signed-out<%- public ? " public" : "" %>" data-transports="<%- JSON.stringify(transports) %>">
<div id="loading"> <div id="loading">
<div id="loading-status-container"> <div class="window">
<img src="img/logo-vertical-transparent-bg.svg" class="logo" alt="The Lounge" width="256" height="170"> <div id="loading-status-container">
<img src="img/logo-vertical-transparent-bg-inverted.svg" class="logo-inverted" alt="The Lounge" width="256" height="170"> <img src="img/logo-vertical-transparent-bg.svg" class="logo" alt="The Lounge" width="256" height="170">
<p id="loading-page-message"><a href="https://enable-javascript.com/" target="_blank" rel="noopener">Your JavaScript must be enabled.</a></p> <img src="img/logo-vertical-transparent-bg-inverted.svg" class="logo-inverted" alt="The Lounge" width="256" height="170">
<p id="loading-page-message"><a href="https://enable-javascript.com/" target="_blank" rel="noopener">Your JavaScript must be enabled.</a></p>
</div>
<div id="loading-reload-container">
<p id="loading-slow">This is taking longer than it should, there might be connectivity issues.</p>
<button id="loading-reload" class="btn">Reload page</button>
</div>
<script async src="js/loading-error-handlers.js"></script>
</div> </div>
<div id="loading-reload-container">
<p id="loading-slow">This is taking longer than it should, there might be connectivity issues.</p>
<button id="loading-reload" class="btn">Reload page</button>
</div>
<script async src="js/loading-error-handlers.js"></script>
</div> </div>
<div id="viewport"></div> <div id="viewport"></div>

3
client/themes/default.css
View File

@ -6,7 +6,7 @@
padding-left: 0; padding-left: 0;
} }
#windows .window { .window {
border-radius: 5px; border-radius: 5px;
box-shadow: 0 0 25px rgba(0, 0, 0, 0.5); box-shadow: 0 0 25px rgba(0, 0, 0, 0.5);
} }
@ -17,7 +17,6 @@
padding: 0; padding: 0;
} }
#viewport #loading,
#viewport #sign-in { #viewport #sign-in {
margin-left: 0; margin-left: 0;
} }