diff options
Diffstat (limited to 'semantic/src/definitions/elements/icon.less')
| -rw-r--r-- | semantic/src/definitions/elements/icon.less | 374 |
1 files changed, 0 insertions, 374 deletions
diff --git a/semantic/src/definitions/elements/icon.less b/semantic/src/definitions/elements/icon.less deleted file mode 100644 index e97ae46..0000000 --- a/semantic/src/definitions/elements/icon.less +++ /dev/null @@ -1,374 +0,0 @@ -/*! - * # Fomantic-UI - Icon - * http://github.com/fomantic/Fomantic-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: 0 @distanceFromText 0 0; - - width: @width; - height: @height; - - font-family: 'Icons'; - font-style: normal; - font-weight: @normal; - text-decoration: inherit; - text-align: center; - - speak: none; - -moz-osx-font-smoothing: grayscale; - -webkit-font-smoothing: antialiased; - backface-visibility: hidden; -} - -i.icon:before { - background: none !important; -} - -/******************************* - Types -*******************************/ - -& when (@variationIconLoading) { - /*-------------- - Loading - ---------------*/ - - i.icon.loading { - height: 1em; - line-height: 1; - animation: loader @loadingDuration linear infinite; - } -} - -/******************************* - States -*******************************/ - -i.icon:hover, i.icons:hover, -i.icon:active, i.icons:active, -i.emphasized.icon:not(.disabled), i.emphasized.icons:not(.disabled) { - opacity: 1; -} - -& when (@variationIconDisabled) { - i.disabled.icon, i.disabled.icons { - opacity: @disabledOpacity; - cursor: default; - pointer-events: none; - } -} - -/******************************* - Variations -*******************************/ - -& when (@variationIconFitted) { - /*------------------- - Fitted - --------------------*/ - - i.fitted.icon { - width: auto; - margin: 0 !important; - } -} - -& when (@variationIconLink) { - /*------------------- - Link - --------------------*/ - - i.link.icon:not(.disabled), i.link.icons:not(.disabled) { - cursor: pointer; - opacity: @linkOpacity; - transition: opacity @defaultDuration @defaultEasing; - } - i.link.icon:hover, i.link.icons:hover { - opacity: 1; - } -} - -& when (@variationIconCircular) { - /*------------------- - Circular - --------------------*/ - - i.circular.icon { - border-radius: 500em !important; - line-height: 1 !important; - - padding: @circularPadding !important; - box-shadow: @circularShadow; - - width: @circularSize !important; - height: @circularSize !important; - } - & when (@variationIconInverted) { - i.circular.inverted.icon { - border: none; - box-shadow: none; - } - } -} - -& when (@variationIconFlipped) { - /*------------------- - Flipped - --------------------*/ - - i.flipped.icon, - i.horizontally.flipped.icon { - transform: scale(-1, 1); - } - i.vertically.flipped.icon { - transform: scale(1, -1); - } -} - -& when (@variationIconRotated) { - /*------------------- - 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); - } - - i.halfway.rotated.icon { - transform: rotate(180deg); - } -} - -& when (@variationIconFlipped) and (@variationIconRotated) { - /*-------------------------- - Flipped & Rotated - ---------------------------*/ - - i.rotated.flipped.icon, - i.right.rotated.flipped.icon, - i.clockwise.rotated.flipped.icon { - transform: scale(-1, 1) rotate(90deg); - } - - i.left.rotated.flipped.icon, - i.counterclockwise.rotated.flipped.icon { - transform: scale(-1, 1) rotate(-90deg); - } - - i.halfway.rotated.flipped.icon { - transform: scale(-1, 1) rotate(180deg); - } - - i.rotated.vertically.flipped.icon, - i.right.rotated.vertically.flipped.icon, - i.clockwise.rotated.vertically.flipped.icon { - transform: scale(1, -1) rotate(90deg); - } - - i.left.rotated.vertically.flipped.icon, - i.counterclockwise.rotated.vertically.flipped.icon { - transform: scale(1, -1) rotate(-90deg); - } - - i.halfway.rotated.vertically.flipped.icon { - transform: scale(1, -1) rotate(180deg); - } -} - -& when (@variationIconBordered) { - /*------------------- - Bordered - --------------------*/ - - i.bordered.icon { - line-height: 1; - vertical-align: baseline; - - width: @borderedSize; - height: @borderedSize; - padding: @borderedVerticalPadding @borderedHorizontalPadding !important; - box-shadow: @borderedShadow; - } - & when (@variationIconInverted) { - i.bordered.inverted.icon { - border: none; - box-shadow: none; - } - } -} - -& when (@variationIconInverted) { - /*------------------- - Inverted - --------------------*/ - - /* Inverted Shapes */ - i.inverted.bordered.icon, - i.inverted.circular.icon { - background-color: @black; - color: @white; - } - - i.inverted.icon { - color: @white; - } -} - -/*------------------- - Colors ---------------------*/ - -each(@colors, { - @color: replace(@key, '@', ''); - @c: @colors[@@color][color]; - @l: @colors[@@color][light]; - - i.@{color}.icon.icon.icon.icon { - color: @c; - } - & when (@variationIconInverted) { - i.inverted.@{color}.icon.icon.icon.icon { - color: @l; - } - i.inverted.bordered.@{color}.icon.icon.icon.icon, - i.inverted.circular.@{color}.icon.icon.icon.icon { - background-color: @c; - color: @white; - } - } -}) - - -/*------------------- - Sizes ---------------------*/ - -i.icon, -i.icons { - font-size: @medium; - line-height: @lineHeight; -} -& when not (@variationIconSizes = false) { - each(@variationIconSizes, { - @s: @@value; - i.@{value}.@{value}.@{value}.icon, - i.@{value}.@{value}.@{value}.icons { - font-size: @s; - vertical-align: middle; - } - }) -} - -& when (@variationIconGroups) or (@variationIconCorner) { - /******************************* - 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: 0; - } - - i.icons .icon:first-child { - position: static; - width: auto; - height: auto; - vertical-align: top; - transform: none; - } - - & when (@variationIconCorner) { - /* Corner Icon */ - i.icons .corner.icon { - top: auto; - left: auto; - right: 0; - bottom: 0; - transform: none; - font-size: @cornerIconSize; - text-shadow: @cornerIconShadow; - } - i.icons .icon.corner[class*="top right"] { - top: 0; - left: auto; - right: 0; - bottom: auto; - } - i.icons .icon.corner[class*="top left"] { - top: 0; - left: 0; - right: auto; - bottom: auto; - } - i.icons .icon.corner[class*="bottom left"] { - top: auto; - left: 0; - right: auto; - bottom: 0; - } - i.icons .icon.corner[class*="bottom right"] { - top: auto; - left: auto; - right: 0; - bottom: 0; - } - & when (@variationIconInverted) { - i.icons .inverted.corner.icon { - text-shadow: @cornerIconInvertedShadow; - } - } - } -} - -.loadUIOverrides(); |