Customizing the login page

[Milena]

I have wanted to customize the login page css for a while now, and recently found out that this css is hard coded in theme-functions.php. I added my own css there and it worked almost perfectly.
But since I want to save these changes from updates, I pasted this code (with my own edits) into my functions.php

 /**
 * Custom Login Logo
 *
 * @since BuddyBoss 1.0
 */

function buddyboss_custom_login_logo()
{
    $logo = get_theme_mod( 'buddyboss_logo', FALSE );
	
	/*convert from relative url to absolute url*/
	$scheme = is_ssl() ? 'https://' : 'http://';
	$logo_absolute_url = $scheme . @$_SERVER['HTTP_HOST'] . $logo;

    if ( $logo ) {
        if ( !0 ) {
            list( $width, $height ) = getimagesize( $logo_absolute_url );
            echo '<style type="text/css">
                    #login h1 a {
                        background-image: url('.esc_url($logo).');
                        background-size: '.intval($width).'px '.intval($height).'px !important;
                        min-height: 87px;
                        width: '.intval($width).'px;
                        height: '.intval($height).'px;
                        overflow: hidden;
                    }
                    body.login {
                        background: #fff;
                    }
                    .login form {
                        -webkit-box-shadow: 0 1px 3px rgba(0,0,0,.3);
                        -moz-box-shadow: 0 1px 3px rgba(0,0,0,.3);
                        box-shadow: 0 1px 3px rgba(0,0,0,.3);
                    }
                </style>';
        }
    }
}
add_action( 'login_head', 'buddyboss_custom_login_logo' );

almost everything works except these 2 things:

1. the custom google font (computers read it but tablets and mobile don’t..)
I also tried adding the font css to custom.css, with !important added but the problem remains.

2. custom logo link- I want the logo on the login page to be a bit larger, so I added this image. The custom url worked within theme-functions.php, but doesn’t in the child theme’s functions.php

#login h1 a {background-image: url(/wp-content/uploads/2015/02/1.png); background-size: 200px 50px;}
doesn’t have an effect.

how does this code work exactly?

thank you 🙂

[Alyssa]

@milena I assume the only reason desktops read it is because the font is cached. The registration page only loads Open Sans Google font.

You need to also set the height and width of the anchor element because backgrounds can repeat