frontendbeast

// ----
// Sass (v3.3.14)
// Compass (v1.0.1)
// ----

// Modified version of Harry Roberts' width mixin.
// https://github.com/csswizardry/discovr/blob/master/css/_trumps.widths.scss

// A mixin to spit out our width classes. Pass in the total number of columns 
// we want to have, and an optional suffix for responsive widths. The widths are

frontendbeast

linters:

    SelectorFormat:
        convention: ^(_)?[a-z]+-[a-z0-9-]+((_{2}|-{2})?[a-z0-9-]+)?(-{2}[a-z0-9-]+)?[a-z0-9]$
        convention_explanation: 'should be written in namespaced, hyphenated BEM format'
        ignored_types: [element]

frontendbeast

// ----
// Sass (v3.3.14)
// Compass (v1.0.1)
// ----

.o-modal {
  background-color: rgba(#000, 0.5);
  color: rgba(white, 0.9);
}

frontendbeast

// ----
// Sass (v3.3.14)
// Compass (v1.0.1)
// ----

p {
  margin: 0;
  
  & + & {
    margin-bottom: 2rem;

frontendbeast

// ----
// Sass (v3.3.14)
// Compass (v1.0.1)
// ----

@function em_as_string($px-value) {
    $size: $px-value/ 16px;
    @return $size#{em};
}

frontendbeast

// ----
// Sass (v3.3.14)
// Compass (v1.0.1)
// ----

// Sass breakpoints with contextual rem calculations
// ===================================================================
// I'm using rems, and most of my elements will use be relative to the 
// base setting on the html element (e.g. p, ul, etc.), but some will 
// have specific sizes, which I want to set in pixels but convert via

frontendbeast

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

.c-nav {
  position: relative;

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

frontendbeast

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

$namespace: c-nav;

.#{$namespace} {
  position: relative;

  &:before {

frontendbeast

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

.c-nav {
  $root: #{&};
  
  position: relative;
  
  &:before {

frontendbeast

[
    { "keys": ["super+b"], "command": "insert_snippet", "args": {"name": "Packages/User/bold.sublime-snippet"} },
    // Set context so shortcut works in HTML files only
    { "keys": ["super+b"], "command": "insert_snippet", "args": {"name": "Packages/User/bold.sublime-snippet"},"context":[{ "key": "selector", "operator": "equal", "operand": "text.html" }] }
]