github.com/fanux/shipyard@v0.0.0-20161009071005-6515ce223235/controller/static/semantic/src/themes/default/elements/segment.variables (about) 1 /******************************* 2 Segment 3 *******************************/ 4 5 /*------------------- 6 Element 7 --------------------*/ 8 9 @background: @white; 10 @borderWidth: 1px; 11 @border: none; 12 13 @borderShadow: 0px 0px 0px @borderWidth @borderColor; 14 @boxShadow: 15 @borderShadow, 16 @subtleShadow 17 ; 18 @verticalPadding: 1em; 19 @horizontalPadding: 1em; 20 21 @margin: 1rem; 22 @borderRadius: @defaultBorderRadius; 23 24 /*------------------- 25 Coupling 26 --------------------*/ 27 28 /* Page Grid Segment */ 29 @pageGridMargin: (2 * @verticalPadding); 30 31 32 /******************************* 33 States 34 *******************************/ 35 36 /* Loading Dimmer */ 37 @loaderDimmerColor: rgba(255, 255, 255, 0.8); 38 @loaderDimmerZIndex: 100; 39 40 /* Loading Spinner */ 41 @loaderSize: 3em; 42 @loaderOffset: -(@loaderSize / 2); 43 @loaderMargin: @loaderOffset 0em 0em @loaderOffset; 44 @loaderLineZIndex: 101; 45 46 47 /******************************* 48 Variations 49 *******************************/ 50 51 /* Piled */ 52 @piledZIndex: auto; 53 @piledMargin: 3em; 54 @piledBoxShadow: 0px 0px 1px 1px @borderColor; 55 @piledDegrees: 1.2deg; 56 57 /* Circular */ 58 @circularPadding: 2em; 59 60 /* Stacked */ 61 @stackedHeight: 6px; 62 @stackedPageBackground: @subtleTransparentBlack; 63 @stackedPadding: @verticalPadding + (0.4em); 64 @tallStackedPadding: @verticalPadding + (0.8em); 65 66 /* Raised */ 67 @raisedShadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.15); 68 @raisedBoxShadow: 69 @borderShadow, 70 @raisedShadow 71 ; 72 73 /* Attached */ 74 @attachedTopOffset: 0px; 75 @attachedBottomOffset: 0px; 76 @attachedHorizontalOffset: -1px; 77 @attachedWidth: ~"calc(100% + "-@attachedHorizontalOffset * 2~")"; 78 @attachedBoxShadow: none; 79 @attachedBorder: 1px solid @solidBorderColor; 80 @attachedBottomBoxShadow: 81 @attachedBoxShadow, 82 @subtleShadow 83 ; 84 85 /* Colors */ 86 @coloredBorderSize: 2px; 87 @coloredBorderRadius: @borderRadius; 88 89 /* Ordinality */ 90 @secondaryBackground: #FAF9FA; 91 @secondaryColor: @textColor; 92 93 @tertiaryBackground: #EBEBEB; 94 @tertiaryColor: @lightTextColor; 95 96 @secondaryInvertedBackground: linear-gradient(rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.3) 100%); 97 @secondaryInvertedColor: @offWhite; 98 99 @tertiaryInvertedBackground: linear-gradient(rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.5) 100%); 100 @tertiaryInvertedColor: @darkWhite;