snips.yml

# ----------------------------------------------------------------------------
simple: # Snippets that will expand.
# ----------------------------------------------------------------------------

  m0a: "margin: 0 auto"

  m0p0: "margin: 0; padding: 0"

  m0: "margin: 0"
  p0: "padding: 0"
  b0: "border: 0"

  w: "width: {0}"
  h: "height: {0}"
  mh: "min-height: {100%}"
  mw: "min-width: {100%}"
  mah: "max-height: {none}"
  maw: "max-width: {none}"

  m:  "margin: {0}"
  mt: "margin-top: {0}"
  mb: "margin-bottom: {0}"
  ml: "margin-left: {0}"
  mr: "margin-right: {0}"

  p:  "padding: {0}"
  pt: "padding-top: {0}"
  pb: "padding-bottom: {0}"
  pl: "padding-left: {0}"
  pr: "padding-right: {0}"

  bo:  "border: {solid 1px #333}"
  bt: "border-top: {solid 1px #333}"
  bb: "border-bottom: {solid 1px #333}"
  bl: "border-left: {solid 1px #333}"
  br: "border-right: {solid 1px #333}"

  bt0: "border-top: 0"
  bb0: "border-bottom: 0"
  bl0: "border-left: 0"
  br0: "border-right: 0"

  bg: "background: {#fff url(image.png) no-repeat left top fixed}"
  bgp: "background-position: {x y}"
  bgi: "background-image: {url()}"
  bgc: "background-color: {transparent}"
  bgr: "background-repeat: {no-repeat}"

  bga:  "background-attachment: {scroll|fixed|local}"
  bgas: "background-attachment: scroll"
  bgaf: "background-attachment: fixed"
  bgal: "background-attachment: local"

  f: "font: {italic bold 1em/1.5em serif}"
  font: "font: {italic bold 1em/1.5em serif}"

  ff: "font-family: {sans-serif}"
  fs: "font-size: {1em}"
  lh: "line-height: {1.5}"
  ls: "letter-spacing: {0}"
  hlh: "height: {0px}; line-height: {1.5}"

  fn: "float: none"
  fl: "float: left"
  fr: "float: right"

  co: "color: {#333}"

  cl: "clear: left"
  cr: "clear: right"
  cb: "clear: both"

  cd: "cursor: default"
  cp: "cursor: pointer"
  ct: "cursor: text"

  cu:   "cursor: {default|pointer|text}"
  cut:  "cursor: text"
  cup:  "cursor: pointer"
  cud:  "cursor: default"
  cuna: "cursor: not-allowed"
  cuew: "cursor: ew-resize"
  cuns: "cursor: ns-resize"

  d:   "display: {none|inline|block}"
  di:  "display: inline"
  df:  "display: flex"
  dif: "display: inline-flex"
  dn:  "display: none"
  db:  "display: block"
  dib: "display: inline-block"
  dt:  "display: table"
  dtc: "display: table-cell"
  dtr: "display: table-row"

  fsn: "font-style: normal"
  fsi: "font-style: italic"

  fwn:  "font-weight: normal"
  fwb:  "font-weight: bold"
  fw1:  "font-weight: 100"
  fw2:  "font-weight: 200"
  fw3:  "font-weight: 300"
  fw4:  "font-weight: 400"
  fw5:  "font-weight: 500"
  fw6:  "font-weight: 600"
  fw7:  "font-weight: 700"
  fw8:  "font-weight: 800"
  fw9:  "font-weight: 900"

  lstc:  "list-style-type: circle"
  lstd:  "list-style-type: disc"
  lstn:  "list-style-type: none"
  lsts:  "list-style-type: square"
  lstu:  "list-style-type: upper-roman"
  lstl:  "list-style-type: lower-alpha"
  lsn:  "list-style: none"

  wwb: "word-wrap: break-word"
  wwn: "word-wrap: normal"

  va:  "vertical-align: {top|bottom|baseline|middle}"
  vat:  "vertical-align: top"
  vab:  "vertical-align: bottom"
  vabl: "vertical-align: baseline"
  vam:  "vertical-align: middle"

  v: "visibility: {visible|hidden|collapse}"
  vh: "visibility: hidden"
  vv: "visibility: visible"

  bcc: "border-collapse: collapse"

  ttu: "text-transform: uppercase"
  ttl: "text-transform: lowercase"
  ttc: "text-transform: capitalize"
  ttn: "text-transform: none"

  td:   "text-decoration: {none|underline|strikethrough}"
  tdu:  "text-decoration: underline"
  tdn:  "text-decoration: none"
  tdlt: "text-decoration: line-through"

  ti: "text-indent: {0}"

  tsh: "text-shadow: {0 1px 0 #333}"

  o:  "overflow: {hidden|auto|scroll}"
  os: "overflow: scroll"
  oh: "overflow: hidden"
  oa: "overflow: auto"

  oxs: "overflow-x: scroll"
  oxh: "overflow-x: hidden"
  oxa: "overflow-x: auto"

  oys: "overflow-y: scroll"
  oyh: "overflow-y: hidden"
  oya: "overflow-y: auto"

  ta:  "text-align: {left|right|center|justify}"
  tar: "text-align: right"
  tal: "text-align: left"
  tac: "text-align: center"
  taj: "text-align: justify"

  poa: "position: absolute"
  pof: "position: fixed"
  por: "position: relative"
  pos: "position: static"

  l: "left: {0}"
  r: "right: {0}"
  t: "top: {0}"
  b: "bottom: {0}"
  lt: "left: {0}; top: {0}"
  lb: "left: {0}; bottom: {0}"
  rt: "right: {0}; top: {0}"
  rb: "right: {0}; bottom: {0}"

  zi: "z-index: {1}"

  tl:  "table-layout: {fixed|auto}"
  tlf: "table-layout: fixed"
  tla: "table-layout: auto"

  brad:   "border-radius: {3px}"
  btrad:  "border-top-radius: {3px}"
  btlrad: "border-top-left-radius: {3px}"
  btrrad: "border-top-right-radius: {3px}"
  bbrad:  "border-bottom-radius: {3px}"
  bblrad: "border-bottom-left-radius: {3px}"
  bbrrad: "border-bottom-right-radius: {3px}"

  bgs:  "background-size: {cover|contain|auto}"
  bgsc: "background-size: cover"

  bsh: "box-shadow: {0 1px 2px #fff}"

  ws: "white-space: {nowrap}"

