Skip to content

Instantly share code, notes, and snippets.

View WebDevLuke's full-sized avatar
🪲
Proficient bug writer

Luke Harrison WebDevLuke

🪲
Proficient bug writer
View GitHub Profile
@WebDevLuke
WebDevLuke / published-articles.md
Last active January 9, 2023 20:34
A list of my published articles online and in print
@WebDevLuke
WebDevLuke / followClick.js
Created February 9, 2020 19:09
For when you can't click 'follow' on Twitter fast enough...
let buttons = document.querySelectorAll('div[role="button"');
for(let button in buttons) {
if(buttons[button].textContent.trim() === 'Follow') {
buttons[button].click()
}
}
@WebDevLuke
WebDevLuke / Git Bash Shortcuts
Created May 28, 2019 17:06
A few shortcuts for git in bash. Add to ~/.bash_profile
# Go to git directory
alias g='cd ~/git';
# What's happening?
alias gs='git status';
# Add all files to staging area
alias ga='git add -A';
# Add only tracked files to staging area
alias gau='git add -u';
# Push current branch
alias gp='git push origin HEAD';
@WebDevLuke
WebDevLuke / sublime-packages.json
Last active April 19, 2019 18:10
Sublime Text 3 Packages - `Preferences` -> `Package Settings` -> `Package Control` -> `Settings User`
{
"bootstrapped": true,
"in_process_packages":
[
],
"installed_packages":
[
"AutoFileName",
"ayu",
"BracketHighlighter",
@WebDevLuke
WebDevLuke / inViewport.js
Created April 1, 2019 10:06
Old fashioned method of checking if an element is within the viewport.
export default function inViewport(elem, options = {}) {
const props = {
offsetBefore: typeof options.offset === 'object' ? -Math.abs(options.offset.before) : -Math.abs(options.offset) || 0,
offsetAfter: typeof options.offset === 'object' ? options.offset.after : 0,
threshold: options.threshold || 0
}
const bounding = elem.getBoundingClientRect();
const bottom = () => {
if(!props.threshold) {
return (bounding.bottom + props.offsetBefore) - elem.offsetHeight;
@WebDevLuke
WebDevLuke / ITCSShttp2.html
Last active April 1, 2019 15:40
ITCSS HTTP2.0 Exploratory Template
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1" />
<!-- Imports ITCSS settings / tools / generic / elements layers -->
<link rel="stylesheet" href="static/core.min.css">
</head>
<body>
@WebDevLuke
WebDevLuke / keybindings
Created September 12, 2018 09:28
Sublime Keybindings
[
// Indents pasted code automatically
{ "keys": ["super+v"], "command": "paste_and_indent" },
// Old paste
{ "keys": ["super+shift+v"], "command": "paste" },
// Automatically adds space after : which is useful for CSS
{ "keys": [":"], "command": "insert", "args": {"characters": ": "}}
]
@WebDevLuke
WebDevLuke / spacing-last-child.scss
Last active August 16, 2018 11:19
Bootstrap Spacing Utilities - Disable for last child
//------------------------------------------------------------------------------------------------
// SPACING LAST CHILD
//------------------------------------------------------------------------------------------------
/*
Extends Bootstraps spacing utility classes to create modifier classes
for margin/padding bottom which disable spacing only if the element in question
is last-child.
This is useful, as when you're using these classes with dynamically
{
"auto_complete": true,
"auto_indent": true,
"auto_match_enabled": true,
"bold_folder_labels": true,
"caret_style": "blink",
"color_scheme": "Packages/ayu/ayu-dark.sublime-color-scheme",
"fade_fold_buttons": false,
"folder_exclude_patterns":
[
@WebDevLuke
WebDevLuke / ie-scrollbar-css.txt
Created July 14, 2018 19:45
Old School Internet Explorer Scrollbar Colour Change CSS *exhale*
<style>
body {
scrollbar-3dlight-color:#2a2680;
scrollbar-arrow-color:#ffff00;
scrollbar-base-color:#7F7F7F;
scrollbar-track-color:7e00ff;
scrollbar-darkshadow-color:#2a2680;
scrollbar-face-color:#7e73ff;
scrollbar-highlight-color:2a2680;
scrollbar-shadow-color:#000000;