customizing login

This commit is contained in:
jorge-vitrubio 2022-11-30 17:11:46 +01:00
parent 9c808b52f8
commit 0408e473c1
7 changed files with 284 additions and 1 deletions

235
assets/css/style-login.css Normal file
View File

@ -0,0 +1,235 @@
body {
background:#fff;
min-width:0;
color:#111;
font-family:"din-light",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
font-size:0.9em;
line-height:1.4;
}
a {
color:#444;
font-family:"din-light",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
transition-property:border,background,color;
transition-duration:.05s;
transition-timing-function:ease-in-out
}
a:active,
a:hover {
color:#111;
}
a:focus {
color:#222;
box-shadow: none;
}
p {
line-height:1.5;
}
.login #login_error,
.login .message,
.login .success {
border-left:4px solid #333;
padding:12px;
margin-left:0;
margin-bottom:20px;
background-color:#fff;
box-shadow:none;
}
.login .success {
border-left-color:#69ed82;
}
.login #login_error {
border-left-color:#ff686e;
}
#loginform p.submit,
.login-action-lostpassword p.submit {
border:none;
}
.login * {
}
.login .input::-ms-clear {
}
.login .pw-weak {
}
.login .button.wp-hide-pw {
}
.login .button.wp-hide-pw:hover {
}
.login .button.wp-hide-pw:focus {
border-color:#333;
box-shadow:none;
outline:none;
}
.login .button.wp-hide-pw:active {
}
.login .button.wp-hide-pw .dashicons {
}
.login .wp-pwd {
}
.no-js .hide-if-no-js {
}
.login form {
background:#fff;
border:none;
box-shadow: none;
}
.login form.shake {
}
@keyframes shake {
}
@media (prefers-reduced-motion:reduce) {
.login form.shake {
animation:none;
transform:none
}
}
.login-action-confirm_admin_email #login {
}
@media screen and (max-width:782px) {
.login-action-confirm_admin_email #login {
}
}
.login form .forgetmenot {
}
.login .button-primary {
}
.login .reset-pass-submit {
}
.login .reset-pass-submit .button {
}
.login .admin-email-confirm-form .submit {
}
.admin-email__later {
}
.login form p.admin-email__details {
}
.login h1.admin-email__heading {
border-bottom: none;
color:#333;
}
.admin-email__actions div {
}
.login .admin-email__actions .button-primary {
}
#login form p {
}
#login form p.submit {
}
.login label {
}
.login .forgetmenot label,
.login .pw-weak label {
}
.login h1 {
}
.login h1 a {
background-size:84px;
background-position:center top;
background-repeat:no-repeat;
color:#3c434a;
height:84px;
font-size:20px;
font-weight:400;
line-height:1.3;
margin:0 auto 25px;
padding:0;
text-decoration:none;
width:84px;
text-indent:-9999px;
outline:0;
overflow:hidden;
display:block
}
#login {
}
.login #backtoblog,
.login #nav {
}
.login #nav {
}
#backtoblog {
}
.login #backtoblog a,
.login #nav a {
color:#333;
}
.login #backtoblog a:hover,
.login #nav a:hover,
.login h1 a:hover {
color:#111;
}
.login #backtoblog a:focus,
.login #nav a:focus,
.login h1 a:focus {
color:#222;
}
.login .privacy-policy-page-link {
}
.login form .input,
.login input[type=password],
.login input[type=text] {
}
.login input.password-input {
font-family:Consolas,Monaco,monospace
}
.js.login input.password-input,
.js.login-action-rp form .input,
.js.login-action-rp input[type=text] {
}
.login form .input,
.login form input[type=checkbox],
.login input[type=text] {
background:#fff;
}
.js.login-action-rp input[type=password],
.js.login-action-rp input[type=text] {
}
.login #pass-strength-result {
}
body.interim-login {
}
.interim-login #login {
}
.interim-login.login h1 a {
}
.interim-login #login_error,
.interim-login.login .message {
}
.interim-login.login form {
}
.screen-reader-text,
.screen-reader-text span {
}
input::-ms-reveal {
}
#language-switcher {
}
#language-switcher select {
}
.language-switcher {
}
.language-switcher label {
}
.language-switcher label .dashicons {
}
.login .language-switcher .button-primary {
}
@media screen and (max-height:550px) {
#login {
}
#language-switcher {
}
}
@media screen and (max-width:782px) {
.interim-login input[type=checkbox] {
}
.interim-login input[type=checkbox]:checked:before {
}
#language-switcher label,
#language-switcher select {
}
}
@media screen and (max-width:400px) {
.login .language-switcher .button-primary {
}
}

View File

@ -177,3 +177,7 @@ if ( defined( 'JETPACK__VERSION' ) ) {
require get_template_directory() . '/inc/jetpack.php';
}
/**
* Functions to personalize login screen
*/
require get_template_directory() . '/inc/login-functions.php';

39
inc/login-functions.php Normal file
View File

@ -0,0 +1,39 @@
<?php
/**
* Add a custom logo and styles in login page
*
* https://developer.wordpress.org/reference/functions/the_custom_logo/#comment-2037
*/
// https://codex.wordpress.org/Customizing_the_Login_Form#Change_the_Login_Logo
function ofisuport_login_logo() {
if ( has_custom_logo() ) :
$image = wp_get_attachment_image_src( get_theme_mod( 'custom_logo' ), 'full' );
?>
<style type="text/css">
.login h1 a {
background-image: url("<?php echo esc_url( $image[0] ); ?>") !important;
}
</style>
<?php
endif;
}
add_action( 'login_enqueue_scripts', 'ofisuport_login_logo' );
function ofisuport_login_logo_url() {
return home_url();
}
add_filter( 'login_headerurl', 'ofisuport_login_logo_url' );
function ofisuport_login_logo_url_title() {
return 'Your Site Name and Info';
}
add_filter( 'login_headertext', 'ofisuport_login_logo_url_title' );
// https://codex.wordpress.org/Customizing_the_Login_Form#Styling_Your_Login
function ofisuport_login_stylesheet() {
wp_enqueue_style( 'custom-login', get_stylesheet_directory_uri() . '/assets/css/style-login.css' );
// wp_enqueue_script( 'custom-login', get_stylesheet_directory_uri() . '/assets/css/style-login.js' );
}
add_action( 'login_enqueue_scripts', 'ofisuport_login_stylesheet' );

View File

@ -35,3 +35,6 @@ function ofisuport_pingback_header() {
}
}
add_action( 'wp_head', 'ofisuport_pingback_header' );

View File

@ -5,6 +5,7 @@
/* Posts and pages
--------------------------------------------- */
@import "content/posts-and-pages";
@import "content/login";
/* Comments
--------------------------------------------- */

View File

File diff suppressed because one or more lines are too long