Skip to content

Instantly share code, notes, and snippets.

@lordfriend
Created July 30, 2016 15:03
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save lordfriend/d48f0c1f407c1c2d3154a25477dbc4ec to your computer and use it in GitHub Desktop.
Save lordfriend/d48f0c1f407c1c2d3154a25477dbc4ec to your computer and use it in GitHub Desktop.
Deneb login page hack
@media (min-width: 723px) {
.center-box {
width: 360px !important;
margin-left: 10%;
}
.center-box-header {
position: fixed;
top: 0.8rem;
left: 1.2rem;
color: #f6f6f6;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif
}
.center-box-body {
background: rgba(256, 256, 256, 0.2);
border-radius: 8px;
}
.center-box-body input[type="text"],
.center-box-body input[type="password"] {
background: rgba(256, 256, 256, 0.3) !important;
color: #f6f6f6 !important;
}
.center-box-body input[type="text"]:focus,
.center-box-body input[type="password"]:focus {
background: rgba(256, 256, 256, 0.3) !important;
color: #ffffff !important;
}
/* placeholder */
.center-box-body input::-webkit-input-placeholder {
color: #98b1bf !important;
}
.center-box-body input::-moz-placeholder {
color: #98b1bf !important;
}
.center-box-body input:-ms-input-placeholder {
color: #98b1bf !important;
}
/* focus placeholder */
.center-box input:focus::-webkit-input-placeholder {
color: #a9c5d4 !important;
}
.center-box input:focus::-moz-placeholder {
color: #a9c5d4 !important;
}
.center-box input:focus:-ms-input-placeholder {
color: #a9c5d4 !important;
}
/* Error Placeholder */
.center-box .ui.form .error input::-webkit-input-placeholder {
color: #da9796 !important;
}
.center-box .ui.form .error input::-moz-placeholder {
color: #da9796 !important;
}
.center-box .ui.form .error input:-ms-input-placeholder {
color: #da9796 !important;
}
/* Focused Error Placeholder */
.center-box .ui.form .error input:focus::-webkit-input-placeholder {
color: #c65f5d !important;
}
.center-box .ui.form .error input:focus::-moz-placeholder {
color: #c65f5d !important;
}
.center-box .ui.form .error input:focus:-ms-input-placeholder {
color: #c65f5d !important;
}
.center-box-body .ui.form .field.field input:-webkit-autofill,
.center-box-body .ui.form .field.field input:-webkit-autofill:hover,
.center-box-body .ui.form .field.field input:-webkit-autofill:focus {
box-shadow: 0 0 0 100px rgba(255, 232, 149, 0.4) inset !important;
-webkit-box-shadow: 0 0 0 100px rgba(255, 232, 149, 0.4) inset !important;
transition: background-color 9999s ease-in-out 0s;
color: #ffffff !important;
-webkit-text-fill-color: #ffffff !important;
}
.center-box-body .ui.primary.button {
background-color: rgba(75, 159, 208, 0.6);
}
#remember-login label {
color: #f6f6f6;
}
#remember-login label:before {
background-color: rgba(256, 256, 256, 0.3);
}
#remember-login label:after {
color: #ffffff;
}
.additional-info {
font-size: 1rem;
position: absolute;
top: 0;
}
.forget-link {
right: 1rem;
}
.register-link {
margin-top: 20px;
right: 8rem;
}
.login-link.additional-info {
right: 1rem;
margin-top: 20px;
}
.additional-info > a {
color: #efefef !important;
padding: 0.5rem 0.8rem;
border-radius: 4px;
background-color: rgba(103, 128, 153, 0.8);
box-shadow: 0 0 3px rgba(256, 256, 256, 0.8);
}
.additional-info > a:hover {
color: #ffffff !important;
background-color: rgba(71, 143, 153, 0.8);
}
.center-box-frame {
justify-content: flex-start !important;
margin-top: -10rem;
}
.center-box-background {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: flex;
flex-direction: column;
justify-content: center;
background-color: #0e144e;
background: url('../img/background.jpg') no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
.center-box-background:before {
content: " ";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 4rem;
background-color: rgba(256, 256, 256, 0.2);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment