fomantic-ui 2.9.0-beta.99 → 2.9.0

package/src/themes/basic/elements/icon.overrides

@@ -1,143 +1,143 @@
 /* basic.icons available */
-i.icon.circle.attention:before { content: '\2757'; } /* '❗' */
-i.icon.circle.help:before { content: '\e704'; } /* '' */
-i.icon.circle.info:before { content: '\e705'; } /* '' */
-i.icon.add:before { content: '\2795'; } /* '➕' */
-
-i.icon.chart:before { content: '📈'; } /* '\1f4c8' */
-i.icon.chart.bar:before { content: '📊'; } /* '\1f4ca' */
-i.icon.chart.pie:before { content: '\e7a2'; } /* '' */
-
-i.icon.resize.full:before { content: '\e744'; } /* '' */
-i.icon.resize.horizontal:before { content: '\2b0d'; } /* '⬍' */
-i.icon.resize.small:before { content: '\e746'; } /* '' */
-i.icon.resize.vertical:before { content: '\2b0c'; } /* '⬌' */
-
-i.icon.down:before { content: '\2193'; } /* '↓' */
-i.icon.down.triangle:before { content: '\25be'; } /* '▾' */
-i.icon.down.arrow:before { content: '\e75c'; } /* '' */
-
-i.icon.left:before { content: '\2190'; } /* '←' */
-i.icon.left.triangle:before { content: '\25c2'; } /* '◂' */
-i.icon.left.arrow:before { content: '\e75d'; } /* '' */
-
-i.icon.right:before { content: '\2192'; } /* '→' */
-i.icon.right.triangle:before { content: '\25b8'; } /* '▸' */
-i.icon.right.arrow:before { content: '\e75e'; } /* '' */
-
-i.icon.up:before { content: '\2191'; } /* '↑' */
-i.icon.up.triangle:before { content: '\25b4'; } /* '▴' */
-i.icon.up.arrow:before { content: '\e75f'; } /* '' */
-
-i.icon.folder:before { content: '\e810'; } /* '' */
-i.icon.open.folder:before { content: '📂'; } /* '\1f4c2' */
-
-i.icon.globe:before { content: '𝌍'; } /* '\1d30d' */
-i.icon.desk.globe:before { content: '🌐'; } /* '\1f310' */
-
-i.icon.star:before { content: '\e801'; } /* '' */
-i.icon.star.empty:before { content: '\e800'; } /* '' */
-i.icon.star.half:before { content: '\e701'; } /* '' */
-
-i.icon.lock:before { content: '🔒'; } /* '\1f512' */
-i.icon.unlock:before { content: '🔓'; } /* '\1f513' */
-
-i.icon.layout.grid:before { content: '\e80c'; } /* '' */
-i.icon.layout.block:before { content: '\e708'; } /* '' */
-i.icon.layout.list:before { content: '\e80b'; } /* '' */
-
-i.icon.heart.empty:before { content: '\2661'; } /* '♡' */
-i.icon.heart:before { content: '\2665'; } /* '♥' */
-
-
-i.icon.asterisk:before { content: '\2731'; } /* '✱' */
-i.icon.attachment:before { content: '📎'; } /* '\1f4ce' */
-i.icon.attention:before { content: '\26a0'; } /* '⚠' */
-i.icon.trophy:before { content: '🏉'; } /* '\1f3c9' */
-i.icon.barcode:before { content: '\e792'; } /* '' */
-i.icon.cart:before { content: '\e813'; } /* '' */
-i.icon.block:before { content: '🚫'; } /* '\1f6ab' */
-i.icon.book:before { content: '📖'; }
-i.icon.bookmark:before { content: '🔖'; } /* '\1f516' */
-i.icon.calendar:before { content: '📅'; } /* '\1f4c5' */
-i.icon.cancel:before { content: '\2716'; } /* '✖' */
-i.icon.close:before { content: '\e80d'; } /* '' */
-i.icon.color:before { content: '\e794'; } /* '' */
-i.icon.chat:before { content: '\e720'; } /* '' */
-i.icon.check:before { content: '\2611'; } /* '☑' */
-i.icon.time:before { content: '🕔'; } /* '\1f554' */
-i.icon.cloud:before { content: '\2601'; } /* '☁' */
-i.icon.code:before { content: '\e714'; } /* '' */
-i.icon.email:before { content: '\40'; } /* '@' */
-i.icon.settings:before { content: '\26ef'; } /* '⛯' */
-i.icon.setting:before { content: '\2699'; } /* '⚙' */
-i.icon.comment:before { content: '\e802'; } /* '' */
-i.icon.clockwise.counter:before { content: '\27f2'; } /* '⟲' */
-i.icon.clockwise:before { content: '\27f3'; } /* '⟳' */
-i.icon.cube:before { content: '\e807'; } /* '' */
-i.icon.direction:before { content: '\27a2'; } /* '➢' */
-i.icon.doc:before { content: '📄'; } /* '\1f4c4' */
-i.icon.docs:before { content: '\e736'; } /* '' */
-i.icon.dollar:before { content: '💵'; } /* '\1f4b5' */
-i.icon.paint:before { content: '\e7b5'; } /* '' */
-i.icon.edit:before { content: '\270d'; } /* '✍' */
-i.icon.eject:before { content: '\2ecf'; } /* '⻏' */
-i.icon.export:before { content: '\e715'; } /* '' */
-i.icon.hide:before  { content: '\e70b'; } /* '' */
-i.icon.unhide:before { content: '\e80f'; } /* '' */
-i.icon.facebook:before { content: '\f301'; } /* '' */
-i.icon.fast-forward:before { content: '\e804'; } /* '' */
-i.icon.fire:before { content: '🔥'; } /* '\1f525' */
-i.icon.flag:before { content: '\2691'; } /* '⚑' */
-i.icon.lightning:before { content: '\26a1'; } /* '⚡' */
-i.icon.lab:before { content: '\68'; } /* 'h' */
-i.icon.flight:before { content: '\2708'; } /* '✈' */
-i.icon.forward:before { content: '\27a6'; } /* '➦' */
-i.icon.gift:before { content: '🎁'; } /* '\1f381' */
-i.icon.github:before { content: '\f308'; } /* '' */
-i.icon.globe:before { content: '\e817'; } /* '' */
-i.icon.headphones:before { content: '🎧'; } /* '\1f3a7' */
-i.icon.question:before { content: '\2753'; } /* '❓' */
-i.icon.home:before { content: '\2302'; } /* '⌂' */
-i.icon.i:before { content: '\2139'; } /* 'ℹ' */
-i.icon.idea:before { content: '💡'; } /* '\1f4a1' */
-i.icon.open:before { content: '🔗'; } /* '\1f517' */
-i.icon.content:before { content: '\e782'; } /* '' */
-i.icon.location:before { content: '\e724'; } /* '' */
-i.icon.mail:before { content: '\2709'; } /* '✉' */
-i.icon.mic:before { content: '🎤'; } /* '\1f3a4' */
-i.icon.minus:before { content: '\2d'; } /* '-' */
-i.icon.money:before { content: '💰'; } /* '\1f4b0' */
-i.icon.off:before { content: '\e78e'; } /* '' */
-i.icon.pause:before { content: '\e808'; } /* '' */
-i.icon.photos:before { content: '\e812'; } /* '' */
-i.icon.photo:before { content: '🌄'; } /* '\1f304' */
-i.icon.pin:before { content: '📌'; } /* '\1f4cc' */
-i.icon.play:before { content: '\e809'; } /* '' */
-i.icon.plus:before { content: '\2b'; } /* '+' */
-i.icon.print:before { content: '\e716'; } /* '' */
-i.icon.rss:before { content: '\e73a'; } /* '' */
-i.icon.search:before { content: '🔍'; } /* '\1f50d' */
-i.icon.shuffle:before { content: '\e803'; } /* '' */
-i.icon.tag:before { content: '\e80a'; } /* '' */
-i.icon.tags:before { content: '\e70d'; } /* '' */
-i.icon.terminal:before { content: '\e7ac'; } /* '' */
-i.icon.thumbs.down:before { content: '👎'; } /* '\1f44e' */
-i.icon.thumbs.up:before { content: '👍'; } /* '\1f44d' */
-i.icon.to-end:before { content: '\e806'; } /* '' */
-i.icon.to-start:before { content: '\e805'; } /* '' */
-i.icon.top.list:before { content: '🏆'; } /* '\1f3c6' */
-i.icon.trash:before { content: '\e729'; } /* '' */
-i.icon.twitter:before { content: '\f303'; } /* '' */
-i.icon.upload:before { content: '\e711'; } /* '' */
-i.icon.user.add:before { content: '\e700'; } /* '' */
-i.icon.user:before { content: '👤'; } /* '\1f464' */
-i.icon.community:before { content: '\e814'; } /* '' */
-i.icon.users:before { content: '👥'; } /* '\1f465' */
-i.icon.id:before { content: '\e722'; } /* '' */
-i.icon.url:before { content: '🔗'; } /* '\1f517' */
-i.icon.zoom.in:before { content: '\e750'; } /* '' */
-i.icon.zoom.out:before { content: '\e751'; } /* '' */
+i.icon.circle.attention::before { content: '\2757'; } /* '❗' */
+i.icon.circle.help::before { content: '\e704'; } /* '' */
+i.icon.circle.info::before { content: '\e705'; } /* '' */
+i.icon.add::before { content: '\2795'; } /* '➕' */
+
+i.icon.chart::before { content: '📈'; } /* '\1f4c8' */
+i.icon.chart.bar::before { content: '📊'; } /* '\1f4ca' */
+i.icon.chart.pie::before { content: '\e7a2'; } /* '' */
+
+i.icon.resize.full::before { content: '\e744'; } /* '' */
+i.icon.resize.horizontal::before { content: '\2b0d'; } /* '⬍' */
+i.icon.resize.small::before { content: '\e746'; } /* '' */
+i.icon.resize.vertical::before { content: '\2b0c'; } /* '⬌' */
+
+i.icon.down::before { content: '\2193'; } /* '↓' */
+i.icon.down.triangle::before { content: '\25be'; } /* '▾' */
+i.icon.down.arrow::before { content: '\e75c'; } /* '' */
+
+i.icon.left::before { content: '\2190'; } /* '←' */
+i.icon.left.triangle::before { content: '\25c2'; } /* '◂' */
+i.icon.left.arrow::before { content: '\e75d'; } /* '' */
+
+i.icon.right::before { content: '\2192'; } /* '→' */
+i.icon.right.triangle::before { content: '\25b8'; } /* '▸' */
+i.icon.right.arrow::before { content: '\e75e'; } /* '' */
+
+i.icon.up::before { content: '\2191'; } /* '↑' */
+i.icon.up.triangle::before { content: '\25b4'; } /* '▴' */
+i.icon.up.arrow::before { content: '\e75f'; } /* '' */
+
+i.icon.folder::before { content: '\e810'; } /* '' */
+i.icon.open.folder::before { content: '📂'; } /* '\1f4c2' */
+
+i.icon.globe::before { content: '𝌍'; } /* '\1d30d' */
+i.icon.desk.globe::before { content: '🌐'; } /* '\1f310' */
+
+i.icon.star::before { content: '\e801'; } /* '' */
+i.icon.star.empty::before { content: '\e800'; } /* '' */
+i.icon.star.half::before { content: '\e701'; } /* '' */
+
+i.icon.lock::before { content: '🔒'; } /* '\1f512' */
+i.icon.unlock::before { content: '🔓'; } /* '\1f513' */
+
+i.icon.layout.grid::before { content: '\e80c'; } /* '' */
+i.icon.layout.block::before { content: '\e708'; } /* '' */
+i.icon.layout.list::before { content: '\e80b'; } /* '' */
+
+i.icon.heart.empty::before { content: '\2661'; } /* '♡' */
+i.icon.heart::before { content: '\2665'; } /* '♥' */
+
+
+i.icon.asterisk::before { content: '\2731'; } /* '✱' */
+i.icon.attachment::before { content: '📎'; } /* '\1f4ce' */
+i.icon.attention::before { content: '\26a0'; } /* '⚠' */
+i.icon.trophy::before { content: '🏉'; } /* '\1f3c9' */
+i.icon.barcode::before { content: '\e792'; } /* '' */
+i.icon.cart::before { content: '\e813'; } /* '' */
+i.icon.block::before { content: '🚫'; } /* '\1f6ab' */
+i.icon.book::before { content: '📖'; }
+i.icon.bookmark::before { content: '🔖'; } /* '\1f516' */
+i.icon.calendar::before { content: '📅'; } /* '\1f4c5' */
+i.icon.cancel::before { content: '\2716'; } /* '✖' */
+i.icon.close::before { content: '\e80d'; } /* '' */
+i.icon.color::before { content: '\e794'; } /* '' */
+i.icon.chat::before { content: '\e720'; } /* '' */
+i.icon.check::before { content: '\2611'; } /* '☑' */
+i.icon.time::before { content: '🕔'; } /* '\1f554' */
+i.icon.cloud::before { content: '\2601'; } /* '☁' */
+i.icon.code::before { content: '\e714'; } /* '' */
+i.icon.email::before { content: '\40'; } /* '@' */
+i.icon.settings::before { content: '\26ef'; } /* '⛯' */
+i.icon.setting::before { content: '\2699'; } /* '⚙' */
+i.icon.comment::before { content: '\e802'; } /* '' */
+i.icon.clockwise.counter::before { content: '\27f2'; } /* '⟲' */
+i.icon.clockwise::before { content: '\27f3'; } /* '⟳' */
+i.icon.cube::before { content: '\e807'; } /* '' */
+i.icon.direction::before { content: '\27a2'; } /* '➢' */
+i.icon.doc::before { content: '📄'; } /* '\1f4c4' */
+i.icon.docs::before { content: '\e736'; } /* '' */
+i.icon.dollar::before { content: '💵'; } /* '\1f4b5' */
+i.icon.paint::before { content: '\e7b5'; } /* '' */
+i.icon.edit::before { content: '\270d'; } /* '✍' */
+i.icon.eject::before { content: '\2ecf'; } /* '⻏' */
+i.icon.export::before { content: '\e715'; } /* '' */
+i.icon.hide::before  { content: '\e70b'; } /* '' */
+i.icon.unhide::before { content: '\e80f'; } /* '' */
+i.icon.facebook::before { content: '\f301'; } /* '' */
+i.icon.fast-forward::before { content: '\e804'; } /* '' */
+i.icon.fire::before { content: '🔥'; } /* '\1f525' */
+i.icon.flag::before { content: '\2691'; } /* '⚑' */
+i.icon.lightning::before { content: '\26a1'; } /* '⚡' */
+i.icon.lab::before { content: '\68'; } /* 'h' */
+i.icon.flight::before { content: '\2708'; } /* '✈' */
+i.icon.forward::before { content: '\27a6'; } /* '➦' */
+i.icon.gift::before { content: '🎁'; } /* '\1f381' */
+i.icon.github::before { content: '\f308'; } /* '' */
+i.icon.globe::before { content: '\e817'; } /* '' */
+i.icon.headphones::before { content: '🎧'; } /* '\1f3a7' */
+i.icon.question::before { content: '\2753'; } /* '❓' */
+i.icon.home::before { content: '\2302'; } /* '⌂' */
+i.icon.i::before { content: '\2139'; } /* 'ℹ' */
+i.icon.idea::before { content: '💡'; } /* '\1f4a1' */
+i.icon.open::before { content: '🔗'; } /* '\1f517' */
+i.icon.content::before { content: '\e782'; } /* '' */
+i.icon.location::before { content: '\e724'; } /* '' */
+i.icon.mail::before { content: '\2709'; } /* '✉' */
+i.icon.mic::before { content: '🎤'; } /* '\1f3a4' */
+i.icon.minus::before { content: '\2d'; } /* '-' */
+i.icon.money::before { content: '💰'; } /* '\1f4b0' */
+i.icon.off::before { content: '\e78e'; } /* '' */
+i.icon.pause::before { content: '\e808'; } /* '' */
+i.icon.photos::before { content: '\e812'; } /* '' */
+i.icon.photo::before { content: '🌄'; } /* '\1f304' */
+i.icon.pin::before { content: '📌'; } /* '\1f4cc' */
+i.icon.play::before { content: '\e809'; } /* '' */
+i.icon.plus::before { content: '\2b'; } /* '+' */
+i.icon.print::before { content: '\e716'; } /* '' */
+i.icon.rss::before { content: '\e73a'; } /* '' */
+i.icon.search::before { content: '🔍'; } /* '\1f50d' */
+i.icon.shuffle::before { content: '\e803'; } /* '' */
+i.icon.tag::before { content: '\e80a'; } /* '' */
+i.icon.tags::before { content: '\e70d'; } /* '' */
+i.icon.terminal::before { content: '\e7ac'; } /* '' */
+i.icon.thumbs.down::before { content: '👎'; } /* '\1f44e' */
+i.icon.thumbs.up::before { content: '👍'; } /* '\1f44d' */
+i.icon.to-end::before { content: '\e806'; } /* '' */
+i.icon.to-start::before { content: '\e805'; } /* '' */
+i.icon.top.list::before { content: '🏆'; } /* '\1f3c6' */
+i.icon.trash::before { content: '\e729'; } /* '' */
+i.icon.twitter::before { content: '\f303'; } /* '' */
+i.icon.upload::before { content: '\e711'; } /* '' */
+i.icon.user.add::before { content: '\e700'; } /* '' */
+i.icon.user::before { content: '👤'; } /* '\1f464' */
+i.icon.community::before { content: '\e814'; } /* '' */
+i.icon.users::before { content: '👥'; } /* '\1f465' */
+i.icon.id::before { content: '\e722'; } /* '' */
+i.icon.url::before { content: '🔗'; } /* '\1f517' */
+i.icon.zoom.in::before { content: '\e750'; } /* '' */
+i.icon.zoom.out::before { content: '\e751'; } /* '' */
 
 /*--------------
    Spacing Fix
@@ -174,16 +174,16 @@ i.icon.right {
 ---------------*/
 
 /* aliases for convenience */
