Merge pull request #2199 from thelounge/astorije/sign-in-logo
Add logo to the sign in page
This commit is contained in:
commit
f07a6db7ab
@ -1543,19 +1543,21 @@ part/quit messages where we don't load previews (adds a blank line otherwise) */
|
|||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
#loading-reload-container {
|
#loading-reload-container {
|
||||||
flex-grow: 0;
|
flex-grow: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.loading-logo-dark {
|
.logo-inverted {
|
||||||
display: none;
|
display: none; /* In dark themes, inverted logo must be used instead */
|
||||||
}
|
}
|
||||||
|
|
||||||
#sign-in label {
|
#sign-in label {
|
||||||
display: block;
|
display: block;
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
#sign-in .btn {
|
#sign-in .btn {
|
||||||
@ -1564,7 +1566,9 @@ part/quit messages where we don't load previews (adds a blank line otherwise) */
|
|||||||
|
|
||||||
#sign-in .error {
|
#sign-in .error {
|
||||||
color: #e74c3c;
|
color: #e74c3c;
|
||||||
|
display: none; /* This message gets displayed on error only */
|
||||||
margin-top: 1em;
|
margin-top: 1em;
|
||||||
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
#connect label {
|
#connect label {
|
||||||
@ -2319,6 +2323,10 @@ part/quit messages where we don't load previews (adds a blank line otherwise) */
|
|||||||
margin: 10px 0 !important;
|
margin: 10px 0 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#sign-in .btn {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
#connect .tls {
|
#connect .tls {
|
||||||
margin: 20px 0;
|
margin: 20px 0;
|
||||||
}
|
}
|
||||||
|
Before Width: | Height: | Size: 2.6 KiB After Width: | Height: | Size: 2.6 KiB |
@ -47,8 +47,8 @@
|
|||||||
<article id="windows">
|
<article id="windows">
|
||||||
<div id="loading" class="window active">
|
<div id="loading" class="window active">
|
||||||
<div id="loading-status-container">
|
<div id="loading-status-container">
|
||||||
<img src="img/logo-vertical-transparent-bg.svg" class="loading-logo-bright" alt="The Lounge" width="256" height="170">
|
<img src="img/logo-vertical-transparent-bg.svg" class="logo" alt="The Lounge" width="256" height="170">
|
||||||
<img src="img/logo-vertical-transparent-dark.svg" class="loading-logo-dark" alt="The Lounge" width="256" height="170">
|
<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>
|
<p id="loading-page-message"><a href="https://enable-javascript.com/" target="_blank" rel="noopener">Your JavaScript must be enabled.</a></p>
|
||||||
</div>
|
</div>
|
||||||
<div id="loading-reload-container">
|
<div id="loading-reload-container">
|
||||||
|
@ -22,11 +22,11 @@ body {
|
|||||||
color: #ccc;
|
color: #ccc;
|
||||||
}
|
}
|
||||||
|
|
||||||
.loading-logo-bright {
|
.logo {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.loading-logo-dark {
|
.logo-inverted {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -23,11 +23,11 @@ body {
|
|||||||
color: #dcdccc;
|
color: #dcdccc;
|
||||||
}
|
}
|
||||||
|
|
||||||
.loading-logo-bright {
|
.logo {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.loading-logo-dark {
|
.logo-inverted {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1,23 +1,18 @@
|
|||||||
<form class="container" method="post" action="">
|
<form class="container" method="post" action="">
|
||||||
<div class="row">
|
<img src="img/logo-vertical-transparent-bg.svg" class="logo" alt="The Lounge" width="256" height="170">
|
||||||
<div class="col-xs-12">
|
<img src="img/logo-vertical-transparent-bg-inverted.svg" class="logo-inverted" alt="The Lounge" width="256" height="170">
|
||||||
<h1 class="title">Sign in to The Lounge</h1>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12">
|
|
||||||
<label>
|
<label>
|
||||||
Username
|
Username
|
||||||
<input class="input" name="user" autofocus>
|
<input class="input" name="user" autofocus>
|
||||||
</label>
|
</label>
|
||||||
</div>
|
|
||||||
<div class="col-xs-12">
|
|
||||||
<label>
|
<label>
|
||||||
Password
|
Password
|
||||||
<input class="input" type="password" name="password">
|
<input class="input" type="password" name="password">
|
||||||
</label>
|
</label>
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 error" style="display: none;">Authentication failed.</div>
|
<div class="error">Authentication failed.</div>
|
||||||
<div class="col-xs-12">
|
|
||||||
<button type="submit" class="btn">Sign in</button>
|
<button type="submit" class="btn">Sign in</button>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</form>
|
</form>
|
||||||
|
Loading…
Reference in New Issue
Block a user