// ============================================================
//          Positioning Mixins                                  
// ------------------------------------------------------------

//**
// Private Mixin: _set-position 
// Set the Position for the Position Mixins
//
// @mixin     _set-position
// @param     $position {list} One Value = top, Two Value = top left, Four Values = top right bottom left (t = zero position) can be in px or %
// @usage:    +_set-position($position)
//          ...
//**
@mixin _set-position($position)
  
  $targets: null !default
  $count: null !default

  $count: length($position)

  @if $count == 1
    $targets: top
  @if $count == 2
    $targets: top left
  @if $count == 4
    $targets: top right bottom left
    
  @for $i from 1 through $count
    @if nth($position,$i) == t
      #{nth($targets,($i))}: 0
    @else
      @if nth($position,$i) > 0 or nth($position,$i) < 0
        @if unitless(nth($position,$i))
          #{nth($targets,($i))}: nth($position,$i) + 0px
        @else
          #{nth($targets,($i))}: nth($position,$i)

//**
// Mixin: relative 
// Relative Positioning Elements
//
// @mixin     relative
// @param     $pos {list} One Value = top, Two Value = top left, Four Values = top right bottom left (t = zero position) can be in px or %
// @usage:    +relative(1)
//          ...
//**
@mixin relative($pos: 0)
  position: relative
  +_set-position($pos)

//**
// Mixin: absolute 
// Absolute Positioning Elements
//
// @mixin     absolute
// @param     $pos {list} One Value = top, Two Value = top left, Four Values = top right bottom left (t = zero position) can be in px or %
// @usage:    +absolute(10 10%)
//          ...
//**
@mixin absolute($pos: 0 0 0 0)
  position: absolute
  +_set-position($pos)

//**
// Mixin: fixed 
// Fixed Positioning Elements
//
// @mixin     fixed
// @param     $pos {list} One Value = top, Two Value = top left, Four Values = top right bottom left (t = zero position) can be in px or %
// @usage:    +fixed(10)
//          ...
//**
@mixin fixed($pos: 0 0 0 0)
  position: fixed
  +_set-position($pos)  

//**
// Mixin: static 
// Reset CSS Position Methods
//
// @mixin     static
// @usage:    +static
//          ...
//**
@mixin static
  position: static
  left: inherit
  right: inherit
  top: inherit
  bottom: inherit


//**
// Mixin: bar-top 
// Define a Top Bar at the Top of the Viewport
//
// @mixin     bar-top
// @param     $z-index {value} The Z-Index
// @param     $variant {value} f for position:fixed, a for position:absolute
// @usage:    +bar-top($z-index, $variant)
//          ...
//**
@mixin bar-top($z-index: 9999,$variant: f)
  @if $variant == f
    +fixed(t t)
  @else
    +absolute(t t)
  width: 100%
  z-index: $z-index

//**
// Mixin: bar-bottom 
// Define a Bottom Bar at the Bottom of the Viewport
//
// @mixin     bar-bottom
// @param     $z-index {value} The Z-Index
// @param     $variant {value} f for position:fixed, a for position:absolute
// @usage:    +bar-bottom($z-index, $variant)
//          ...
//**
@mixin bar-bottom($z-index: 999, $variant: f)
  @if $variant == f
    +fixed(0 0 t t)
  @else
    +absolute(0 0 t t)
  width: 100%
  z-index: $z-index

//**
// Mixin: absolute-middle 
// Moving an absolute position element in the Center - optional in the Middle (with Height)
//
// @mixin     absolute-middle
// @param     $element {list} Width and the Height of the Element (in PX). 
// @usage:    +absolute-middle($element: 100 200)
//          ...
//**
@mixin absolute-middle($element: 0 0)
  $width  : 0 !default
  $height : 0 !default

  @if length($element) == 2
    $width  : nth($element,1)
    $height : nth($element,2)

  @if length($element) == 1
    $width: $element

  @if unitless($width)
    $width: $width + 0px
  @if unitless($height)
    $height: $height + 0px

  position: absolute

  @if $height > 0
    top: 50%
  left: 50%

  @if $height > 0
    margin-top: 0 - ($height / 2)
  margin-left: 0 - ($width / 2)

  @if $height > 0 
    height: $height
  width: $width 

