github.com/fanux/shipyard@v0.0.0-20161009071005-6515ce223235/controller/static/semantic/src/definitions/modules/shape.less (about)

     1  /*!
     2   * # Semantic UI - Shape
     3   * http://github.com/semantic-org/semantic-ui/
     4   *
     5   *
     6   * Copyright 2014 Contributors
     7   * Released under the MIT license
     8   * http://opensource.org/licenses/MIT
     9   *
    10   */
    11  
    12  
    13  
    14  /*******************************
    15              Theme
    16  *******************************/
    17  
    18  @type    : 'module';
    19  @element : 'shape';
    20  
    21  @import (multiple) '../../theme.config';
    22  
    23  /*******************************
    24                Shape
    25  *******************************/
    26  
    27  .ui.shape {
    28    position: relative;
    29    display: @display;
    30    perspective: @perspective;
    31  }
    32  
    33  .ui.shape .sides {
    34    transform-style: preserve-3d;
    35  }
    36  
    37  .ui.shape .side {
    38    opacity: 1;
    39    width: 100%;
    40  
    41    margin: @sideMargin !important;
    42  
    43    backface-visibility: @backfaceVisibility;
    44  }
    45  
    46  .ui.shape .side {
    47    display: none;
    48  }
    49  
    50  .ui.shape .side > * {
    51    backface-visibility: visible !important;
    52  }
    53  
    54  /*******************************
    55               Types
    56  *******************************/
    57  
    58  .ui.cube.shape .side {
    59    min-width: @cubeSize;
    60    height: @cubeSize;
    61  
    62    padding: @cubePadding;
    63  
    64    background-color: @cubeBackground;
    65    color: @cubeTextColor;
    66    box-shadow: @cubeBoxShadow;
    67  }
    68  .ui.cube.shape .side > .content {
    69    width: 100%;
    70    height: 100%;
    71    display: table;
    72  
    73    text-align: @cubeTextAlign;
    74    user-select: text;
    75  }
    76  .ui.cube.shape .side > .content > div {
    77    display: table-cell;
    78    vertical-align: middle;
    79    font-size: @cubeFontSize;
    80  }
    81  
    82  /*******************************
    83            Variations
    84  *******************************/
    85  
    86  .ui.text.shape.animating .sides {
    87    position: static;
    88  }
    89  .ui.text.shape .side {
    90    white-space: nowrap;
    91  }
    92  .ui.text.shape .side > * {
    93    white-space: normal;
    94  }
    95  
    96  
    97  /*******************************
    98               States
    99  *******************************/
   100  
   101  /*--------------
   102      Loading
   103  ---------------*/
   104  
   105  .ui.loading.shape {
   106    position: absolute;
   107    top: -9999px;
   108    left: -9999px;
   109  }
   110  
   111  
   112  /*--------------
   113      Animating
   114  ---------------*/
   115  
   116  .ui.shape .animating.side {
   117    position: absolute;
   118    top: 0px;
   119    left: 0px;
   120    z-index: @animatingZIndex;
   121  }
   122  .ui.shape .hidden.side {
   123    opacity: @hiddenSideOpacity;
   124  }
   125  
   126  
   127  /*--------------
   128        CSS
   129  ---------------*/
   130  
   131  .ui.shape.animating {
   132    transition: @transition;
   133  }
   134  .ui.shape.animating .sides {
   135    position: absolute;
   136  }
   137  .ui.shape.animating .sides {
   138    transition: @transition;
   139  }
   140  .ui.shape.animating .side {
   141    transition: @sideTransition;
   142  }
   143  
   144  /*--------------
   145       Active
   146  ---------------*/
   147  
   148  .ui.shape .active.side {
   149    display: block;
   150  }
   151  
   152  .loadUIOverrides();