github.com/fanux/shipyard@v0.0.0-20161009071005-6515ce223235/controller/static/semantic/src/themes/shipyard/modules/progress.variables (about)

     1  /*******************************
     2              Progress
     3  *******************************/
     4  
     5  /*-------------------
     6         Element
     7  --------------------*/
     8  
     9  @verticalSpacing: 1em;
    10  @margin: @verticalSpacing 0em (@labelHeight + @verticalSpacing);
    11  @firstMargin: 0em 0em (@labelHeight + @verticalSpacing);
    12  @lastMargin: 0em 0em (@labelHeight);
    13  
    14  @background: @subtleTransparentBlack;
    15  @border: 1px solid @borderColor;
    16  @boxShadow: none;
    17  @padding: 0.2857em;
    18  @borderRadius: @defaultBorderRadius;
    19  
    20  /* Bar */
    21  @barPosition: relative;
    22  @barHeight: 1.75em;
    23  @barBackground: #888888;
    24  @barBorderRadius: @borderRadius;
    25  @barTransitionEasing: ease;
    26  @barTransitionDuration: 0.3s;
    27  @barTransition:
    28    width @barTransitionDuration @barTransitionEasing,
    29    background-color @barTransitionDuration @barTransitionEasing
    30  ;
    31  @barInitialWidth: 0%;
    32  @barMinWidth: 2em;
    33  
    34  /* Progress Bar Label */
    35  @progressWidth: auto;
    36  @progressSize: 0.9em;
    37  @progressPosition: absolute;
    38  @progressTop: 50%;
    39  @progressRight: 0.5em;
    40  @progressLeft: auto;
    41  @progressBottom: auto;
    42  @progressOffset: -0.5em;
    43  @progressColor: @invertedLightTextColor;
    44  @progressTextShadow: none;
    45  @progressFontWeight: bold;
    46  @progressTextAlign: left;
    47  
    48  /* Label */
    49  @labelWidth: 100%;
    50  @labelHeight: 1.5em;
    51  @labelSize: 1em;
    52  @labelPosition: absolute;
    53  @labelTop: 100%;
    54  @labelLeft: 0%;
    55  @labelRight: auto;
    56  @labelBottom: auto;
    57  @labelOffset: (@labelHeight - 1.3em);
    58  @labelColor: @textColor;
    59  @labelTextShadow: none;
    60  @labelFontWeight: bold;
    61  @labelTextAlign: center;
    62  @labelTransition: color 0.4s @defaultEasing;
    63  
    64  /*-------------------
    65          Types
    66  --------------------*/
    67  
    68  @indicatingFirstColor: #D95C5C;
    69  @indicatingSecondColor: #D9A65C;
    70  @indicatingThirdColor: #E6BB48;
    71  @indicatingFourthColor: #DDC928;
    72  @indicatingFifthColor: #B4D95C;
    73  @indicatingSixthColor: #66DA81;
    74  
    75  
    76  /*-------------------
    77          States
    78  --------------------*/
    79  
    80  /* Active */
    81  @activePulseColor: @white;
    82  @activePulseMaxOpacity: 0.3;
    83  @activePulseDuration: 2s;
    84  @activeMinWidth: @barMinWidth;
    85  
    86  
    87  /*-------------------
    88        Variations
    89  --------------------*/
    90  
    91  /* Attached */
    92  @attachedBackground: transparent;
    93  @attachedHeight: 0.2rem;
    94  @attachedBorderRadius: @borderRadius;
    95  
    96  /* Inverted */
    97  @invertedBackground: @transparentWhite;
    98  @invertedBorder: none;
    99  @invertedBarBackground: @barBackground;
   100  @invertedProgressColor: @offWhite;
   101  @invertedLabelColor: @white;
   102  
   103  /* Sizing */
   104  @tinyBarHeight: 0.5em;
   105  @smallBarHeight: 1em;
   106  @largeBarHeight: 2.5em;
   107  @bigBarHeight: 3.5em;