Temporary loginOffline styles fixes
This commit is contained in:
parent
9c69a99f7e
commit
b038b30ec6
@ -677,6 +677,72 @@ body, button {
|
|||||||
display: initial;
|
display: initial;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Login Offline button styles. */
|
||||||
|
#loginOfflineButton {
|
||||||
|
background: none;
|
||||||
|
font-weight: bold;
|
||||||
|
letter-spacing: 2px;
|
||||||
|
border: none;
|
||||||
|
padding: 15px 5px;
|
||||||
|
margin: 10px 0px;
|
||||||
|
cursor: pointer;
|
||||||
|
position: relative;
|
||||||
|
right: -20px;
|
||||||
|
transition: 0.5s ease;
|
||||||
|
}
|
||||||
|
#loginOfflineutton:disabled {
|
||||||
|
color: rgba(255, 255, 255, 0.75);
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
#loginOfflineButton[loading] {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
#loginOfflineButton:hover,
|
||||||
|
#loginOfflineButton:focus {
|
||||||
|
text-shadow: 0px 0px 20px #fff;
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
#loginOfflineButton:active {
|
||||||
|
color: #c7c7c7;
|
||||||
|
text-shadow: 0px 0px 20px #c7c7c7;
|
||||||
|
}
|
||||||
|
#loginSVG {
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
overflow: visible;
|
||||||
|
transform: rotate(90deg);
|
||||||
|
margin-left: 20px;
|
||||||
|
transition: 0.25s ease;
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
}
|
||||||
|
#loginOfflineButton:hover #loginSVG,
|
||||||
|
#loginOfflineButton:focus #loginSVG {
|
||||||
|
-webkit-filter: drop-shadow(0px 0px 2px #fff);
|
||||||
|
}
|
||||||
|
#loginOfflineButton:active #loginSVG .arrowLine {
|
||||||
|
stroke: #c7c7c7;
|
||||||
|
}
|
||||||
|
#loginOfflineButton:active #loginSVG {
|
||||||
|
-webkit-filter: drop-shadow(0px 0px 2px #c7c7c7);
|
||||||
|
}
|
||||||
|
#loginOfflineButton:disabled #loginSVG .arrowLine {
|
||||||
|
stroke: rgba(255, 255, 255, 0.75);
|
||||||
|
}
|
||||||
|
|
||||||
|
#loginOfflineButtonContent {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#loginOfflineButton .circle-loader,
|
||||||
|
#loginOfflineButton[loading] #loginSVG {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
#loginOfflineButton[loading] .circle-loader,
|
||||||
|
#loginOfflineButton #loginSVG {
|
||||||
|
display: initial;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
.circle-loader {
|
.circle-loader {
|
||||||
margin-left: 20px;
|
margin-left: 20px;
|
||||||
|
@ -6,12 +6,12 @@
|
|||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div id="loginContent">
|
<div id="loginContent">
|
||||||
<form id="loginForm">
|
<form id="loginForm" style="margin-top: 2.5em;">
|
||||||
<span id="loginSubheader">OFFLINE LOGIN</span>
|
<span id="loginSubheader">OFFLINE LOGIN</span>
|
||||||
<div class="loginFieldContainer">
|
<div class="loginFieldContainer">
|
||||||
<input id="loginOfflineUsername" class="loginField" type="text" placeholder="USERNAME"/>
|
<input id="loginOfflineUsername" class="loginField" type="text" placeholder="USERNAME"/>
|
||||||
</div>
|
</div>
|
||||||
<button id="loginOfflineButton" enabled>
|
<button id="loginOfflineButton" class="loginButton" enabled>
|
||||||
<div id="loginOfflineButtonContent">
|
<div id="loginOfflineButtonContent">
|
||||||
LOGIN
|
LOGIN
|
||||||
<svg id="loginSVG" viewBox="0 0 24.87 13.97">
|
<svg id="loginSVG" viewBox="0 0 24.87 13.97">
|
||||||
|
Loading…
Reference in New Issue
Block a user