Skip to content

Instantly share code, notes, and snippets.

View illepic's full-sized avatar

Christopher Bloom illepic

82 followers · 34 following
View GitHub Profile
@illepic
illepic / js-to-sass-map.js
Last active November 5, 2023 14:54
Javascript object to Sass map transform
// For a JS object like so
const sassMapObj = {
namespace: {
primary: {
white: '#fff',
},
secondary: {
black: '#000',
},
},
@illepic
illepic / gutenberg.html
Created June 1, 2020 18:09
Gutenberg Field Markup
<!-- wp:cover {"url":"/sites/default/files/inline-images/bKwo5axttdsDP9G6qsVTwBF3mAEMCsxvn3Kh6DHZkrlCFK6IQc.jpg","id":1,"focalPoint":{"x":"0.41","y":"0.48"},"align":"wide","mediaAttrs":{"data-entity-type":"file","data-entity-uuid":"41e16525-3af8-404b-8db8-08afff83a1e7","data-image-style":"original"}} --><div class="wp-block-cover alignwide has-background-dim" style="background-image:url(/sites/default/files/inline-images/bKwo5axttdsDP9G6qsVTwBF3mAEMCsxvn3Kh6DHZkrlCFK6IQc.jpg);background-position:41% 48%" data-entity-type="file" data-entity-uuid="41e16525-3af8-404b-8db8-08afff83a1e7" data-image-style="original"><div class="wp-block-cover__inner-container"><!-- wp:paragraph {"align":"left","placeholder":"Write title…","fontSize":"large"} --><p class="has-text-align-left has-large-font-size">This is a title</p><!-- /wp:paragraph --></div></div><!-- /wp:cover --><!-- wp:heading {"align":"center"} --><h2 class="has-text-align-center">Test title</h2><!-- /wp:heading --><!-- wp:phase2/p2-massive-cover {"title":"Titl
@illepic
illepic / carousel.js
Last active September 26, 2018 15:00
Drupal.t() - Particle integration version 2
@illepic
illepic / drupal.js
Created September 26, 2018 00:05
Particle Drupal.t() integration
// apps/drupal/index.js
import { carousel } from '../../source/design-system';
Drupal.behaviors.carouselIntegration = {
attach($context) {
carousel.enable($context, {
strings: {
goBackText: Drupal.t('Go back'),
goForwardText: Drupal.t('Go forward'),
@illepic
illepic / particle-deps.sh
Last active May 18, 2022 21:50
Particle from scratch with all dependencies
#!/usr/bin/env bash
# 1. Skip steps if you already have the tools listed
# 2. Run source ~/.bashrc or source ~/.zshrc after each step to ensure command is registered
# Install Homebrew, if not installed
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
# Update Homebrew installed packages
brew update && brew upgrade
@illepic
illepic / gulp-sass2json.js
Last active November 9, 2017 08:55
gulp sass to json
const path = require('path');
const through = require('through2');
const sassExtract = require('sass-extract');
const _ = require('lodash');
/**
* Parse a sass file, discover all Sass vars, write to json
* See https://github.com/contra/gulp-concat/blob/master/index.js for inspiration
* @param fileName
* @param opt
@illepic
illepic / index.html
Last active October 31, 2017 15:23 — forked from bleeDev/index.html
jaPbeN
<html>
<body>
<div id="app">
<div>
{{ notes }}
</div>
<button @click='increase'>Increase</button>
<button @click='decrease'>Decrease</button>
</div>
@illepic
illepic / carousel.js
Last active June 14, 2017 20:15
ES6 modules with Drupal implementation (pseudocode)
@illepic
illepic / card.js
Created November 5, 2016 19:37
function placeCards(cardCollection, $cardRegion, $interp) {
cardCollection.forEach(function(element, index, array) {
var $img = $('<img>').attr('src', element.image);
var $text = $('<p>' + element.reading + '</p>');
$cardRegion.append($img);
$interp.append($text);
});
}
@illepic
illepic / shuffle.js
Last active October 22, 2016 18:39
function shuffle(shufflearray) {
var i = shufflearray.length;
var j;
var temp;
while(i-- > 0) {
j = Math.floor(Math.random() * (i + 1));
temp = shufflearray[j];
shufflearray[j] = shufflearray[i];
shufflearray[i] = temp;