fomantic-ui 2.9.1-beta.2 → 2.9.1-beta.21

package/src/definitions/elements/divider.less

@@ -12,203 +12,194 @@
             Theme
 *******************************/
 
-@type    : 'element';
+@type : 'element';
 @element : 'divider';
 
 @import (multiple) '../../theme.config';
 
-
 /*******************************
             Divider
 *******************************/
 
 .ui.divider {
-  margin: @margin;
-
-  line-height: 1;
-  height: 0;
-
-  font-weight: @fontWeight;
-  text-transform: @textTransform;
-  letter-spacing: @letterSpacing;
-  color: @color;
-
-  user-select: none;
-  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+    margin: @margin;
+    line-height: 1;
+    height: 0;
+    font-weight: @fontWeight;
+    text-transform: @textTransform;
+    letter-spacing: @letterSpacing;
+    color: @color;
+    user-select: none;
+    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 }
 
-/*--------------
+/* --------------
       Basic
----------------*/
+--------------- */
 
 .ui.divider:not(.vertical):not(.horizontal) {
-  border-top: @shadowWidth @borderStyle @shadowColor;
-  border-bottom: @highlightWidth @borderStyle @highlightColor;
+    border-top: @shadowWidth @borderStyle @shadowColor;
+    border-bottom: @highlightWidth @borderStyle @highlightColor;
 }
 
