@performant-software/semantic-components 0.5.4 → 0.5.7

package/src/css/themes/chubby/views/comment.variables

@@ -0,0 +1,46 @@
+/*******************************
+            Comments
+*******************************/
+
+/*-------------------
+      Elements
+--------------------*/
+
+/* Comment */
+@commentBackground: #FFFFFF;
+@commentMargin: 1em 0em 0em;
+@commentPadding: 1em 1.5em;
+@commentBorder: 1px solid rgba(0, 0, 0, 0.1);
+@commentDivider: 1px solid rgba(0, 0, 0, 0.1);
+@firstCommentMargin: 1em;
+@firstCommentPadding: 1em;
+
+/* Nested Comment */
+@nestedCommentsMargin: 0em 0em 0.5em 0.5em;
+@nestedCommentsPadding: 1em 0em 0em 1em;
+@nestedCommentBackground: #F0F0F0;
+
+/* Avatar */
+@avatarWidth: 3.5em;
+@avatarSpacing: 1.5em;
+@avatarBorderRadius: @circularRadius;
+
+/* Content */
+@contentMargin: @avatarWidth + @avatarSpacing;
+
+/* Author */
+@authorFontSize: 1em;
+@authorColor: @primaryColor;
+@authorHoverColor: @primaryColorHover;
+@authorFontWeight: bold;
+
+@metadataDisplay: block;
+@metadataSpacing: 0em;
+@metadataColor: @textColor;
+
+/*-------------------
+      Variations
+--------------------*/
+
+/* Threaded */
+@threadedCommentMargin: -1.5em 0 -1em  (@avatarWidth / 2);

package/src/css/themes/classic/collections/table.overrides

@@ -0,0 +1,3 @@
+/*******************************
+           Overrides
+*******************************/

package/src/css/themes/classic/collections/table.variables

@@ -0,0 +1,14 @@
+/*******************************
+            Table
+*******************************/
+
+/*-------------------
+       Element
+--------------------*/
+
+@boxShadow: @subtleGradient;
+
+@headerBackground: @subtleGradient;
+@headerBoxShadow: @subtleShadow;
+@footerBoxShadow: 0px -1px 1px 0px rgba(0, 0, 0, 0.05);
+@footerBackground: rgba(0, 0, 0, 0.05);

package/src/css/themes/classic/elements/button.overrides

@@ -0,0 +1,3 @@
+/*******************************
+           Overrides
+*******************************/

package/src/css/themes/classic/elements/button.variables

@@ -0,0 +1,96 @@
+/*******************************
+            Button
+*******************************/
+
+/*-------------------
+       Element
+--------------------*/
+
+/* Shadow */
+@shadowDistance: 0em;
+@shadowOffset: (@shadowDistance / 2);
+@shadowBoxShadow: 0px -@shadowDistance 0px 0px @borderColor inset;
+@backgroundColor: #FAFAFA;
+@backgroundImage: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.09));
+@boxShadow:
+  0px 0px 0px 1px @borderColor inset,
+  @shadowBoxShadow
+;
+
+/* Padding */
+@verticalPadding: 0.8em;
+@horizontalPadding: 1.5em;
+
+
+/*-------------------
+        Group
+--------------------*/
+
+@groupBoxShadow: none;
+@groupButtonBoxShadow:
+  0px 0px 0px 1px @borderColor inset,
+  @shadowBoxShadow
+;
+@verticalBoxShadow: 0px 0px 0px 1px @borderColor inset;
+@groupButtonOffset: 0px 0px 0px -1px;
+@verticalGroupOffset: 0px 0px -1px 0px;
+
+/*-------------------
+        States
+--------------------*/
+
+/* Hovered */
+@hoverBackgroundColor: '';
+@hoverBackgroundImage: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.13));
+@hoverBoxShadow: '';
+@hoverColor: @hoveredTextColor;
+@iconHoverOpacity: 0.85;
+
+/* Focused */
+@focusBackgroundColor: '';
+@focusBackgroundImage: '';
+@focusBoxShadow:
+  0px 0px 1px rgba(81, 167, 232, 0.8) inset,
+  0px 0px 3px 2px rgba(81, 167, 232, 0.8)
+;
+@focusColor: @hoveredTextColor;
+@iconFocusOpacity: 0.85;
+
+/* Pressed Down */
+@downBackgroundColor: #F1F1F1;
+@downBackgroundImage: '';
+@downBoxShadow:
+  0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset,
+  0px 1px 4px 0px rgba(0, 0, 0, 0.1) inset !important
+;
+@downColor: @pressedTextColor;
+
+/* Active */
+@activeBackgroundColor: #DADADA;
+@activeBackgroundImage: none;
+@activeColor: @selectedTextColor;
+@activeBoxShadow:
+  0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset,
+  0px 1px 4px 0px rgba(0, 0, 0, 0.1) inset !important
+;
+
+/* Active + Hovered */
+@activeHoverBackgroundColor: #DADADA;
+@activeHoverBackgroundImage: none;
+@activeHoverBoxShadow:
+  0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset,
+  0px 1px 4px 0px rgba(0, 0, 0, 0.1) inset !important
+;
+@activeHoverColor: @selectedTextColor;
+
+/* Loading */
+@loadingBackgroundColor: #FFFFFF;
+
+/*-------------------
+        Types
+--------------------*/
+
+/* Labeled Icon */
+@labeledIconBackgroundColor: rgba(0, 0, 0, 0.05);
+@labeledIconLeftShadow: -1px 0px 0px 0px @labeledIconBorder inset;
+@labeledIconRightShadow: 1px 0px 0px 0px @labeledIconBorder inset;