-i.icon.delete:before { content: '\e80d'; } /* '' */
-i.icon.dropdown:before { content: '\25be'; } /* '▾' */
+i.icon.delete::before { content: '\e80d'; } /* '' */
+i.icon.dropdown::before { content: '\25be'; } /* '▾' */
 
-i.icon.help:before { content: '\e704'; } /* '' */
-i.icon.info:before { content: '\e705'; } /* '' */
-i.icon.error:before { content: '\e80d'; } /* '' */
+i.icon.help::before { content: '\e704'; } /* '' */
+i.icon.info::before { content: '\e705'; } /* '' */
+i.icon.error::before { content: '\e80d'; } /* '' */
 
-i.icon.dislike:before { content: '\2661'; } /* '♡' */
-i.icon.like:before { content: '\2665'; } /* '♥' */
+i.icon.dislike::before { content: '\2661'; } /* '♡' */
+i.icon.like::before { content: '\2665'; } /* '♥' */
 
-i.icon.eye:before { content: '\e80f'; } /* '' */
-i.icon.eye.hidden:before { content: '\e70b'; } /* '' */
-i.icon.date:before { content: '📅'; } /* '\1f4c5' */
+i.icon.eye::before { content: '\e80f'; } /* '' */
+i.icon.eye.hidden::before { content: '\e70b'; } /* '' */
+i.icon.date::before { content: '📅'; } /* '\1f4c5' */

