Jeet 5.3.0 - One file for random use

jeet.styl

// Grid Settings
jeet = {
  gutter: 3,
  parent-first: false,
  layout-direction: LTR
}

g = jeet.gutter

-get_span(ratio = 1)
  return ratio * 100

-get_column(ratios = 1, g = jeet.gutter)
  ratios = -reverse(ratios) unless jeet.parent-first is true
  w = 100
  for ratio in ratios
    g = g / w * 100
    w = 100 * ratio - g + ratio * g
  return w g

-get_layout_direction()
  jeet.layout-direction == RTL ? result = right : result = left
  return result

-replace_nth(list, index, value)
  result = ()
  index = length(list) + index if index < 0
  for i in (0..(length(list) - 1))
    if i == index
      append(result, value)
    else
      append(result, list[i])
  return result

-reverse(list)
  result = ()
  for item in list
    prepend(result, item)
  return result

// Columns with Gutters
column(ratios = 1, offset = 0, cycle = 0, uncycle = 0, gutter = jeet.gutter)
  side = -get_layout_direction()
  column_widths = -get_column(ratios, gutter)
  margin_l = margin_last = 0
  margin_r = column_widths[1]
  unless offset == 0
    if offset < 0
      offset *= -1
      offset = -get_column(offset, column_widths[1])[0]
      margin_r = margin_last = offset + column_widths[1] * 2
    else
      offset = -get_column(offset, column_widths[1])[0]
      margin_l = offset + column_widths[1]
  cf()
  float: side
  clear: none
  text-align: inherit
  padding-left: 0
  padding-right: 0
  width: (column_widths[0])%
  margin-{side}: (margin_l)%
  margin-{opposite-position(side)}: (margin_r)%
  if uncycle != 0
    &:nth-child({uncycle}n)
      margin-{opposite-position(side)}: (margin_r)%
      float: side
    &:nth-child({uncycle}n + 1)
      clear: none
  if cycle != 0
    &:nth-child({cycle}n)
      margin-{opposite-position(side)}: (margin_last)%
      float: opposite-position(side)
    &:nth-child({cycle}n + 1)
      clear: both
  else
    &:last-child
      margin-{opposite-position(side)}: (margin_last)%

col = column

// Columns without Gutters
span(ratio = 1, offset = 0, cycle = 0, uncycle = 0)
  side = -get_layout_direction()
  span_width = -get_span(ratio)
  margin_l = margin_r = 0
  unless offset == 0
    if offset < 0
      offset *= -1
      margin_r = -get_span(offset)
    else
      margin_l = -get_span(offset)
  cf()
  float: side
  clear: none
  padding-left: 0
  padding-right: 0
  text-align: inherit
  width: (span_width)%
  margin-{side}: (margin_l)%
  margin-{opposite-position(side)}: (margin_r)%
  if uncycle != 0
    &:nth-child({uncycle}n)
      float: side
    &:nth-child({uncycle}n + 1)
      clear: none
  if cycle != 0
    &:nth-child({cycle}n)
      float: opposite-position(side)
    &:nth-child({cycle}n + 1)
      clear: both

// Source Ordering
shift(ratios = 0, col_or_span = column, gutter = jeet.gutter)
  side = -get_layout_direction()
  if side == right
    ratios = -replace_nth(ratios, 0, ratios[0] * -1)
  if col_or_span == column or col_or_span == col or col_or_span == c
    column_widths = -get_column(ratios, gutter)
    translate = column_widths[0] + column_widths[1]
  else
    translate = -get_span(ratios)
  position: relative
  left: (translate)%
unshift()
  position: static
  left: 0

// Edit Mode
edit()
  *
    background: rgba(#000, 5%)

// Horizontal Centering Block Elements
center(max_width = 1410px, pad = 0)
  cf()
  width: auto
  max-width: max_width
  float: none
  display: unquote('block')
  margin-right: auto
  margin-left: auto
  padding-left: pad
  padding-right: pad

// Uncenter Elements
uncenter()
  max-width: none
  margin-right: 0
  margin-left: 0
  padding-left: 0
  padding-right: 0

// Stacking/Unstacking Elements
stack(pad = 0, align = false)
  side = -get_layout_direction()
  display: unquote('block')
  clear: both
  float: none
  width: 100%
  margin-left: auto
  margin-right: auto
  &:first-child
    margin-{side}: auto
  &:last-child
    margin-{opposite-position(side)}: auto
  if pad != 0
    padding-left: pad
    padding-right: pad
  if (align is not false)
    if (align == center) or (align == c)
      text-align: center
    if (align == left) or (align == l)
      text-align: left
    if (align == right) or (align == r)
      text-align: right
unstack()
  side = -get_layout_direction()
  display: inline
  clear: none
  width: auto
  margin-left: 0
  margin-right: 0
  &:first-child
    margin-{side}: 0
  &:last-child
    margin-{opposite-position(side)}: 0
  if (jeet.layout-direction == RTL)
    text-align: right
  else
    text-align: left

// Horizontal/Vertical/Both Alignment - Parent container needs position relative. IE9+
align(direction = both)
  position: absolute
  transform-style: preserve-3d
  if (direction == horizontal) or (direction == h)
    left: 50%
    transform: translateX(-50%)
  else if (direction == vertical) or (direction == v)
    top: 50%
    transform: translateY(-50%)
  else
    top: 50%
    left: 50%
    transform: translate(-50%, -50%)

// Clearfix
cf()
  *zoom: 1
  &:before, &:after
    content: ''
    display: table
  &:after
    clear: both