Skip to content

Instantly share code, notes, and snippets.

View fsgreco's full-sized avatar
🐰
¯\_(ツ)_/¯

Santiago fsgreco

🐰
¯\_(ツ)_/¯
View GitHub Profile
@fsgreco
fsgreco / design-tokens.css
Last active May 4, 2025 15:42
✨ design-tokens.css ✨ install with`npm i gist:f4a55ae8eea9ad11bd7588a2eeb24630` and import it like this `import "design-tokens.css";`
/* ==========================================================================
Design Tokens as foundational CSS Variables
Using "Clamp" for Text sizes inspired by fluid scale typography concepts
MIT © Santiago Greco - fsgreco@hey.com
- gist.github.com/fsgreco/f4a55ae8eea9ad11bd7588a2eeb24630
You can use this along with "reset.css": `npm i gist:0822bebdf9935e1c5cfd5e3d1018a565`
Vscode Extension suggested: `ext install cr34t1ve.csvars`
========================================================================== */
@fsgreco
fsgreco / alias.zsh
Created March 1, 2025 19:21
Discover and remove node_modules recursively | alias for zsh
shownm='find . -name "node_modules" -type d -prune | xargs du -chs'
delnm='find . -name "node_modules" -type d -prune -exec rm -rf '\''{}'\'' +'
@fsgreco
fsgreco / package.json
Last active July 26, 2025 17:23
✨ reset.css ✨ install with`npm i gist:0822bebdf9935e1c5cfd5e3d1018a565` and import it like this `import "reset.css";`
{
"name": "reset.css",
"version": "1.0.7",
"description": "A modern CSS file that resets and normalizes the default styles of HTML elements.",
"main": "reset.css",
"author": "Santiago Greco <fsgreco@fastmail.com> (https://github.com/fsgreco)",
"license": "MIT",
"type": "module",
"keywords": [
"css",
@fsgreco
fsgreco / init.lua
Last active November 18, 2024 09:43
neovim config for pencil and twilight: enabled automatically when opening markdown or txt files
require('packer').startup(function(use)
-- Package manager
use 'wbthomason/packer.nvim'
-- ...
-- Writing related plugins
use 'reedes/vim-pencil'
use "folke/twilight.nvim"
use 'folke/zen-mode.nvim'
@fsgreco
fsgreco / find-elem-with-breakout-width.js
Created May 15, 2023 08:33 — forked from joshwcomeau/find-elem-with-breakout-width.js
Paste this in your browser console to search for HTML elements which extend past the window's width and create a horizontal scrollbar.
function findBreakoutElem(rootElem = document.body) {
function checkElemWidth(elem) {
if (elem.clientWidth > window.outerWidth) {
console.log("The following element has a larger width than the window's outer width");
console.log(elem);
console.log('<-------------------------------------------------------------------->');
} else if (elem.scrollWidth > window.outerWidth) {
console.log("The following element has a larger width than the window's scroll width");
console.log(elem);
console.log('<-------------------------------------------------------------------->');
@fsgreco
fsgreco / set-hooks.sh
Created March 27, 2023 07:30
This script set a new folder to git hooks - if using npm set it as a "prepare" script on package.json, it will trigger automatically when you run your fist `npm install`.
#!/bin/bash
# MIT © Santiago Greco - fsgreco@hey.com
# Set new folder to hooks
# In order to get this script working automatically (it triggers when user runs `npm install`):
# 1. place this script inside .githooks folder
# 2. set a script "prepare" on package.json with the command: .githooks/set-hooks.sh
HASHOOKPATH="$(git config core.hooksPath)"
if [[ -z "$HASHOOKPATH" ]]; then
@fsgreco
fsgreco / .htaccess
Created December 31, 2022 17:48
Htaccess for WordPress local development - it let you visualize upload files (from production) in your localhost environment
# MIT © Santiago Greco - fsgreco@hey.com
#
# What it does:
# If the site is already in production, instead of manually download all the files in upload folder
# your local apache server will search and use the production files if they are not found on localhost
#
# How to use it:
# Place this file inside your own localhost environment: `your_localhost/wp-content/uploads/.htaccess`
# Change "YOUR_DOMAIN.TLD" with your actual production domain name inside the RewriteRule line.
#
@fsgreco
fsgreco / gist-functions.sh
Created August 18, 2022 16:32
Two bash functions that interact with github gist public API. It is made for single file gists. You can retrieve the list of gists for a given user and then download a specific gist.
#!/bin/bash
# MIT © Santiago Greco - fsgreco@hey.com
# This file set two bash functions that interact with github gist public API. It is made for single file gists.
# The first one "gist_list" retrieves a list of public gist from a given username (the only param you need to pass).
# The second one "download_gist" downloads the single gist file (need to have 2 params: username and gits_name)
function check_jq() {
if ! command -v jq &> /dev/null; then echo "Please install 'jq'." && exit 1; fi
}
@fsgreco
fsgreco / generate-plugins-script.sh
Last active November 7, 2023 17:52
Fetch a list of active plugins from your production wordpress environment and create the command to install everything with wp-cli // This is an alternative to the Node.js script `generate-plugin-script.js`
#!/usr/bin/env bash
# MIT © Santiago Greco - fsgreco@hey.com
# This script fetches a list of active plugins from your production wordpress environment.
# Once it retrieves the list it creates a second script ready to run: `install-plugins.sh`
#
# For more context and information please consult the documentation of the entire project:
# docker-wordpress - https://github.com/fsgreco/docker-wordpress#sync-plugins
if ! command -v jq &> /dev/null; then echo "Please install 'jq'." && exit 1; fi
@fsgreco
fsgreco / generate-plugins-script.js
Last active November 7, 2023 17:51
A vanilla nodeJs script to fetch list of active plugins from wordpress production environment, and subsequently create a set of wp-cli commands to install them in localhost
#!/usr/bin/env node
/**
* MIT © Santiago Greco - fsgreco@hey.com
* This script fetches a list of active plugins from your production wordpress environment.
* The goal is to quickly install the same plugins on local environment (matching their version numbers).
* How it works:
* Once it retrieves the list it creates a second script (in bash) ready to run: `install-plugins.sh`
* The script generated consist on a set of instructions to install everything using wp-cli.
* This second script can be modified or adapted.