//**
// Mixin: element-middle 
// Moving an Element in the Middle and Center
//
// @mixin     element-middle
// @param     $container {list} The Width and the Height of the outer Container (in PX)
// @param     $element {list} The Width and the Height of the positioned inner Element (in PX)
// @usage:    +element-middle($container: 400 200,$element: 88 40)
//          ...
//**
@mixin element-middle($container: 0, $element: 0)
  margin  : 0
  padding : 0
  $container-height : 0 !default
  $container-width  : 0 !default
  $element-height   : 0 !default
  $element-width    : 0 !default

  @if length($container) == 2
    $container-width  : nth($container,1)
    $container-height : nth($container,2)
  @if length($container) == 1
    $container-height : $container

  @if length($element) == 2
    $element-width  : nth($element,1)
    $element-height : nth($element,2)
  @if length($element) == 1
    $element-height : $element

  @if unitless($element-height)
    $element-height: $element-height + 0px
  @if unitless($element-width)
    $element-width: $element-width + 0px
  @if unitless($container-height)
    $container-height : $container-height + 0px
  @if unitless($container-width)
    $container-width: $container-width + 0px

  margin-top: ($container-height - $element-height) / 2

  @if $element-width > 0
    margin-left : ($container-width - $element-width) / 2
    width       : $element-width

  height: $element-height

//**
// Mixin: centering 
// Centering a element
//
// @mixin     centering
// @param     $size {list} The Width and the Height of the outer Container (in %) [:default => false]
// @param     $index {value} The Layerindex (in PX) [:default => false]
// @param     $box {list} The min-widht, max-width, min-height, max-height of the Container (in PX) [:default => false]
// @usage:    +centering($size, $index, $box)
//          ...
//**
@mixin centering($size: false, $index: false, $box: false)
  margin: auto
  position: absolute
  top: 0 
  left: 0 
  bottom: 0 
  right: 0
  
  @if $size != false
    +size($size)
  @if $index != false
    z-index: $index

  @if $box != false
    @if nth($box,1) > 0
      min-width: nth($box,1) + 0px
    @if nth($box,2) > 0
      max-width: nth($box,2) + 0px
    @if nth($box,3) > 0
      min-height: nth($box,3) + 0px
    @if nth($box,4) > 0
      max-height: nth($box,4) + 0px


//**
// Mixin: shift 
// Gives a Layer a new Z-Index
//
// @mixin     shift
// @param     $index {number} The Z_index
// @param     $position {string} The Positioning [:values => false, r(relative), a (absolute)]
// @usage:    +shift($index,$position)
//          ...
//**
@mixin shift($index, $position: false)
  @if $position != false
    @if $position == r
      position: relative
    @if $position == a
      position: absolute
  z-index: $index

//**
// Mixin: offset 
// Brings a absolute or relative element up and set the margin-bottom
//
// @mixin     offset
// @param     $offset {list} The Offset Value - only one value [vertical] two values [vertical / horizontal]
// @param     $position {string} The Positioning [:values => false, r(relative), a (absolute)]
// @usage:    +offset($offset,$position)
//          ...
//**
@mixin offset($offset, $position: false)
  @if $position != false
    @if $position == r
      position: relative
    @if $position == a
      position: absolute

  @if length($offset) == 2
    top: nth($offset,1) + 0px
    @if nth($offset,1) < 0
      margin-bottom: nth($offset,1) + 0px
    @else
      margin-bottom: nth($offset,1) + 0px

    left: nth($offset,2) + 0px
    @if nth($offset,2) < 0
      margin-right: nth($offset,2) + 0px
    @else
      margin-right: nth($offset,2) + 0px

  @if length($offset) == 1
    top: $offset + 0px
    @if $offset < 0
      margin-bottom: $offset + 0px
    @else
      margin-bottom: $offset + 0px

//**
// Mixin: hangover 
// Overlapps a Element over the Side Padding
//
// @mixin     hangover
// @param     $size {list} The Sidevalues, one value can be used for two sides, two values first for left second for right
// @usage:    +hangover($size)
//          ...
//**
@mixin hangover($size)
  @if length($size) == 1
    margin-left: 0 - $size + 0px
    margin-right: 0 - $size + 0px

  @if length($size) == 2
    margin-left: 0 - nth($size,1) + 0px
    margin-right: 0 - nth($size,2) + 0px