Skip to content

Instantly share code, notes, and snippets.

@LucaRosaldi
LucaRosaldi / input-numeric.html
Created May 5, 2021
HTML: Better altenative to input type="number"
View input-numeric.html
<!-- https://technology.blog.gov.uk/2020/02/24/why-the-gov-uk-design-system-team-changed-the-input-type-for-numbers/ -->
<input type="text" inputmode="numeric" pattern="[0-9]*">
@LucaRosaldi
LucaRosaldi / debug-overflow.js
Last active Apr 27, 2021
DEBUG: Show elements which overflow the viewport horizontally
View debug-overflow.js
/* Paste this snippet in the console */
var docWidth = document.documentElement.offsetWidth;
[].forEach.call(
document.querySelectorAll('*'),
function(el) {
if (el.offsetWidth > docWidth) {
console.log(el);
}
}
@LucaRosaldi
LucaRosaldi / query.mysql
Last active Nov 23, 2020
WordPress, WooCommerce, MySQL: Get list of customers with at least one order placed (for email marketing)
View query.mysql
SELECT wp_users.user_email as "Email", firstmeta.meta_value AS "First Name", lastmeta.meta_value AS "Last Name", ordermeta.meta_value AS "Orders Placed" FROM wp_users
LEFT JOIN wp_usermeta as firstmeta on wp_users.ID = firstmeta.user_id and firstmeta.meta_key = 'first_name'
LEFT JOIN wp_usermeta as lastmeta on wp_users.ID = lastmeta.user_id and lastmeta.meta_key = 'last_name'
LEFT JOIN wp_usermeta as ordermeta on wp_users.ID = ordermeta.user_id and ordermeta.meta_key = '_order_count'
WHERE wp_users.ID IN (
SELECT user_id FROM wp_usermeta WHERE meta_key = '_order_count' AND meta_value > 0
)
@LucaRosaldi
LucaRosaldi / mq.js
Created Sep 9, 2020
JS: Listen for Media Queries
View mq.js
// Create a condition that targets viewports at least 768px wide
const mediaQuery = window.matchMedia('(min-width: 768px)')
function handleTabletChange(e) {
// Check if the media query is true
if (e.matches) {
// Then log the following message to the console
console.log('Media Query Matched!')
}
}
@LucaRosaldi
LucaRosaldi / favicon.svg
Last active May 4, 2020
SVG Favicon (2020 edition)
View favicon.svg
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
@LucaRosaldi
LucaRosaldi / touch-query.css
Created Mar 12, 2020
CSS: Media Query for touch and non-touch devices
View touch-query.css
@media (hover: hover) {
/* targets only non-touch devices */
}
@media (hover: none) {
/* targets only touch devices */
}
@LucaRosaldi
LucaRosaldi / functions.php
Last active Jan 30, 2020
WP: Remove unwanted styles set by themes or plugins
View functions.php
<?php
/**
* Remove unwanted styles in the front end which were added by other themes or plugins.
*
* @filter print_styles_array
*
* @param array $handles The list of enqueued style handles about to be processed
* @return array
*/
@LucaRosaldi
LucaRosaldi / get_user_ip.php
Last active Sep 25, 2019
PHP: Get User Geolocation with ipgeolocationapi.com
View get_user_ip.php
<?php
/**
* Get the user IP address from the server request.
*
* @return string
*/
function get_user_ip() : string {
if ( ! empty( $_SERVER['HTTP_CLIENT_IP'] ) ) {
return $_SERVER[ 'HTTP_CLIENT_IP' ];
@LucaRosaldi
LucaRosaldi / .htaccess
Created Sep 17, 2019
APACHE: Redirect to HTTPS
View .htaccess
RewriteEngine On
RewriteBase /
RewriteCond %{HTTPS} off
RewriteCond %{HTTP:X-Forwarded-Proto} !https
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]
@LucaRosaldi
LucaRosaldi / utils.js
Last active Aug 23, 2019
JS: utilities module
View utils.js
/**
* Check if passed argument is a callable function.
*
* @param {Callable} func
* @return {Boolean}
*/
export function isFunction( func ) {
return func && {}.toString.call( func ) === '[object Function]';
}