package/src/themes/basic/elements/icon.variables

@@ -4,9 +4,19 @@
 
 @fontPath  : "../../themes/basic/assets/fonts";
 
-@src:
-  url("@{fontPath}/@{fontName}.eot?#iefix") format('embedded-opentype'),
-  url("@{fontPath}/@{fontName}.woff") format('woff'),
-  url("@{fontPath}/@{fontName}.ttf") format('truetype'),
-  url("@{fontPath}/@{fontName}.svg#icons") format('svg')
-;
+@fonts: {
+  @solid: {
+    font-family: @fontName;
+    src: url("@{fontPath}/@{fontName}.woff") format('woff');
+    font-style: normal;
+    font-weight: @normal;
+    font-variant: normal;
+    text-decoration: inherit;
+    text-transform: none;
+  };
+};
+@icon-deprecated-map: {};
+@icon-outline-map: {};
+@icon-outline-aliases-map: {};
+@icon-brand-map: {};
+@icon-brand-aliases-map: {};

package/src/themes/basic/elements/step.overrides

@@ -2,9 +2,9 @@
            Overrides
 *******************************/
 
-.ui.steps .step:after {
+.ui.steps .step::after {
   display: none !important;
 }
 .ui.steps .step {
   border-radius: 500px !important;
-}
+}