# ----------------------------------------------------------------------------
media: # Presets for media queries
# ----------------------------------------------------------------------------

  "@large":
    desc: Larger than standard 960
    snippet: "@media only screen and (min-width: 1180px)"
  "@small":
    desc: Smaller than standard 960
    snippet: "@media only screen and (max-width: 959px)"
  "@tablet":
    desc: Tablet Portrait size to standard 960
    snippet: "@media only screen and (min-width: 768px) and (max-width: 959px)"
  "@mobile":
    desc: All Mobile Sizes
    snippet: "@media only screen and (max-width: 767px)"
  "@mobile-land":
    desc: Mobile Landscape Size to Tablet Portrait
    snippet: "@media only screen and (min-width: 480px) and (max-width: 767px)"
  "@mobile-port":
    desc: Mobile Portrait Size to Mobile Landscape Size
    snippet: "@media only screen and (max-width: 479px)"

# ----------------------------------------------------------------------------
expressions: # Things that are not properties
# ----------------------------------------------------------------------------

  0nr: '0 0 no-repeat'
  cnr: 'center center no-repeat'
  nr: "no-repeat"
  rx: "repeat-x"
  ry: "repeat-y"
  ra: "rgba({0, 0, 0}, {0.5})"

# ----------------------------------------------------------------------------
sass-expressions: # Sass-specific expressions
# ----------------------------------------------------------------------------

  rb: "rgba(black, {0.2})"
  rw: "rgba(white, {0.2})"
  cf: "+pie-clearfix"

# ----------------------------------------------------------------------------
stylus-expressions: # Stylus-specific expressions
# ----------------------------------------------------------------------------

  rb: "rgba(black, {0.2})"
  rw: "rgba(white, {0.2})"
  cf: "clearfix()"

# ----------------------------------------------------------------------------
css3: # converts to Compass mixins in Sass, stays as plain stuff in CSS/Stylus.
# ----------------------------------------------------------------------------
  flx: "flex: {0} {1} {auto}"
  fld: "flex-direction: { row | row-reverse | column | column-reverse }"
  fldr: "flex-direction: row"
  fldrr: "flex-direction: row-reverse"
  fldc: "flex-direction: column"
  fldcr: "flex-direction: column-reverse"
  flo: "order: {1}"
  flw: "flex-wrap: {nowrap|wrap|wrap-reverse}"
  flwn: "flex-wrap: nowrap"
  flww: "flex-wrap: wrap"
  flwr: "flex-wrap: wrap-reverse"
  flg: "flex-grow: {0}"
  fls: "flex-shrink: {1}"
  flf: "flex-flow: {row} {nowrap}"
  flb: "flex-basis: {default} {auto}"
  jc: "justify-content: {flex-start|flex-end|center|space-between|space-around}"
  jcfs: "justify-content: flex-start"
  jcfe: "justify-content: flex-end"
  jcc: "justify-content: center"
  jcsb: "justify-content: space-between"
  jcsa: "justify-content: space-around"
  as: "align-self: {auto|flex-start|flex-end|center|baseline|stretch}"
  asa: "align-self: auto"
  asfs: "align-self: flex-start"
  asfe: "align-self: flex-end"
  asc: "align-self: center"
  asb: "align-self: baseline"
  ass: "align-self: stretch"
  ai: "align-items: {flex-start|flex-end|center|baseline|stretch}"
  aifs: "align-items: flex-start"
  aife: "align-items: flex-end"
  aic: "align-items: center"
  aib: "align-items: baseline"
  ais: "align-items: stretch"
  ac: "align-content: {flex-start|flex-end|center|space-between|space-around|stretch}"
  acc: "align-content: center"
  acfs: "align-content: flex-start"
  acfe: "align-content: flex-end"
  acs: "align-content: stretch"
  acsa: "align-content: space-around"
  acsb: "align-content: space-between"

  bsb: "box-sizing: border-box"
  bsc: "box-sizing: content-box"

  trans:   "transition: {all 300ms ease}"
  xf:      "transform: {scale(1.0)}"
  xform:   "transform: {scale(1.0)}"

  op: "opacity: {0}"
  bgclip: "background-clip: padding-box"

  us:  "user-select: {none|text|toggle|element|elements|all}"
  usa: "user-select: all"
  ust: "user-select: text"
  usn: "user-select: none"

  an: "animation: {name} {300ms linear infinite}"