Skip to content

Instantly share code, notes, and snippets.

View johnfmorton's full-sized avatar
⌨️
Making stuff

John F Morton johnfmorton

⌨️
Making stuff
View GitHub Profile
@johnfmorton
johnfmorton / jekyll-collections-prev-next-wrap-around.html
Last active May 16, 2019 15:46 — forked from budparr/jekyll-collections-prev-next.html
Previous Next Links for Jekyll Collections - with wrap around to beginning link and last link when needed
{% capture the_collection %}{{page.collection}}{% endcapture %}
{% if page.collection %}
{% assign document = site[the_collection] %}
{% endif %}
<h1>TITLE: {{ page.title }}</h1>
{% for links in document %}
{% if forloop.first %}
{% assign first = links %}
{% endif %}
{% if forloop.last %}
@johnfmorton
johnfmorton / styleMerge.js
Created February 20, 2017 22:33
Merging a dynamic style with a predefined style in a React app
class InfoPanel extends React.Component {
// a pre-defined style
scrollBarStyle = {
top: 0,
position: 'absolute',
width: '18px',
height: 54,
background: '#434344'
}
@johnfmorton
johnfmorton / TransmitOpenTerminal.txt
Last active May 30, 2023 14:42
Use Transmit 5 to open in iTerm (instead of Terminal.app) as mentioned here https://library.panic.com/transmit5/open-in-terminal/
on openTerminal(location, remoteHost, serverPort)
tell application "System Events"
-- some versions might identify as "iTerm2" instead of "iTerm"
set isRunning to (exists (processes where name is "iTerm")) or (exists (processes where name is "iTerm2"))
end tell
tell application "iTerm"
activate
set targetTab to ""
@johnfmorton
johnfmorton / jmx2-privacy-bar.js
Last active May 25, 2018 13:17
This gist is to archive the way we code a "privacy bar", a bit of legal text that must appear on each viewing of a page on a site. The act of closing the privacy bar once sets a cookie that will make that privacy notice not appear again until the cookie is deleted or expires.
/*
This gist is to archive the way we code a "privacy bar", a bit of legal text that must appear
on each viewing of a page on a site. The act of closing the privacy bar once sets a cookie
that will make that privacy notice not appear again until the cookie is deleted or expires.
<div class="privacy-bar" id="privacy-bar" style="display: block;">
<div class="privacy-bar-content">
<p>We use cookies to make interactions with our websites and services easy and meaningful,
to better understand how they are used and to tailor advertising. You can read more and make
your cookie choices&nbsp;<a href="#">here</a>. By continuing to use this site you are giving
@johnfmorton
johnfmorton / webpack.mix.js
Created August 1, 2018 14:06
A WIP laravel mix workflow
let mix = require('laravel-mix');
let precss = require("precss");
let tailwindcss = require("tailwindcss");
require('laravel-mix-purgecss');
require('laravel-mix-criticalcss');
class TailwindExtractor {
static extract(content) {
return content.match(/[A-z0-9-:\/]+/g) || [];
<style>
body {
background: #282828;
color: #FFFFFF;
}
h1, h2, h3, h4, h5, h6 {
margin: 1em;
}
.fizz {
color: #FACB3E;
@johnfmorton
johnfmorton / fullHeightMultiselectFields.js
Last active February 26, 2020 14:05
Make multiselect fields the full height of number of items with Vanilla JS
// Select the multiselect fields
var mulitSelectFields = document.querySelectorAll('select[multiple]');
// For each field found...
Array.prototype.forEach.call(mulitSelectFields, function(el, i) {
// count how many selection options are present
var itemsInSelect = el.length;
// then set the height with the size attribute to match
el.setAttribute('size', itemsInSelect);
// finally remove the scroll indicator for that field
el.style.overflowY = 'auto';
@johnfmorton
johnfmorton / deploy-from-git.sh
Last active September 5, 2022 08:40
deploy-from-git.sh - Used on Arcustech to deploy a Craft CMS site
# This script is used to deploy a Craft CMS site on an Arcustech server
#
# It will clone the git main branch from a private repo into
# a 'deployments' directory and them create symlinks for the
# static assets: .env, and 3 directories of assets.
# It then does a composer install of the Craft site.
# The scripts in the composer file are like this: https://github.com/nystudio107/devmode/blob/f2b231e772026860f75e255c9e22722dac983de8/cms/composer.json#L55
# These scripts update Craft, clear caches, etc.
# Finally, it will symlink the web directory in the newly downloaded files
# to the public folder which is the one used by Arcustech
@johnfmorton
johnfmorton / picture-tag-helper-snippet.html
Created May 18, 2021 14:10
Picture tag helper snippet
<!-- Revised snippet based on https://www.stefanjudis.com/snippets/a-picture-element-to-load-correctly-resized-webp-images-in-html/ -->
<picture>
<!-- load avif if supported -->
<source type="image/avif"
srcset="image-100x200.avif 100w,
image-200x400.avif 200w"
sizes="
(max-width: 768px) calc(100vw - 3em),
(max-width: 1376px) calc(50vw - 8em),
550px"
@johnfmorton
johnfmorton / ambient-video-play-on-enter.js
Last active January 18, 2022 14:52
Play an ambient video (muted inlin
var ambientVideo = document.getElementById("ambientVideo");
/**
// in HTML page
<video muted playsinline id='abientVideo'>
<source src="my-video-file.webm" type="video/webm">
</video>