Skip to content

Instantly share code, notes, and snippets.

View andy-blum's full-sized avatar
🤖

Andy Blum andy-blum

🤖
View GitHub Profile
@andy-blum
andy-blum / one-page.js
Last active October 19, 2023 12:31
Style Diff
const styleDiff = (elementOne, elementTwo) => {
const elOneStyles = window.getComputedStyle(elementOne);
const elTwoStyles = window.getComputedStyle(elementTwo);
const styleDiff = new Set();
for (const prop in elOneStyles) {
if (elOneStyles[prop] !== elTwoStyles[prop]) {
styleDiff.add(`${prop}: ${elOneStyles[prop]} | ${elTwoStyles[prop]}`);
}
}
@andy-blum
andy-blum / hexToHSL.php
Last active February 14, 2022 16:29
Hexcode to HSL values in php
<?php
/**
* Converts hex color strings to array of HSL values.
* Code based on JS version: https://css-tricks.com/converting-color-spaces-in-javascript/.
* Formula here: https://www.rapidtables.com/convert/color/rgb-to-hsl.html.
*
* @param string $hexString
* The 6-character hexadecimal color code, optionally with a leading hash
*
@andy-blum
andy-blum / Utility_Functions.md
Last active May 8, 2020 17:40
Utility Functions

This gist contains various utility functions.

  • getDomPath()
  • getVisibleChildNodes()
  • preventFocusOnClick()
  • slideUp(), slideDown(), slideToggle()
  • trapFocus(), focusTrap = {}
@andy-blum
andy-blum / getVisibleNodes.js
Created April 22, 2020 17:34
Function to get array of child nodes that are visible in browser
function getVisibleChildNodes(input) {
if (!input instanceof Node) {
return false;
} else {
const filteredNodes =
// Create array from child nodes
Array.from(input.childNodes)
// Remove comments
@andy-blum
andy-blum / cli-commands.sh
Last active July 2, 2019 21:04
Less frequent terminal commands
##
# SSH COMMANDS
##
# SSH into AWS Server
ssh -i ~/KEY_LOCATION ubuntu@IP_OR_WEBSITE
# Copy files from server
# scp SOURCE DESTINATION
scp USER@SERVER:PATH ~/Desktop
@andy-blum
andy-blum / field--image.html.twig
Last active April 16, 2019 14:03
Useful/Tricky Twig Snippets
/*
* Merge attributes onto an image
*
* Note: Attributes must have at least one non-null value.
* If you don't have a value, enter an single-space string (' ').
*/
{% for item in items %}
{{ item.content|merge({'#item_attributes': {'attribute-name': ['attribute', 'values', 'here']}}) }}
{% endfor %}
@andy-blum
andy-blum / preprocess.php
Created March 14, 2019 12:18
My frequent preprocess additions
/**
* Implements template_preprocess().
*/
function theme_preprocess(&$variables) {
/* Set variables to icon library */
$variables['icons'] = '/themes/custom/THEME/assets/icons';
$variables['brand_ico'] = '/themes/custom/THEME/assets/icons/brands.svg';
$variables['light_ico'] = '/themes/custom/THEME/assets/icons/light.svg';
$variables['regular_ico'] = '/themes/custom/THEME/assets/icons/regular.svg';
$variables['solid_ico'] = '/themes/custom/THEME/assets/icons/solid.svg';
@andy-blum
andy-blum / theme.base.css
Created March 14, 2019 12:16
drupal/uikit CSS Starters
/* Use this file to set CSS variables & root properties */
/* Import google font */
@import url('');
/* Set root variables */
:root {
/* Body paragraph text (used for rem sizing) */
font-size: 18px;