jouni-kantola / test-max-cookie-value.js

Last active May 26, 2021 18:39

Test max cookie value

jouni-kantola / eleventy-external-links-transform.js

Last active June 29, 2024 21:58

Eleventy tranform for amending external links to include icon and screen reader message

	// Credits 🙇 for original ideas to:
	// Fork of https://github.com/vimtor/eleventy-plugin-external-links
	// css.gg SVG icon https://github.com/astrit/css.gg/blob/master/icons/svg/external.svg

	const { parse, HTMLElement } = require("node-html-parser");
	const { extname } = require("path");

	module.exports = eleventyConfig => {
	const options = {
	name: "external-links",

jouni-kantola / color-scheme.css

Created March 14, 2020 09:39

States (and cleaner code) with PostCSS custom selectors

	@custom-selector :--dark-mode input#dark-mode:checked;
	@custom-selector :--light-mode input#light-mode:checked;

	$color-scheme-toggle-root: .color-scheme;

	input[name="color-scheme"] {
	display: none;
	}

	$color-scheme-toggle-root {

jouni-kantola / .eleventy.js

Last active March 27, 2020 21:26

Inline styles from PostCSS with 11ty and Liquid

	module.exports = eleventyConfig => {
	/* ... */
	eleventyConfig.addPairedShortcode("postcss", require("./shortcodes/postcss"));
	/* ... */
	}

jouni-kantola / dark-and-light-mode.html

Last active February 28, 2020 23:17

Dark & light mode switch (with preferred choice kept in localStorage)

	<!DOCTYPE html>
	<html>

	<head>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<style>
	:root {
	--light-color: #fafafa;
	--dark-color: #222;
	--background-color: var(--light-color);

jouni-kantola / replay.sh

Last active February 5, 2020 21:22

Replay git commits

	#!/bin/sh

	# Remember current branch
	CURRENT_BRANCH=$(git rev-parse --abbrev-ref HEAD)

	# Temp branch used for replaying history
	TEMP_BRANCH=__tmp-replay-git-commits

	# Checkout temp branch
	git checkout -b $TEMP_BRANCH

jouni-kantola / Program.cs

Last active November 10, 2019 17:03

Implicitly typed lambda expressions in C#

	using System;

	public class Program
	{
	static Func<TSource, TResult> CreateFunction<TSource, TResult>(Func<TSource, TResult> function)
	{
	return function;
	}

	public static void Main()

jouni-kantola / active.js

Created April 18, 2017 07:24

Currently in date range

	function isActive(startDate, endDate) {
	var start = new Date(startDate);
	var end = new Date(endDate);
	var timeNow = new Date();
	return (timeNow >= start.setHours(0, 0, 0, 0)) &&
	(timeNow < end.setHours(0, 0, 0, 0));
	}

	// running on 2017-04-18
	isActive("2017-04-01", "2017-04-18") // -> false

jouni-kantola / package.json

Created March 18, 2017 19:38

webpack with babel-loader config

	{
	"dependencies": {
	"is-thirteen": "^2.0.0",
	"no-op": "^1.0.3"
	},
	"devDependencies": {
	"autoprefixer": "^6.6.1",
	"babel-core": "^6.21.0",
	"babel-eslint": "^7.1.1",
	"babel-loader": "^6.2.10",

jouni-kantola / reasons-for-webpack-chunk-hash-updates.md

Last active May 9, 2021 10:08

Reasons for webpack chunk hash updates

Reasons for hash change

First build, for reference

       0.14ff9d89ef59e0542b1d.dev.js    1.55 kB    0, 7  [emitted]
       1.bcca8d49c0f671a4afb6.dev.js  708 bytes    1, 7  [emitted]
       2.6617d1b992b44b0996dc.dev.js  708 bytes    2, 7  [emitted]
       3.c8edca9c31923a566f7f.dev.js  403 bytes    3, 7  [emitted]
       4.c67fbd67a62782c31d1c.dev.js  403 bytes    4, 7  [emitted]
  vendor.3c35d30d5995c0e6e1c1.dev.js     259 kB    5, 7  [emitted]  [big]  vendor

	// RFC: https://datatracker.ietf.org/doc/html/rfc6265#section-6.1
	// "measured by the sum of the length of the cookie's name, value, and attributes"
	(function testMaxCookieSize (cookieName = "test-cookie", fillWith = "1") {
	const setCookie = (name, value) => {
	const formattedValue = `${value}; path=/; domain=${document.location.host}`;
	document.cookie = `${name}=${formattedValue}`;
	};

	const getCookie = cookieName => {
	const name = cookieName + "=";

Jouni Kantola jouni-kantola

Reasons for hash change

First build, for reference