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

     1  /*******************************
     2               Table
     3  *******************************/
     4  
     5  /*-------------------
     6         Element
     7  --------------------*/
     8  
     9  @margin: 1em 0em;
    10  @borderCollapse: separate;
    11  @borderSpacing: 0px;
    12  @transition:
    13    background @transitionDuration @transitionEasing,
    14    border-color @transitionDuration @transitionEasing,
    15    color @transitionDuration @transitionEasing
    16  ;
    17  @borderRadius: 0.25rem;
    18  @background: #FFFFFF;
    19  @color: @textColor;
    20  @borderWidth: 1px;
    21  @borderColor: #D0D0D0;
    22  @border: @borderWidth solid @borderColor;
    23  @boxShadow: none;
    24  @textAlign: left;
    25  
    26  /*-------------------
    27         Types
    28  --------------------*/
    29  
    30  /* Definition */
    31  @definitionPageBackground: @white;
    32  
    33  @definitionHeaderBackground: transparent;
    34  @definitionHeaderColor: @unselectedTextColor;
    35  @definitionHeaderFontWeight: normal;
    36  
    37  @definitionFooterBackground: @definitionHeaderBackground;
    38  @definitionFooterColor: @definitionHeaderColor;
    39  @definitionFooterFontWeight: @definitionHeaderFontWeight;
    40  
    41  @definitionColumnBackground: @subtleTransparentBlack;
    42  @definitionColumnColor: @selectedTextColor;
    43  @definitionColumnFontWeight: bold;
    44  
    45  
    46  /*--------------
    47       Parts
    48  ---------------*/
    49  
    50  /* Table Row */
    51  @rowBorder: 1px solid @solidBorderColor;
    52  
    53  /* Table Cell */
    54  @cellVerticalPadding: 0.7em;
    55  @cellHorizontalPadding: 0.8em;
    56  @cellVerticalAlign: middle;
    57  @cellTextAlign: @textAlign;
    58  @cellBorder: 1px solid @solidBorderColor;
    59  
    60  /* Table Header */
    61  @headerBorder: 1px solid @solidBorderColor;
    62  @headerDivider: none;
    63  @headerBackground: @darkWhite;
    64  @headerAlign: @textAlign;
    65  @headerVerticalAlign: middle;
    66  @headerColor: @textColor;
    67  @headerVerticalPadding: @cellVerticalPadding;
    68  @headerHorizontalPadding: @cellHorizontalPadding;
    69  @headerFontStyle: none;
    70  @headerFontWeight: bold;
    71  @headerTextTransform: none;
    72  @headerBoxShadow: none;
    73  
    74  /* Table Footer */
    75  @footerBoxShadow: none;
    76  @footerBorder: 1px solid @solidBorderColor;
    77  @footerDivider: none;
    78  @footerBackground: @white;
    79  @footerAlign: @textAlign;
    80  @footerVerticalAlign: middle;
    81  @footerColor: @textColor;
    82  @footerVerticalPadding: @cellVerticalPadding;
    83  @footerHorizontalPadding: @cellHorizontalPadding;
    84  @footerFontStyle: normal;
    85  @footerFontWeight: normal;
    86  @footerTextTransform: none;
    87  
    88  /* Responsive Size */
    89  @responsiveHeaderDisplay: block;
    90  @responsiveFooterDisplay: block;
    91  @responsiveRowVerticalPadding: 1em;
    92  @responsiveRowBoxShadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.1) inset !important;
    93  @responsiveCellVerticalPadding: 0.25em;
    94  @responsiveCellHorizontalPadding: 0.75em;
    95  @responsiveCellBoxShadow: none !important;
    96  @responsiveStatusColor: transparent;
    97  
    98  /*--------------
    99      Couplings
   100  ---------------*/
   101  
   102  @iconVerticalAlign: baseline;
   103  
   104  
   105  /*--------------
   106       States
   107  ---------------*/
   108  
   109  @stateMarkerWidth: 0px;
   110  
   111  /* Positive */
   112  @positiveColor: @positiveTextColor;
   113  @positiveBoxShadow: @stateMarkerWidth 0px 0px @positiveBorderColor inset;
   114  @positiveBackgroundHover: darken(@positiveBackgroundColor, 3);
   115  @positiveColorHover: darken(@positiveColor, 3);
   116  
   117  /* Negative */
   118  @negativeColor: #CD2929;
   119  @negativeBoxShadow: @stateMarkerWidth 0px 0px @negativeBorderColor inset;
   120  @negativeBackgroundHover: darken(@negativeBackgroundColor, 3);
   121  @negativeColorHover: darken(@negativeColor, 3);
   122  
   123  /* Error */
   124  @errorColor: #CD2929;
   125  @errorBoxShadow: @stateMarkerWidth 0px 0px @errorBorderColor inset;
   126  @errorBackgroundHover: darken(@errorBackgroundColor, 3);
   127  @errorColorHover: darken(@errorColor, 3);
   128  
   129  /* Warning */
   130  @warningColor: #7D6C00;
   131  @warningBoxShadow: @stateMarkerWidth 0px 0px @warningBorderColor inset;
   132  @warningBackgroundHover: darken(@warningBackgroundColor, 3);
   133  @warningColorHover: darken(@warningColor, 3);
   134  
   135  /* Active */
   136  @activeColor: rgba(50, 50, 50, 0.9);
   137  @activeBackgroundColor: #E0E0E0;
   138  @activeBoxShadow: @stateMarkerWidth 0px 0px @activeColor inset;
   139  @activeBackgroundHover: #EFEFEF;
   140  @activeColorHover: rgba(50, 50, 50, 1);
   141  
   142  /*--------------
   143       Types
   144  ---------------*/
   145  
   146  /* Attached */
   147  @attachedHorizontalOffset: -1px;
   148  @attachedBoxShadow: none;
   149  @attachedTableWidth: ~"calc(100% + "@attachedHorizontalOffset * -2~")";
   150  
   151  /* Striped */
   152  @stripedBackground: rgba(0, 0, 50, 0.03);
   153  @invertedStripedBackground: rgba(255, 255, 255, 0.06);
   154  
   155  /* Sortable */
   156  @sortableBackground: '';
   157  @sortableColor: @textColor;
   158  
   159  @sortableBorder: 1px solid @borderColor;
   160  @sortableIconWidth: 1em;
   161  @sortableIconDistance: 0.5em;
   162  @sortableIconOpacity: 0.8;
   163  @sortableIconFont: 'Icons';
   164  @sortableIconAscending: '\f0d7';
   165  @sortableIconDescending: '\f0d8';
   166  @sortableDisabledColor: @disabledTextColor;
   167  
   168  @sortableHoverBackground: @transparentBlack;
   169  @sortableHoverColor: @hoveredTextColor;
   170  
   171  @sortableActiveBackground: @transparentBlack;
   172  @sortableActiveColor: @selectedTextColor;
   173  
   174  @sortableActiveHoverBackground: @transparentBlack;
   175  @sortableActiveHoverColor: @selectedTextColor;
   176  
   177  @sortableInvertedBorderColor: transparent;
   178  @sortableInvertedHoverBackground: @transparentWhite @subtleGradient;
   179  @sortableInvertedHoverColor: @invertedHoveredTextColor;
   180  @sortableInvertedActiveBackground: @strongTransparentWhite @subtleGradient;
   181  @sortableInvertedActiveColor: @invertedSelectedTextColor;
   182  
   183  /* Colors */
   184  @coloredBorderSize: 0.2em;
   185  @coloredBorderRadius: 0em 0em @borderRadius @borderRadius;
   186  
   187  /* Inverted */
   188  @invertedBackground: #333333;
   189  @invertedBorder: none;
   190  @invertedCellBorderColor: rgba(0, 0, 0, 0.2);
   191  @invertedCellColor: @invertedTextColor;
   192  @invertedHeaderBackground: rgba(0, 0, 0, 0.15);
   193  @invertedHeaderColor: rgba(255, 255, 255, 0.9);
   194  
   195  @invertedDefinitionColumnBackground: @subtleTransparentWhite;
   196  @invertedDefinitionColumnColor: @invertedSelectedTextColor;
   197  @invertedDefinitionColumnFontWeight: bold;
   198  
   199  /* Basic */
   200  @basicTableBackground: transparent;
   201  @basicTableBorder: 1px solid @borderColor;
   202  @basicBoxShadow: none;
   203  
   204  @basicTableHeaderBackground: transparent;
   205  @basicTableCellBackground: transparent;
   206  @basicTableHeaderDivider: none;
   207  @basicTableCellBorder: 1px solid rgba(0, 0, 0, 0.1);
   208  @basicTableCellVerticalPadding: @cellVerticalPadding;
   209  @basicTableCellHorizontalPadding: @cellHorizontalPadding;
   210  @basicTableStripedBackground: @transparentBlack;
   211  
   212  /* Padded */
   213  @paddedVerticalPadding: 1em;
   214  @paddedHorizontalPadding: 1em;
   215  @veryPaddedVerticalPadding: 1.5em;
   216  @veryPaddedHorizontalPadding: 1.5em;
   217  
   218  /* Compact */
   219  @compactVerticalPadding: 0.5em;
   220  @compactHorizontalPadding: 0.7em;
   221  @veryCompactVerticalPadding: 0.4em;
   222  @veryCompactHorizontalPadding: 0.6em;
   223  
   224  
   225  /* Sizes */
   226  @small: 0.9em;
   227  @medium: 1em;
   228  @large: 1.1em;