How to style a WP Login:
function my_login_logo() {
// wp_enqueue_style( 'admin-css', get_template_directory_uri().'/admin.css' );
?>
<style>
body {
background: #ffffff !important;
/*background image start*/
background: url("<?php echo get_site_url(); ?>/wp-content/uploads/...") no-repeat center center fixed !important;
background-size: cover !important;
-moz-background-size: cover !important;
-o-background-size: cover !important;
-webkit-background-size: cover;
position: fixed;
top: 0;
left: 0;
z-index: 10;
overflow: hidden;
width: 100%;
height: 100%;
/*background image end*/
}
#login_error{
border-left:4px solid #dd3d36 !important;
}
.login .message{
border-left:4px solid #2ea2cc !important;
}
.login form {
margin-top: 20px;
margin-left: 0;
padding: 26px 24px 46px;
font-weight: 400;
overflow: hidden;
background: #0098db !important;
-webkit-box-shadow: none !important;
box-shadow: none !important;
;
}
input#wp-submit {
background: #ffffff !important;
border-color: #dddddd !important;
-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.15) !important;
box-shadow: inset 0 1px 0 rgba(255,255,255,0.15) !important;
color: #0098db !important;
}
#login h1 a {
background-image: url("<?php echo get_site_url(); ?>/wp-content/uploads/2017/12/activ-logo.svg");
background-size: cover !important;
background-position: center top;
background-repeat: no-repeat;
color: #999;
height: 130px !important;
font-size: 20px;
font-weight: 400;
line-height: 1.3em;
margin: 0 auto 20px;
padding: 0;
text-decoration: none;
width: 321px !important;
max-width: 320px;
text-indent: -9999px;
outline: 0;
overflow: hidden;
display: block;
}
label[for=user_login], label[for=user_pass], label[for=rememberme] {
color: #ffffff !important;
}
.login #nav {
margin: 24px 0 0;
display: none;
}
#backtoblog {
margin: 16px 0 0;
padding: 0 24px;
;
}
p#nav > a {
padding: 0 0 0 24px;
color: #d8d8d8 !important;
}
p#nav > a:hover {
padding: 0 0 0 24px;
color: #bababa !important;
}
#backtoblog a {
color: #d8d8d8 !important;
}
#backtoblog a:hover {
color: #bababa !important;
}
input[type=text]:focus,
input[type=search]:focus,
input[type=radio]:focus,
input[type=tel]:focus,
input[type=time]:focus,
input[type=url]:focus,
input[type=week]:focus,
input[type=password]:focus,
input[type=checkbox]:focus,
input[type=color]:focus,
input[type=date]:focus,
input[type=datetime]:focus,
input[type=datetime-local]:focus,
input[type=email]:focus,
input[type=month]:focus,
input[type=number]:focus,
select:focus,
textarea:focus {
border-color: #b51923 !important;
-webkit-box-shadow: 0 0 2px #b51923 !important;
box-shadow: 0 0 2px #b51923 !important;
}
.wp-core-ui .button-primary {
background: #b51923;
border-color: #b51923;
-webkit-box-shadow: 0 1px 0 #b51923;
box-shadow: 0 1px 0 #b51923;
color: #fff;
text-decoration: none;
text-shadow: none !important;
}
</style>
<?php }
add_action( 'login_enqueue_scripts', 'my_login_logo' );
// LOGO URL
add_filter( 'login_headerurl', 'custom_loginlogo_url' );
function custom_loginlogo_url($url) {
return get_site_url();
}