utils/test/reporting/3rd_party/sass/components/_list.scss

   1 ///\r
   2 /// Phantom by HTML5 UP\r
   3 /// html5up.net | @ajlkn\r
   4 /// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)\r
   5 ///\r
   6 \r
   7 /* List */\r
   8 \r
   9         ol {\r
  10                 list-style: decimal;\r
  11                 margin: 0 0 _size(element-margin) 0;\r
  12                 padding-left: 1.25em;\r
  13 \r
  14                 li {\r
  15                         padding-left: 0.25em;\r
  16                 }\r
  17         }\r
  18 \r
  19         ul {\r
  20                 list-style: disc;\r
  21                 margin: 0 0 _size(element-margin) 0;\r
  22                 padding-left: 1em;\r
  23 \r
  24                 li {\r
  25                         padding-left: 0.5em;\r
  26                 }\r
  27 \r
  28                 &.alt {\r
  29                         list-style: none;\r
  30                         padding-left: 0;\r
  31 \r
  32                         li {\r
  33                                 border-top: solid _size(border-width) _palette(border);\r
  34                                 padding: 0.5em 0;\r
  35 \r
  36                                 &:first-child {\r
  37                                         border-top: 0;\r
  38                                         padding-top: 0;\r
  39                                 }\r
  40                         }\r
  41                 }\r
  42 \r
  43                 &.icons {\r
  44                         cursor: default;\r
  45                         list-style: none;\r
  46                         padding-left: 0;\r
  47                         margin: -1em 0 _size(element-margin) -1em;\r
  48 \r
  49                         li {\r
  50                                 display: inline-block;\r
  51                                 padding: 1em 0 0 1em;\r
  52                         }\r
  53                 }\r
  54 \r
  55                 &.actions {\r
  56                         cursor: default;\r
  57                         list-style: none;\r
  58                         padding-left: 0;\r
  59 \r
  60                         li {\r
  61                                 display: inline-block;\r
  62                                 padding: 0 (_size(element-margin) * 0.5) 0 0;\r
  63                                 vertical-align: middle;\r
  64 \r
  65                                 &:last-child {\r
  66                                         padding-right: 0;\r
  67                                 }\r
  68                         }\r
  69 \r
  70                         &.small {\r
  71                                 li {\r
  72                                         padding: 0 (_size(element-margin) * 0.25) 0 0;\r
  73                                 }\r
  74                         }\r
  75 \r
  76                         &.vertical {\r
  77                                 li {\r
  78                                         display: block;\r
  79                                         padding: (_size(element-margin) * 0.5) 0 0 0;\r
  80 \r
  81                                         &:first-child {\r
  82                                                 padding-top: 0;\r
  83                                         }\r
  84 \r
  85                                         > * {\r
  86                                                 margin-bottom: 0;\r
  87                                         }\r
  88                                 }\r
  89 \r
  90                                 &.small {\r
  91                                         li {\r
  92                                                 padding: (_size(element-margin) * 0.25) 0 0 0;\r
  93 \r
  94                                                 &:first-child {\r
  95                                                         padding-top: 0;\r
  96                                                 }\r
  97                                         }\r
  98                                 }\r
  99                         }\r
 100 \r
 101                         &.fit {\r
 102                                 display: table;\r
 103                                 margin-left: (_size(element-margin) * -0.5);\r
 104                                 padding: 0;\r
 105                                 table-layout: fixed;\r
 106                                 width: calc(100% + #{(_size(element-margin) * 0.5)});\r
 107 \r
 108                                 li {\r
 109                                         display: table-cell;\r
 110                                         padding: 0 0 0 (_size(element-margin) * 0.5);\r
 111 \r
 112                                         > * {\r
 113                                                 margin-bottom: 0;\r
 114                                         }\r
 115                                 }\r
 116 \r
 117                                 &.small {\r
 118                                         margin-left: (_size(element-margin) * -0.25);\r
 119                                         width: calc(100% + #{(_size(element-margin) * 0.25)});\r
 120 \r
 121                                         li {\r
 122                                                 padding: 0 0 0 (_size(element-margin) * 0.25);\r
 123                                         }\r
 124                                 }\r
 125                         }\r
 126 \r
 127                         @include breakpoint(xsmall) {\r
 128                                 margin: 0 0 _size(element-margin) 0;\r
 129 \r
 130                                 li {\r
 131                                         padding: (_size(element-margin) * 0.5) 0 0 0;\r
 132                                         display: block;\r
 133                                         text-align: center;\r
 134                                         width: 100%;\r
 135 \r
 136                                         &:first-child {\r
 137                                                 padding-top: 0;\r
 138                                         }\r
 139 \r
 140                                         > * {\r
 141                                                 width: 100%;\r
 142                                                 margin: 0 !important;\r
 143 \r
 144                                                 &.icon {\r
 145                                                         &:before {\r
 146                                                                 margin-left: -2em;\r
 147                                                         }\r
 148                                                 }\r
 149                                         }\r
 150                                 }\r
 151 \r
 152                                 &.small {\r
 153                                         li {\r
 154                                                 padding: (_size(element-margin) * 0.25) 0 0 0;\r
 155 \r
 156                                                 &:first-child {\r
 157                                                         padding-top: 0;\r
 158                                                 }\r
 159                                         }\r
 160                                 }\r
 161                         }\r
 162                 }\r
 163         }\r
 164 \r
 165         dl {\r
 166                 margin: 0 0 _size(element-margin) 0;\r
 167 \r
 168                 dt {\r
 169                         display: block;\r
 170                         font-weight: _font(weight-bold);\r
 171                         margin: 0 0 (_size(element-margin) * 0.5) 0;\r
 172                 }\r
 173 \r
 174                 dd {\r
 175                         margin-left: _size(element-margin);\r
 176                 }\r
 177         }