github.com/fanux/shipyard@v0.0.0-20161009071005-6515ce223235/controller/static/semantic/src/themes/default/views/item.variables (about) 1 /******************************* 2 Item 3 *******************************/ 4 5 /*------------------- 6 View 7 --------------------*/ 8 9 /* Group */ 10 @groupMargin: 1.5em 0em; 11 12 /* Item */ 13 @display: table; 14 @background: transparent; 15 @borderRadius: 0rem; 16 @minHeight: 0px; 17 @padding: 0em; 18 @width: 100%; 19 @boxShadow: none; 20 @border: none; 21 @zIndex: ''; 22 @transition: box-shadow @transitionDuration @transitionEasing; 23 24 /* Responsive */ 25 @itemSpacing: 1em; 26 @imageWidth: 175px; 27 @contentImageDistance: 1.5em; 28 29 @tabletItemSpacing: 1em; 30 @tabletImageWidth: 150px; 31 @tabletContentImageDistance: 1em; 32 33 @mobileItemSpacing: 2em; 34 @mobileImageWidth: auto; 35 @mobileImageMaxHeight: 250px; 36 @mobileContentImageDistance: 1.5em; 37 38 /*------------------- 39 Content 40 --------------------*/ 41 42 /* Image */ 43 @imageDisplay: table-cell; 44 @imageFloat: none; 45 @imageMaxHeight: ''; 46 @imageVerticalAlign: top; 47 @imageMargin: 0em; 48 @imagePadding: 0em; 49 @imageBorder: none; 50 @imageBorderRadius: 0.125rem; 51 @imageBoxShadow: none; 52 @imageBorder: none; 53 54 /* Content */ 55 @contentDisplay: table-cell; 56 @contentVerticalAlign: top; 57 58 @contentWidth: 100%; 59 @contentOffset: 0em; 60 @contentBackground: none; 61 @contentMargin: 0em; 62 @contentPadding: 0em; 63 @contentFontSize: 1em; 64 @contentBorder: none; 65 @contentBorderRadius: 0em; 66 @contentBoxShadow: none; 67 68 /* Header */ 69 @headerMargin: -@lineHeightOffset 0em 0em; 70 @headerFontWeight: bold; 71 @headerFontSize: 1.2em; 72 @headerColor: @darkTextColor; 73 74 /* Metadata */ 75 @metaFontSize: 1em; 76 @metaLineHeight: 1em; 77 @metaSpacing: 0.3em; 78 @metaColor: rgba(0, 0, 0, 0.6); 79 80 /* Icons */ 81 @actionOpacity: 0.75; 82 @actionHoverOpacity: 1; 83 @actionTransition: color @transitionDuration @transitionEasing; 84 85 /* Actions */ 86 @favoriteColor: #FFB70A; 87 @favoriteActiveColor: #FFE623; 88 @likeColor: #FF2733; 89 @likeActiveColor: #FF2733; 90 91 /* Links */ 92 @headerLinkColor: @headerColor; 93 @headerLinkHoverColor: @linkHoverColor; 94 @metaLinkColor: @lightTextColor; 95 @metaLinkHoverColor: @textColor; 96 @contentLinkColor: ''; 97 @contentLinkHoverColor: ''; 98 @contentLinkTransition: color @transitionDuration @transitionEasing; 99 100 101 /* Description */ 102 @descriptionDistance: 0.6em; 103 @descriptionMaxWidth: 550px; 104 @descriptionFontSize: 1em; 105 @descriptionLineHeight: 1.33; 106 @descriptionColor: @textColor; 107 108 /* Content Image */ 109 @contentImageWidth: ''; 110 @contentImageVerticalAlign: middle; 111 112 /* Avatar Image */ 113 @avatarSize: @contentImageWidth; 114 @avatarBorderRadius: @circularRadius; 115 116 /* Paragraph */ 117 @paragraphDistance: 0.5em; 118 119 /* Additional Content */ 120 @extraDivider: none; 121 @extraHorizontalSpacing: 0.5rem; 122 @extraRowSpacing: 0.5rem; 123 124 @extraBackground: none; 125 @extraDisplay: block; 126 @extraPosition: relative; 127 @extraMargin: (1rem - @extraRowSpacing) 0em 0em; 128 @extraTop: 0em; 129 @extraLeft: 0em; 130 @extraWidth: 100%; 131 @extraPadding: 0em 0em 0em; 132 @extraBoxShadow: none; 133 @extraColor: @lightTextColor; 134 @extraTransition: color @transitionDuration @transitionEasing; 135 136 /*------------------- 137 Variations 138 --------------------*/ 139 140 /* Relaxed */ 141 @relaxedItemSpacing: 1.5em; 142 @veryRelaxedItemSpacing: 2em; 143 144 /* Divided */ 145 @dividedBorder: 1px solid @borderColor; 146 @dividedMargin: 0em; 147 @dividedPadding: 1em 0em; 148 149 @dividedFirstLastMargin: 0em; 150 @dividedFirstLastPadding: 0em; 151 152 /* Sizes */ 153 @medium: 1em;