Skip to content

Instantly share code, notes, and snippets.

View kevinkace's full-sized avatar

Kevin Cameron kevinkace

View GitHub Profile
  • Bracket Pair Colorizer 2
  • CSS Modules
  • ESLint
  • HTML Snippets
  • Material Icon Theme
  • Path Intellisense
  • Rainbox CSV
  • indent rainbow
  • REST Client
  • stylfmt?
[
{
"ID": 11,
"post_author": "1",
"post_date": "2011-07-21 19:43:30",
"post_date_gmt": "2011-07-21 19:43:30",
"post_content": "THE GAME",
"post_title": "Game",
"post_excerpt": "",
"post_status": "publish",
@kevinkace
kevinkace / Flowdock.css
Last active October 18, 2018 17:40
flowdock styles
html,
button,
input,
select,
textarea {
/* font-family: monospace; */
letter-spacing: 0.02em;
}
.avatar-container {
opacity: 0.4;
<!-- NOTE: not valid markup, just to show DOM structure -->
<!-- 01. full bleed background & overlay -->
<section class="background">
<div class="overlay"></div>
<svg>
<!-- 02. transparency data/mask -->
<defs>
{
"[markdown]": {
"files.trimTrailingWhitespace": false,
"diffEditor.ignoreTrimWhitespace": false
},
"[csv]": {
"files.trimTrailingWhitespace": false
},
"breadcrumbs.enabled": true,
@kevinkace
kevinkace / .bashrc
Last active July 4, 2023 18:52
.bashrc
alias ll="ls -a -l"
alias gs="git status"
alias gl="git pull"
alias gh="git push"
alias ga="git add"
alias gaa="git add ."
alias gd="git difftool"
alias gdd="git difftool --dir"
alias gcm="git commit -m"
// pref:
// lazyload
// - content img
// - background img
// fe:
const pify = require("pify");
// returns path of img when loaded
@import url(https://fonts.googleapis.com/css?family=Roboto:400,700,500,300);@import url(https://fonts.googleapis.com/css?family=Roboto+Mono:400,700,500,300);@keyframes a{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes b{0%{opacity:1}50%{opacity:0}to{opacity:1}}[src$="blue.png"]{background-image:url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjE4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIxOCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBmaWxsPSIjMDA5Njg4IiBkPSJNMTIgMkM2LjQ4IDIgMiA2LjQ4IDIgMTJzNC40OCAxMCAxMCAxMCAxMC00LjQ4IDEwLTEwUzE3LjUyIDIgMTIgMnptLTIgMTVsLTUtNSAxLjQxLTEuNDFMMTAgMTQuMTdsNy41OS03LjU5TDE5IDhsLTkgOXoiLz48L3N2Zz4=)}[src$="red.png"]{background-image:url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjE4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIxOCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBmaWxsPSIjRjQ0MzM2IiBkPSJNMTIgMkM2LjQ4IDIgMiA2LjQ4IDIgMTJzNC40OCAxMCAxMCAxMCAxMC00LjQ4IDEwLTEwUzE3LjUyIDIgMTIgMnptMSAxNWgtMnYtMmgydjJ6bTAtNGgtMlY3aDJ2NnoiLz48L3N2Zz4=)}[src$="yellow.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
@kevinkace
kevinkace / posthtml-walker-first-last-child.js
Created June 9, 2016 18:42
posthtml recursive tree walker to add first-child/last-child classes to all elements
var iteration = 0,
maxIterations = 200;
function addClass(node, className) {
var classNameRegex = new RegExp(className, "g");
node.attrs = node.attrs || {};
if(!node.attrs.class || !classNameRegex.test(node.attrs.class)) {
node.attrs.class = node.attrs.class ? node.attrs.class + " " + className : className;