wcfsetup/install/files/style/element/list.scss

   1 /* makes an inline-list */
   2 .inlineList {
   3         @include inlineList;
   4 }
   5
   6 /* restores the native styling for lists */
   7 .nativeList {
   8         margin: 1em 0 1em 40px;
   9
  10         li {
  11                 margin: 7px 0;
  12         }
  13 }
  14 ul.nativeList {
  15         list-style-type: disc;
  16 }
  17 ol.nativeList {
  18         list-style-type: decimal;
  19 }
  20
  21 /* tag cloud list */
  22 .tagList {
  23         @include inlineList;
  24
  25         align-items: baseline;
  26         margin-bottom: -4px;
  27         margin-right: -8px;
  28
  29         > li {
  30                 margin-bottom: 4px;
  31                 margin-right: 8px;
  32         }
  33
  34         .tag {
  35                 background-color: $wcfButtonBackground;
  36                 color: $wcfButtonText;
  37                 display: inline-block;
  38                 margin-left: 11px;
  39                 padding: 3px 6px 2px 2px;
  40                 position: relative;
  41                 text-decoration: none;
  42                 text-transform: uppercase;
  43
  44                 @include wcfFontSmall;
  45                 @include wcfFontBold;
  46
  47                 &::before {
  48                         border: 11px solid transparent;
  49                         border-left-width: 0;
  50                         border-right-color: $wcfButtonBackground;
  51                         content: "";
  52                         display: block;
  53                         left: -11px;
  54                         position: absolute;
  55                         top: 0;
  56                 }
  57
  58                 &:hover {
  59                         background-color: $wcfButtonPrimaryBackgroundActive;
  60                         color: $wcfButtonPrimaryTextActive;
  61                         text-decoration: none;
  62
  63                         &::before {
  64                                 border-right-color: $wcfButtonPrimaryBackgroundActive;
  65                         }
  66                 }
  67         }
  68
  69         .tagWeight1 {
  70                 font-size: 12px;
  71         }
  72
  73         .tagWeight2 {
  74                 font-size: 14px;
  75         }
  76
  77         .tagWeight3 {
  78                 font-size: 16px;
  79         }
  80
  81         .tagWeight4 {
  82                 font-size: 18px;
  83         }
  84
  85         .tagWeight5 {
  86                 font-size: 20px;
  87         }
  88
  89         .tagWeight6 {
  90                 font-size: 23px;
  91         }
  92
  93         .tagWeight7 {
  94                 font-size: 28px;
  95         }
  96 }
  97
  98 /* list of smileys */
  99 .smileyList {
 100         align-items: center;
 101
 102         @include screen-lg {
 103                 margin-bottom: -5px;
 104
 105                 > li {
 106                         margin-bottom: 5px;
 107                 }
 108         }
 109 }
 110
 111 /* legacy styling (deprecated) */
 112 ol.dataList,
 113 ul.dataList {
 114         @include inlineList;
 115         @include wcfFontSmall;
 116
 117         > li {
 118                 &:not(:last-child):after {
 119                         content: ",";
 120                         padding-left: 1px;
 121                 }
 122         }
 123 }