aboutsummaryrefslogtreecommitdiff
path: root/semantic/src/definitions/modules/dimmer.less
diff options
context:
space:
mode:
Diffstat (limited to 'semantic/src/definitions/modules/dimmer.less')
-rw-r--r--semantic/src/definitions/modules/dimmer.less390
1 files changed, 0 insertions, 390 deletions
diff --git a/semantic/src/definitions/modules/dimmer.less b/semantic/src/definitions/modules/dimmer.less
deleted file mode 100644
index 04c3f54..0000000
--- a/semantic/src/definitions/modules/dimmer.less
+++ /dev/null
@@ -1,390 +0,0 @@
-/*!
- * # Fomantic-UI - Dimmer
- * http://github.com/fomantic/Fomantic-UI/
- *
- *
- * Released under the MIT license
- * http://opensource.org/licenses/MIT
- *
- */
-
-/*******************************
- Theme
-*******************************/
-
-@type : 'module';
-@element : 'dimmer';
-
-@import (multiple) '../../theme.config';
-
-/*******************************
- Dimmer
-*******************************/
-
-.dimmable:not(body) {
- position: @dimmablePosition;
-}
-
-.ui.dimmer {
- display: none;
- position: @dimmerPosition;
- top: 0 !important;
- left: 0 !important;
-
- width: 100%;
- height: 100%;
-
- text-align: @textAlign;
- vertical-align: @verticalAlign;
- padding: @padding;
-
- background: @backgroundColor;
- opacity: @hiddenOpacity;
- line-height: @lineHeight;
-
- animation-fill-mode: both;
- animation-duration: @duration;
- transition: @transition;
-
- flex-direction: column;
- align-items: center;
- justify-content: center;
-
- user-select: none;
- will-change: opacity;
- z-index: @zIndex;
-}
-
-/* Dimmer Content */
-.ui.dimmer > .content {
- user-select: text;
- color: @textColor;
-}
-
-
-/* Loose Coupling */
-.ui.segment > .ui.dimmer:not(.page) {
- border-radius: inherit;
-}
-
-/* Scrollbars */
-.addScrollbars() when (@useCustomScrollbars) {
- .ui.dimmer:not(.inverted)::-webkit-scrollbar-track {
- background: @trackInvertedBackground;
- }
- .ui.dimmer:not(.inverted)::-webkit-scrollbar-thumb {
- background: @thumbInvertedBackground;
- }
- .ui.dimmer:not(.inverted)::-webkit-scrollbar-thumb:window-inactive {
- background: @thumbInvertedInactiveBackground;
- }
- .ui.dimmer:not(.inverted)::-webkit-scrollbar-thumb:hover {
- background: @thumbInvertedHoverBackground;
- }
-}
-.addScrollbars();
-
-/*******************************
- States
-*******************************/
-
-/* Animating */
-.animating.dimmable:not(body),
-.dimmed.dimmable:not(body) {
- overflow: @overflow;
-}
-
-/* Animating / Active / Visible */
-.dimmed.dimmable > .ui.animating.dimmer,
-.dimmed.dimmable > .ui.visible.dimmer,
-.ui.active.dimmer {
- display: flex;
- opacity: @visibleOpacity;
-}
-
-& when (@variationDimmerDisabled) {
- /* Disabled */
- .ui.disabled.dimmer {
- width: 0 !important;
- height: 0 !important;
- }
-}
-
-
-/*******************************
- Variations
-*******************************/
-
-& when (@variationDimmerLegacy) {
- /*--------------
- Legacy
- ---------------*/
-
- /* Animating / Active / Visible */
- .dimmed.dimmable > .ui.animating.legacy.dimmer,
- .dimmed.dimmable > .ui.visible.legacy.dimmer,
- .ui.active.legacy.dimmer {
- display: block;
- }
-}
-
-& when (@variationDimmerAligned) {
- /*--------------
- Alignment
- ---------------*/
-
- .ui[class*="top aligned"].dimmer {
- justify-content: flex-start;
- }
- .ui[class*="bottom aligned"].dimmer {
- justify-content: flex-end;
- }
-}
-
-& when (@variationDimmerPage) {
- /*--------------
- Page
- ---------------*/
-
- .ui.page.dimmer {
- position: @pageDimmerPosition;
- transform-style: @transformStyle;
- perspective: @perspective;
- transform-origin: center center;
- &.modals {
- -moz-perspective: none;
- }
- }
-}
-
-body.animating.in.dimmable,
-body.dimmed.dimmable {
- overflow: hidden;
-}
-
-body.dimmable > .dimmer {
- position: fixed;
-}
-
-& when (@variationDimmerBlurring) {
- /*--------------
- Blurring
- ---------------*/
-
- .blurring.dimmable > :not(.dimmer) {
- filter: @blurredStartFilter;
- transition: @blurredTransition;
- }
- .blurring.dimmed.dimmable > :not(.dimmer):not(.popup) {
- filter: @blurredEndFilter;
- }
-
- /* Dimmer Color */
- .blurring.dimmable > .dimmer {
- background: @blurredBackgroundColor;
- }
- .blurring.dimmable > .inverted.dimmer {
- background: @blurredInvertedBackgroundColor;
- }
-}
-& when (@variationDimmerAligned) {
- /*--------------
- Aligned
- ---------------*/
-
- .ui.dimmer > .top.aligned.content > * {
- vertical-align: top;
- }
- .ui.dimmer > .bottom.aligned.content > * {
- vertical-align: bottom;
- }
-}
-
-& when (@variationDimmerShades) {
- /*--------------
- Shades
- ---------------*/
-
- .medium.medium.medium.medium.medium.dimmer {
- background: @mediumBackgroundColor;
- }
- .light.light.light.light.light.dimmer {
- background: @lightBackgroundColor;
- }
- .very.light.light.light.light.dimmer {
- background: @veryLightBackgroundColor;
- }
-}
-
-& when (@variationDimmerInverted) {
- /*--------------
- Inverted
- ---------------*/
-
- .ui.inverted.dimmer {
- background: @invertedBackgroundColor;
- }
- .ui.inverted.dimmer > .content,
- .ui.inverted.dimmer > .content > * {
- color: @invertedTextColor;
- }
-
- & when (@variationDimmerShades) {
- /*--------------
- Inverted Shades
- ---------------*/
-
- .medium.medium.medium.medium.medium.inverted.dimmer {
- background: @mediumInvertedBackgroundColor;
- }
- .light.light.light.light.light.inverted.dimmer {
- background: @lightInvertedBackgroundColor;
- }
- .very.light.light.light.light.inverted.dimmer {
- background: @veryLightInvertedBackgroundColor;
- }
- }
-}
-
-& when (@variationDimmerSimple) {
- /*--------------
- Simple
- ---------------*/
-
- /* Displays without javascript */
- .ui.simple.dimmer {
- display: block;
- overflow: hidden;
- opacity: 0;
- width: 0;
- height: 0;
- z-index: -100;
- background: @simpleStartBackgroundColor;
- }
- .dimmed.dimmable > .ui.simple.dimmer {
- overflow: visible;
- opacity: 1;
- width: 100%;
- height: 100%;
- background: @simpleEndBackgroundColor;
- z-index: @simpleZIndex;
- }
-
- .ui.simple.inverted.dimmer {
- background: @simpleInvertedStartBackgroundColor;
- }
- .dimmed.dimmable > .ui.simple.inverted.dimmer {
- background: @simpleInvertedEndBackgroundColor;
- }
-}
-
-& when (@variationDimmerPartially) {
- /*--------------
- Partially
- ----------------*/
-
- .ui[class*="top dimmer"],
- .ui[class*="center dimmer"],
- .ui[class*="bottom dimmer"] {
- height: auto;
- }
- .ui[class*="bottom dimmer"] {
- top: auto !important;
- bottom: 0;
- }
- .ui[class*="center dimmer"] {
- top:50% !important;
- transform: translateY(-50%);
- -webkit-transform: translateY(calc(-50% - .5px));
- }
-
- .ui.segment > .ui.ui[class*="top dimmer"] {
- border-bottom-left-radius: 0;
- border-bottom-right-radius: 0;
- }
- .ui.segment > .ui.ui[class*="center dimmer"] {
- border-radius: 0;
- }
- .ui.segment > .ui.ui[class*="bottom dimmer"] {
- border-top-left-radius: 0;
- border-top-right-radius: 0;
- }
-
- .ui[class*="center dimmer"].transition[class*="fade up"].in {
- animation-name: fadeInUpCenter;
- }
- .ui[class*="center dimmer"].transition[class*="fade down"].in {
- animation-name: fadeInDownCenter;
- }
- .ui[class*="center dimmer"].transition[class*="fade up"].out {
- animation-name: fadeOutUpCenter;
- }
- .ui[class*="center dimmer"].transition[class*="fade down"].out {
- animation-name: fadeOutDownCenter;
- }
- .ui[class*="center dimmer"].bounce.transition {
- animation-name: bounceCenter;
- }
- @keyframes fadeInUpCenter {
- 0% {
- opacity: 0;
- transform: translateY(-40%);
- -webkit-transform: translateY(calc(-40% - .5px));
- }
- 100% {
- opacity: 1;
- transform: translateY(-50%);
- -webkit-transform: translateY(calc(-50% - .5px));
- }
- }
- @keyframes fadeInDownCenter {
- 0% {
- opacity: 0;
- transform: translateY(-60%);
- -webkit-transform: translateY(calc(-60% - .5px));
- }
- 100% {
- opacity: 1;
- transform: translateY(-50%);
- -webkit-transform: translateY(calc(-50% - .5px));
- }
- }
- @keyframes fadeOutUpCenter {
- 0% {
- opacity: 1;
- transform: translateY(-50%);
- -webkit-transform: translateY(calc(-50% - .5px));
- }
- 100% {
- opacity: 0;
- transform: translateY(-45%);
- -webkit-transform: translateY(calc(-45% - .5px));
- }
- }
- @keyframes fadeOutDownCenter {
- 0% {
- opacity: 1;
- transform: translateY(-50%);
- -webkit-transform: translateY(calc(-50% - .5px));
- }
- 100% {
- opacity: 0;
- transform: translateY(-55%);
- -webkit-transform: translateY(calc(-55% - .5px));
- }
- }
- @keyframes bounceCenter {
- 0%, 20%, 50%, 80%, 100% {
- transform: translateY(-50%);
- -webkit-transform: translateY(calc(-50% - .5px));
- }
- 40% {
- transform: translateY(calc(-50% - 30px));
- }
- 60% {
- transform: translateY(calc(-50% - 15px));
- }
- }
-}
-
-.loadUIOverrides();