Skip to content

Instantly share code, notes, and snippets.

View meduzen's full-sized avatar
🌍
<body> in Belgium, <head> worldwide.

Mehdi meduzen

🌍
<body> in Belgium, <head> worldwide.
View GitHub Profile
/* Answer to https://twitter.com/stevepiron/status/900732215415508994
*
* How can I not show the :focus style when clicking an element, but keep it for keyboard navigation?
*/
// hover (mouse only)
:hover {}
// click (mouse only)
:active:hover {}
@meduzen
meduzen / laravel-localization-fix-localizedUrlWithSlugParameter.md
Last active April 1, 2024 18:20
A helper to allow named route with slug (named-route/{slug}) translation in mcamara/laravel-localization
/**
 * Localize current URL having a {parameter}.
 *
 * Awaiting a fix to the laravel-localization package
 * this helper will translate any translated route
 * that accept a mandatory slug, but no ?query.
 *
 * GitHub issue: https://github.com/mcamara/laravel-localization/issues?utf8=%E2%9C%93&q=is%3Aissue%20is%3Aopen%20getLocalizedURL
 *
########################### LAST UPDATE: 2018-10-03 ###########################
# #
# Source: https://gist.github.com/meduzen/030aa314afeb4a9806c4c59994ed7ed4 #
# #
# Main idea: target every browser with at least 0.3% market shares, plus #
# IE 11, Safari 9 and Edge 15, no matter their shares evolution. #
# #
# Browserslist documentation: https://github.com/ai/browserslist#queries #
# #
###############################################################################
// IE & Edge do not support :focus-within, so they ignore the 3 selectors.
@media screen and (min-width:896px) {
.sub-nav:target,
.sub-nav__parent:focus-within .sub-nav,
.sub-nav__parent:hover .sub-nav {
opacity: 1;
visibility: visible;
}
}
@meduzen
meduzen / bpost-tracking.js
Last active October 20, 2023 08:30
Run this in the browser console on https://track.bpost.cloud ; don’t forget to update the first 3 lines.
const trackingCode = '324567890'
const postCode = 1000
const language = 'EN' // 'FR', 'NL', 'EN'
let status = null
let deliveryWindow = null
setInterval(() => {
fetch('https://track.bpost.cloud/track/items?itemIdentifier=' + trackingCode + '&postalCode=' + postCode)
.then(res => {
@meduzen
meduzen / always-trim-custom-properties.html
Last active July 11, 2021 13:34
CSS custom properties (CSS variables) stuff
<html>
<head>
<style>
:root {
/* Like me, you probably add a space between the semicolon and the value.
👇 */
--bg: hsl(0 0% 100%);
}
@meduzen
meduzen / media-query-orientation-square.md
Last active July 12, 2019 09:15
Querying a square viewport

Hi,

I’m playing a bit with the regular browser media queries and noticed that there’s no square value for orientation. And more surprisingly, the definition of portrait orientation includes the square orientation:

The orientation media feature is portrait when the value of the height media feature is greater than or equal to the value of the width media feature. […] Otherwise orientation is landscape.

So the only way to query a square viewport is by using the aspect-ratio media query:

@media (aspect-ratio: 1/1) {
 /* css declarations for a square visual output */
@meduzen
meduzen / macos-active-directory-username-change.md
Last active December 8, 2018 10:32
“Hey, let’s put your macOS sessions in the Active Directory and see what mess it creates for developers”

Active Directory username change on macOS

Dev things will break when your macOS sessions enters the Active Directocrap. Here are some things to help.

(This supposes your user stays administrator of the computer.)

First note

You may end up by doing some find and replace in some place where the macOS username is hardcoded (like Vagrant files, Homestead.yaml or $PATH: it’s the only ones I remember). So: /Users/oldUsername should become /Users/newUsername.

@meduzen
meduzen / ViewServiceProvider.php
Last active November 21, 2023 19:41
Laravel Blade @Currency, @usd and @Eur directives
<?php
namespace App\Providers;
use Illuminate\Support\Facades\Blade;
use Illuminate\Support\ServiceProvider;
class ViewServiceProvider extends ServiceProvider
{
/**
@meduzen
meduzen / README.md
Last active August 31, 2020 11:17
Replace Nginx server name on Forge + Digital Ocean

Replace Nginx server name

This works on a Digital Ocean’s server managed by Laravel Forge. What this does:

  1. Power off the server by connecting through ssh and running sudo poweroff.
  2. Take a snapshot of the server in the Digital Ocean panel. If things goes wrong, it’ll help server restauration.
  3. Warning step: