/******************************* Item *******************************/ /*------------------- View --------------------*/ /* Group */ @groupMargin: 1.5em 0em; /* Item */ @display: flex; @background: transparent; @borderRadius: 0rem; @minHeight: 0px; @padding: 0em; @width: 100%; @boxShadow: none; @border: none; @zIndex: ''; @transition: box-shadow @defaultDuration @defaultEasing; /* Responsive */ @itemSpacing: 1em; @imageWidth: 175px; @contentImageDistance: 1.5em; @tabletItemSpacing: 1em; @tabletImageWidth: 150px; @tabletContentImageDistance: 1em; @mobileItemSpacing: 2em; @mobileImageWidth: auto; @mobileImageMaxHeight: 250px; @mobileContentImageDistance: 1.5em; /*------------------- Content --------------------*/ /* Image */ @imageDisplay: block; @imageFloat: none; @imageMaxHeight: ''; @imageVerticalAlign: top; @imageMargin: 0em; @imagePadding: 0em; @imageBorder: none; @imageBorderRadius: 0.125rem; @imageBoxShadow: none; @imageBorder: none; /* Content */ @contentDisplay: block; @contentVerticalAlign: top; @contentWidth: auto; @contentOffset: 0em; @contentBackground: none; @contentMargin: 0em; @contentPadding: 0em; @contentFontSize: 1em; @contentBorder: none; @contentBorderRadius: 0em; @contentBoxShadow: none; /* Header */ @headerMargin: -@lineHeightOffset 0em 0em; @headerFontWeight: bold; @headerFontSize: @relativeBig; @headerColor: @darkTextColor; /* Metadata */ @metaMargin: 0.5em 0em 0.5em; @metaFontSize: 1em; @metaLineHeight: 1em; @metaSpacing: 0.3em; @metaColor: rgba(0, 0, 0, 0.6); /* Icons */ @actionOpacity: 0.75; @actionHoverOpacity: 1; @actionTransition: color @defaultDuration @defaultEasing; /* Actions */ @favoriteColor: #FFB70A; @favoriteActiveColor: #FFE623; @likeColor: #FF2733; @likeActiveColor: #FF2733; /* Links */ @headerLinkColor: @headerColor; @headerLinkHoverColor: @linkHoverColor; @metaLinkColor: @lightTextColor; @metaLinkHoverColor: @textColor; @contentLinkColor: ''; @contentLinkHoverColor: ''; @contentLinkTransition: color @defaultDuration @defaultEasing; /* Description */ @descriptionDistance: 0.6em; @descriptionMaxWidth: auto; @descriptionFontSize: 1em; @descriptionLineHeight: @lineHeight; @descriptionColor: @textColor; /* Content Image */ @contentImageWidth: ''; @contentImageVerticalAlign: middle; /* Avatar Image */ @avatarSize: @contentImageWidth; @avatarBorderRadius: @circularRadius; /* Paragraph */ @paragraphDistance: 0.5em; /* Additional Content */ @extraDivider: none; @extraHorizontalSpacing: 0.5rem; @extraRowSpacing: 0.5rem; @extraBackground: none; @extraDisplay: block; @extraPosition: relative; @extraMargin: (1rem - @extraRowSpacing) 0em 0em; @extraTop: 0em; @extraLeft: 0em; @extraWidth: 100%; @extraPadding: 0em 0em 0em; @extraBoxShadow: none; @extraColor: @lightTextColor; @extraTransition: color @defaultDuration @defaultEasing; /*------------------- Variations --------------------*/ /* Relaxed */ @relaxedItemSpacing: 1.5em; @veryRelaxedItemSpacing: 2em; /* Divided */ @dividedBorder: 1px solid @borderColor; @dividedMargin: 0em; @dividedPadding: 1em 0em; @dividedFirstLastMargin: 0em; @dividedFirstLastPadding: 0em; /* Sizes */ @medium: 1em;