summaryrefslogtreecommitdiff
path: root/source/bower_components/foundation/scss/foundation/components/_inline-lists.scss
blob: 9ee162dfd4548d96489472d87749be22a40f501d (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
// Foundation by ZURB
// foundation.zurb.com
// Licensed under MIT Open Source

@import "global";

//
// @variables
//
$include-html-inline-list-classes: $include-html-classes !default;

// We use this to control the margins and padding of the inline list.
$inline-list-top-margin: 0 !default;
$inline-list-opposite-margin: 0 !default;
$inline-list-bottom-margin: rem-calc(17) !default;
$inline-list-default-float-margin: rem-calc(-22) !default;
$inline-list-default-float-list-margin: rem-calc(22) !default;

$inline-list-padding: 0 !default;

// We use this to control the overflow of the inline list.
$inline-list-overflow: hidden !default;

// We use this to control the list items
$inline-list-display: block !default;

// We use this to control any elements within list items
$inline-list-children-display: block !default;

//
// @mixins
//
// We use this mixin to create inline lists
@mixin inline-list {
  margin: $inline-list-top-margin auto $inline-list-bottom-margin auto;
  margin-#{$default-float}: $inline-list-default-float-margin;
  margin-#{$opposite-direction}: $inline-list-opposite-margin;
  padding: $inline-list-padding;
  list-style: none;
  overflow: $inline-list-overflow;

  & > li {
    list-style: none;
    float: $default-float;
    margin-#{$default-float}: $inline-list-default-float-list-margin;
    display: $inline-list-display;
    &>* { display: $inline-list-children-display; }
  }
}

@include exports("inline-list") {
  @if $include-html-inline-list-classes {
    .inline-list {
      @include inline-list();
    }
  }
}