From 823344c19094680e80e2b56449a243e183db8b06 Mon Sep 17 00:00:00 2001 From: Fuwn Date: Mon, 14 Dec 2020 23:21:39 -0800 Subject: :star: --- semantic/src/definitions/modules/shape.less | 155 ++++++++++++++++++++++++++++ 1 file changed, 155 insertions(+) create mode 100644 semantic/src/definitions/modules/shape.less (limited to 'semantic/src/definitions/modules/shape.less') diff --git a/semantic/src/definitions/modules/shape.less b/semantic/src/definitions/modules/shape.less new file mode 100644 index 0000000..4d0b8ab --- /dev/null +++ b/semantic/src/definitions/modules/shape.less @@ -0,0 +1,155 @@ +/*! + * # Fomantic-UI - Shape + * http://github.com/fomantic/Fomantic-UI/ + * + * + * Released under the MIT license + * http://opensource.org/licenses/MIT + * + */ + + + +/******************************* + Theme +*******************************/ + +@type : 'module'; +@element : 'shape'; + +@import (multiple) '../../theme.config'; + +/******************************* + Shape +*******************************/ + +.ui.shape { + position: relative; + vertical-align: top; + display: @display; + perspective: @perspective; + transition: @transition; +} + +.ui.shape .side, +.ui.shape .sides { + transform-style: preserve-3d; +} + +.ui.shape .side { + display: none; + opacity: 1; + width: 100%; + + margin: @sideMargin !important; + backface-visibility: @backfaceVisibility; +} + +.ui.shape .side * { + backface-visibility: visible !important; +} + +/******************************* + Types +*******************************/ + +& when (@variationShapeCube) { + .ui.cube.shape .side { + min-width: @cubeSize; + height: @cubeSize; + + padding: @cubePadding; + + background-color: @cubeBackground; + color: @cubeTextColor; + box-shadow: @cubeBoxShadow; + } + .ui.cube.shape .side > .content { + width: 100%; + height: 100%; + display: table; + + text-align: @cubeTextAlign; + user-select: text; + } + .ui.cube.shape .side > .content > div { + display: table-cell; + vertical-align: middle; + font-size: @cubeFontSize; + } +} + +/******************************* + Variations +*******************************/ +& when (@variationShapeText) { + .ui.text.shape.animating .sides { + position: static; + } + .ui.text.shape .side { + white-space: nowrap; + } + .ui.text.shape .side > * { + white-space: normal; + } +} + + +/******************************* + States +*******************************/ + +& when (@variationShapeLoading) { + /*-------------- + Loading + ---------------*/ + + .ui.loading.shape { + position: absolute; + top: -9999px; + left: -9999px; + } +} + + +/*-------------- + Animating +---------------*/ + +.ui.shape .animating.side { + position: absolute; + top: 0; + left: 0; + display: block; + z-index: @animatingZIndex; +} +.ui.shape .hidden.side { + opacity: @hiddenSideOpacity; +} + + +/*-------------- + CSS +---------------*/ + +.ui.shape.animating .sides { + position: absolute; + transition: @transition; +} +.ui.shape.animating .side { + transition: @sideTransition; +} +.ui.shape .animating.side *, +.ui.shape.animating .side * { + transition: none; +} + +/*-------------- + Active +---------------*/ + +.ui.shape .active.side { + display: block; +} + +.loadUIOverrides(); -- cgit v1.2.3