/*!markdown

---
title: Position
---

定位相关样式。

| Class       | Properties               |
| ----------- | ------------------------ |
| static  | position: static; |
| fixed  | position: fixed; |
| absolute  | position: absolute; |
| relative  | position: relative; |
| sticky  | position: sticky; |

## 用法

请前往一下文档查看属性含义。

https://www.w3school.com.cn/cssref/pr_class_position.asp

# 响应式设计

支持通过添加设备前缀 `m:` 或者 `pc:` 来分别针对「手机端」或者「pc端」设置样式，更多说明请前往[「响应式设计」](../../../docs/style/responsive-design.md)。

*/

@mixin make-position($prefix: '.') {
  @each $name,
    $value
      in (
        static: static,
        fixed: fixed,
        absolute: absolute,
        relative: relative,
        sticky: sticky
      )
  {
    #{$prefix + $name} {
      position: $value;
    }
  }
}

@include make-position();
@each $deivce in map-keys($devices) {
  @include media-device($deivce) {
    @include make-position('.' + selector-escape($deivce + ':'));
  }
}
