Skip to content

Instantly share code, notes, and snippets.

View attitude's full-sized avatar

Martin Adamko attitude

14 followers · 5 following
View GitHub Profile
@attitude
attitude / platform.js
Created February 27, 2016 09:22
Platform CSS class on HTML tag
/**
* Platform CSS class on HTML tag inspired by https://github.com/driftyco/ionic/blob/67ef9ebde21ac64e1f9e3db43b16c2db7ed2256d/js/utils/platform.js
*/
(function(w, el) {
var platformName,
IOS = 'ios',
ANDROID = 'android',
WINDOWS_PHONE = 'windowsphone',
EDGE = 'edge',
CROSSWALK = 'crosswalk';
@attitude
attitude / normalize.less
Last active August 8, 2016 14:00
Normalize.less [Bot updated on each change to original normalize.css]
/*! normalize.css v4.2.0 | MIT License | github.com/necolas/normalize.css */
// 1. Change the default font family in all browsers (opinionated).
// 2. Correct the line height in all browsers.
// 3. Prevent adjustments of font size after orientation changes in IE and iOS.
// Document
html {
font-family: sans-serif; // 1
@attitude
attitude / hideGoogleSerp.js
Last active May 29, 2016 12:14
Script to dim some SERP in Chrome; requires Control Freak extension.
(function(domains) {
var to,
observer,
// Google SERP div#search
search,
// Array of links
links,
// Passed arg iterator
domainsI,
// Passed arg length
@attitude
attitude / hideGoogleSerps.js
Last active May 29, 2016 13:37
Tiny script to dim some Google SERPs in Chrome; requires Control Freak extension.
(function (w, domains) {
'use strict';
var to,
// Google SERP div#search
search,
// Array of links
links,
// Passed arg iterator
domainsI,
// Passed arg length
@attitude
attitude / remove-extra-line-height.less
Created February 19, 2017 18:12
LESS CSS mixin to remove extra optical space above and below the block of text caused by how the browser distributes the line height property.
.remove-extra-line-height(@line-height: 1, @m-height: 0.7, @coef: 0.5) {
line-height: 1em * @line-height;
&:before,
&:after {
content: "";
display: table;
}
&:before {
@attitude
attitude / stringListCombinations.js
Created March 24, 2018 20:13
Generates combinations of strings within array of strings
// @flow
export const stringListCombinationsWithoutSort = (a: string[], transformer: (str: string) => string): string[] => {
return a.reduce((accumulator, propName, i) => [
propName,
...accumulator,
...(accumulator.map((s) => (s + (transformer ? transformer(propName) : propName)))),
], [])
}
@attitude
attitude / include.php
Last active October 28, 2020 09:47
Use less confusing links for the WooCommerce built-in filters that always point to the base of the shop, the `shop` page.
<?php
// NOTE: This filter has no effect on "Active Filters" widget
add_filter('woocommerce_layered_nav_link', function(string $link) {
static $shopPageId, $shopPermalink, $silent;
if (!isset($silent)) {
$silent = wp_get_environment_type() === 'production';
}
@attitude
attitude / LargeJSONEncode.php
Last active October 30, 2020 10:20
A JSON encoder class to encode and process large data sets
<?php
namespace LargeJson;
class JSONEncoder {
protected static $whiteSpace = ' ';
protected static $indentation = 2;
protected static $inline = false;
/**
@attitude
attitude / useOuterRef.ts
Created October 6, 2021 12:59
React: Use forwardRef with useRef
import { ForwardedRef, MutableRefObject, useEffect, useRef } from 'react'
function useOuterRef(outerRef: ForwardedRef<HTMLElement | null>): MutableRefObject<HTMLElement | null> {
const innerRef = useRef<HTMLElement | null>(null)
useEffect(() => {
if (!outerRef) return
if (typeof outerRef === 'function') {
outerRef(innerRef.current)
@attitude
attitude / idealLuminanceAtIndex.ts
Created April 1, 2022 08:37
Reverse function of WCAG 2.0 that returns ideal Luminance of colour at current index (to be used with Array.map)
// Contrast ratio formula:
// (L1 + 0.05) / (L2 + 0.05), where
// L1 is the relative luminance of the lighter of the foreground or background colors, and
// L2 is the relative luminance of the darker of the foreground or background colors.
function idealLuminanceAtIndex(index: number, colorsCount: number) {
const exponent = (1 - (index * 1 / (colorsCount - 1)))
return (Math.pow(colorsCount, exponent) * 0.05 - 0.05) / (colorsCount - 1) * 20
}