Skip to content

Instantly share code, notes, and snippets.

View hacknug's full-sized avatar
👽

Nestor Vera hacknug

👽
View GitHub Profile
@JLarky
JLarky / example.ts
Created August 11, 2020 00:55
Expose tailwind color palette to be able to access tailwind config from javascript/browser
import { theme } from './tailwind.static';
console.log(theme.extend.colors.gray[500]);
@hihayk
hihayk / dynamic-line-height.css
Created July 7, 2020 17:05
Dynamically decrease line-height as the font-size grows.
:root {
--lineHeightFixedAmount: 0.25rem;
--lineHeightRelativeAmount: 1em;
--sizesIncrement: 1.4;
--fontSize-0: 1rem;
--fontSize-1: calc(var(--fontSize-0) * var(--sizesIncrement));
--fontSize-2: calc(var(--fontSize-1) * var(--sizesIncrement));
--globalLineHeight: calc(var(--lineHeightFixedAmount) + var(--lineHeightRelativeAmount));
@gahabeen
gahabeen / FormulateForm.js
Last active September 17, 2020 04:56
Extended FormulateSchema/FormulateForm Component as Plugin - for the amazing VueFormulate lib
import FormulateForm from './FormulateForm.vue'
export function plugin(instance) {
instance.extend({
components: {
FormulateForm,
},
})
}
<template lang="pug">
button.py-2.px-3.rounded.tran-colors-p1.relative.overflow-hidden(
@click="click",
:class="[themes[theme], cursor]")
.flex.items-center.tran-opacity-p5(:class="{'opacity-25': loading, 'opacity-0': success}")
.mdi(v-if="icon",:class="[`mdi-${icon}`, label ? 'mr-2' : '']")
img.w-4.h-4(v-if="image",:src="image",:class="label ? 'mr-2' : ''")
div(v-if="label") {{ label }}
.bg-white-o3.button-loadbar.ani-zi(v-if="loading")
.absolute.inset-0.flex.items-center.justify-center(v-if="success")
const { setContext } = require('apollo-link-context');
const { HttpLink } = require('apollo-link-http');
const { introspectSchema, makeRemoteExecutableSchema } = require('graphql-tools');
const fetch = require('node-fetch');
module.exports = function(api) {
api.createSchema(async function(graphql) {
const http = new HttpLink({
uri: 'http://example.com/api',
fetch
function custom_theme_assets() {
// bail if classic editor setting is set to block or no-replace
$option = get_option( 'classic-editor-replace' );
if ( $option === 'block' || $option === 'no-replace' ) {
return;
}
// bail if classic editor plugin is not active. can't use is_plugin_active() here, unless you include wp-admin/includes/plugin.php
if ( ! in_array( 'classic-editor/classic-editor.php', apply_filters( 'active_plugins', get_option( 'active_plugins' ) ) ) ) {
return;
@DavidKuennen
DavidKuennen / minimal-analytics-snippet.js
Last active October 24, 2024 18:10
Minimal Analytics Snippet
(function (context, trackingId, options) {
const history = context.history;
const doc = document;
const nav = navigator || {};
const storage = localStorage;
const encode = encodeURIComponent;
const pushState = history.pushState;
const typeException = 'exception';
const generateId = () => Math.random().toString(36);
const getId = () => {
// Should I be ES6+ing this file? Does it matter? Seems like it would feel nicer but running Babel over this file feels like ouroboros.
// I'm using Gulp 3.x. I couldn't for the life of me get Gulp 4.x going, I think because my Gulp CLI was at too high (??) of a version and no amount of uninstalling and reinstalling would bring it back down.
var gulp = require("gulp");
// I thought I needed this until I found out about gulp.series. Can I refactor anything here?
var runSequence = require("run-sequence");
// Would this be a speed boost for anything? As in, only looking at files that have changed instead of all files?
// https://github.com/sindresorhus/gulp-changed
@tunguskha
tunguskha / Gradient shadow in pure CSS.md
Last active October 12, 2024 17:02
Gradient shadow in pure CSS

Gradient shadow in pure CSS

alt text

HTML
<button>Let's Go !</button>
const WordpressPurgeCSS = {
whitelist: [
"rtl",
"home",
"blog",
"archive",
"date",
"error404",
"logged-in",
"admin-bar",