fomantic-ui 2.9.1-beta.0 → 2.9.1-beta.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fomantic-ui",
-  "version": "2.9.1-beta.0+a290620",
+  "version": "2.9.1-beta.10+0533782",
   "description": "Fomantic empowers designers and developers by creating a shared vocabulary for UI.",
   "keywords": [
     "fomantic-ui",
@@ -29,11 +29,11 @@
   },
   "dependencies": {
     "@actions/core": "^1.6.0",
-    "@octokit/core": ">=3",
+    "@octokit/core": "^3.6.0",
     "@octokit/rest": "^16.16.0",
     "better-console": "1.0.1",
     "browserslist": "^4.19.1",
-    "del": "^3.0.0",
+    "del": "^6.1.1",
     "extend": "^3.0.2",
     "gulp": "^4.0.0",
     "gulp-autoprefixer": "^6.0.0",
@@ -44,7 +44,6 @@
     "gulp-concat-css": "^3.1.0",
     "gulp-concat-filenames": "^1.2.0",
     "gulp-copy": "^4.0.0",
-    "gulp-debug": "^4.0.0",
     "gulp-dedupe": "0.0.2",
     "gulp-flatten": "^0.4.0",
     "gulp-git": "^2.9.0",
@@ -52,7 +51,6 @@
     "gulp-if": "^2.0.2",
     "gulp-json-editor": "^2.4.3",
     "gulp-less": "^5.0.0",
-    "gulp-notify": "^3.0.0",
     "gulp-plumber": "^1.1.0",
     "gulp-print": "^5.0.0",
     "gulp-rename": "^1.4.0",

package/src/definitions/behaviors/api.js

@@ -1,10 +1,10 @@
 /*!
  * # Fomantic-UI - API
- * http://github.com/fomantic/Fomantic-UI/
+ * https://github.com/fomantic/Fomantic-UI/
  *
  *
  * Released under the MIT license
- * http://opensource.org/licenses/MIT
+ * https://opensource.org/licenses/MIT
  *
  */
 

package/src/definitions/behaviors/form.js

@@ -1,10 +1,10 @@
 /*!
  * # Fomantic-UI - Form Validation
- * http://github.com/fomantic/Fomantic-UI/
+ * https://github.com/fomantic/Fomantic-UI/
  *
  *
  * Released under the MIT license
- * http://opensource.org/licenses/MIT
+ * https://opensource.org/licenses/MIT
  *
  */
 

package/src/definitions/behaviors/state.js

@@ -1,10 +1,10 @@
 /*!
  * # Fomantic-UI - State
- * http://github.com/fomantic/Fomantic-UI/
+ * https://github.com/fomantic/Fomantic-UI/
  *
  *
  * Released under the MIT license
- * http://opensource.org/licenses/MIT
+ * https://opensource.org/licenses/MIT
  *
  */
 

package/src/definitions/behaviors/visibility.js

@@ -1,10 +1,10 @@
 /*!
  * # Fomantic-UI - Visibility
- * http://github.com/fomantic/Fomantic-UI/
+ * https://github.com/fomantic/Fomantic-UI/
  *
  *
  * Released under the MIT license
- * http://opensource.org/licenses/MIT
+ * https://opensource.org/licenses/MIT
  *
  */
 

package/src/definitions/collections/breadcrumb.less

@@ -1,10 +1,10 @@
 /*!
  * # Fomantic-UI - Breadcrumb
- * http://github.com/fomantic/Fomantic-UI/
+ * https://github.com/fomantic/Fomantic-UI/
  *
  *
  * Released under the MIT license
- * http://opensource.org/licenses/MIT
+ * https://opensource.org/licenses/MIT
  *
  */
 

package/src/definitions/collections/form.less

@@ -1,10 +1,10 @@
 /*!
  * # Fomantic-UI - Form
- * http://github.com/fomantic/Fomantic-UI/
+ * https://github.com/fomantic/Fomantic-UI/
  *
  *
  * Released under the MIT license
- * http://opensource.org/licenses/MIT
+ * https://opensource.org/licenses/MIT
  *
  */
 
@@ -591,7 +591,7 @@
       border-radius: @formStates[@@state][borderRadius];
       box-shadow: @formStates[@@state][boxShadow];
     }
