Nick Freear nfreear

Accessibility consultant @abilitynet · formerly Web developer @ The Open University @IET-OU · Javascript · open source · e-learning · i18n · maps

nfreear / starter.html

Created October 7, 2023 20:47

Leaflet starter example

	<!doctype html>
	<html lang="en">
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">

	<!-- 1. Add the Leaflet stylesheet. -->
	<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css"
	integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY="
	crossorigin=""/>

nfreear / youtrack.user.js

Created February 13, 2023 19:31

YouTrack User JS - Add buttons for easier keyboard navigation of YouTrack.

	// ==UserScript==
	// @name YouTrack
	// @namespace https://gist.github.com/nfreear
	// @version 0.1
	// @description Add buttons for easier keyboard navigation of YouTrack.
	// @author Nick Freear
	// @match https://.myjetbrains.com/youtrack/issue
	// @icon https://www.google.com/s2/favicons?sz=64&domain=myjetbrains.com
	// @grant none
	// ==/UserScript==

nfreear / E-WEB-Goal-05.svg

Last active January 27, 2023 17:38

SDG - Goal 5 Gender Equality | © United Nations | https://sdgs.un.org/goals

Sorry, something went wrong. Reload?

Sorry, we cannot display this file.

Sorry, this file is invalid so it cannot be displayed.

nfreear / listbox-group.test.html

Created January 13, 2023 04:49

Listbox-group test - using `<my-keyboard-control>`

	<!doctype html> <title> listbox-group test </title>

	<meta charset="utf-8">
	<style>
	body {
	line-height: 1.5;
	margin: 1rem auto;
	max-width: 30rem;
	}

nfreear / w3c-translations-chart.js.html

Created November 2, 2022 18:24

Chart: W3C Specs - Number of translations | https://codepen.io/nfreear/pen/oNyxBjv

	<!doctype html> <title> Chart </title>

	<style>
	#container {
	height: 400px;
	width: 100%;
	}

	.highcharts-point {
	fill: teal;

nfreear / my-indieauth-login.js.html

Created October 3, 2022 17:09

Partial implementation of "IndieAuth" | https://indielogin.com/api

	<!doctype html> <title> My-login test </title>

	<style>
	body { font: 1.1rem/1.6 sans-serif; margin: auto; max-width: 32rem; }
	button, input { font: inherit; padding: .3rem; }
	button { display: block; X-padding: .3rem 1rem; width: 7rem; margin: 0 auto; }
	input { min-width: 14rem; }
	hr { border-top: 3px blue solid; margin: 1rem; }

	my-login { border: 1px solid #bbb; display: block; padding: 1rem; }

nfreear / import-test.js.html

Created October 2, 2022 10:14

Loading non-module Javascripts using `import()`.

	<!doctype html> <title> Import tests </title>

	<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css"
	integrity="sha256-sA+zWATbFveLLNqWO2gtiw3HL/lh1giY/Inf1BJ0z14="
	crossorigin=""/>

	<style>
	#map { x-height: 180px; height: 72vh; }
	button { font-size: inherit; padding: .5rem 1rem; }
	</style>

nfreear / my-fullscreen.element.js.html

Created September 30, 2022 16:53

Fullscreen test JS

	<!doctype html> <title> fullscreen test </title>

	<style>
	body {
	margin: auto;
	max-width: 35rem;
	}

	my-fullscreen {
	border: 3px solid red;

nfreear / system-colors.css4.html

Created September 19, 2022 15:18

CSS4 System Colors

	<!doctype html> <title> CSS 4 System Colours </title>

	<style>
	body {
	background-color: var(--canvas, Canvas);
	color: var(--canvas-text, CanvasText);
	margin: 1rem auto;
	max-width: 30rem;
	}

nfreear / slides-reveal.js.html

Created September 15, 2022 18:17

Slideshow test, built on Reveal.js

	<!doctype html><html lang="en"> <title> Slideshow test </title>

	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width,initial-scale=1">

	<meta name="author" content="NDF, 13-Sep-2022">

	<body data-X-class="h-screen full-page-demo" data-page="demo">
	<div class="reveal">
	<div class="slides">