package/src/css/themes/classic/elements/header.overrides

@@ -0,0 +1,3 @@
+/*******************************
+           Overrides
+*******************************/

package/src/css/themes/classic/elements/header.variables

@@ -0,0 +1,12 @@
+/*******************************
+            Button
+*******************************/
+
+/*-------------------
+       Element
+--------------------*/
+
+@headerFont: 'Open Sans', Arial, sans-serif;
+
+@blockBackground: @offWhite @subtleGradient;
+@blockBoxShadow: @subtleShadow;

package/src/css/themes/classic/modules/progress.overrides

@@ -0,0 +1,3 @@
+/*******************************
+            Progress
+*******************************/

package/src/css/themes/classic/modules/progress.variables

@@ -0,0 +1,9 @@
+/*******************************
+            Progress
+*******************************/
+
+@background: rgba(0, 0, 0, 0.05);
+@boxShadow: 0px 0px 4px rgba(0, 0, 0, 0.1) inset;
+@barBackground: @subtleGradient #888888;
+@border: 1px solid @borderColor;
+@padding: @relative3px;

package/src/css/themes/classic/views/card.overrides

@@ -0,0 +1,98 @@
+/*******************************
+             Item
+*******************************/
+/*-------------------
+         View
+--------------------*/
+
+/* Item */
+@background: #FFFFFF;
+@borderRadius: 0.325rem;
+@display: block;
+@float: left;
+@margin: 0em @horizontalSpacing @rowSpacing;
+@minHeight: 0px;
+@padding: 0em;
+@width: 300px;
+@boxShadow:
+  0px 0px 0px 1px @borderColor,
+  0px 3px 0px 0px @borderColor
+;
+@border: none;
+@zIndex: '';
+
+/* Item Group */
+@horizontalSpacing: 0.5em;
+@rowSpacing: 2.5em;
+@groupMargin: 1em -@horizontalSpacing;
+
+/*-------------------
+       Content
+--------------------*/
+
+/* Image */
+@imageBackground: @transparentBlack;
+@imagePadding: 0em;
+@imageBorderRadius: @borderRadius @borderRadius 0em 0em;
+@imageBoxShadow: none;
+@imageBorder: none;
+
+/* Content */
+@contentMargin: 0em;
+@contentPadding: 0.75em 1em;
+@contentFontSize: 1em;
+@contentBorder: none;
+@contentBorderRadius: 0em;
+@contentBoxShadow: none;
+
+/* Title */
+@titleMargin: 0em;
+@titleFont: @headerFont;
+@titleFontWeight: bold;
+@titleFontSize: 1.25em;
+@titleColor: @darkTextColor;
+
+/* Metadata */
+@metaColor: @lightTextColor;
+
+/* Description */
+@descriptionDistance: 0.75em;
+@descriptionColor: @lightTextColor;
+
+/* Image */
+@imageSpacing: 0.25em;
+@contentImageWidth: 2em;
+@contentImageVerticalAlign: middle;
+
+/* Paragraph */
+@paragraphDistance: 0.1em;
+
+/* Additional Content */
+@extraDisplay: absolute;
+@extraTop: 100%;
+@extraLeft: 0em;
+@extraWidth: 100%;
+
+@extraPadding: 0.5em 0.75em;
+@extraColor: @lightTextColor;
+@extraTransition: color @defaultDuration @defaultEasing;
+
+/*-------------------
+       States
+--------------------*/
+
+@hoverCursor: pointer;
+@hoverZIndex: 5;
+@hoverBorder: none;
+@hoverBoxShadow:
+  0px 0px 0px 1px @selectedBorderColor,
+  0px 3px 0px 0px @selectedBorderColor
+;
+
+
+/*-------------------
+      Variations
+--------------------*/
+
+/* Sizes */
+@medium: 1em;

package/src/css/themes/classic/views/card.variables

@@ -0,0 +1,22 @@
+/*******************************
+             Card
+*******************************/
+
+/*-------------------
+         View
+--------------------*/
+
+/* Shadow */
+@shadowDistance: 0em;
+@padding: 0em;
+
+/*-------------------
+       Content
+--------------------*/
+
+/* Additional Content */
+@extraDivider: 1px solid rgba(0, 0, 0, 0.05);
+@extraBackground: #FAFAFA @subtleGradient;
+@extraPadding: 0.75em 1em;
+@extraBoxShadow: 0 1px 1px rgba(0, 0, 0, 0.15);
+@extraColor: @lightTextColor;

package/src/css/themes/colored/modules/checkbox.variables

@@ -0,0 +1,29 @@
+/* Checkbox */
+@checkboxActiveBackground: @primaryColor;
+@checkboxActiveBorderColor: @primaryColor;
+@checkboxActiveCheckColor: @white;
+
+@checkboxActiveFocusBackground: @primaryColorFocus;
+@checkboxActiveFocusBorderColor: @primaryColorFocus;
+@checkboxActiveFocusCheckColor: @white;
+
+@checkboxTransition: none;
+
+/* Radio */
+@radioActiveBackground: @white;
+@radioActiveBorderColor: @primaryColor;
+@radioActiveBulletColor: @primaryColor;
+
+@radioActiveFocusBackground: @white;
+@radioActiveFocusBorderColor: @primaryColorFocus;
+@radioActiveFocusBulletColor: @primaryColorFocus;
+
+/* Slider */
+@sliderOnLineColor: @primaryColor;
+@sliderOnFocusLineColor: @primaryColorFocus;
+
+/* Handle */
+@handleBackground: @white @subtleGradient;
+@handleBoxShadow:
+  0px 0px 0px 1px @selectedBorderColor inset
+;