You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@senssoft.apache.org by ar...@apache.org on 2016/10/21 16:12:31 UTC
[38/48] incubator-senssoft-tap git commit: Cherry pick front end
bundle
http://git-wip-us.apache.org/repos/asf/incubator-senssoft-tap/blob/db97ec6f/semantic/src/definitions/elements/container.less
----------------------------------------------------------------------
diff --git a/semantic/src/definitions/elements/container.less b/semantic/src/definitions/elements/container.less
new file mode 100644
index 0000000..14b32f2
--- /dev/null
+++ b/semantic/src/definitions/elements/container.less
@@ -0,0 +1,143 @@
+/*!
+ * # Semantic UI - Container
+ * http://github.com/semantic-org/semantic-ui/
+ *
+ *
+ * Released under the MIT license
+ * http://opensource.org/licenses/MIT
+ *
+ */
+
+/*******************************
+ Theme
+*******************************/
+
+@type : 'element';
+@element : 'container';
+
+@import (multiple) '../../theme.config';
+
+/*******************************
+ Container
+*******************************/
+
+/* All Sizes */
+.ui.container {
+ display: block;
+ max-width: @maxWidth !important;
+}
+
+/* Mobile */
+@media only screen and (max-width: @largestMobileScreen) {
+ .ui.container {
+ width: @mobileWidth !important;
+ margin-left: @mobileGutter !important;
+ margin-right: @mobileGutter !important;
+ }
+ .ui.grid.container {
+ width: @mobileGridWidth !important;
+ }
+ .ui.relaxed.grid.container {
+ width: @mobileRelaxedGridWidth !important;
+ }
+ .ui.very.relaxed.grid.container {
+ width: @mobileVeryRelaxedGridWidth !important;
+ }
+}
+
+/* Tablet */
+@media only screen and (min-width: @tabletBreakpoint) and (max-width: @largestTabletScreen) {
+ .ui.container {
+ width: @tabletWidth;
+ margin-left: @tabletGutter !important;
+ margin-right: @tabletGutter !important;
+ }
+ .ui.grid.container {
+ width: @tabletGridWidth !important;
+ }
+ .ui.relaxed.grid.container {
+ width: @tabletRelaxedGridWidth !important;
+ }
+ .ui.very.relaxed.grid.container {
+ width: @tabletVeryRelaxedGridWidth !important;
+ }
+}
+
+/* Small Monitor */
+@media only screen and (min-width: @computerBreakpoint) and (max-width: @largestSmallMonitor) {
+ .ui.container {
+ width: @computerWidth;
+ margin-left: @computerGutter !important;
+ margin-right: @computerGutter !important;
+ }
+ .ui.grid.container {
+ width: @computerGridWidth !important;
+ }
+ .ui.relaxed.grid.container {
+ width: @computerRelaxedGridWidth !important;
+ }
+ .ui.very.relaxed.grid.container {
+ width: @computerVeryRelaxedGridWidth !important;
+ }
+}
+
+/* Large Monitor */
+@media only screen and (min-width: @largeMonitorBreakpoint) {
+ .ui.container {
+ width: @largeMonitorWidth;
+ margin-left: @largeMonitorGutter !important;
+ margin-right: @largeMonitorGutter !important;
+ }
+ .ui.grid.container {
+ width: @largeMonitorGridWidth !important;
+ }
+ .ui.relaxed.grid.container {
+ width: @largeMonitorRelaxedGridWidth !important;
+ }
+ .ui.very.relaxed.grid.container {
+ width: @largeMonitorVeryRelaxedGridWidth !important;
+ }
+}
+
+/*******************************
+ Types
+*******************************/
+
+
+/* Text Container */
+.ui.text.container {
+ font-family: @textFontFamily;
+ max-width: @textWidth !important;
+ line-height: @textLineHeight;
+}
+
+.ui.text.container {
+ font-size: @textSize;
+}
+
+/* Fluid */
+.ui.fluid.container {
+ width: 100%;
+}
+
+
+/*******************************
+ Variations
+*******************************/
+
+.ui[class*="left aligned"].container {
+ text-align: left;
+}
+.ui[class*="center aligned"].container {
+ text-align: center;
+}
+.ui[class*="right aligned"].container {
+ text-align: right;
+}
+.ui.justified.container {
+ text-align: justify;
+ hyphens: auto;
+}
+
+
+.loadUIOverrides();
http://git-wip-us.apache.org/repos/asf/incubator-senssoft-tap/blob/db97ec6f/semantic/src/definitions/elements/divider.less
----------------------------------------------------------------------
diff --git a/semantic/src/definitions/elements/divider.less b/semantic/src/definitions/elements/divider.less
new file mode 100755
index 0000000..28c0c68
--- /dev/null
+++ b/semantic/src/definitions/elements/divider.less
@@ -0,0 +1,255 @@
+/*!
+ * # Semantic UI - Divider
+ * http://github.com/semantic-org/semantic-ui/
+ *
+ *
+ * Released under the MIT license
+ * http://opensource.org/licenses/MIT
+ *
+ */
+
+/*******************************
+ Theme
+*******************************/
+
+@type : 'element';
+@element : 'divider';
+
+@import (multiple) '../../theme.config';
+
+
+/*******************************
+ Divider
+*******************************/
+
+.ui.divider {
+ margin: @margin;
+
+ line-height: 1;
+ height: 0em;
+
+ 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 solid @shadowColor;
+ border-bottom: @highlightWidth solid @highlightColor;
+}
+
+/*--------------
+ Coupling
+---------------*/
+
+/* Allow divider between each column row */
+.ui.grid > .column + .divider,
+.ui.grid > .row > .column + .divider {
+ left: auto;
+}
+
+/*--------------
+ Horizontal
+---------------*/
+
+.ui.horizontal.divider {
+ display: table;
+ white-space: nowrap;
+
+ 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%;
+}
+
+/*--------------
+ Vertical
+---------------*/
+
+.ui.vertical.divider {
+ position: absolute;
+ z-index: 2;
+ top: 50%;
+ left: 50%;
+
+ margin: 0rem;
+ padding: 0em;
+ width: auto;
+ height: 50%;
+
+ line-height: 0em;
+ 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 solid @shadowColor;
+ border-right: @highlightWidth solid @highlightColor;
+
+ width: 0%;
+ height: @verticalDividerHeight;
+}
+
+.ui.vertical.divider:before {
+ top: -100%;
+}
+.ui.vertical.divider:after {
+ top: auto;
+ bottom: 0px;
+}
+
+/* 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 {
+ position: static;
+ 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%;
+ }
+}
+
+/*--------------
+ Icon
+---------------*/
+
+.ui.divider > .icon {
+ margin: @dividerIconMargin;
+ font-size: @dividerIconSize;
+ height: 1em;
+ vertical-align: middle;
+}
+
+/*******************************
+ Variations
+*******************************/
+
+/*--------------
+ Hidden
+---------------*/
+
+.ui.hidden.divider {
+ border-color: transparent !important;
+}
+.ui.hidden.divider:before,
+.ui.hidden.divider:after {
+ display: none;
+}
+
+/*--------------
+ Inverted
+---------------*/
+
+.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
+---------------*/
+
+.ui.fitted.divider {
+ margin: 0em;
+}
+
+/*--------------
+ Clearing
+---------------*/
+
+.ui.clearing.divider {
+ clear: both;
+}
+
+/*--------------
+ Section
+---------------*/
+
+.ui.section.divider {
+ margin-top: @sectionMargin;
+ margin-bottom: @sectionMargin;
+}
+
+/*--------------
+ Sizes
+---------------*/
+
+.ui.divider {
+ font-size: @medium;
+}
+
+
+.loadUIOverrides();
http://git-wip-us.apache.org/repos/asf/incubator-senssoft-tap/blob/db97ec6f/semantic/src/definitions/elements/flag.less
----------------------------------------------------------------------
diff --git a/semantic/src/definitions/elements/flag.less b/semantic/src/definitions/elements/flag.less
new file mode 100755
index 0000000..1f4145e
--- /dev/null
+++ b/semantic/src/definitions/elements/flag.less
@@ -0,0 +1,52 @@
+/*!
+ * # Semantic UI - Flag
+ * http://github.com/semantic-org/semantic-ui/
+ *
+ *
+ * Released under the MIT license
+ * http://opensource.org/licenses/MIT
+ *
+ */
+
+
+/*******************************
+ Theme
+*******************************/
+
+@type : 'element';
+@element : 'flag';
+
+@import (multiple) '../../theme.config';
+
+
+/*******************************
+ Flag
+*******************************/
+
+i.flag:not(.icon) {
+ display: inline-block;
+
+ width: @width;
+ height: @height;
+
+ line-height: @height;
+ vertical-align: @verticalAlign;
+ margin: 0em @margin 0em 0em;
+
+ text-decoration: inherit;
+
+ speak: none;
+ font-smoothing: antialiased;
+ backface-visibility: hidden;
+}
+
+/* Sprite */
+i.flag:not(.icon):before {
+ display: inline-block;
+ content: '';
+ background: url(@spritePath) no-repeat -108px -1976px;
+ width: @width;
+ height: @height;
+}
+
+.loadUIOverrides();
http://git-wip-us.apache.org/repos/asf/incubator-senssoft-tap/blob/db97ec6f/semantic/src/definitions/elements/header.less
----------------------------------------------------------------------
diff --git a/semantic/src/definitions/elements/header.less b/semantic/src/definitions/elements/header.less
new file mode 100755
index 0000000..079cac8
--- /dev/null
+++ b/semantic/src/definitions/elements/header.less
@@ -0,0 +1,708 @@
+/*!
+ * # Semantic UI - Header
+ * http://github.com/semantic-org/semantic-ui/
+ *
+ *
+ * Released under the MIT license
+ * http://opensource.org/licenses/MIT
+ *
+ */
+
+
+/*******************************
+ Theme
+*******************************/
+
+@type : 'element';
+@element : 'header';
+
+@import (multiple) '../../theme.config';
+
+
+/*******************************
+ Header
+*******************************/
+
+/* Standard */
+.ui.header {
+ border: none;
+ margin: @margin;
+ padding: @verticalPadding @horizontalPadding;
+ font-family: @fontFamily;
+ font-weight: @fontWeight;
+ line-height: @lineHeight;
+ text-transform: @textTransform;
+ color: @textColor;
+}
+
+.ui.header:first-child {
+ margin-top: @firstMargin;
+}
+.ui.header:last-child {
+ margin-bottom: @lastMargin;
+}
+
+/*--------------
+ Sub Header
+---------------*/
+
+.ui.header .sub.header {
+ display: block;
+ font-weight: normal;
+ padding: 0em;
+ margin: @subHeaderMargin;
+ font-size: @subHeaderFontSize;
+ line-height: @subHeaderLineHeight;
+ color: @subHeaderColor;
+}
+
+/*--------------
+ Icon
+---------------*/
+
+.ui.header > .icon {
+ display: table-cell;
+ opacity: @iconOpacity;
+ font-size: @iconSize;
+ padding-top: @iconOffset;
+ vertical-align: @iconAlignment;
+}
+
+/* With Text Node */
+.ui.header .icon:only-child {
+ display: inline-block;
+ padding: 0em;
+ margin-right: @iconMargin;
+}
+
+/*-------------------
+ Image
+--------------------*/
+
+.ui.header > .image,
+.ui.header > img {
+ display: inline-block;
+ margin-top: @imageOffset;
+ width: @imageWidth;
+ height: @imageHeight;
+ vertical-align: @imageAlignment;
+}
+.ui.header > .image:only-child,
+.ui.header > img:only-child {
+ margin-right: @imageMargin;
+}
+
+/*--------------
+ Content
+---------------*/
+
+.ui.header .content {
+ display: inline-block;
+ vertical-align: @contentAlignment;
+}
+
+/* After Image */
+.ui.header > img + .content,
+.ui.header > .image + .content {
+ padding-left: @imageMargin;
+ vertical-align: @contentImageAlignment;
+}
+
+/* After Icon */
+.ui.header > .icon + .content {
+ padding-left: @iconMargin;
+ display: table-cell;
+ vertical-align: @contentIconAlignment;
+}
+
+
+/*--------------
+ Loose Coupling
+---------------*/
+
+.ui.header .ui.label {
+ font-size: @labelSize;
+ margin-left: @labelDistance;
+ vertical-align: @labelVerticalAlign;
+}
+
+/* Positioning */
+.ui.header + p {
+ margin-top: @nextParagraphDistance;
+}
+
+
+
+/*******************************
+ Types
+*******************************/
+
+
+/*--------------
+ Page
+---------------*/
+
+h1.ui.header {
+ font-size: @h1;
+}
+h2.ui.header {
+ font-size: @h2;
+}
+h3.ui.header {
+ font-size: @h3;
+}
+h4.ui.header {
+ font-size: @h4;
+}
+h5.ui.header {
+ font-size: @h5;
+}
+
+
+/* Sub Header */
+h1.ui.header .sub.header {
+ font-size: @h1SubHeaderFontSize;
+}
+h2.ui.header .sub.header {
+ font-size: @h2SubHeaderFontSize;
+}
+h3.ui.header .sub.header {
+ font-size: @h3SubHeaderFontSize;
+}
+h4.ui.header .sub.header {
+ font-size: @h4SubHeaderFontSize;
+}
+h5.ui.header .sub.header {
+ font-size: @h5SubHeaderFontSize;
+}
+
+
+/*--------------
+ Content Heading
+---------------*/
+
+.ui.huge.header {
+ min-height: 1em;
+ font-size: @hugeFontSize;
+}
+.ui.large.header {
+ font-size: @largeFontSize;
+}
+.ui.medium.header {
+ font-size: @mediumFontSize;
+}
+.ui.small.header {
+ font-size: @smallFontSize;
+}
+.ui.tiny.header {
+ font-size: @tinyFontSize;
+}
+
+/* Sub Header */
+.ui.huge.header .sub.header {
+ font-size: @hugeSubHeaderFontSize;
+}
+.ui.large.header .sub.header {
+ font-size: @hugeSubHeaderFontSize;
+}
+.ui.header .sub.header {
+ font-size: @subHeaderFontSize;
+}
+.ui.small.header .sub.header {
+ font-size: @smallSubHeaderFontSize;
+}
+.ui.tiny.header .sub.header {
+ font-size: @tinySubHeaderFontSize;
+}
+
+/*--------------
+ Sub Heading
+---------------*/
+
+.ui.sub.header {
+ padding: 0em;
+ margin-bottom: @subHeadingDistance;
+ font-weight: @subHeadingFontWeight;
+ font-size: @subHeadingFontSize;
+ text-transform: @subHeadingTextTransform;
+ color: @subHeadingColor;
+}
+
+.ui.small.sub.header {
+ font-size: @smallSubHeadingSize;
+}
+.ui.sub.header {
+ font-size: @subHeadingFontSize;
+}
+.ui.large.sub.header {
+ font-size: @largeSubHeadingSize;
+}
+.ui.huge.sub.header {
+ font-size: @hugeSubHeadingSize;
+}
+
+
+
+/*-------------------
+ Icon
+--------------------*/
+
+.ui.icon.header {
+ display: inline-block;
+ text-align: center;
+ margin: @iconHeaderTopMargin 0em @iconHeaderBottomMargin;
+}
+.ui.icon.header:after {
+ content: '';
+ display: block;
+ height: 0px;
+ clear: both;
+ visibility: hidden;
+}
+
+.ui.icon.header:first-child {
+ margin-top: @iconHeaderFirstMargin;
+}
+.ui.icon.header .icon {
+ float: none;
+ display: block;
+ width: auto;
+ height: auto;
+ line-height: 1;
+ padding: 0em;
+ font-size: @iconHeaderSize;
+ margin: 0em auto @iconHeaderMargin;
+ opacity: @iconHeaderOpacity;
+}
+.ui.icon.header .content {
+ display: block;
+ padding: 0em;
+}
+.ui.icon.header .circular.icon {
+ font-size: @circularHeaderIconSize;
+}
+.ui.icon.header .square.icon {
+ font-size: @squareHeaderIconSize;
+}
+.ui.block.icon.header .icon {
+ margin-bottom: 0em;
+}
+.ui.icon.header.aligned {
+ margin-left: auto;
+ margin-right: auto;
+ display: block;
+}
+
+/*******************************
+ States
+*******************************/
+
+.ui.disabled.header {
+ opacity: @disabledOpacity;
+}
+
+
+/*******************************
+ Variations
+*******************************/
+
+/*-------------------
+ Inverted
+--------------------*/
+
+.ui.inverted.header {
+ color: @invertedColor;
+}
+.ui.inverted.header .sub.header {
+ color: @invertedSubHeaderColor;
+}
+.ui.inverted.attached.header {
+ background: @invertedAttachedBackground;
+ box-shadow: none;
+ border-color: transparent;
+}
+.ui.inverted.block.header {
+ background: @invertedBlockBackground;
+ box-shadow: none;
+}
+.ui.inverted.block.header {
+ border-bottom: none;
+}
+
+
+/*-------------------
+ Colors
+--------------------*/
+
+/*--- Red ---*/
+.ui.red.header {
+ color: @red !important;
+}
+a.ui.red.header:hover {
+ color: @redHover !important;
+}
+.ui.red.dividing.header {
+ border-bottom: @dividedColoredBorderWidth solid @red;
+}
+
+/* Inverted */
+.ui.inverted.red.header {
+ color: @lightRed !important;
+}
+a.ui.inverted.red.header:hover {
+ color: @lightRedHover !important;
+}
+
+/*--- Orange ---*/
+.ui.orange.header {
+ color: @orange !important;
+}
+a.ui.orange.header:hover {
+ color: @orangeHover !important;
+}
+.ui.orange.dividing.header {
+ border-bottom: @dividedColoredBorderWidth solid @orange;
+}
+/* Inverted */
+.ui.inverted.orange.header {
+ color: @lightOrange !important;
+}
+a.ui.inverted.orange.header:hover {
+ color: @lightOrangeHover !important;
+}
+
+/*--- Olive ---*/
+.ui.olive.header {
+ color: @olive !important;
+}
+a.ui.olive.header:hover {
+ color: @oliveHover !important;
+}
+.ui.olive.dividing.header {
+ border-bottom: @dividedColoredBorderWidth solid @olive;
+}
+/* Inverted */
+.ui.inverted.olive.header {
+ color: @lightOlive !important;
+}
+a.ui.inverted.olive.header:hover {
+ color: @lightOliveHover !important;
+}
+
+/*--- Yellow ---*/
+.ui.yellow.header {
+ color: @yellow !important;
+}
+a.ui.yellow.header:hover {
+ color: @yellowHover !important;
+}
+.ui.yellow.dividing.header {
+ border-bottom: @dividedColoredBorderWidth solid @yellow;
+}
+/* Inverted */
+.ui.inverted.yellow.header {
+ color: @lightYellow !important;
+}
+a.ui.inverted.yellow.header:hover {
+ color: @lightYellowHover !important;
+}
+
+/*--- Green ---*/
+.ui.green.header {
+ color: @green !important;
+}
+a.ui.green.header:hover {
+ color: @greenHover !important;
+}
+.ui.green.dividing.header {
+ border-bottom: @dividedColoredBorderWidth solid @green;
+}
+/* Inverted */
+.ui.inverted.green.header {
+ color: @lightGreen !important;
+}
+a.ui.inverted.green.header:hover {
+ color: @lightGreenHover !important;
+}
+
+/*--- Teal ---*/
+.ui.teal.header {
+ color: @teal !important;
+}
+a.ui.teal.header:hover {
+ color: @tealHover !important;
+}
+.ui.teal.dividing.header {
+ border-bottom: @dividedColoredBorderWidth solid @teal;
+}
+/* Inverted */
+.ui.inverted.teal.header {
+ color: @lightTeal !important;
+}
+a.ui.inverted.teal.header:hover {
+ color: @lightTealHover !important;
+}
+
+/*--- Blue ---*/
+.ui.blue.header {
+ color: @blue !important;
+}
+a.ui.blue.header:hover {
+ color: @blueHover !important;
+}
+.ui.blue.dividing.header {
+ border-bottom: @dividedColoredBorderWidth solid @blue;
+}
+/* Inverted */
+.ui.inverted.blue.header {
+ color: @lightBlue !important;
+}
+a.ui.inverted.blue.header:hover {
+ color: @lightBlueHover !important;
+}
+
+/*--- Violet ---*/
+.ui.violet.header {
+ color: @violet !important;
+}
+a.ui.violet.header:hover {
+ color: @violetHover !important;
+}
+.ui.violet.dividing.header {
+ border-bottom: @dividedColoredBorderWidth solid @violet;
+}
+/* Inverted */
+.ui.inverted.violet.header {
+ color: @lightViolet !important;
+}
+a.ui.inverted.violet.header:hover {
+ color: @lightVioletHover !important;
+}
+
+/*--- Purple ---*/
+.ui.purple.header {
+ color: @purple !important;
+}
+a.ui.purple.header:hover {
+ color: @purpleHover !important;
+}
+.ui.purple.dividing.header {
+ border-bottom: @dividedColoredBorderWidth solid @purple;
+}
+/* Inverted */
+.ui.inverted.purple.header {
+ color: @lightPurple !important;
+}
+a.ui.inverted.purple.header:hover {
+ color: @lightPurpleHover !important;
+}
+
+/*--- Pink ---*/
+.ui.pink.header {
+ color: @pink !important;
+}
+a.ui.pink.header:hover {
+ color: @pinkHover !important;
+}
+.ui.pink.dividing.header {
+ border-bottom: @dividedColoredBorderWidth solid @pink;
+}
+/* Inverted */
+.ui.inverted.pink.header {
+ color: @lightPink !important;
+}
+a.ui.inverted.pink.header:hover {
+ color: @lightPinkHover !important;
+}
+
+/*--- Brown ---*/
+.ui.brown.header {
+ color: @brown !important;
+}
+a.ui.brown.header:hover {
+ color: @brownHover !important;
+}
+.ui.brown.dividing.header {
+ border-bottom: @dividedColoredBorderWidth solid @brown;
+}
+/* Inverted */
+.ui.inverted.brown.header {
+ color: @lightBrown !important;
+}
+a.ui.inverted.brown.header:hover {
+ color: @lightBrownHover !important;
+}
+
+/*--- Grey ---*/
+.ui.grey.header {
+ color: @grey !important;
+}
+a.ui.grey.header:hover {
+ color: @greyHover !important;
+}
+.ui.grey.dividing.header {
+ border-bottom: @dividedColoredBorderWidth solid @grey;
+}
+/* Inverted */
+.ui.inverted.grey.header {
+ color: @lightGrey !important;
+}
+a.ui.inverted.grey.header:hover {
+ color: @lightGreyHover !important;
+}
+
+
+/*-------------------
+ Aligned
+--------------------*/
+
+.ui.left.aligned.header {
+ text-align: left;
+}
+.ui.right.aligned.header {
+ text-align: right;
+}
+.ui.centered.header,
+.ui.center.aligned.header {
+ text-align: center;
+}
+.ui.justified.header {
+ text-align: justify;
+}
+.ui.justified.header:after {
+ display: inline-block;
+ content: '';
+ width: 100%;
+}
+
+/*-------------------
+ Floated
+--------------------*/
+
+.ui.floated.header,
+.ui[class*="left floated"].header {
+ float: left;
+ margin-top: 0em;
+ margin-right: @floatedMargin;
+}
+.ui[class*="right floated"].header {
+ float: right;
+ margin-top: 0em;
+ margin-left: @floatedMargin;
+}
+
+/*-------------------
+ Fitted
+--------------------*/
+
+.ui.fitted.header {
+ padding: 0em;
+}
+
+
+/*-------------------
+ Dividing
+--------------------*/
+
+.ui.dividing.header {
+ padding-bottom: @dividedBorderPadding;
+ border-bottom: @dividedBorder;
+}
+.ui.dividing.header .sub.header {
+ padding-bottom: @dividedSubHeaderPadding;
+}
+.ui.dividing.header .icon {
+ margin-bottom: @dividedIconPadding;
+}
+
+.ui.inverted.dividing.header {
+ border-bottom-color: @invertedDividedBorderColor;
+}
+
+
+/*-------------------
+ Block
+--------------------*/
+
+.ui.block.header {
+ background: @blockBackground;
+ padding: @blockVerticalPadding @blockHorizontalPadding;
+ box-shadow: @blockBoxShadow;
+ border: @blockBorder;
+ border-radius: @blockBorderRadius;
+}
+
+.ui.tiny.block.header {
+ font-size: @tinyBlock;
+}
+.ui.small.block.header {
+ font-size: @smallBlock;
+}
+.ui.block.header:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
+ font-size: @mediumBlock;
+}
+.ui.large.block.header {
+ font-size: @largeBlock;
+}
+.ui.huge.block.header {
+ font-size: @hugeBlock;
+}
+
+/*-------------------
+ Attached
+--------------------*/
+
+.ui.attached.header {
+ background: @attachedBackground;
+ padding: @attachedVerticalPadding @attachedHorizontalPadding;
+ margin-left: @attachedOffset;
+ margin-right: @attachedOffset;
+ box-shadow: @attachedBoxShadow;
+ border: @attachedBorder;
+}
+.ui.attached.block.header {
+ background: @blockBackground;
+}
+
+.ui.attached:not(.top):not(.bottom).header {
+ margin-top: 0em;
+ margin-bottom: 0em;
+ border-top: none;
+ border-radius: 0em;
+}
+.ui.top.attached.header {
+ margin-bottom: 0em;
+ border-radius: @attachedBorderRadius @attachedBorderRadius 0em 0em;
+}
+.ui.bottom.attached.header {
+ margin-top: 0em;
+ border-top: none;
+ border-radius: 0em 0em @attachedBorderRadius @attachedBorderRadius;
+}
+
+/* Attached Sizes */
+.ui.tiny.attached.header {
+ font-size: @tinyAttachedSize;
+}
+.ui.small.attached.header {
+ font-size: @smallAttachedSize;
+}
+.ui.attached.header:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
+ font-size: @mediumAttachedSize;
+}
+.ui.large.attached.header {
+ font-size: @largeAttachedSize;
+}
+.ui.huge.attached.header {
+ font-size: @hugeAttachedSize;
+}
+
+/*-------------------
+ Sizing
+--------------------*/
+
+.ui.header:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
+ font-size: @mediumFontSize;
+}
+
+.loadUIOverrides();
http://git-wip-us.apache.org/repos/asf/incubator-senssoft-tap/blob/db97ec6f/semantic/src/definitions/elements/icon.less
----------------------------------------------------------------------
diff --git a/semantic/src/definitions/elements/icon.less b/semantic/src/definitions/elements/icon.less
new file mode 100755
index 0000000..a145f1d
--- /dev/null
+++ b/semantic/src/definitions/elements/icon.less
@@ -0,0 +1,477 @@
+/*!
+ * # Semantic UI - Icon
+ * http://github.com/semantic-org/semantic-ui/
+ *
+ *
+ * Released under the MIT license
+ * http://opensource.org/licenses/MIT
+ *
+ */
+
+
+/*******************************
+ Theme
+*******************************/
+
+@type : 'element';
+@element : 'icon';
+
+@import (multiple) '../../theme.config';
+
+
+/*******************************
+ Icon
+*******************************/
+
+@font-face {
+ font-family: 'Icons';
+ src: @fallbackSRC;
+ src: @src;
+ font-style: normal;
+ font-weight: normal;
+ font-variant: normal;
+ text-decoration: inherit;
+ text-transform: none;
+}
+
+i.icon {
+ display: inline-block;
+ opacity: @opacity;
+
+ margin: 0em @distanceFromText 0em 0em;
+
+ width: @width;
+ height: @height;
+
+ font-family: 'Icons';
+ font-style: normal;
+ font-weight: normal;
+ text-decoration: inherit;
+ text-align: center;
+
+ speak: none;
+ font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+ -webkit-font-smoothing: antialiased;
+ backface-visibility: hidden;
+}
+
+i.icon:before {
+ background: none !important;
+}
+
+/*******************************
+ Types
+*******************************/
+
+/*--------------
+ Loading
+---------------*/
+
+i.icon.loading {
+ height: 1em;
+ line-height: 1;
+ animation: icon-loading @loadingDuration linear infinite;
+}
+@keyframes icon-loading {
+ from {
+ transform: rotate(0deg);
+ }
+ to {
+ transform: rotate(360deg);
+ }
+}
+
+/*******************************
+ States
+*******************************/
+
+i.icon.hover {
+ opacity: 1 !important;
+}
+
+i.icon.active {
+ opacity: 1 !important;
+}
+
+i.emphasized.icon {
+ opacity: 1 !important;
+}
+
+i.disabled.icon {
+ opacity: @disabledOpacity !important;
+}
+
+
+/*******************************
+ Variations
+*******************************/
+
+
+/*-------------------
+ Fitted
+--------------------*/
+
+i.fitted.icon {
+ width: auto;
+ margin: 0em;
+}
+
+/*-------------------
+ Link
+--------------------*/
+
+i.link.icon {
+ cursor: pointer;
+ opacity: @linkOpacity;
+ transition: opacity @defaultDuration @defaultEasing;
+}
+i.link.icon:hover {
+ opacity: 1 !important;
+}
+
+/*-------------------
+ Circular
+--------------------*/
+
+i.circular.icon {
+ border-radius: 500em !important;
+ line-height: 1 !important;
+
+ padding: @circularPadding !important;
+ box-shadow: @circularShadow;
+
+ width: @circularSize !important;
+ height: @circularSize !important;
+}
+i.circular.inverted.icon {
+ border: none;
+ box-shadow: none;
+}
+
+/*-------------------
+ Flipped
+--------------------*/
+
+i.flipped.icon,
+i.horizontally.flipped.icon {
+ transform: scale(-1, 1);
+}
+i.vertically.flipped.icon {
+ transform: scale(1, -1);
+}
+
+/*-------------------
+ Rotated
+--------------------*/
+
+i.rotated.icon,
+i.right.rotated.icon,
+i.clockwise.rotated.icon {
+ transform: rotate(90deg);
+}
+
+i.left.rotated.icon,
+i.counterclockwise.rotated.icon {
+ transform: rotate(-90deg);
+}
+
+/*-------------------
+ Bordered
+--------------------*/
+
+i.bordered.icon {
+ line-height: 1;
+ vertical-align: baseline;
+
+ width: @borderedSize;
+ height: @borderedSize;
+ padding: @borderedVerticalPadding @borderedHorizontalPadding !important;
+ box-shadow: @borderedShadow;
+}
+i.bordered.inverted.icon {
+ border: none;
+ box-shadow: none;
+}
+
+/*-------------------
+ Inverted
+--------------------*/
+
+/* Inverted Shapes */
+i.inverted.bordered.icon,
+i.inverted.circular.icon {
+ background-color: @black !important;
+ color: @white !important;
+}
+
+i.inverted.icon {
+ color: @white;
+}
+
+
+/*-------------------
+ Colors
+--------------------*/
+
+/* Red */
+i.red.icon {
+ color: @red !important;
+}
+i.inverted.red.icon {
+ color: @lightRed !important;
+}
+i.inverted.bordered.red.icon,
+i.inverted.circular.red.icon {
+ background-color: @red !important;
+ color: @white !important;
+}
+
+/* Orange */
+i.orange.icon {
+ color: @orange !important;
+}
+i.inverted.orange.icon {
+ color: @lightOrange !important;
+}
+i.inverted.bordered.orange.icon,
+i.inverted.circular.orange.icon {
+ background-color: @orange !important;
+ color: @white !important;
+}
+
+/* Yellow */
+i.yellow.icon {
+ color: @yellow !important;
+}
+i.inverted.yellow.icon {
+ color: @lightYellow !important;
+}
+i.inverted.bordered.yellow.icon,
+i.inverted.circular.yellow.icon {
+ background-color: @yellow !important;
+ color: @white !important;
+}
+
+/* Olive */
+i.olive.icon {
+ color: @olive !important;
+}
+i.inverted.olive.icon {
+ color: @lightOlive !important;
+}
+i.inverted.bordered.olive.icon,
+i.inverted.circular.olive.icon {
+ background-color: @olive !important;
+ color: @white !important;
+}
+
+/* Green */
+i.green.icon {
+ color: @green !important;
+}
+i.inverted.green.icon {
+ color: @lightGreen !important;
+}
+i.inverted.bordered.green.icon,
+i.inverted.circular.green.icon {
+ background-color: @green !important;
+ color: @white !important;
+}
+
+/* Teal */
+i.teal.icon {
+ color: @teal !important;
+}
+i.inverted.teal.icon {
+ color: @lightTeal !important;
+}
+i.inverted.bordered.teal.icon,
+i.inverted.circular.teal.icon {
+ background-color: @teal !important;
+ color: @white !important;
+}
+
+/* Blue */
+i.blue.icon {
+ color: @blue !important;
+}
+i.inverted.blue.icon {
+ color: @lightBlue !important;
+}
+i.inverted.bordered.blue.icon,
+i.inverted.circular.blue.icon {
+ background-color: @blue !important;
+ color: @white !important;
+}
+
+/* Violet */
+i.violet.icon {
+ color: @violet !important;
+}
+i.inverted.violet.icon {
+ color: @lightViolet !important;
+}
+i.inverted.bordered.violet.icon,
+i.inverted.circular.violet.icon {
+ background-color: @violet !important;
+ color: @white !important;
+}
+
+/* Purple */
+i.purple.icon {
+ color: @purple !important;
+}
+i.inverted.purple.icon {
+ color: @lightPurple !important;
+}
+i.inverted.bordered.purple.icon,
+i.inverted.circular.purple.icon {
+ background-color: @purple !important;
+ color: @white !important;
+}
+
+/* Pink */
+i.pink.icon {
+ color: @pink !important;
+}
+i.inverted.pink.icon {
+ color: @lightPink !important;
+}
+i.inverted.bordered.pink.icon,
+i.inverted.circular.pink.icon {
+ background-color: @pink !important;
+ color: @white !important;
+}
+
+/* Brown */
+i.brown.icon {
+ color: @brown !important;
+}
+i.inverted.brown.icon {
+ color: @lightBrown !important;
+}
+i.inverted.bordered.brown.icon,
+i.inverted.circular.brown.icon {
+ background-color: @brown !important;
+ color: @white !important;
+}
+
+/* Grey */
+i.grey.icon {
+ color: @grey !important;
+}
+i.inverted.grey.icon {
+ color: @lightGrey !important;
+}
+i.inverted.bordered.grey.icon,
+i.inverted.circular.grey.icon {
+ background-color: @grey !important;
+ color: @white !important;
+}
+
+/* Black */
+i.black.icon {
+ color: @black !important;
+}
+i.inverted.black.icon {
+ color: @lightBlack !important;
+}
+i.inverted.bordered.black.icon,
+i.inverted.circular.black.icon {
+ background-color: @black !important;
+ color: @white !important;
+}
+
+/*-------------------
+ Sizes
+--------------------*/
+
+i.mini.icon,
+i.mini.icons {
+ line-height: 1;
+ font-size: @mini;
+}
+i.tiny.icon,
+i.tiny.icons {
+ line-height: 1;
+ font-size: @tiny;
+}
+i.small.icon,
+i.small.icons {
+ line-height: 1;
+ font-size: @small;
+}
+i.icon,
+i.icons {
+ font-size: @medium;
+}
+i.large.icon,
+i.large.icons {
+ line-height: 1;
+ vertical-align: middle;
+ font-size: @large;
+}
+i.big.icon,
+i.big.icons {
+ line-height: 1;
+ vertical-align: middle;
+ font-size: @big;
+}
+i.huge.icon,
+i.huge.icons {
+ line-height: 1;
+ vertical-align: middle;
+ font-size: @huge;
+}
+i.massive.icon,
+i.massive.icons {
+ line-height: 1;
+ vertical-align: middle;
+ font-size: @massive;
+}
+
+/*******************************
+ Groups
+*******************************/
+
+i.icons {
+ display: inline-block;
+ position: relative;
+ line-height: 1;
+}
+
+i.icons .icon {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translateX(-50%) translateY(-50%);
+ margin: 0em;
+ margin: 0;
+}
+
+i.icons .icon:first-child {
+ position: static;
+ width: auto;
+ height: auto;
+ vertical-align: top;
+ transform: none;
+ margin-right: @distanceFromText;
+}
+
+/* Corner Icon */
+i.icons .corner.icon {
+ top: auto;
+ left: auto;
+ right: 0;
+ bottom: 0;
+ transform: none;
+ font-size: @cornerIconSize;
+ text-shadow: @cornerIconShadow;
+}
+
+i.icons .inverted.corner.icon {
+ text-shadow: @cornerIconInvertedShadow;
+}
+
+.loadUIOverrides();
http://git-wip-us.apache.org/repos/asf/incubator-senssoft-tap/blob/db97ec6f/semantic/src/definitions/elements/image.less
----------------------------------------------------------------------
diff --git a/semantic/src/definitions/elements/image.less b/semantic/src/definitions/elements/image.less
new file mode 100755
index 0000000..b996cde
--- /dev/null
+++ b/semantic/src/definitions/elements/image.less
@@ -0,0 +1,324 @@
+/*!
+ * # Semantic UI - Image
+ * http://github.com/semantic-org/semantic-ui/
+ *
+ *
+ * Released under the MIT license
+ * http://opensource.org/licenses/MIT
+ *
+ */
+
+
+/*******************************
+ Theme
+*******************************/
+
+@type : 'element';
+@element : 'image';
+
+@import (multiple) '../../theme.config';
+
+
+/*******************************
+ Image
+*******************************/
+
+.ui.image {
+ position: relative;
+ display: inline-block;
+ vertical-align: middle;
+ max-width: 100%;
+ background-color: @placeholderColor;
+}
+
+img.ui.image {
+ display: block;
+}
+
+.ui.image svg,
+.ui.image img {
+ display: block;
+ max-width: 100%;
+ height: auto;
+}
+
+
+/*******************************
+ States
+*******************************/
+
+.ui.hidden.images,
+.ui.hidden.image {
+ display: none;
+}
+.ui.hidden.transition.images,
+.ui.hidden.transition.image {
+ display: block;
+ visibility: hidden;
+}
+
+
+.ui.disabled.images,
+.ui.disabled.image {
+ cursor: default;
+ opacity: @disabledOpacity;
+}
+
+
+/*******************************
+ Variations
+*******************************/
+
+
+/*--------------
+ Inline
+---------------*/
+
+.ui.inline.image,
+.ui.inline.image svg,
+.ui.inline.image img {
+ display: inline-block;
+}
+
+/*------------------
+ Vertical Aligned
+-------------------*/
+
+.ui.top.aligned.images .image,
+.ui.top.aligned.image,
+.ui.top.aligned.image svg,
+.ui.top.aligned.image img {
+ display: inline-block;
+ vertical-align: top;
+}
+.ui.middle.aligned.images .image,
+.ui.middle.aligned.image,
+.ui.middle.aligned.image svg,
+.ui.middle.aligned.image img {
+ display: inline-block;
+ vertical-align: middle;
+}
+.ui.bottom.aligned.images .image,
+.ui.bottom.aligned.image,
+.ui.bottom.aligned.image svg,
+.ui.bottom.aligned.image img {
+ display: inline-block;
+ vertical-align: bottom;
+}
+
+/*--------------
+ Rounded
+---------------*/
+
+.ui.rounded.images .image,
+.ui.rounded.image,
+.ui.rounded.images .image > *,
+.ui.rounded.image > * {
+ border-radius: @roundedBorderRadius;
+}
+
+/*--------------
+ Bordered
+---------------*/
+
+.ui.bordered.images .image,
+.ui.bordered.images img,
+.ui.bordered.images svg,
+.ui.bordered.image img,
+.ui.bordered.image svg,
+img.ui.bordered.image {
+ border: @imageBorder;
+}
+
+/*--------------
+ Circular
+---------------*/
+
+.ui.circular.images,
+.ui.circular.image {
+ overflow: hidden;
+}
+
+.ui.circular.images .image,
+.ui.circular.image,
+.ui.circular.images .image > *,
+.ui.circular.image > * {
+ -webkit-border-radius: @circularRadius;
+ -moz-border-radius: @circularRadius;
+ border-radius: @circularRadius;
+}
+
+/*--------------
+ Fluid
+---------------*/
+
+.ui.fluid.images,
+.ui.fluid.image,
+.ui.fluid.images img,
+.ui.fluid.images svg,
+.ui.fluid.image svg,
+.ui.fluid.image img {
+ display: block;
+ width: 100%;
+ height: auto;
+}
+
+
+/*--------------
+ Avatar
+---------------*/
+
+.ui.avatar.images .image,
+.ui.avatar.images img,
+.ui.avatar.images svg,
+.ui.avatar.image img,
+.ui.avatar.image svg,
+.ui.avatar.image {
+ margin-right: @avatarMargin;
+
+ display: inline-block;
+ width: @avatarSize;
+ height: @avatarSize;
+
+ -webkit-border-radius: @circularRadius;
+ -moz-border-radius: @circularRadius;
+ border-radius: @circularRadius;
+}
+
+/*-------------------
+ Spaced
+--------------------*/
+
+.ui.spaced.image {
+ display: inline-block !important;
+ margin-left: @spacedDistance;
+ margin-right: @spacedDistance;
+}
+
+.ui[class*="left spaced"].image {
+ margin-left: @spacedDistance;
+ margin-right: 0em;
+}
+
+.ui[class*="right spaced"].image {
+ margin-left: 0em;
+ margin-right: @spacedDistance;
+}
+
+/*-------------------
+ Floated
+--------------------*/
+
+.ui.floated.image,
+.ui.floated.images {
+ float: left;
+ margin-right: @floatedHorizontalMargin;
+ margin-bottom: @floatedVerticalMargin;
+}
+.ui.right.floated.images,
+.ui.right.floated.image {
+ float: right;
+ margin-right: 0em;
+ margin-bottom: @floatedVerticalMargin;
+ margin-left: @floatedHorizontalMargin;
+}
+
+.ui.floated.images:last-child,
+.ui.floated.image:last-child {
+ margin-bottom: 0em;
+}
+
+
+.ui.centered.images,
+.ui.centered.image {
+ margin-left: auto;
+ margin-right: auto;
+}
+
+/*--------------
+ Sizes
+---------------*/
+
+.ui.mini.images .image,
+.ui.mini.images img,
+.ui.mini.images svg,
+.ui.mini.image {
+ width: @miniWidth;
+ height: auto;
+ font-size: @mini;
+}
+.ui.tiny.images .image,
+.ui.tiny.images img,
+.ui.tiny.images svg,
+.ui.tiny.image {
+ width: @tinyWidth;
+ height: auto;
+ font-size: @tiny;
+}
+.ui.small.images .image,
+.ui.small.images img,
+.ui.small.images svg,
+.ui.small.image {
+ width: @smallWidth;
+ height: auto;
+ font-size: @small;
+}
+.ui.medium.images .image,
+.ui.medium.images img,
+.ui.medium.images svg,
+.ui.medium.image {
+ width: @mediumWidth;
+ height: auto;
+ font-size: @medium;
+}
+.ui.large.images .image,
+.ui.large.images img,
+.ui.large.images svg,
+.ui.large.image {
+ width: @largeWidth;
+ height: auto;
+ font-size: @large;
+}
+.ui.big.images .image,
+.ui.big.images img,
+.ui.big.images svg,
+.ui.big.image {
+ width: @bigWidth;
+ height: auto;
+ font-size: @big;
+}
+.ui.huge.images .image,
+.ui.huge.images img,
+.ui.huge.images svg,
+.ui.huge.image {
+ width: @hugeWidth;
+ height: auto;
+ font-size: @huge;
+}
+.ui.massive.images .image,
+.ui.massive.images img,
+.ui.massive.images svg,
+.ui.massive.image {
+ width: @massiveWidth;
+ height: auto;
+ font-size: @massive;
+}
+
+
+/*******************************
+ Groups
+*******************************/
+
+.ui.images {
+ font-size: 0em;
+ margin: 0em -@imageHorizontalMargin 0rem;
+}
+
+.ui.images .image,
+.ui.images img,
+.ui.images svg {
+ display: inline-block;
+ margin: 0em @imageHorizontalMargin @imageVerticalMargin;
+}
+
+.loadUIOverrides();
http://git-wip-us.apache.org/repos/asf/incubator-senssoft-tap/blob/db97ec6f/semantic/src/definitions/elements/input.less
----------------------------------------------------------------------
diff --git a/semantic/src/definitions/elements/input.less b/semantic/src/definitions/elements/input.less
new file mode 100755
index 0000000..991a309
--- /dev/null
+++ b/semantic/src/definitions/elements/input.less
@@ -0,0 +1,507 @@
+/*!
+ * # Semantic UI - Input
+ * http://github.com/semantic-org/semantic-ui/
+ *
+ *
+ * Released under the MIT license
+ * http://opensource.org/licenses/MIT
+ *
+ */
+
+/*******************************
+ Theme
+*******************************/
+
+@type : 'element';
+@element : 'input';
+
+@import (multiple) '../../theme.config';
+
+
+/*******************************
+ Standard
+*******************************/
+
+
+/*--------------------
+ Inputs
+---------------------*/
+
+.ui.input {
+ position: relative;
+ font-weight: normal;
+ font-style: normal;
+ display: inline-flex;
+ color: @inputColor;
+}
+.ui.input input {
+ margin: 0em;
+ max-width: 100%;
+ flex: 1 0 auto;
+ outline: none;
+ -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
+ text-align: @textAlign;
+ line-height: @lineHeight;
+
+ font-family: @inputFont;
+ padding: @padding;
+
+ background: @background;
+ border: @border;
+ color: @inputColor;
+ border-radius: @borderRadius;
+ transition: @transition;
+
+ box-shadow: @boxShadow;
+}
+
+
+/*--------------------
+ Placeholder
+---------------------*/
+
+/* browsers require these rules separate */
+
+.ui.input input::-webkit-input-placeholder {
+ color: @placeholderColor;
+}
+.ui.input input::-moz-placeholder {
+ color: @placeholderColor;
+}
+.ui.input input:-ms-input-placeholder {
+ color: @placeholderColor;
+}
+
+
+/*******************************
+ States
+*******************************/
+
+/*--------------------
+ Disabled
+---------------------*/
+
+.ui.disabled.input,
+.ui.input input[disabled] {
+ opacity: @disabledOpacity;
+}
+
+.ui.disabled.input input,
+.ui.input input[disabled] {
+ pointer-events: none;
+}
+
+/*--------------------
+ Active
+---------------------*/
+
+.ui.input input:active,
+.ui.input.down input {
+ border-color: @downBorderColor;
+ background: @downBackground;
+ color: @downColor;
+ box-shadow: @downBoxShadow;
+}
+
+/*--------------------
+ Loading
+---------------------*/
+
+.ui.loading.loading.input > i.icon:before {
+ position: absolute;
+ content: '';
+ top: 50%;
+ left: 50%;
+
+ margin: @loaderMargin;
+ width: @loaderSize;
+ height: @loaderSize;
+
+ border-radius: @circularRadius;
+ border: @loaderLineWidth solid @loaderFillColor;
+}
+.ui.loading.loading.input > i.icon:after {
+ position: absolute;
+ content: '';
+ top: 50%;
+ left: 50%;
+
+ margin: @loaderMargin;
+ width: @loaderSize;
+ height: @loaderSize;
+
+ animation: button-spin @loaderSpeed linear;
+ animation-iteration-count: infinite;
+
+ border-radius: @circularRadius;
+
+ border-color: @loaderLineColor transparent transparent;
+ border-style: solid;
+ border-width: @loaderLineWidth;
+
+ box-shadow: 0px 0px 0px 1px transparent;
+}
+
+
+/*--------------------
+ Focus
+---------------------*/
+
+.ui.input.focus input,
+.ui.input input:focus {
+ border-color: @focusBorderColor;
+ background: @focusBackground;
+ color: @focusColor;
+ box-shadow: @focusBoxShadow;
+}
+.ui.input.focus input::-webkit-input-placeholder,
+.ui.input input:focus::-webkit-input-placeholder {
+ color: @placeholderFocusColor;
+}
+.ui.input.focus input::-moz-placeholder,
+.ui.input input:focus::-moz-placeholder {
+ color: @placeholderFocusColor;
+}
+.ui.input.focus input:-ms-input-placeholder,
+.ui.input input:focus:-ms-input-placeholder {
+ color: @placeholderFocusColor;
+}
+
+
+
+/*--------------------
+ Error
+---------------------*/
+
+.ui.input.error input {
+ background-color: @errorBackground;
+ border-color: @errorBorder;
+ color: @errorColor;
+ box-shadow: @errorBoxShadow;
+}
+
+/* Error Placeholder */
+.ui.input.error input::-webkit-input-placeholder {
+ color: @placeholderErrorColor;
+}
+.ui.input.error input::-moz-placeholder {
+ color: @placeholderErrorColor;
+}
+.ui.input.error input:-ms-input-placeholder {
+ color: @placeholderErrorColor !important;
+}
+
+/* Focused Error Placeholder */
+.ui.input.error input:focus::-webkit-input-placeholder {
+ color: @placeholderErrorFocusColor;
+}
+.ui.input.error input:focus::-moz-placeholder {
+ color: @placeholderErrorFocusColor;
+}
+.ui.input.error input:focus:-ms-input-placeholder {
+ color: @placeholderErrorFocusColor !important;
+}
+
+/*******************************
+ Variations
+*******************************/
+
+/*--------------------
+ Transparent
+---------------------*/
+
+
+.ui.transparent.input input {
+ border-color: transparent !important;
+ background-color: transparent !important;
+ padding: 0em !important;
+ box-shadow: none !important;
+}
+
+/* Transparent Icon */
+.ui.transparent.icon.input > i.icon {
+ width: @transparentIconWidth;
+}
+.ui.transparent.icon.input > input {
+ padding-left: 0em !important;
+ padding-right: @transparentIconMargin !important;
+}
+.ui.transparent[class*="left icon"].input > input {
+ padding-left: @transparentIconMargin !important;
+ padding-right: 0em !important;
+}
+
+/* Transparent Inverted */
+.ui.transparent.inverted.input {
+ color: @transparentInvertedColor;
+}
+.ui.transparent.inverted.input input {
+ color: inherit;
+}
+
+.ui.transparent.inverted.input input::-webkit-input-placeholder {
+ color: @transparentInvertedPlaceholderColor;
+}
+.ui.transparent.inverted.input input::-moz-placeholder {
+ color: @transparentInvertedPlaceholderColor;
+}
+.ui.transparent.inverted.input input:-ms-input-placeholder {
+ color: @transparentInvertedPlaceholderColor;
+}
+
+
+/*--------------------
+ Icon
+---------------------*/
+
+.ui.icon.input > i.icon {
+ cursor: default;
+ position: absolute;
+ line-height: 1;
+ text-align: center;
+ top: 0px;
+ right: 0px;
+ margin: 0em;
+ height: 100%;
+
+ width: @iconWidth;
+ opacity: @iconOpacity;
+ border-radius: 0em @borderRadius @borderRadius 0em;
+ transition: @iconTransition;
+}
+.ui.icon.input > i.icon:not(.link) {
+ pointer-events: none;
+}
+.ui.icon.input input {
+ padding-right: @iconMargin !important;
+}
+
+.ui.icon.input > i.icon:before,
+.ui.icon.input > i.icon:after {
+ left: 0;
+ position: absolute;
+ text-align: center;
+ top: 50%;
+ width: 100%;
+ margin-top: @iconOffset;
+}
+.ui.icon.input > i.link.icon {
+ cursor: pointer;
+}
+.ui.icon.input > i.circular.icon {
+ top: @circularIconVerticalOffset;
+ right: @circularIconHorizontalOffset;
+}
+
+/* Left Icon Input */
+.ui[class*="left icon"].input > i.icon {
+ right: auto;
+ left: @borderWidth;
+ border-radius: @borderRadius 0em 0em @borderRadius;
+}
+.ui[class*="left icon"].input > i.circular.icon {
+ right: auto;
+ left: @circularIconHorizontalOffset;
+}
+.ui[class*="left icon"].input > input {
+ padding-left: @iconMargin !important;
+ padding-right: @horizontalPadding !important;
+}
+
+/* Focus */
+.ui.icon.input > input:focus ~ i.icon {
+ opacity: 1;
+}
+
+/*--------------------
+ Labeled
+---------------------*/
+
+/* Adjacent Label */
+.ui.labeled.input > .label {
+ flex: 0 0 auto;
+ margin: 0;
+ font-size: @relativeMedium;
+}
+.ui.labeled.input > .label:not(.corner) {
+ padding-top: @verticalPadding;
+ padding-bottom: @verticalPadding;
+}
+
+/* Regular Label on Left */
+.ui.labeled.input:not([class*="corner labeled"]) .label:first-child {
+ border-top-right-radius: 0px;
+ border-bottom-right-radius: 0px;
+}
+.ui.labeled.input:not([class*="corner labeled"]) .label:first-child + input {
+ border-top-left-radius: 0px;
+ border-bottom-left-radius: 0px;
+ border-left-color: transparent;
+}
+.ui.labeled.input:not([class*="corner labeled"]) .label:first-child + input:focus {
+ border-left-color: @focusBorderColor;
+}
+
+/* Regular Label on Right */
+.ui[class*="right labeled"].input input {
+ border-top-right-radius: 0px !important;
+ border-bottom-right-radius: 0px !important;
+ border-right-color: transparent !important;
+}
+.ui[class*="right labeled"].input input + .label {
+ border-top-left-radius: 0px;
+ border-bottom-left-radius: 0px;
+}
+
+.ui[class*="right labeled"].input input:focus {
+ border-right-color: @focusBorderColor !important;
+}
+
+/* Corner Label */
+.ui.labeled.input .corner.label {
+ top: @labelCornerTop;
+ right: @labelCornerRight;
+ font-size: @labelCornerSize;
+ border-radius: 0em @borderRadius 0em 0em;
+}
+
+/* Spacing with corner label */
+.ui[class*="corner labeled"]:not([class*="left corner labeled"]).labeled.input input {
+ padding-right: @labeledMargin !important;
+}
+.ui[class*="corner labeled"].icon.input:not([class*="left corner labeled"]) > input {
+ padding-right: @labeledIconInputMargin !important;
+}
+.ui[class*="corner labeled"].icon.input:not([class*="left corner labeled"]) > .icon {
+ margin-right: @labeledIconMargin;
+}
+
+/* Left Labeled */
+.ui[class*="left corner labeled"].labeled.input input {
+ padding-left: @labeledMargin !important;
+}
+.ui[class*="left corner labeled"].icon.input > input {
+ padding-left: @labeledIconInputMargin !important;
+}
+.ui[class*="left corner labeled"].icon.input > .icon {
+ margin-left: @labeledIconMargin;
+}
+
+/* Corner Label Position */
+.ui.input > .ui.corner.label {
+ top: @borderWidth;
+ right: @borderWidth;
+}
+.ui.input > .ui.left.corner.label {
+ right: auto;
+ left: @borderWidth;
+}
+
+
+/*--------------------
+ Action
+---------------------*/
+
+.ui.action.input > .button,
+.ui.action.input > .buttons {
+ display: flex;
+ align-items: center;
+ flex: 0 0 auto;
+}
+.ui.action.input > .button,
+.ui.action.input > .buttons > .button {
+ padding-top: @verticalPadding;
+ padding-bottom: @verticalPadding;
+ margin: 0;
+}
+
+/* Button on Right */
+.ui.action.input:not([class*="left action"]) > input {
+ border-top-right-radius: 0px !important;
+ border-bottom-right-radius: 0px !important;
+ border-right-color: transparent !important;
+}
+.ui.action.input:not([class*="left action"]) > .dropdown:not(:first-child),
+.ui.action.input:not([class*="left action"]) > .button:not(:first-child),
+.ui.action.input:not([class*="left action"]) > .buttons:not(:first-child) > .button {
+ border-radius: 0px;
+}
+.ui.action.input:not([class*="left action"]) > .dropdown:last-child,
+.ui.action.input:not([class*="left action"]) > .button:last-child,
+.ui.action.input:not([class*="left action"]) > .buttons:last-child > .button {
+ border-radius: 0px @borderRadius @borderRadius 0px;
+}
+
+/* Input Focus */
+.ui.action.input:not([class*="left action"]) input:focus {
+ border-right-color: @focusBorderColor !important;
+}
+
+/* Button on Left */
+.ui[class*="left action"].input > input {
+ border-top-left-radius: 0px !important;
+ border-bottom-left-radius: 0px !important;
+ border-left-color: transparent !important;
+}
+.ui[class*="left action"].input > .dropdown,
+.ui[class*="left action"].input > .button,
+.ui[class*="left action"].input > .buttons > .button {
+ border-radius: 0px;
+}
+.ui[class*="left action"].input > .dropdown:first-child,
+.ui[class*="left action"].input > .button:first-child,
+.ui[class*="left action"].input > .buttons:first-child > .button {
+ border-radius: @borderRadius 0px 0px @borderRadius;
+}
+/* Input Focus */
+.ui[class*="left action"].input > input:focus {
+ border-left-color: @focusBorderColor !important;
+}
+
+/*--------------------
+ Inverted
+---------------------*/
+
+/* Standard */
+.ui.inverted.input input {
+ border: none;
+}
+
+/*--------------------
+ Fluid
+---------------------*/
+
+.ui.fluid.input {
+ display: flex;
+}
+.ui.fluid.input > input {
+ width: 0px !important;
+}
+
+/*--------------------
+ Size
+---------------------*/
+
+.ui.mini.input {
+ font-size: @relativeMini;
+}
+.ui.small.input {
+ font-size: @relativeSmall;
+}
+.ui.input {
+ font-size: @relativeMedium;
+}
+.ui.large.input {
+ font-size: @relativeLarge;
+}
+.ui.big.input {
+ font-size: @relativeBig;
+}
+.ui.huge.input {
+ font-size: @relativeHuge;
+}
+.ui.massive.input {
+ font-size: @relativeMassive;
+}
+
+.loadUIOverrides();
http://git-wip-us.apache.org/repos/asf/incubator-senssoft-tap/blob/db97ec6f/semantic/src/definitions/elements/label.less
----------------------------------------------------------------------
diff --git a/semantic/src/definitions/elements/label.less b/semantic/src/definitions/elements/label.less
new file mode 100755
index 0000000..fe84cb5
--- /dev/null
+++ b/semantic/src/definitions/elements/label.less
@@ -0,0 +1,1257 @@
+/*!
+ * # Semantic UI - Label
+ * http://github.com/semantic-org/semantic-ui/
+ *
+ *
+ * Released under the MIT license
+ * http://opensource.org/licenses/MIT
+ *
+ */
+
+
+/*******************************
+ Theme
+*******************************/
+
+@type : 'element';
+@element : 'label';
+
+@import (multiple) '../../theme.config';
+
+/*******************************
+ Label
+*******************************/
+
+.ui.label {
+ display: inline-block;
+ line-height: 1;
+ vertical-align: @verticalAlign;
+
+ margin: @verticalMargin @horizontalMargin;
+
+ background-color: @backgroundColor;
+ background-image: @backgroundImage;
+ padding: @verticalPadding @horizontalPadding;
+ color: @color;
+
+ text-transform: @textTransform;
+ font-weight: @fontWeight;
+
+ border: @border;
+ border-radius: @borderRadius;
+ transition: @transition;
+}
+
+.ui.label:first-child {
+ margin-left: 0em;
+}
+.ui.label:last-child {
+ margin-right: 0em;
+}
+
+/* Link */
+a.ui.label {
+ cursor: pointer;
+}
+
+/* Inside Link */
+.ui.label > a {
+ cursor: pointer;
+ color: inherit;
+ opacity: @linkOpacity;
+ transition: @linkTransition;
+}
+.ui.label > a:hover {
+ opacity: 1;
+}
+
+/* Image */
+.ui.label > img {
+ width: auto !important;
+ vertical-align: middle;
+ height: @imageHeight !important;
+}
+
+/* Icon */
+.ui.label > .icon {
+ width: auto;
+ margin: 0em @iconDistance 0em 0em;
+}
+
+/* Detail */
+.ui.label > .detail {
+ display: inline-block;
+ vertical-align: top;
+ font-weight: @detailFontWeight;
+ margin-left: @detailMargin;
+ opacity: @detailOpacity;
+}
+.ui.label > .detail .icon {
+ margin: 0em @detailIconDistance 0em 0em;
+}
+
+
+/* Removable label */
+.ui.label > .close.icon,
+.ui.label > .delete.icon {
+ cursor: pointer;
+ margin-right: 0em;
+ margin-left: @deleteMargin;
+ font-size: @deleteSize;
+ opacity: @deleteOpacity;
+ transition: @deleteTransition;
+}
+.ui.label > .delete.icon:hover {
+ opacity: 1;
+}
+
+/*-------------------
+ Group
+--------------------*/
+
+.ui.labels > .label {
+ margin: 0em @groupHorizontalMargin @groupVerticalMargin 0em;
+}
+
+
+/*-------------------
+ Coupling
+--------------------*/
+
+.ui.header > .ui.label {
+ margin-top: @lineHeightOffset;
+}
+
+/* Remove border radius on attached segment */
+.ui.attached.segment > .ui.top.left.attached.label,
+.ui.bottom.attached.segment > .ui.top.left.attached.label {
+ border-top-left-radius: 0;
+}
+.ui.attached.segment > .ui.top.right.attached.label,
+.ui.bottom.attached.segment > .ui.top.right.attached.label {
+ border-top-right-radius: 0;
+}
+.ui.top.attached.segment > .ui.bottom.left.attached.label {
+ border-bottom-left-radius: 0;
+}
+.ui.top.attached.segment > .ui.bottom.right.attached.label {
+ border-bottom-right-radius: 0;
+}
+
+/* Padding on next content after a label */
+.ui.top.attached.label:first-child + :not(.attached),
+.ui.top.attached.label + [class*="right floated"] + * {
+ margin-top: @attachedSegmentPadding !important;
+}
+.ui.bottom.attached.label:first-child ~ :last-child:not(.attached) {
+ margin-top: 0em;
+ margin-bottom: @attachedSegmentPadding !important;
+}
+
+
+/*******************************
+ Types
+*******************************/
+
+.ui.image.label {
+ width: auto !important;
+ margin-top: 0em;
+ margin-bottom: 0em;
+ max-width: 9999px;
+ vertical-align: baseline;
+ text-transform: none;
+
+ background: @imageLabelBackground;
+ padding: @imageLabelPadding;
+ border-radius: @imageLabelBorderRadius;
+ box-shadow: @imageLabelBoxShadow;
+}
+
+.ui.image.label img {
+ display: inline-block;
+ vertical-align: top;
+
+ height: @imageLabelImageHeight;
+ margin: @imageLabelImageMargin;
+ border-radius: @imageLabelImageBorderRadius;
+}
+
+.ui.image.label .detail {
+ background: @imageLabelDetailBackground;
+ margin: @imageLabelDetailMargin;
+ padding: @imageLabelDetailPadding;
+ border-radius: 0em @imageLabelBorderRadius @imageLabelBorderRadius 0em;
+}
+
+/*-------------------
+ Tag
+--------------------*/
+
+.ui.tag.labels .label,
+.ui.tag.label {
+ margin-left: 1em;
+ position: relative;
+ padding-left: @tagHorizontalPadding;
+ padding-right: @tagHorizontalPadding;
+
+ border-radius: 0em @borderRadius @borderRadius 0em;
+ transition: @tagTransition;
+}
+.ui.tag.labels .label:before,
+.ui.tag.label:before {
+ position: absolute;
+ transform: translateY(-50%) translateX(50%) rotate(-45deg);
+
+ top: @tagTriangleTopOffset;
+ right: @tagTriangleRightOffset;
+ content: '';
+
+ background-color: inherit;
+ background-image: @tagTriangleBackgroundImage;
+
+ width: @tagTriangleSize;
+ height: @tagTriangleSize;
+ transition: @tagTransition;
+}
+
+
+.ui.tag.labels .label:after,
+.ui.tag.label:after {
+ position: absolute;
+ content: '';
+ top: 50%;
+ left: -(@tagCircleSize / 2);
+
+ margin-top: -(@tagCircleSize / 2);
+ background-color: @tagCircleColor !important;
+ width: @tagCircleSize;
+ height: @tagCircleSize;
+
+ box-shadow: @tagCircleBoxShadow;
+ border-radius: @circularRadius;
+}
+
+
+/*-------------------
+ Corner Label
+--------------------*/
+
+.ui.corner.label {
+ position: absolute;
+ top: 0em;
+ right: 0em;
+ margin: 0em;
+ padding: 0em;
+ text-align: center;
+
+ border-color: @backgroundColor;
+
+ width: @cornerTriangleSize;
+ height: @cornerTriangleSize;
+ z-index: @cornerTriangleZIndex;
+ transition: @cornerTriangleTransition;
+}
+
+/* Icon Label */
+.ui.corner.label{
+ background-color: transparent !important;
+}
+.ui.corner.label:after {
+ position: absolute;
+ content: "";
+ right: 0em;
+ top: 0em;
+ z-index: -1;
+
+ width: 0em;
+ height: 0em;
+ background-color: transparent !important;
+
+ border-top: 0em solid transparent;
+ border-right: @cornerTriangleSize solid transparent;
+ border-bottom: @cornerTriangleSize solid transparent;
+ border-left: 0em solid transparent;
+
+ border-right-color: inherit;
+ transition: @cornerTriangleTransition;
+}
+
+.ui.corner.label .icon {
+ cursor: default;
+ position: relative;
+ top: @cornerIconTopOffset;
+ left: @cornerIconLeftOffset;
+ font-size: @cornerIconSize;
+ margin: 0em;
+}
+
+/* Left Corner */
+.ui.left.corner.label,
+.ui.left.corner.label:after {
+ right: auto;
+ left: 0em;
+}
+.ui.left.corner.label:after {
+ border-top: @cornerTriangleSize solid transparent;
+ border-right: @cornerTriangleSize solid transparent;
+ border-bottom: 0em solid transparent;
+ border-left: 0em solid transparent;
+
+ border-top-color: inherit;
+}
+.ui.left.corner.label .icon {
+ left: -@cornerIconLeftOffset;
+}
+
+/* Segment */
+.ui.segment > .ui.corner.label {
+ top: -1px;
+ right: -1px;
+}
+.ui.segment > .ui.left.corner.label {
+ right: auto;
+ left: -1px;
+}
+
+/*-------------------
+ Ribbon
+--------------------*/
+
+.ui.ribbon.label {
+ position: relative;
+ margin: 0em;
+ min-width: max-content;
+ border-radius: 0em @borderRadius @borderRadius 0em;
+ border-color: @ribbonShadowColor;
+}
+
+.ui.ribbon.label:after {
+ position: absolute;
+ content: '';
+
+ top: 100%;
+ left: 0%;
+ background-color: transparent !important;
+
+ border-style: solid;
+ border-width: 0em @ribbonTriangleSize @ribbonTriangleSize 0em;
+ border-color: transparent;
+ border-right-color: inherit;
+
+ width: 0em;
+ height: 0em;
+}
+/* Positioning */
+.ui.ribbon.label {
+ left: @ribbonOffset;
+ margin-right: -@ribbonTriangleSize;
+ padding-left: @ribbonDistance;
+ padding-right: @ribbonTriangleSize;
+}
+.ui[class*="right ribbon"].label {
+ left: @rightRibbonOffset;
+ padding-left: @ribbonTriangleSize;
+ padding-right: @ribbonDistance;
+}
+
+/* Right Ribbon */
+.ui[class*="right ribbon"].label {
+ text-align: left;
+ transform: translateX(-100%);
+ border-radius: @borderRadius 0em 0em @borderRadius;
+}
+.ui[class*="right ribbon"].label:after {
+ left: auto;
+ right: 0%;
+
+ border-style: solid;
+ border-width: @ribbonTriangleSize @ribbonTriangleSize 0em 0em;
+ border-color: transparent;
+ border-top-color: inherit;
+}
+
+/* Inside Table */
+.ui.image > .ribbon.label,
+.ui.card .image > .ribbon.label {
+ position: absolute;
+ top: @ribbonImageTopDistance;
+}
+.ui.card .image > .ui.ribbon.label,
+.ui.image > .ui.ribbon.label {
+ left: @ribbonImageOffset;
+}
+.ui.card .image > .ui[class*="right ribbon"].label,
+.ui.image > .ui[class*="right ribbon"].label {
+ left: @rightRibbonImageOffset;
+ padding-left: @horizontalPadding;
+}
+
+/* Inside Table */
+.ui.table td > .ui.ribbon.label {
+ left: @ribbonTableOffset;
+}
+.ui.table td > .ui[class*="right ribbon"].label {
+ left: @rightRibbonTableOffset;
+ padding-left: @horizontalPadding;
+}
+
+
+/*-------------------
+ Attached
+--------------------*/
+
+.ui[class*="top attached"].label,
+.ui.attached.label {
+ width: 100%;
+ position: absolute;
+ margin: 0em;
+ top: 0em;
+ left: 0em;
+
+ padding: @attachedVerticalPadding @attachedHorizontalPadding;
+
+ border-radius: @attachedCornerBorderRadius @attachedCornerBorderRadius 0em 0em;
+}
+.ui[class*="bottom attached"].label {
+ top: auto;
+ bottom: 0em;
+ border-radius: 0em 0em @attachedCornerBorderRadius @attachedCornerBorderRadius;
+}
+
+.ui[class*="top left attached"].label {
+ width: auto;
+ margin-top: 0em !important;
+ border-radius: @attachedCornerBorderRadius 0em @attachedBorderRadius 0em;
+}
+
+.ui[class*="top right attached"].label {
+ width: auto;
+ left: auto;
+ right: 0em;
+ border-radius: 0em @attachedCornerBorderRadius 0em @attachedBorderRadius;
+}
+.ui[class*="bottom left attached"].label {
+ width: auto;
+ top: auto;
+ bottom: 0em;
+ border-radius: 0em @attachedBorderRadius 0em @attachedCornerBorderRadius;
+}
+.ui[class*="bottom right attached"].label {
+ top: auto;
+ bottom: 0em;
+ left: auto;
+ right: 0em;
+ width: auto;
+ border-radius: @attachedBorderRadius 0em @attachedCornerBorderRadius 0em;
+}
+
+
+/*******************************
+ States
+*******************************/
+
+/*-------------------
+ Disabled
+--------------------*/
+
+.ui.label.disabled {
+ opacity: 0.5;
+}
+
+/*-------------------
+ Hover
+--------------------*/
+
+a.ui.labels .label:hover,
+a.ui.label:hover {
+ background-color: @labelHoverBackgroundColor;
+ border-color: @labelHoverBackgroundColor;
+
+ background-image: @labelHoverBackgroundImage;
+ color: @labelHoverTextColor;
+}
+.ui.labels a.label:hover:before,
+a.ui.label:hover:before {
+ color: @labelHoverTextColor;
+}
+
+/*-------------------
+ Active
+--------------------*/
+
+.ui.active.label {
+ background-color: @labelActiveBackgroundColor;
+ border-color: @labelActiveBackgroundColor;
+
+ background-image: @labelActiveBackgroundImage;
+ color: @labelActiveTextColor;
+}
+.ui.active.label:before {
+ background-color: @labelActiveBackgroundColor;
+ background-image: @labelActiveBackgroundImage;
+ color: @labelActiveTextColor;
+}
+
+/*-------------------
+ Active Hover
+--------------------*/
+
+a.ui.labels .active.label:hover,
+a.ui.active.label:hover {
+ background-color: @labelActiveHoverBackgroundColor;
+ border-color: @labelActiveHoverBackgroundColor;
+
+ background-image: @labelActiveHoverBackgroundImage;
+ color: @labelActiveHoverTextColor;
+}
+.ui.labels a.active.label:ActiveHover:before,
+a.ui.active.label:ActiveHover:before {
+ background-color: @labelActiveHoverBackgroundColor;
+ background-image: @labelActiveHoverBackgroundImage;
+ color: @labelActiveHoverTextColor;
+}
+
+
+/*-------------------
+ Visible
+--------------------*/
+
+.ui.labels.visible .label,
+.ui.label.visible {
+ display: inline-block !important;
+}
+
+/*-------------------
+ Hidden
+--------------------*/
+
+.ui.labels.hidden .label,
+.ui.label.hidden {
+ display: none !important;
+}
+
+
+/*******************************
+ Variations
+*******************************/
+
+
+/*-------------------
+ Colors
+--------------------*/
+
+/*--- Red ---*/
+.ui.red.labels .label,
+.ui.red.label {
+ background-color: @red !important;
+ border-color: @red !important;
+ color: @redTextColor !important;
+}
+/* Link */
+.ui.red.labels .label:hover,
+a.ui.red.label:hover{
+ background-color: @redHover !important;
+ border-color: @redHover !important;
+ color: @redHoverTextColor !important;
+}
+/* Corner */
+.ui.red.corner.label,
+.ui.red.corner.label:hover {
+ background-color: transparent !important;
+}
+/* Ribbon */
+.ui.red.ribbon.label {
+ border-color: @redRibbonShadow !important;
+}
+/* Basic */
+.ui.basic.red.label {
+ background-color: @white !important;
+ color: @red !important;
+ border-color: @red !important;
+}
+.ui.basic.red.labels a.label:hover,
+a.ui.basic.red.label:hover {
+ background-color: @white !important;
+ color: @redHover !important;
+ border-color: @redHover !important;
+}
+
+/*--- Orange ---*/
+.ui.orange.labels .label,
+.ui.orange.label {
+ background-color: @orange !important;
+ border-color: @orange !important;
+ color: @orangeTextColor !important;
+}
+/* Link */
+.ui.orange.labels .label:hover,
+a.ui.orange.label:hover{
+ background-color: @orangeHover !important;
+ border-color: @orangeHover !important;
+ color: @orangeHoverTextColor !important;
+}
+/* Corner */
+.ui.orange.corner.label,
+.ui.orange.corner.label:hover {
+ background-color: transparent !important;
+}
+/* Ribbon */
+.ui.orange.ribbon.label {
+ border-color: @orangeRibbonShadow !important;
+}
+/* Basic */
+.ui.basic.orange.label {
+ background-color: @white !important;
+ color: @orange !important;
+ border-color: @orange !important;
+}
+.ui.basic.orange.labels a.label:hover,
+a.ui.basic.orange.label:hover {
+ background-color: @white !important;
+ color: @orangeHover !important;
+ border-color: @orangeHover !important;
+}
+
+/*--- Yellow ---*/
+.ui.yellow.labels .label,
+.ui.yellow.label {
+ background-color: @yellow !important;
+ border-color: @yellow !important;
+ color: @yellowTextColor !important;
+}
+/* Link */
+.ui.yellow.labels .label:hover,
+a.ui.yellow.label:hover{
+ background-color: @yellowHover !important;
+ border-color: @yellowHover !important;
+ color: @yellowHoverTextColor !important;
+}
+/* Corner */
+.ui.yellow.corner.label,
+.ui.yellow.corner.label:hover {
+ background-color: transparent !important;
+}
+/* Ribbon */
+.ui.yellow.ribbon.label {
+ border-color: @yellowRibbonShadow !important;
+}
+/* Basic */
+.ui.basic.yellow.label {
+ background-color: @white !important;
+ color: @yellow !important;
+ border-color: @yellow !important;
+}
+.ui.basic.yellow.labels a.label:hover,
+a.ui.basic.yellow.label:hover {
+ background-color: @white !important;
+ color: @yellowHover !important;
+ border-color: @yellowHover !important;
+}
+
+/*--- Olive ---*/
+.ui.olive.labels .label,
+.ui.olive.label {
+ background-color: @olive !important;
+ border-color: @olive !important;
+ color: @oliveTextColor !important;
+}
+/* Link */
+.ui.olive.labels .label:hover,
+a.ui.olive.label:hover{
+ background-color: @oliveHover !important;
+ border-color: @oliveHover !important;
+ color: @oliveHoverTextColor !important;
+}
+/* Corner */
+.ui.olive.corner.label,
+.ui.olive.corner.label:hover {
+ background-color: transparent !important;
+}
+/* Ribbon */
+.ui.olive.ribbon.label {
+ border-color: @greenRibbonShadow !important;
+}
+/* Basic */
+.ui.basic.olive.label {
+ background-color: @white !important;
+ color: @olive !important;
+ border-color: @olive !important;
+}
+.ui.basic.olive.labels a.label:hover,
+a.ui.basic.olive.label:hover {
+ background-color: @white !important;
+ color: @oliveHover !important;
+ border-color: @oliveHover !important;
+}
+
+/*--- Green ---*/
+.ui.green.labels .label,
+.ui.green.label {
+ background-color: @green !important;
+ border-color: @green !important;
+ color: @greenTextColor !important;
+}
+/* Link */
+.ui.green.labels .label:hover,
+a.ui.green.label:hover{
+ background-color: @greenHover !important;
+ border-color: @greenHover !important;
+ color: @greenHoverTextColor !important;
+}
+/* Corner */
+.ui.green.corner.label,
+.ui.green.corner.label:hover {
+ background-color: transparent !important;
+}
+/* Ribbon */
+.ui.green.ribbon.label {
+ border-color: @greenRibbonShadow !important;
+}
+/* Basic */
+.ui.basic.green.label {
+ background-color: @white !important;
+ color: @green !important;
+ border-color: @green !important;
+}
+.ui.basic.green.labels a.label:hover,
+a.ui.basic.green.label:hover {
+ background-color: @white !important;
+ color: @greenHover !important;
+ border-color: @greenHover !important;
+}
+
+/*--- Teal ---*/
+.ui.teal.labels .label,
+.ui.teal.label {
+ background-color: @teal !important;
+ border-color: @teal !important;
+ color: @tealTextColor !important;
+}
+/* Link */
+.ui.teal.labels .label:hover,
+a.ui.teal.label:hover{
+ background-color: @tealHover !important;
+ border-color: @tealHover !important;
+ color: @tealHoverTextColor !important;
+}
+/* Corner */
+.ui.teal.corner.label,
+.ui.teal.corner.label:hover {
+ background-color: transparent !important;
+}
+/* Ribbon */
+.ui.teal.ribbon.label {
+ border-color: @tealRibbonShadow !important;
+}
+/* Basic */
+.ui.basic.teal.label {
+ background-color: @white !important;
+ color: @teal !important;
+ border-color: @teal !important;
+}
+.ui.basic.teal.labels a.label:hover,
+a.ui.basic.teal.label:hover {
+ background-color: @white !important;
+ color: @tealHover !important;
+ border-color: @tealHover !important;
+}
+
+/*--- Blue ---*/
+.ui.blue.labels .label,
+.ui.blue.label {
+ background-color: @blue !important;
+ border-color: @blue !important;
+ color: @blueTextColor !important;
+}
+/* Link */
+.ui.blue.labels .label:hover,
+a.ui.blue.label:hover{
+ background-color: @blueHover !important;
+ border-color: @blueHover !important;
+ color: @blueHoverTextColor !important;
+}
+/* Corner */
+.ui.blue.corner.label,
+.ui.blue.corner.label:hover {
+ background-color: transparent !important;
+}
+/* Ribbon */
+.ui.blue.ribbon.label {
+ border-color: @blueRibbonShadow !important;
+}
+/* Basic */
+.ui.basic.blue.label {
+ background-color: @white !important;
+ color: @blue !important;
+ border-color: @blue !important;
+}
+.ui.basic.blue.labels a.label:hover,
+a.ui.basic.blue.label:hover {
+ background-color: @white !important;
+ color: @blueHover !important;
+ border-color: @blueHover !important;
+}
+
+/*--- Violet ---*/
+.ui.violet.labels .label,
+.ui.violet.label {
+ background-color: @violet !important;
+ border-color: @violet !important;
+ color: @violetTextColor !important;
+}
+/* Link */
+.ui.violet.labels .label:hover,
+a.ui.violet.label:hover{
+ background-color: @violetHover !important;
+ border-color: @violetHover !important;
+ color: @violetHoverTextColor !important;
+}
+/* Corner */
+.ui.violet.corner.label,
+.ui.violet.corner.label:hover {
+ background-color: transparent !important;
+}
+/* Ribbon */
+.ui.violet.ribbon.label {
+ border-color: @violetRibbonShadow !important;
+}
+/* Basic */
+.ui.basic.violet.label {
+ background-color: @white !important;
+ color: @violet !important;
+ border-color: @violet !important;
+}
+.ui.basic.violet.labels a.label:hover,
+a.ui.basic.violet.label:hover {
+ background-color: @white !important;
+ color: @violetHover !important;
+ border-color: @violetHover !important;
+}
+
+/*--- Purple ---*/
+.ui.purple.labels .label,
+.ui.purple.label {
+ background-color: @purple !important;
+ border-color: @purple !important;
+ color: @purpleTextColor !important;
+}
+/* Link */
+.ui.purple.labels .label:hover,
+a.ui.purple.label:hover{
+ background-color: @purpleHover !important;
+ border-color: @purpleHover !important;
+ color: @purpleHoverTextColor !important;
+}
+/* Corner */
+.ui.purple.corner.label,
+.ui.purple.corner.label:hover {
+ background-color: transparent !important;
+}
+/* Ribbon */
+.ui.purple.ribbon.label {
+ border-color: @purpleRibbonShadow !important;
+}
+/* Basic */
+.ui.basic.purple.label {
+ background-color: @white !important;
+ color: @purple !important;
+ border-color: @purple !important;
+}
+.ui.basic.purple.labels a.label:hover,
+a.ui.basic.purple.label:hover {
+ background-color: @white !important;
+ color: @purpleHover !important;
+ border-color: @purpleHover !important;
+}
+
+/*--- Pink ---*/
+.ui.pink.labels .label,
+.ui.pink.label {
+ background-color: @pink !important;
+ border-color: @pink !important;
+ color: @pinkTextColor !important;
+}
+/* Link */
+.ui.pink.labels .label:hover,
+a.ui.pink.label:hover{
+ background-color: @pinkHover !important;
+ border-color: @pinkHover !important;
+ color: @pinkHoverTextColor !important;
+}
+/* Corner */
+.ui.pink.corner.label,
+.ui.pink.corner.label:hover {
+ background-color: transparent !important;
+}
+/* Ribbon */
+.ui.pink.ribbon.label {
+ border-color: @pinkRibbonShadow !important;
+}
+/* Basic */
+.ui.basic.pink.label {
+ background-color: @white !important;
+ color: @pink !important;
+ border-color: @pink !important;
+}
+.ui.basic.pink.labels a.label:hover,
+a.ui.basic.pink.label:hover {
+ background-color: @white !important;
+ color: @pinkHover !important;
+ border-color: @pinkHover !important;
+}
+
+/*--- Brown ---*/
+.ui.brown.labels .label,
+.ui.brown.label {
+ background-color: @brown !important;
+ border-color: @brown !important;
+ color: @brownTextColor !important;
+}
+/* Link */
+.ui.brown.labels .label:hover,
+a.ui.brown.label:hover{
+ background-color: @brownHover !important;
+ border-color: @brownHover !important;
+ color: @brownHoverTextColor !important;
+}
+/* Corner */
+.ui.brown.corner.label,
+.ui.brown.corner.label:hover {
+ background-color: transparent !important;
+}
+/* Ribbon */
+.ui.brown.ribbon.label {
+ border-color: @brownRibbonShadow !important;
+}
+/* Basic */
+.ui.basic.brown.label {
+ background-color: @white !important;
+ color: @brown !important;
+ border-color: @brown !important;
+}
+.ui.basic.brown.labels a.label:hover,
+a.ui.basic.brown.label:hover {
+ background-color: @white !important;
+ color: @brownHover !important;
+ border-color: @brownHover !important;
+}
+
+/*--- Grey ---*/
+.ui.grey.labels .label,
+.ui.grey.label {
+ background-color: @grey !important;
+ border-color: @grey !important;
+ color: @greyTextColor !important;
+}
+/* Link */
+.ui.grey.labels .label:hover,
+a.ui.grey.label:hover{
+ background-color: @greyHover !important;
+ border-color: @greyHover !important;
+ color: @greyHoverTextColor !important;
+}
+/* Corner */
+.ui.grey.corner.label,
+.ui.grey.corner.label:hover {
+ background-color: transparent !important;
+}
+/* Ribbon */
+.ui.grey.ribbon.label {
+ border-color: @brownRibbonShadow !important;
+}
+/* Basic */
+.ui.basic.grey.label {
+ background-color: @white !important;
+ color: @grey !important;
+ border-color: @grey !important;
+}
+.ui.basic.grey.labels a.label:hover,
+a.ui.basic.grey.label:hover {
+ background-color: @white !important;
+ color: @greyHover !important;
+ border-color: @greyHover !important;
+}
+
+/*--- Black ---*/
+.ui.black.labels .label,
+.ui.black.label {
+ background-color: @black !important;
+ border-color: @black !important;
+ color: @blackTextColor !important;
+}
+/* Link */
+.ui.black.labels .label:hover,
+a.ui.black.label:hover{
+ background-color: @blackHover !important;
+ border-color: @blackHover !important;
+ color: @blackHoverTextColor !important;
+}
+/* Corner */
+.ui.black.corner.label,
+.ui.black.corner.label:hover {
+ background-color: transparent !important;
+}
+/* Ribbon */
+.ui.black.ribbon.label {
+ border-color: @brownRibbonShadow !important;
+}
+/* Basic */
+.ui.basic.black.label {
+ background-color: @white !important;
+ color: @black !important;
+ border-color: @black !important;
+}
+.ui.basic.black.labels a.label:hover,
+a.ui.basic.black.label:hover {
+ background-color: @white !important;
+ color: @blackHover !important;
+ border-color: @blackHover !important;
+}
+
+
+/*-------------------
+ Basic
+--------------------*/
+
+.ui.basic.label {
+ background: @basicBackground;
+ border: @basicBorder;
+ color: @basicColor;
+ box-shadow: @basicBoxShadow;
+}
+
+/* Link */
+a.ui.basic.label:hover {
+ text-decoration: none;
+ background: @basicHoverBackground;
+ color: @basicHoverColor;
+ box-shadow: @basicHoverBorder;
+ box-shadow: @basicHoverBoxShadow;
+}
+
+/* Pointing */
+.ui.basic.pointing.label:before {
+ border-color: inherit;
+}
+
+
+/*-------------------
+ Fluid
+--------------------*/
+
+.ui.label.fluid,
+.ui.fluid.labels > .label {
+ width: 100%;
+ box-sizing: border-box;
+}
+
+/*-------------------
+ Inverted
+--------------------*/
+
+.ui.inverted.labels .label,
+.ui.inverted.label {
+ color: @invertedTextColor !important;
+}
+
+/*-------------------
+ Horizontal
+--------------------*/
+
+.ui.horizontal.labels .label,
+.ui.horizontal.label {
+ margin: 0em @horizontalLabelMargin 0em 0em;
+
+ padding: @horizontalLabelVerticalPadding @horizontalPadding;
+ min-width: @horizontalLabelMinWidth;
+ text-align: center;
+}
+
+
+/*-------------------
+ Circular
+--------------------*/
+
+.ui.circular.labels .label,
+.ui.circular.label {
+ min-width: @circularMinSize;
+ min-height: @circularMinSize;
+
+ padding: @circularPadding !important;
+
+ line-height: 1em;
+ text-align: center;
+ border-radius: @circularRadius;
+}
+.ui.empty.circular.labels .label,
+.ui.empty.circular.label {
+ min-width: 0em;
+ min-height: 0em;
+ overflow: hidden;
+ width: @emptyCircleSize;
+ height: @emptyCircleSize;
+ vertical-align: baseline;
+}
+
+/*-------------------
+ Pointing
+--------------------*/
+
+.ui.pointing.label {
+ position: relative;
+}
+
+.ui.attached.pointing.label {
+ position: absolute;
+}
+
+.ui.pointing.label:before {
+ background-color: inherit;
+ background-image: inherit;
+ border-width: none;
+ border-style: solid;
+ border-color: @pointingBorderColor;
+}
+/* Arrow */
+.ui.pointing.label:before {
+ position: absolute;
+ content: '';
+ transform: rotate(45deg);
+ background-image: none;
+
+ z-index: @pointingTriangleZIndex;
+ width: @pointingTriangleSize;
+ height: @pointingTriangleSize;
+ transition: @pointingTriangleTransition;
+}
+
+/*--- Above ---*/
+.ui.pointing.label,
+.ui[class*="pointing above"].label {
+ margin-top: @pointingVerticalDistance;
+}
+.ui.pointing.label:before,
+.ui[class*="pointing above"].label:before {
+ border-width: @borderWidth 0px 0px @borderWidth;
+ transform: translateX(-50%) translateY(-50%) rotate(45deg);
+ top: 0%;
+ left: 50%;
+}
+/*--- Below ---*/
+.ui[class*="bottom pointing"].label,
+.ui[class*="pointing below"].label {
+ margin-top: 0em;
+ margin-bottom: @pointingVerticalDistance;
+}
+.ui[class*="bottom pointing"].label:before,
+.ui[class*="pointing below"].label:before {
+ border-width: 0px @borderWidth @borderWidth 0px;
+ top: auto;
+ right: auto;
+ transform: translateX(-50%) translateY(-50%) rotate(45deg);
+ top: 100%;
+ left: 50%;
+}
+/*--- Left ---*/
+.ui[class*="left pointing"].label {
+ margin-top: 0em;
+ margin-left: @pointingHorizontalDistance;
+}
+.ui[class*="left pointing"].label:before {
+ border-width: 0px 0px @borderWidth @borderWidth;
+ transform: translateX(-50%) translateY(-50%) rotate(45deg);
+ bottom: auto;
+ right: auto;
+ top: 50%;
+ left: 0em;
+}
+/*--- Right ---*/
+.ui[class*="right pointing"].label {
+ margin-top: 0em;
+ margin-right: @pointingHorizontalDistance;
+}
+.ui[class*="right pointing"].label:before {
+ border-width: @borderWidth @borderWidth 0px 0px;
+ transform: translateX(50%) translateY(-50%) rotate(45deg);
+ top: 50%;
+ right: 0%;
+ bottom: auto;
+ left: auto;
+}
+
+/* Basic Pointing */
+
+/*--- Above ---*/
+.ui.basic.pointing.label:before,
+.ui.basic[class*="pointing above"].label:before {
+ margin-top: @basicPointingTriangleOffset;
+}
+/*--- Below ---*/
+.ui.basic[class*="bottom pointing"].label:before,
+.ui.basic[class*="pointing below"].label:before {
+ bottom: auto;
+ top: 100%;
+ margin-top: -@basicPointingTriangleOffset;
+}
+/*--- Left ---*/
+.ui.basic[class*="left pointing"].label:before {
+ top: 50%;
+ left: @basicPointingTriangleOffset;
+}
+/*--- Right ---*/
+.ui.basic[class*="right pointing"].label:before {
+ top: 50%;
+ right: @basicPointingTriangleOffset;
+}
+
+
+/*------------------
+ Floating Label
+-------------------*/
+
+.ui.floating.label {
+ position: absolute;
+ z-index: @floatingZIndex;
+ top: @floatingTopOffset;
+ left: 100%;
+ margin: 0em 0em 0em @floatingLeftOffset !important;
+}
+
+/*-------------------
+ Sizes
+--------------------*/
+
+.ui.mini.labels .label,
+.ui.mini.label {
+ font-size: @mini;
+}
+.ui.tiny.labels .label,
+.ui.tiny.label {
+ font-size: @tiny;
+}
+.ui.small.labels .label,
+.ui.small.label {
+ font-size: @small;
+}
+.ui.labels .label,
+.ui.label {
+ font-size: @medium;
+}
+.ui.large.labels .label,
+.ui.large.label {
+ font-size: @large;
+}
+.ui.big.labels .label,
+.ui.big.label {
+ font-size: @big;
+}
+.ui.huge.labels .label,
+.ui.huge.label {
+ font-size: @huge;
+}
+.ui.massive.labels .label,
+.ui.massive.label {
+ font-size: @massive;
+}
+
+.loadUIOverrides();