package/src/themes/bookish/elements/header.overrides

@@ -2,7 +2,7 @@
            Overrides
 *******************************/
 
-@import url(https://fonts.googleapis.com/css?family=Karma);
+@import (css) url('https://fonts.googleapis.com/css2?family=Karma');
 
 h1.ui.header,
 .ui.huge.header {

package/src/themes/chubby/elements/button.overrides

@@ -2,7 +2,7 @@
            Overrides
 *******************************/
 
-@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro);
+@import (css) url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro');
 
 .ui.labeled.icon.buttons > .button > .icon,
 .ui.labeled.icon.button > .icon {

package/src/themes/chubby/elements/header.overrides

@@ -2,4 +2,4 @@
            Overrides
 *******************************/
 
-@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro);
+@import (css) url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro');

package/src/themes/default/collections/form.variables

@@ -149,6 +149,10 @@
 @groupedLabelFontWeight: @labelFontWeight;
 @groupedLabelTextTransform: @labelTextTransform;
 
+/* Icon */
+@iconOpacity: 0.5;
+@iconFocusOpacity: 1;
+@iconTransition: opacity 0.3s @defaultEasing;
 
 /* Inline */
 @inlineInputSize: @relativeMedium;

package/src/themes/default/collections/table.variables

@@ -42,6 +42,7 @@
 @headerBorder: 1px solid @internalBorderColor;
 @headerDivider: none;
 @headerBackground: @offWhite;
+@headerBackgroundHex: @offWhite;
 @headerAlign: inherit;
 @headerVerticalAlign: inherit;
 @headerColor: @textColor;
@@ -57,6 +58,7 @@
 @footerBorder: 1px solid @borderColor;
 @footerDivider: none;
 @footerBackground: @offWhite;
+@footerBackgroundHex: @offWhite;
 @footerAlign: inherit;
 @footerVerticalAlign: inherit;
 @footerColor: @textColor;
@@ -118,29 +120,39 @@
 @positiveBoxShadow: @stateMarkerWidth 0 0 @positiveBorderColor inset;
 @positiveBackgroundHover: darken(@positiveBackgroundColor, 3);
 @positiveColorHover: darken(@positiveColor, 3);
+@invertedPositiveColor: @positiveTextColor;
+@invertedPositiveBackgroundColor: @positiveBorderColor;
 
 /* Negative */
 @negativeColor: @negativeTextColor;
 @negativeBoxShadow: @stateMarkerWidth 0 0 @negativeBorderColor inset;
 @negativeBackgroundHover: darken(@negativeBackgroundColor, 3);
 @negativeColorHover: darken(@negativeColor, 3);
+@invertedNegativeColor: @negativeTextColor;
+@invertedNegativeBackgroundColor: @negativeBorderColor;
 
 /* Error */
 @errorColor: @errorTextColor;
 @errorBoxShadow: @stateMarkerWidth 0 0 @errorBorderColor inset;
 @errorBackgroundHover: darken(@errorBackgroundColor, 3);
 @errorColorHover: darken(@errorColor, 3);
+@invertedErrorColor: @errorTextColor;
+@invertedErrorBackgroundColor: @errorBorderColor;
 
 /* Warning */
 @warningColor: @warningTextColor;
 @warningBoxShadow: @stateMarkerWidth 0 0 @warningBorderColor inset;
 @warningBackgroundHover: darken(@warningBackgroundColor, 3);
 @warningColorHover: darken(@warningColor, 3);
+@invertedWarningColor: @warningTextColor;
+@invertedWarningBackgroundColor: #EEC97E;
 
 /* Active */
 @activeColor: @textColor;
 @activeBackgroundColor: #E0E0E0;
 @activeBoxShadow: @stateMarkerWidth 0 0 @activeColor inset;
+@invertedActiveColor: @textColor;
+@invertedActiveBackgroundColor: #A0A0A0;
 
 @activeBackgroundHover: #EFEFEF;
 @activeColorHover: @selectedTextColor;
@@ -212,9 +224,15 @@
 @invertedCellColor: @invertedTextColor;
 
 @invertedHeaderBackground: @veryStrongTransparentBlack;
+@invertedHeaderBackgroundHex: #252525;
 @invertedHeaderColor: @invertedTextColor;
 @invertedHeaderBorderColor: @invertedCellBorderColor;
 
+@invertedFooterBackground: @invertedHeaderBackground;
+@invertedFooterBackgroundHex: @invertedHeaderBackgroundHex;
+@invertedFooterColor: @invertedHeaderColor;
+@invertedFooterBorderColor: @invertedHeaderBorderColor;
+
 @invertedDefinitionColumnBackground: @subtleTransparentWhite;
 @invertedDefinitionColumnColor: @invertedSelectedTextColor;
 @invertedDefinitionColumnFontWeight: @bold;
@@ -243,6 +261,40 @@
 @veryCompactVerticalPadding: 0.4em;
 @veryCompactHorizontalPadding: 0.6em;
 
+/* Scrolling */
+@scrollingMobileMaxItems: 3;
+@scrollingTabletMaxItems: 4;
+@scrollingComputerMaxItems: 6;
+@scrollingWidescreenMaxItems: 8;
+
+@scrollingItemHeight: (@cellVerticalPadding * 2) + @lineHeight;
+@scrollingMobileMaxBodyHeight: (@scrollingItemHeight * @scrollingMobileMaxItems);
+@scrollingTabletMaxBodyHeight: (@scrollingItemHeight * @scrollingTabletMaxItems);
+@scrollingComputerMaxBodyHeight: (@scrollingItemHeight * @scrollingComputerMaxItems);
+@scrollingWidescreenMaxBodyHeight: (@scrollingItemHeight * @scrollingWidescreenMaxItems);
+
+/* Stuck */
+@stuckBackground: @background;
+@stuckHeaderBackground: @offWhite;
+@stuckFooterBackground: @stuckHeaderBackground;
+
+@invertedStuckBackground: @invertedBackground;
+@invertedStuckHeaderBackground: @invertedHeaderBackgroundHex;
+@invertedStuckFooterBackground: @invertedStuckHeaderBackground;
+
+@stuckZIndex: 800;
+
+@overflowingMobileMaxItems: 5;
+@overflowingTabletMaxItems: 6;
+@overflowingComputerMaxItems: 8;
+@overflowingWidescreenMaxItems: 10;
+
+@overflowingItemHeight: (@cellVerticalPadding * 2) + @lineHeight;
+@overflowingMobileMaxHeight: (@overflowingItemHeight * @overflowingMobileMaxItems);
+@overflowingTabletMaxHeight: (@overflowingItemHeight * @overflowingTabletMaxItems);
+@overflowingComputerMaxHeight: (@overflowingItemHeight * @overflowingComputerMaxItems);
+@overflowingWidescreenMaxHeight: (@overflowingItemHeight * @overflowingWidescreenMaxItems);
+
 
 /* Sizes */
 @small: 0.9em;

package/src/themes/default/elements/button.variables

@@ -377,6 +377,8 @@
 
 /* Attached */
 @attachedOffset: -1px;
+@topAttachedOffset: 0;
+@bottomAttachedOffset: @attachedOffset;
 @attachedBoxShadow: 0 0 0 1px @borderColor;
 @attachedHorizontalPadding: 0.75em;
 @attachedZIndex: auto;
@@ -403,3 +405,6 @@
 /* Circular */
 @circularBorderRadius: 10em;
 @circularIconWidth: 1em;
+
+/* Spaced */
+@spacedMargin: 1em;

package/src/themes/default/elements/container.variables

@@ -9,6 +9,7 @@
 /* Minimum Gutter is used to determine  the maximum container width for a given device */
 
 @maxWidth: 100%;
+@wideRatio: 1.2;
 
 /* Devices */
 @mobileMinimumGutter: 0;
@@ -17,14 +18,17 @@
 
 @tabletMinimumGutter: (@emSize  * 1);
 @tabletWidth: @tabletBreakpoint - (@tabletMinimumGutter * 2) - @scrollbarWidth;
+@tabletWideWidth: (@tabletBreakpoint - (@tabletMinimumGutter * 2) - @scrollbarWidth) * @wideRatio;
 @tabletGutter: auto;
 
 @computerMinimumGutter: (@emSize  * 1.5);
 @computerWidth: @computerBreakpoint - (@computerMinimumGutter * 2) - @scrollbarWidth;
+@computerWideWidth: (@computerBreakpoint - (@computerMinimumGutter * 2) - @scrollbarWidth) * @wideRatio;
 @computerGutter: auto;
 
 @largeMonitorMinimumGutter: (@emSize  * 2);
 @largeMonitorWidth: @largeMonitorBreakpoint - (@largeMonitorMinimumGutter * 2) - @scrollbarWidth;
+@largeMonitorWideWidth: (@largeMonitorBreakpoint - (@largeMonitorMinimumGutter * 2) - @scrollbarWidth) * @wideRatio;
 @largeMonitorGutter: auto;
 
 /* Coupling (Add Negative Margin to container size) */
@@ -47,6 +51,14 @@
 @computerVeryRelaxedGridWidth: e(%("calc(%d + %d)", @computerWidth, @veryRelaxedGridGutterWidth));
 @largeMonitorVeryRelaxedGridWidth: e(%("calc(%d + %d)", @largeMonitorWidth, @veryRelaxedGridGutterWidth));
 
+/*-------------------
+       Scrolling
+--------------------*/
+@scrollingMobileMaxHeight: 15em;
+@scrollingTabletMaxHeight: 18em;
+@scrollingComputerMaxHeight: 24em;
+@scrollingWidescreenMaxHeight: 30em;
+
 /*-------------------
        Types
 --------------------*/