-    & when (@state=error) {
+    & when (@state=error) and (@variationFormInvalid) {
       .ui.form .field input:not(:placeholder-shown):invalid {
         color: @c;
         background: @bg;
@@ -760,7 +760,7 @@
   .ui.form .disabled.fields .field,
   .ui.form .disabled.field,
   .ui.form .field :disabled {
-    pointer-events: none;
+    pointer-events: @disabledPointerEvents;
     opacity: @disabledOpacity;
   }
   .ui.form .field.disabled > label,

package/src/definitions/collections/grid.less

@@ -1,10 +1,10 @@
 /*!
  * # Fomantic-UI - Grid
- * http://github.com/fomantic/Fomantic-UI/
+ * https://github.com/fomantic/Fomantic-UI/
  *
  *
  * Released under the MIT license
- * http://opensource.org/licenses/MIT
+ * https://opensource.org/licenses/MIT
  *
  */
 

package/src/definitions/collections/menu.less

@@ -1,11 +1,11 @@
 /*
  * # Fomantic - Menu
- * http://github.com/fomantic/Fomantic-UI/
+ * https://github.com/fomantic/Fomantic-UI/
  *
  *
  * Copyright 2015 Contributor
  * Released under the MIT license
- * http://opensource.org/licenses/MIT
+ * https://opensource.org/licenses/MIT
  *
  */
 

package/src/definitions/collections/message.less

@@ -1,10 +1,10 @@
 /*!
  * # Fomantic-UI - Message
- * http://github.com/fomantic/Fomantic-UI/
+ * https://github.com/fomantic/Fomantic-UI/
  *
  *
  * Released under the MIT license
- * http://opensource.org/licenses/MIT
+ * https://opensource.org/licenses/MIT
  *
  */
 

package/src/definitions/collections/table.less

@@ -1,10 +1,10 @@
 /*!
  * # Fomantic-UI - Table
- * http://github.com/fomantic/Fomantic-UI/
+ * https://github.com/fomantic/Fomantic-UI/
  *
  *
  * Released under the MIT license
- * http://opensource.org/licenses/MIT
+ * https://opensource.org/licenses/MIT
  *
  */
 
@@ -1556,8 +1556,8 @@
     border-color: @invertedCellBorderColor;
   }
   & when (@variationTableDisabled) {
-    .ui.inverted.table tr.disabled td,
-    .ui.inverted.table tr td.disabled,
+    .ui.ui.ui.inverted.table tr.disabled td,
+    .ui.ui.ui.inverted.table tr td.disabled,
     .ui.inverted.table tr.disabled:hover td,
     .ui.inverted.table tr:hover td.disabled {
       pointer-events: none;

package/src/definitions/elements/button.less

@@ -1,10 +1,10 @@
 /*!
  * # Fomantic-UI - Button
- * http://github.com/fomantic/Fomantic-UI/
+ * https://github.com/fomantic/Fomantic-UI/
  *
  *
  * Released under the MIT license
- * http://opensource.org/licenses/MIT
+ * https://opensource.org/licenses/MIT
  *
  */
 
@@ -1756,101 +1756,93 @@
   })
 }
 
-.addConsequence(@consequence) {
-
-  @_backgroundColor: "@{consequence}Color";
-  @_backgroundColorHover: "@{consequence}ColorHover";
-  @_backgroundColorFocus: "@{consequence}ColorFocus";
-  @_backgroundColorDown: "@{consequence}ColorDown";
-  @_backgroundColorActive: "@{consequence}ColorActive";
-  @_textColor: "@{consequence}TextColor";
-  @_textShadow: "@{consequence}TextShadow";
-
-  /* Standard */
-  .ui.@{consequence}.buttons .button,
-  .ui.@{consequence}.button {
-    background-color: @@_backgroundColor;
-    color: @@_textColor;
-    text-shadow: @@_textShadow;
-    background-image: @coloredBackgroundImage;
-  }
-  .ui.@{consequence}.button {
-    box-shadow: @coloredBoxShadow;
-  }
-  .ui.@{consequence}.buttons .button:hover,
-  .ui.@{consequence}.button:hover {
-    background-color: @@_backgroundColorHover;
-    color: @@_textColor;
-    text-shadow: @@_textShadow;
-  }
-  .ui.@{consequence}.buttons .button:focus,
-  .ui.@{consequence}.button:focus {
-    background-color: @@_backgroundColorFocus;
-    color: @@_textColor;
-    text-shadow: @@_textShadow;
-  }
-  .ui.@{consequence}.buttons .button:active,
-  .ui.@{consequence}.button:active {
-    background-color: @@_backgroundColorDown;
-    color: @@_textColor;
-    text-shadow: @@_textShadow;
-  }
-  .ui.@{consequence}.buttons .active.button,
-  .ui.@{consequence}.buttons .active.button:active,
-  .ui.@{consequence}.active.button,
-  .ui.@{consequence}.button .active.button:active {
-    background-color: @@_backgroundColorActive;
-    color: @@_textColor;
-    text-shadow: @@_textShadow;
-  }
-  & when (@variationButtonBasic) {
-    /* Basic */
-    .ui.basic.@{consequence}.buttons .button,
-    .ui.basic.@{consequence}.button {
-      background: transparent;
-      box-shadow: 0 0 0 @basicBorderSize @@_backgroundColor inset;
-      color: @@_backgroundColor;
-    }
-    .ui.basic.@{consequence}.buttons .button:hover,
-    .ui.basic.@{consequence}.button:hover {
-      background: transparent;
-      box-shadow: 0 0 0 @basicColoredBorderSize @@_backgroundColorHover inset;
-      color: @@_backgroundColorHover;
-    }
-    .ui.basic.@{consequence}.buttons .button:focus,
-    .ui.basic.@{consequence}.button:focus {
-      background: transparent;
-      box-shadow: 0 0 0 @basicColoredBorderSize @@_backgroundColorFocus inset;
-      color: @@_backgroundColorHover;
-    }
-    .ui.basic.@{consequence}.buttons .active.button,
-    .ui.basic.@{consequence}.active.button {
-      background: transparent;
-      box-shadow: 0 0 0 @basicColoredBorderSize @@_backgroundColorActive inset;
-      color: @@_backgroundColorDown;
-    }
-    .ui.basic.@{consequence}.buttons .button:active,
-    .ui.basic.@{consequence}.button:active {
-      box-shadow: 0 0 0 @basicColoredBorderSize @@_backgroundColorDown inset;
-      color: @@_backgroundColorDown;
-    }
-    .ui.buttons:not(.vertical) > .basic.@{consequence}.button:not(:first-child) {
-      margin-left: -@basicColoredBorderSize;
+& when not (@variationButtonConsequences = false) {
+  each(@variationButtonConsequences, {
+    @consequence: @value;
+
+    @_backgroundColor: "@{consequence}Color";
+    @_backgroundColorHover: "@{consequence}ColorHover";
+    @_backgroundColorFocus: "@{consequence}ColorFocus";
+    @_backgroundColorDown: "@{consequence}ColorDown";
+    @_backgroundColorActive: "@{consequence}ColorActive";
+    @_textColor: "@{consequence}TextColor";
+    @_textShadow: "@{consequence}TextShadow";
+
+    /* Standard */
+    .ui.@{consequence}.buttons .button,
+    .ui.@{consequence}.button {
+      background-color: @@_backgroundColor;
+      color: @@_textColor;
+      text-shadow: @@_textShadow;
+      background-image: @coloredBackgroundImage;
     }
-  }
+    .ui.@{consequence}.button {
+      box-shadow: @coloredBoxShadow;
+    }
+    .ui.@{consequence}.buttons .button:hover,
+    .ui.@{consequence}.button:hover {
+      background-color: @@_backgroundColorHover;
+      color: @@_textColor;
+      text-shadow: @@_textShadow;
+    }
+    .ui.@{consequence}.buttons .button:focus,
+    .ui.@{consequence}.button:focus {
+      background-color: @@_backgroundColorFocus;
+      color: @@_textColor;
+      text-shadow: @@_textShadow;
+    }
+    .ui.@{consequence}.buttons .button:active,
+    .ui.@{consequence}.button:active {
+      background-color: @@_backgroundColorDown;
+      color: @@_textColor;
+      text-shadow: @@_textShadow;
+    }
+    .ui.@{consequence}.buttons .active.button,
+    .ui.@{consequence}.buttons .active.button:active,
+    .ui.@{consequence}.active.button,
+    .ui.@{consequence}.button .active.button:active {
+      background-color: @@_backgroundColorActive;
+      color: @@_textColor;
+      text-shadow: @@_textShadow;
+    }
+    & when (@variationButtonBasic) {
+      /* Basic */
+      .ui.basic.@{consequence}.buttons .button,
+      .ui.basic.@{consequence}.button {
+        background: transparent;
+        box-shadow: 0 0 0 @basicBorderSize @@_backgroundColor inset;
+        color: @@_backgroundColor;
+      }
+      .ui.basic.@{consequence}.buttons .button:hover,
+      .ui.basic.@{consequence}.button:hover {
+        background: transparent;
+        box-shadow: 0 0 0 @basicColoredBorderSize @@_backgroundColorHover inset;
+        color: @@_backgroundColorHover;
+      }
+      .ui.basic.@{consequence}.buttons .button:focus,
+      .ui.basic.@{consequence}.button:focus {
+        background: transparent;
+        box-shadow: 0 0 0 @basicColoredBorderSize @@_backgroundColorFocus inset;
+        color: @@_backgroundColorHover;
+      }
+      .ui.basic.@{consequence}.buttons .active.button,
+      .ui.basic.@{consequence}.active.button {
+        background: transparent;
+        box-shadow: 0 0 0 @basicColoredBorderSize @@_backgroundColorActive inset;
+        color: @@_backgroundColorDown;
+      }
+      .ui.basic.@{consequence}.buttons .button:active,
+      .ui.basic.@{consequence}.button:active {
+        box-shadow: 0 0 0 @basicColoredBorderSize @@_backgroundColorDown inset;
+        color: @@_backgroundColorDown;
+      }
+      .ui.buttons:not(.vertical) > .basic.@{consequence}.button:not(:first-child) {
+        margin-left: -@basicColoredBorderSize;
+      }
+    }
+  })
 }
 
-/*---------------
-    Positive
-----------------*/
-
-.addConsequence(positive);
-
-/*---------------
-     Negative
-----------------*/
-
-.addConsequence(negative);
 
 & when (@variationButtonGroups) {
   /*******************************

package/src/definitions/elements/container.less

@@ -1,10 +1,10 @@
 /*!
  * # Fomantic-UI - Container
- * http://github.com/fomantic/Fomantic-UI/
+ * https://github.com/fomantic/Fomantic-UI/
  *
  *
  * Released under the MIT license
- * http://opensource.org/licenses/MIT
+ * https://opensource.org/licenses/MIT
  *
  */
 

package/src/definitions/elements/divider.less

@@ -1,10 +1,10 @@
 /*!
  * # Fomantic-UI - Divider
- * http://github.com/fomantic/Fomantic-UI/
+ * https://github.com/fomantic/Fomantic-UI/
  *
  *
  * Released under the MIT license
- * http://opensource.org/licenses/MIT
+ * https://opensource.org/licenses/MIT
  *
  */
 

package/src/definitions/elements/flag.less

@@ -1,10 +1,10 @@
 /*!
  * # Fomantic-UI - Flag
- * http://github.com/fomantic/Fomantic-UI/
+ * https://github.com/fomantic/Fomantic-UI/
  *
  *
  * Released under the MIT license
- * http://opensource.org/licenses/MIT
+ * https://opensource.org/licenses/MIT
  *
  */
 

package/src/definitions/elements/header.less

@@ -1,10 +1,10 @@
 /*!
  * # Fomantic-UI - Header
- * http://github.com/fomantic/Fomantic-UI/
+ * https://github.com/fomantic/Fomantic-UI/
  *
  *
  * Released under the MIT license
- * http://opensource.org/licenses/MIT
+ * https://opensource.org/licenses/MIT
  *
  */
 

package/src/definitions/elements/icon.less

@@ -1,10 +1,10 @@
 /*!
  * # Fomantic-UI - Icon
- * http://github.com/fomantic/Fomantic-UI/
+ * https://github.com/fomantic/Fomantic-UI/
  *
  *
  * Released under the MIT license
- * http://opensource.org/licenses/MIT
+ * https://opensource.org/licenses/MIT
  *
  */
 
@@ -163,7 +163,7 @@ i.emphasized.icon:not(.disabled), i.emphasized.icons:not(.disabled) {
     transform: scale(1, -1);
   }
 
-  & when(@variationIconGroups) {
+  & when (@variationIconGroups) {
     .icons i.flipped.icon:not(.corner):not(:first-child),
     .icons i.horizontally.flipped.icon:not(.corner):not(:first-child) {
       transform: translateX(-50%) translateY(-50%) scale(-1, 1);
@@ -194,7 +194,7 @@ i.emphasized.icon:not(.disabled), i.emphasized.icons:not(.disabled) {
     transform: rotate(180deg);
   }
 
-  & when(@variationIconGroups) {
+  & when (@variationIconGroups) {
     .icons i.rotated.rotated.icon:not(.corner):not(:first-child),
     .icons i.right.rotated.icon:not(.corner):not(:first-child),
     .icons i.clockwise.rotated.icon:not(.corner):not(:first-child) {
@@ -245,7 +245,7 @@ i.emphasized.icon:not(.disabled), i.emphasized.icons:not(.disabled) {
     transform: scale(1, -1) rotate(180deg);
   }
 
-  & when(@variationIconGroups) {
+  & when (@variationIconGroups) {
     .icons i.rotated.flipped.icon:not(.corner):not(:first-child),
     .icons i.right.rotated.flipped.icon:not(.corner):not(:first-child),
     .icons i.clockwise.rotated.flipped.icon:not(.corner):not(:first-child) {
@@ -529,6 +529,16 @@ i.icons {
   });
 };
 
+.generateSecondaryIcons(@map) {
+  each(@map,{
+    @escapedKey: replace(@key,'^([0-9])','\3$1 ');
+    @normalizedKey: replace(@escapedKey,'_','.','g');
+    i.icon.@{normalizedKey}::after {
+      content: "@{value}";
+    }
+  });
+};
+
 & when (@variationIconDeprecated) {
 
   /* Deprecated *In/Out Naming Conflict) */
@@ -584,7 +594,7 @@ i.icons {
   }
 }
 
-& when(@variationIconBrand) {
+& when (@variationIconBrand) {
   /*******************************
             Brand Icons
   *******************************/
@@ -598,4 +608,68 @@ i.icons {
   }
 }
 
+& when (@variationIconDuotone) {
+  /*******************************
+            Duotone Icons
+  *******************************/
+
+  /* Make duotone icons use the proper font */
+  i.icon.duotone {
+    font-family: @duotoneFontName;
+    /* To position the secondary layer on top of the first layer */
+    position: relative;
+  }
+
+  /* Set the default opacity levels and colors for each layer */
+  i.icon.duotone::before {
+    color: @duotonePrimaryColor;
+    opacity: @duotonePrimaryOpacity;
+  }
+
+  i.icon.duotone::after {
+    /* Position secondary layer to the left, centered horizontally and aligned vertically to flex with different line heights */
+    position: absolute;
+    left: 0;
+    top: 50%;
+    transform: translateY(-50%);
+    text-align: center;
+
+    color: @duotoneSecondaryColor;
+    opacity: @duotoneSecondaryOpacity;
+  }
+
+  .generateIcons(@icon-duotone-map,false);
+  .generateSecondaryIcons(@icon-duotone-secondary-map);
+
+  & when (@variationIconAliases) {
+
+    /* Aliases */
+    .generateIcons(@icon-duotone-aliases-map,false);
+    .generateSecondaryIcons(@icon-duotone-secondary-aliases-map);
+  }
+
+  /*
+   * Colors for duotone icons, in the form `primary-secondary`(e.g. `black-grey duotone icon`).
+   */
+  & when not (@variationIconColors = false) {
+    each(@variationIconColors, {
+      @color: @value;
+      @c: @colors[@@color][color];
+      @l: @colors[@@color][light];
+
+      i.icon.duotone[class*="@{color}-"]::before,
+      i.icon.duotone[class*="-@{color}"]::after {
+        color: @c;
+      }
+
+      & when (@variationIconInverted) {
+        i.icon.inverted.duotone[class*="@{color}-"]::before,
+        i.icon.inverted.duotone[class*="-@{color}"]::after {
+          color: @l;
+        }
+      }
+    })
+  }
+}
+
 .loadUIOverrides();

package/src/definitions/elements/image.less

@@ -1,10 +1,10 @@
 /*!
  * # Fomantic-UI - Image
- * http://github.com/fomantic/Fomantic-UI/
+ * https://github.com/fomantic/Fomantic-UI/
  *
  *
  * Released under the MIT license
- * http://opensource.org/licenses/MIT
+ * https://opensource.org/licenses/MIT
  *
  */