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

     1  /*******************************
     2              Checkbox
     3  *******************************/
     4  
     5  @checkboxColor: @textColor;
     6  @fontSize: 1em;
     7  @checkboxLineHeight: 15px;
     8  
     9  /* Label */
    10  @labelPadding: 1.75em;
    11  
    12  @neutralCheckbox: @transparentBlack;
    13  @positiveCheckbox: @positiveColor;
    14  @negativeCheckbox: @negativeColor;
    15  
    16  /* Checkbox */
    17  @checkboxSize: 17px;
    18  @checkboxBackground: @white;
    19  @checkboxBorder: 1px solid @solidBorderColor;
    20  @checkboxBorderRadius: 0.25em;
    21  @checkboxTransition:
    22    background-color 0.3s ease,
    23    border 0.3s ease,
    24    box-shadow 0.3s ease
    25  ;
    26  
    27  /* Checkmark */
    28  @checkboxCheckTop: 0px;
    29  @checkboxCheckLeft: 0px;
    30  
    31  
    32  /*-------------------
    33        Coupling
    34  --------------------*/
    35  
    36  @labelColor: @textColor;
    37  
    38  @labelOpacity: 0.6;
    39  @labelHoverOpacity: 0.8;
    40  @labelSelectedOpacity: 1;
    41  
    42  /*-------------------
    43          States
    44  --------------------*/
    45  
    46  @checkboxHoverBackground: @checkboxBackground;
    47  @checkboxHoverBorder: 1px solid @selectedBorderColor;
    48  @labelHoverColor: @hoveredTextColor;
    49  
    50  @checkboxSelectedBackground: #F5F5F5;
    51  @checkboxSelectedBorder: 1px solid @selectedBorderColor;
    52  @labelSelectedColor: @selectedTextColor;
    53  
    54  /* Disabled */
    55  @disabledCheckboxOpacity: 0.5;
    56  @disabledCheckboxLabelColor: rgba(0, 0, 0, 1);
    57  
    58  /*-------------------
    59          Types
    60  --------------------*/
    61  
    62  /* Radio */
    63  @checkboxRadioSize: 14px;
    64  @checkboxRadioCircleSize: 9px;
    65  @checkboxRadioTop: 1px;
    66  @checkboxRadioLeft: 0px;
    67  
    68  @checkboxBulletScale: 0.428571428;
    69  @checkboxBulletColor: @textColor;
    70  @checkboxBulletRadius: @circularRadius;
    71  
    72  /* Slider & Toggle Handle */
    73  @handleBackground: @white @subtleGradient;
    74  @handleBoxShadow:
    75    @subtleShadow,
    76    0px 0px 0px 1px @borderColor inset
    77  ;
    78  
    79  /* Slider */
    80  @sliderHandleSize: 1.5rem;
    81  @sliderHandleOffset: (1rem - @sliderHandleSize) / 2;
    82  @sliderLineWidth: 3.5rem;
    83  
    84  @sliderWidth: @sliderLineWidth;
    85  @sliderHeight: (@sliderHandleSize + @sliderHandleOffset);
    86  
    87  @sliderLineHeight: 0.25rem;
    88  @sliderLineVerticalOffset: 0.4rem;
    89  @sliderLineColor: @neutralCheckbox;
    90  @sliderLineRadius: @circularRadius;
    91  
    92  @sliderTravelDistance: @sliderLineWidth - @sliderHandleSize;
    93  
    94  @sliderLabelDistance: @sliderLineWidth + 1rem;
    95  @sliderOffLabelColor: @unselectedTextColor;
    96  
    97  @sliderOnLineColor: @strongTransparentBlack;
    98  @sliderOnLabelColor: @selectedTextColor;
    99  @sliderLabelLineHeight: 1rem;
   100  
   101  @sliderHoverLaneBackground: @strongTransparentBlack;
   102  @sliderHoverLabelColor: @hoveredTextColor;
   103  
   104  
   105  /* Toggle */
   106  @toggleLaneWidth: 3.5rem;
   107  @toggleHandleSize: 1.5rem;
   108  
   109  @toggleWidth: @toggleLaneWidth;
   110  @toggleHeight: @toggleHandleSize;
   111  
   112  @toggleHandleRadius: @circularRadius;
   113  @toggleHandleOffset: 0rem;
   114  @toggleHandleTransition:
   115    background 0.3s ease 0s,
   116    left 0.3s ease 0s
   117  ;
   118  
   119  @toggleLaneHeight: @toggleHandleSize;
   120  @toggleLaneVerticalOffset: 0rem;
   121  @toggleOffOffset: -0.05rem;
   122  @toggleOnOffset: (@toggleLaneWidth - @toggleHandleSize) + 0.05rem;
   123  
   124  @toggleLabelDistance: @toggleLaneWidth + 1rem;
   125  @toggleLabelLineHeight: 1.5rem;
   126  @toggleLabelOffset: 0.15em;
   127  
   128  
   129  @toggleFocusColor: @strongTransparentBlack;
   130  @toggleHoverColor: @toggleFocusColor;
   131  
   132  @toggleOffLabelColor: @checkboxColor;
   133  @toggleOnLabelColor: @positiveCheckbox;
   134  @toggleOnLaneColor: @positiveCheckbox;
   135  
   136  
   137  
   138  /*-------------------
   139        Variations
   140  --------------------*/