Sin categoría

Webpack 4 Boilerplate configuration with Babel, Bootstrap 4, Sass and Webpack Server

Yes, I know, there are a lot of repos with Webpack configuration to start with our projects, but beyond of that, this a boilerplate made from scratch following mainly this great post of Margarita Obraztsova where she explains how to configure Webpack 4 and that helps to have a major understanding of how packages and Webpack works.

The idea of create this repo is to learn how the configure all this technologies to develop further projects using the latest technologies and have a better understanding of how works all together, and not just make copy/pate of Stack Overflow.

I hope that this help somebody like the Margarita’s post did with me 🙂

Repository available in:

Webpack Boilerplate

Advertisements
Sin categoría

Customize styles of Contact Form 7

In my last project I had the need of customize the messages success and fail of Contact Form 7 and after using this usel post of Isabel Castillo (Style The Response Messages For Contact Form 7) I could make it it.

Now, I want to share some changes that I made to the Isabel’s solution like a class for the email send error and another one for the inputs hints.

/**
 * @author: Wilhelm
 * WP iconset https://developer.wordpress.org/resource/dashicons/#analytics
 */

/* Input hint */
.wpcf7-form .wpcf7-not-valid-tip {
  padding-left: 2rem;
}

/* Error */
.wpcf7-form .wpcf7-response-output.wpcf7-validation-errors,
.wpcf7-form .wpcf7-response-output.wpcf7-mail-sent-ng {
    color: #d8000c;
    background-color: #ffbaba;
    border: 0;
    padding: 10px;
}

/* Success */
.wpcf7-form .wpcf7-response-output.wpcf7-mail-sent-ok {
    color: #4F8A10;
    background-color: #dff2bf;
    border: 0;
    padding: 10px;
}

/* icons properties */
div.wpcf7-mail-sent-ok:before,
div.wpcf7-validation-errors:before {
    font: 26px/30px dashicons;
    margin-right: 16px;
    vertical-align: middle;
}

/* WP Dashicon check icon for success */
div.wpcf7-mail-sent-ok:before {
    content: '\f147';
}

/* WP Dashicon no icon for errors */
div.wpcf7-validation-errors:before {
    content: '\f158';
}

To load the Dashicons of WordPress icons in our theme I don’t use the Isabel’s solution of load the icons using the function wp_enqueue_style( ‘dashicons’ ), instead I load the Dashicons like I explained in my previous post How to use dashicons in your wordpress theme

functions.php

//Enqueue the Dashicons script
add_action( 'wp_enqueue_scripts', 'load_dashicons_front_end' );
function load_dashicons_front_end() {
wp_enqueue_style( 'dashicons' );
}

 

Sin categoría

Bug in Whatsapp calls

Some weeks ago I was using Whatsapp calls and I notice that when you having a normal call (service provider) and you receive a Whatsapp call you can’t hold the previous call, you just have to answer or decline the Whatsapp call. The interface of Whatsapp overlaps the Android interface.

I hope Whatsapp will find this kind of bug very soon, now that Whatsapp calls is turning a very important tool.

Sin categoría

Ahora en Ingles

Estoy aprendiendo Ingles, así que por ello comenzare a publicar los tips de este espacio en ese idioma, tanto para continuar con mi aprendizaje y llegar a una audencia un poco mas amplia.

No se molesten por los que quieren un contenido en Español pero es la evolución bebe.