paulmsmith

"trim_trailing_white_space_on_save": true

paulmsmith

t-colour(#{nth(map-get($map,colour),1)},#{nth(map-get($map,colour),2)});

paulmsmith

<snippet>
	<content><![CDATA[
<${1:div} class="{{ setModifiers "${2:baseClass}" modifiers }} {{ setClasses classes}} ${3:''}" {{ setData data }}>
	${4:content}
</${1:div}>
]]></content>
	<tabTrigger>de</tabTrigger>
</snippet>

paulmsmith

# install libvpx and ffmpeg
brew install libvpx
brew install ffmpeg --with-libvpx

# convert a single specific file "input.mp4" to webm "output.webm"
ffmpeg -i input.mp4 -c:v libvpx -b:v 1M -c:a libvorbis output.webm

# loop all mp4 files in current directory and convert to webm suffixed with "_compressed"
for file in *.mp4; do ffmpeg -i "$file" -c:v libvpx -b:v 1M -c:a libvorbis "${file%.mp4}"_compressed.webm; done

paulmsmith

// ----
// libsass (v3.2.4)
// ----

.c-nav {
  position: relative;

  &:before {
    content: 'Menu';
    display: inline-block;

paulmsmith

// ----
// libsass (v3.2.4)
// ----

.c-nav {
  position: relative;

  &:before {
    content: 'Menu';
    display: inline-block;

paulmsmith

// block one (the containing block)
.accordion {}

// block two (the nested BEM block)
.toggler {}

// when the accordion is toggled open I need to update it's
// appearance whilst adhearing to the BEM methodology. How?

// option one:

paulmsmith

// mark-up example
// <div class="block block--sml"><span class="block__label">Text here</span></div>

.block { color: #000; }

// outputted css
.block {
	color: #000;
}

paulmsmith

Scroll overflowing list of elements horizontally (without line-breaks)

Scroll overflowing list of elements horizontally insider a fixed sized container element without elements breaking into a new line.

A Pen by Martin Schubert on CodePen.

License.

Discusstion: http://stackoverflow.com/questions/11477406/horizontal-scrolling-fit-to-content-width?rq=1

paulmsmith

// Maintain ratio mixin. Great for responsive grids, or videos.
// https://gist.github.com/brianmcallister/2932463
// 
// $ratio - Ratio the element needs to maintain.
// 
// Examples
// 
//   // A 16:9 ratio would look like this:
//   .element {
//     @include maintain-ratio(16 9);