-/*--------------
+/* --------------
     Coupling
----------------*/
+--------------- */
 
 /* Allow divider between each column row */
 .ui.grid > .column + .divider,
 .ui.grid > .row > .column + .divider {
-  left: auto;
+    left: auto;
 }
 
 & when (@variationDividerHorizontal) {
-  /*--------------
-     Horizontal
-  ---------------*/
+    /* --------------
+       Horizontal
+    --------------- */
+
+    .ui.horizontal.divider {
+        display: table;
+        white-space: nowrap;
+        height: auto;
+        margin: @horizontalMargin;
+        line-height: 1;
+        text-align: center;
+    }
 
-  .ui.horizontal.divider {
-    display: table;
-    white-space: nowrap;
+    .ui.horizontal.divider::before,
+    .ui.horizontal.divider::after {
+        content: '';
+        display: table-cell;
+        position: relative;
+        top: 50%;
+        width: 50%;
+        background-repeat: no-repeat;
+    }
 
-    height: auto;
-    margin: @horizontalMargin;
-    line-height: 1;
-    text-align: center;
-  }
-
-  .ui.horizontal.divider::before,
-  .ui.horizontal.divider::after {
-    content: '';
-    display: table-cell;
-    position: relative;
-    top: 50%;
-    width: 50%;
-    background-repeat: no-repeat;
-  }
-
-  .ui.horizontal.divider::before {
-    background-position: right @horizontalDividerMargin top 50%;
-  }
-  .ui.horizontal.divider::after {
-    background-position: left @horizontalDividerMargin top 50%;
-  }
+    .ui.horizontal.divider::before {
+        background-position: right @horizontalDividerMargin top 50%;
+    }
+    .ui.horizontal.divider::after {
+        background-position: left @horizontalDividerMargin top 50%;
+    }
 }
 
 & when (@variationDividerVertical) {
-  /*--------------
-      Vertical
-  ---------------*/
-
-  .ui.vertical.divider {
-    position: absolute;
-    z-index: 2;
-    top: 50%;
-    left: 50%;
-
-    margin: 0;
-    padding: 0;
-    width: auto;
-    height: 50%;
-
-    line-height: 0;
-    text-align: center;
-    transform: translateX(-50%);
-  }
-
-  .ui.vertical.divider::before,
-  .ui.vertical.divider::after {
-    position: absolute;
-    left: 50%;
-    content: '';
-    z-index: 3;
-
-    border-left: @shadowWidth @borderStyle @shadowColor;
-    border-right: @highlightWidth @borderStyle @highlightColor;
-
-    width: 0;
-    height: @verticalDividerHeight;
-  }
-
-  .ui.vertical.divider::before {
-    top: -100%;
-  }
-  .ui.vertical.divider::after {
-    top: auto;
-    bottom: 0;
-  }
-
-  /* Inside grid */
-  @media only screen and (max-width : @largestMobileScreen) {
-
-    .ui.stackable.grid .ui.vertical.divider,
-    .ui.grid .stackable.row .ui.vertical.divider {
-      display: table;
-      white-space: nowrap;
-      height: auto;
-      margin: @horizontalMargin;
-      overflow: hidden;
-      line-height: 1;
-      text-align: center;
-      position: static;
-      top: 0;
-      left: 0;
-      transform: none;
+    /* --------------
+        Vertical
+    --------------- */
+
+    .ui.vertical.divider {
+        position: absolute;
+        z-index: 2;
+        top: 50%;
+        left: 50%;
+        margin: 0;
+        padding: 0;
+        width: auto;
+        height: 50%;
+        line-height: 0;
+        text-align: center;
+        transform: translateX(-50%);
     }
 
-    .ui.stackable.grid .ui.vertical.divider::before,
-    .ui.grid .stackable.row .ui.vertical.divider::before,
-    .ui.stackable.grid .ui.vertical.divider::after,
-    .ui.grid .stackable.row .ui.vertical.divider::after {
-      left: 0;
-      border-left: none;
-      border-right: none;
-      content: '';
-      display: table-cell;
-      position: relative;
-      top: 50%;
-      width: 50%;
-      background-repeat: no-repeat;
+    .ui.vertical.divider::before,
+    .ui.vertical.divider::after {
+        position: absolute;
+        left: 50%;
+        content: '';
+        z-index: 3;
+        border-left: @shadowWidth @borderStyle @shadowColor;
+        border-right: @highlightWidth @borderStyle @highlightColor;
+        width: 0;
+        height: @verticalDividerHeight;
     }
 
-    .ui.stackable.grid .ui.vertical.divider::before,
-    .ui.grid .stackable.row .ui.vertical.divider::before {
-      background-position: right @horizontalDividerMargin top 50%;
+    .ui.vertical.divider::before {
+        top: -100%;
     }
-    .ui.stackable.grid .ui.vertical.divider::after,
-    .ui.grid .stackable.row .ui.vertical.divider::after {
-      background-position: left @horizontalDividerMargin top 50%;
+    .ui.vertical.divider::after {
+        top: auto;
+        bottom: 0;
+    }
+
+    /* Inside grid */
+    @media only screen and (max-width: @largestMobileScreen) {
+
+        .ui.stackable.grid .ui.vertical.divider,
+        .ui.grid .stackable.row .ui.vertical.divider {
+            display: table;
+            white-space: nowrap;
+            height: auto;
+            margin: @horizontalMargin;
+            overflow: hidden;
+            line-height: 1;
+            text-align: center;
+            position: static;
+            top: 0;
+            left: 0;
+            transform: none;
+        }
+
+        .ui.stackable.grid .ui.vertical.divider::before,
+        .ui.grid .stackable.row .ui.vertical.divider::before,
+        .ui.stackable.grid .ui.vertical.divider::after,
+        .ui.grid .stackable.row .ui.vertical.divider::after {
+            left: 0;
+            border-left: none;
+            border-right: none;
+            content: '';
+            display: table-cell;
+            position: relative;
+            top: 50%;
+            width: 50%;
+            background-repeat: no-repeat;
+        }
+
+        .ui.stackable.grid .ui.vertical.divider::before,
+        .ui.grid .stackable.row .ui.vertical.divider::before {
+            background-position: right @horizontalDividerMargin top 50%;
+        }
+        .ui.stackable.grid .ui.vertical.divider::after,
+        .ui.grid .stackable.row .ui.vertical.divider::after {
+            background-position: left @horizontalDividerMargin top 50%;
+        }
     }
-  }
 }
 
 & when (@variationDividerIcon) {
-  /*--------------
-        Icon
-  ---------------*/
-
-  .ui.divider > .icon {
-    margin: @dividerIconMargin;
-    font-size: @dividerIconSize;
-    height: 1em;
-    vertical-align: middle;
-  }
+    /* --------------
+          Icon
+    --------------- */
+
+    .ui.divider > .icon {
+        margin: @dividerIconMargin;
+        font-size: @dividerIconSize;
+        height: 1em;
+        vertical-align: middle;
+    }
 }
 
 & when (@variationDividerHorizontal) {
-  /*--------------
-       Header
-  ---------------*/
-  .ui.horizontal.divider[class*="left aligned"] {
-    &::before {
-      display: none;
+    /* --------------
+         Header
+    --------------- */
+    .ui.horizontal.divider[class*="left aligned"] {
+        &::before {
+            display: none;
+        }
+        &::after {
+            width: 100%;
+        }
     }
-    &::after {
-      width: 100%;
+    .ui.horizontal.divider[class*="right aligned"] {
+        &::before {
+            width: 100%;
+        }
+        &::after {
+            display: none;
+        }
     }
-  }
-  .ui.horizontal.divider[class*="right aligned"] {
-    &::before {
-      width: 100%;
-    }
-    &::after {
-      display: none;
-    }
-  }
 }
 
 /*******************************
@@ -216,83 +207,83 @@
 *******************************/
 
 & when (@variationDividerHidden) {
-  /*--------------
-      Hidden
-  ---------------*/
-
-  .ui.hidden.divider {
-    border-color: transparent !important;
-  }
-
-  .ui.hidden.divider::before,
-  .ui.hidden.divider::after {
-    display: none;
-  }
+    /* --------------
+        Hidden
+    --------------- */
+
+    .ui.hidden.divider {
+        border-color: transparent !important;
+    }
+
+    .ui.hidden.divider::before,
+    .ui.hidden.divider::after {
+        display: none;
+    }
 }
 
-/*--------------
+/* --------------
     Inverted
----------------*/
+--------------- */
 & when (@variationDividerInverted) {
-  .ui.divider.inverted,
-  .ui.vertical.inverted.divider,
-  .ui.horizontal.inverted.divider {
-    color: @invertedTextColor;
-  }
-  .ui.divider.inverted,
-  .ui.divider.inverted::after,
-  .ui.divider.inverted::before {
-    border-top-color: @invertedShadowColor !important;
-    border-left-color: @invertedShadowColor !important;
-    border-bottom-color: @invertedHighlightColor !important;
-    border-right-color: @invertedHighlightColor !important;
-  }
+    .ui.divider.inverted,
+    .ui.vertical.inverted.divider,
+    .ui.horizontal.inverted.divider {
+        color: @invertedTextColor;
+    }
+    .ui.divider.inverted,
+    .ui.divider.inverted::after,
+    .ui.divider.inverted::before {
+        border-top-color: @invertedShadowColor !important;
+        border-left-color: @invertedShadowColor !important;
+        border-bottom-color: @invertedHighlightColor !important;
+        border-right-color: @invertedHighlightColor !important;
+    }
 }
 
-/*--------------
+/* --------------
     Fitted
----------------*/
+--------------- */
 & when (@variationDividerFitted) {
-  .ui.fitted.divider {
-    margin: 0;
-  }
+    .ui.fitted.divider {
+        margin: 0;
+    }
 }
 
 & when (@variationDividerClearing) {
-  /*--------------
-      Clearing
-  ---------------*/
+    /* --------------
+        Clearing
+    --------------- */
 
-  .ui.clearing.divider {
-    clear: both;
-  }
+    .ui.clearing.divider {
+        clear: both;
+    }
 }
 
 & when (@variationDividerSection) {
-  /*--------------
-      Section
-  ---------------*/
-
-  .ui.section.divider {
-    margin-top: @sectionMargin;
-    margin-bottom: @sectionMargin;
-  }
+    /* --------------
+        Section
+    --------------- */
+
+    .ui.section.divider {
+        margin-top: @sectionMargin;
+        margin-bottom: @sectionMargin;
+    }
 }
 
-/*--------------
+/* --------------
      Sizes
----------------*/
+--------------- */
 
 .ui.divider {
-  font-size: @medium;
+    font-size: @medium;
 }
 & when not (@variationDividerSizes = false) {
-  each(@variationDividerSizes, {
-    @s: @@value;
-    .ui.@{value}.divider {
-      font-size: @s;
-    }
-  })
+    each(@variationDividerSizes, {
+        @s: @@value;
+        .ui.@{value}.divider {
+            font-size: @s;
+        }
+    })
 }
 
 .loadUIOverrides();

package/src/definitions/elements/emoji.less

@@ -8,94 +8,87 @@
  *
  */
 
-
 /*******************************
             Theme
 *******************************/
 
-@type    : 'element';
+@type : 'element';
 @element : 'emoji';
 
 @import (multiple) '../../theme.config';
 
-
 /*******************************
              Emoji
 *******************************/
 
-
 em[data-emoji] {
-  opacity: @opacity;
-
-  speak: none;
-  backface-visibility: hidden;
+    opacity: @opacity;
+    speak: none;
+    backface-visibility: hidden;
 }
 
 em[data-emoji]::before {
-  content:'\00A0\00A0\00A0\00A0\00A0\00A0\00A0';
-  display: inline-block;
-  line-height: @emojiLineHeight;
-  background-repeat: no-repeat;
-  background-position: center center;
-  & when not (@emojiFileType = 'svg') {
-    background-size: contain;
-  }
+    content: '\00A0\00A0\00A0\00A0\00A0\00A0\00A0';
+    display: inline-block;
+    line-height: @emojiLineHeight;
+    background-repeat: no-repeat;
+    background-position: center center;
+    & when not (@emojiFileType = 'svg') {
+        background-size: contain;
+    }
 }
 
-
 /*******************************
              States
 *******************************/
 
 & when (@variationEmojiDisabled) {
-  em[data-emoji].disabled {
-    opacity: @disabledOpacity;
-  }
+    em[data-emoji].disabled {
+        opacity: @disabledOpacity;
+    }
 }
 
-
 /*******************************
            Variations
 *******************************/
 
 & when (@variationEmojiLoading) {
-  em[data-emoji].loading::before {
-    animation: loader @loadingDuration linear infinite;
-  }
+    em[data-emoji].loading::before {
+        animation: loader @loadingDuration linear infinite;
+    }
 }
 
-
 & when (@variationEmojiLink) {
-  /*-------------------
-           Link
-  --------------------*/
+    /* -------------------
+             Link
+    -------------------- */
 
-  em[data-emoji].link:not(.disabled) {
-    cursor: pointer;
-  }
+    em[data-emoji].link:not(.disabled) {
+        cursor: pointer;
+    }
 }
 
-/*rtl:begin:ignore*/
+/* rtl:begin:ignore */
 
 each(@size-map, {
-  em[data-emoji].@{key} {
-    font-size: 1.5em * @value;
-    vertical-align: middle;
-  }
+    em[data-emoji].@{key} {
+        font-size: 1.5em * @value;
+        vertical-align: middle;
+    }
 });
 
 each(@emoji-map,{
-  & when (@variationEmojiColons) {
-    em[data-emoji=":@{value}:"]::before {
-      background-image: url("@{emojiPath}@{key}.@{emojiFileType}");
+    & when (@variationEmojiColons) {
+        em[data-emoji=":@{value}:"]::before {
+            background-image: url("@{emojiPath}@{key}.@{emojiFileType}");
+        }
+        em[data-emoji="@{value}"]::before:extend(em[data-emoji=":@{value}:"]::before) when (@variationEmojiNoColons) {}
+    }
+    em[data-emoji="@{value}"]::before when (@variationEmojiNoColons) and not (@variationEmojiColons) {
+        background-image: url("@{emojiPath}@{key}.@{emojiFileType}");
     }
-    em[data-emoji="@{value}"]::before:extend(em[data-emoji=":@{value}:"]::before) when (@variationEmojiNoColons) {}
-  }
-  em[data-emoji="@{value}"]::before when (@variationEmojiNoColons) and not (@variationEmojiColons) {
-    background-image: url("@{emojiPath}@{key}.@{emojiFileType}");
-  }
 });
 
-/*rtl:end:ignore*/
+/* rtl:end:ignore */
 
 .loadUIOverrides();