less-rails-semantic_ui 1.0.1.0

data/assets/stylesheets/semantic_ui/definitions/modules/popup.less

@@ -0,0 +1,296 @@
+/*
+ *= depend_on semantic_ui/theme.config
+ *= depend_on semantic_ui/config/modules/popup.overrides
+ *= depend_on semantic_ui/config/modules/popup.variables
+ */
+
+/*
+ * # Semantic - Popup
+ * http://github.com/semantic-org/semantic-ui/
+ *
+ *
+ * Copyright 2014 Contributor
+ * Released under the MIT license
+ * http://opensource.org/licenses/MIT
+ *
+ */
+
+/*******************************
+            Theme
+*******************************/
+
+@type    : 'module';
+@element : 'popup';
+
+@import 'semantic_ui/theme.config';
+
+/*******************************
+            Popup
+*******************************/
+
+.ui.popup {
+  display: none;
+  position: absolute;
+  top: 0px;
+  right: 0px;
+  z-index: @zIndex;
+
+  border: @border;
+  max-width: @maxWidth;
+  background-color: @background;
+
+  padding: @verticalPadding @horizontalPadding;
+  font-weight: @fontWeight;
+  font-style: @fontStyle;
+  color: @color;
+
+  border-radius: @borderRadius;
+  box-shadow: @boxShadow;
+}
+.ui.popup > .header {
+  padding: 0em;
+
+  font-family: @headerFont;
+  font-size: @headerFontSize;
+  line-height: @headerLineHeight;
+  font-weight: bold;
+}
+.ui.popup > .header + .content {
+  padding-top: @headerDistance;
+}
+
+.ui.popup:before {
+  position: absolute;
+  content: '';
+  width: @arrowSize;
+  height: @arrowSize;
+
+  background: @arrowBackground;
+  transform: rotate(45deg);
+
+  z-index: @arrowZIndex;
+  box-shadow: @arrowBoxShadow;
+}
+
+/*******************************
+            Types
+*******************************/
+
+/*--------------
+     Spacing
+---------------*/
+
+.ui.popup {
+  margin: 0em;
+}
+.ui.popup.bottom {
+  margin: @popupDistanceAway 0em 0em;
+}
+.ui.popup.top {
+  margin: 0em 0em @popupDistanceAway;
+}
+.ui.popup.left.center {
+  margin: 0em @popupDistanceAway 0em 0em;
+}
+.ui.popup.right.center {
+  margin: 0em 0em 0em @popupDistanceAway;
+}
+
+/*--------------
+     Pointer
+---------------*/
+
+/*--- Below ---*/
+.ui.bottom.center.popup:before {
+  margin-left: @arrowOffset;
+  top: @arrowOffset;
+  left: 50%;
+  right: auto;
+  bottom: auto;
+  box-shadow: @bottomArrowBoxShadow;
+}
+
+.ui.bottom.left.popup {
+  margin-left: @boxArrowOffset;
+}
+.ui.bottom.left.popup:before {
+  top: @arrowOffset;
+  left: @arrowDistanceFromEdge;
+  right: auto;
+  bottom: auto;
+  margin-left: 0em;
+  box-shadow: @bottomArrowBoxShadow;
+}
+
+.ui.bottom.right.popup {
+  margin-right: @boxArrowOffset;
+}
+.ui.bottom.right.popup:before {
+  top: @arrowOffset;
+  right: @arrowDistanceFromEdge;
+  bottom: auto;
+  left: auto;
+  margin-left: 0em;
+  box-shadow: @bottomArrowBoxShadow;
+}
+
+/*--- Above ---*/
+.ui.top.center.popup:before {
+  top: auto;
+  right: auto;
+  bottom: @arrowOffset;
+  left: 50%;
+  margin-left: @arrowOffset;
+}
+.ui.top.left.popup {
+  margin-left: @boxArrowOffset;
+}
+.ui.top.left.popup:before {
+  bottom: @arrowOffset;
+  left: @arrowDistanceFromEdge;
+  top: auto;
+  right: auto;
+  margin-left: 0em;
+}
+.ui.top.right.popup {
+  margin-right: @boxArrowOffset;
+}
+.ui.top.right.popup:before {
+  bottom: @arrowOffset;
+  right: @arrowDistanceFromEdge;
+  top: auto;
+  left: auto;
+  margin-left: 0em;
+}
+
+/*--- Left Center ---*/
+.ui.left.center.popup:before {
+  top: 50%;
+  right: @arrowOffset;
+  bottom: auto;
+  left: auto;
+  margin-top: @arrowOffset;
+  box-shadow: @leftArrowBoxShadow;
+}
+
+/*--- Right Center  ---*/
+.ui.right.center.popup:before {
+  top: 50%;
+  left: @arrowOffset;
+  bottom: auto;
+  right: auto;
+  margin-top: @arrowOffset;
+  box-shadow: @rightArrowBoxShadow;
+}
+
+/*******************************
+            Coupling
+*******************************/
+
+/* Immediate Nested Grid */
+.ui.popup > .ui.grid:not(.padded) {
+  width: @nestedGridWidth;
+  margin: @nestedGridMargin;
+}
+
+/*******************************
+            States
+*******************************/
+
+.ui.loading.popup {
+  display: block;
+  visibility: hidden;
+  z-index: @loadingZIndex;
+}
+
+.ui.animating.popup,
+.ui.visible.popup {
+  display: block;
+}
+
+
+/*******************************
+            Variations
+*******************************/
+
+/*--------------
+     Basic
+---------------*/
+
+.ui.basic.popup:before {
+  display: none;
+}
+
+
+/*--------------
+     Wide
+---------------*/
+
+.ui.wide.popup {
+  width: @wideWidth;
+  max-width: @wideWidth;
+}
+.ui[class*="very wide"].popup {
+  width: @veryWideWidth;
+  max-width: @veryWideWidth;
+}
+
+
+/*--------------
+     Fluid
+---------------*/
+
+.ui.fluid.popup {
+  width: 100%;
+  max-width: none;
+}
+
+
+/*--------------
+     Colors
+---------------*/
+
+/* Inverted colors  */
+.ui.inverted.popup {
+  background: @invertedBackground;
+  color: @invertedColor;
+  border: @invertedBorder;
+  box-shadow: @invertedBoxShadow;
+}
+.ui.inverted.popup .header {
+  background-color: @invertedHeaderBackground;
+  color: @invertedHeaderColor;
+}
+.ui.inverted.popup:before {
+  background-color: @invertedArrowColor;
+  box-shadow: none !important;
+}
+
+/*--------------
+     Flowing
+---------------*/
+
+.ui.flowing.popup {
+  max-width: none;
+}
+
+
+/*--------------
+     Sizes
+---------------*/
+
+.ui.small.popup {
+  font-size: @small;
+}
+.ui.popup {
+  font-size: @medium;
+}
+.ui.large.popup {
+  font-size: @large;
+}
+.ui.huge.popup {
+  font-size: @huge;
+}
+
+
+.loadUIOverrides();

data/assets/stylesheets/semantic_ui/definitions/modules/progress.less

@@ -0,0 +1,404 @@
+/*
+ *= depend_on semantic_ui/theme.config
+ *= depend_on semantic_ui/config/modules/progress.overrides
+ *= depend_on semantic_ui/config/modules/progress.variables
+ */
+
+ /*
+ * # Semantic - Progress Bar
+ * http://github.com/semantic-org/semantic-ui/
+ *
+ *
+ * Copyright 2014 Contributors
+ * Released under the MIT license
+ * http://opensource.org/licenses/MIT
+ *
+ */
+
+/*******************************
+            Theme
+*******************************/
+
+@type    : 'module';
+@element : 'progress';
+
+@import 'semantic_ui/theme.config';
+
+
+/*******************************
+            Progress
+*******************************/
+
+.ui.progress {
+  position: relative;
+  display: block;
+  max-width: 100%;
+  border: @border;
+  margin: @margin;
+  box-shadow: @boxShadow;
+  background: @background;
+  padding: @padding;
+  border-radius: @borderRadius;
+}
+
+.ui.progress:first-child {
+  margin: @firstMargin;
+}
+.ui.progress:last-child {
+  margin: @lastMargin;
+}
+
+/* Indicating */
+.ui.indicating.progress .bar[style^="width: 3"] {
+  background-color: @indicatingSecondColor;
+}
+.ui.indicating.progress .bar[style^="width: 4"],
+.ui.indicating.progress .bar[style^="width: 5"] {
+  background-color: @indicatingThirdColor;
+}
+.ui.indicating.progress .bar[style^="width: 6"] {
+  background-color: @indicatingFourthColor;
+}
+.ui.indicating.progress .bar[style^="width: 7"],
+.ui.indicating.progress .bar[style^="width: 8"] {
+  background-color: @indicatingFifthColor;
+}
+.ui.indicating.progress .bar[style^="width: 9"],
+.ui.indicating.progress .bar[style^="width: 100"] {
+  background-color: @indicatingSixthColor;
+}
+.ui.indicating.progress .bar[style^="width: 1%"],
+.ui.indicating.progress .bar[style^="width: 2%"],
+.ui.indicating.progress .bar[style^="width: 3%"],
+.ui.indicating.progress .bar[style^="width: 4%"],
+.ui.indicating.progress .bar[style^="width: 5%"],
+.ui.indicating.progress .bar[style^="width: 6%"],
+.ui.indicating.progress .bar[style^="width: 7%"],
+.ui.indicating.progress .bar[style^="width: 8%"],
+.ui.indicating.progress .bar[style^="width: 9%"],
+.ui.indicating.progress .bar[style^="width: 1"],
+.ui.indicating.progress .bar[style^="width: 2"] {
+  background-color: @indicatingFirstColor;
+}
+
+/* Single Digits Last */
+.ui.indicating.progress .bar[style^="width: 1%"] + .label,
+.ui.indicating.progress .bar[style^="width: 2%"] + .label,
+.ui.indicating.progress .bar[style^="width: 3%"] + .label,
+.ui.indicating.progress .bar[style^="width: 4%"] + .label,
+.ui.indicating.progress .bar[style^="width: 5%"] + .label,
+.ui.indicating.progress .bar[style^="width: 6%"] + .label,
+.ui.indicating.progress .bar[style^="width: 7%"] + .label,
+.ui.indicating.progress .bar[style^="width: 8%"] + .label,
+.ui.indicating.progress .bar[style^="width: 9%"] + .label,
+.ui.indicating.progress .bar[style^="width: 1"] + .label,
+.ui.indicating.progress .bar[style^="width: 2"] + .label {
+  color: @indicatingFirstColor;
+}
+.ui.indicating.progress .bar[style^="width: 3"] + .label {
+  color: @indicatingSecondColor;
+}
+.ui.indicating.progress .bar[style^="width: 4"] + .label,
+.ui.indicating.progress .bar[style^="width: 5"] + .label {
+  color: @indicatingThirdColor;
+}
+.ui.indicating.progress .bar[style^="width: 6"] + .label {
+  color: @indicatingFourthColor;
+}
+.ui.indicating.progress .bar[style^="width: 7"] + .label,
+.ui.indicating.progress .bar[style^="width: 8"] + .label {
+  color: @indicatingFifthColor;
+}
+.ui.indicating.progress .bar[style^="width: 9"] + .label,
+.ui.indicating.progress .bar[style^="width: 100"] + .label {
+  color: @indicatingSixthColor;
+}
+
+.ui.indicating.progress.success .bar + .label {
+  color: @successHeaderColor;
+}
+
+/*******************************
+            Content
+*******************************/
+
+/* Activity Bar */
+.ui.progress .bar {
+  display: block;
+  line-height: 1;
+  position: @barPosition;
+  width: @barInitialWidth;
+  min-width: @barMinWidth;
+  height: @barHeight;
+  background: @barBackground;
+  border-radius: @barBorderRadius;
+  transition: @barTransition;
+}
+
+/* Percent Complete */
+.ui.progress .bar > .progress {
+  white-space: nowrap;
+  position: absolute;
+  width: @progressWidth;
+  font-size: @progressSize;
+  top: @progressTop;
+  right: @progressRight;
+  left: @progressLeft;
+  bottom: @progressBottom;
+  color: @progressColor;
+  text-shadow: @progressTextShadow;
+  margin-top: @progressOffset;
+  font-weight: @progressFontWeight;
+  text-align: @progressTextAlign;
+}
+
+/* Label */
+.ui.progress > .label {
+  position: absolute;
+  width: @labelWidth;
+  font-size: @labelSize;
+  top: @labelTop;
+  right: @labelRight;
+  left: @labelLeft;
+  bottom: @labelBottom;
+  color: @labelColor;
+  font-weight: @labelFontWeight;
+  text-shadow: @labelTextShadow;
+  margin-top: @labelOffset;
+  text-align: @labelTextAlign;
+  transition: @labelTransition;
+}
+
+
+/*******************************
+             States
+*******************************/
+
+
+/*--------------
+     Success
+---------------*/
+
+.ui.progress.success .bar {
+  background-color: @successColor !important;
+}
+.ui.progress.success .bar,
+.ui.progress.success .bar::after {
+  animation: none !important;
+}
+.ui.progress.success > .label {
+  color: @successHeaderColor;
+}
+
+/*--------------
+     Warning
+---------------*/
+
+.ui.progress.warning .bar {
+  background-color: @warningColor !important;
+}
+.ui.progress.warning .bar,
+.ui.progress.warning .bar::after {
+  animation: none !important;
+}
+.ui.progress.warning > .label {
+  color: @warningHeaderColor;
+}
+
+/*--------------
+     Error
+---------------*/
+
+.ui.progress.error .bar {
+  background-color: @errorColor !important;
+}
+.ui.progress.error .bar,
+.ui.progress.error .bar::after {
+  animation: none !important;
+}
+.ui.progress.error > .label {
+  color: @errorHeaderColor;
+}
+
+/*--------------
+     Active
+---------------*/
+
+.ui.active.progress .bar {
+  position: relative;
+  min-width: @activeMinWidth;
+}
+.ui.active.progress .bar::after {
+  content: '';
+  opacity: 0;
+
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  right: 0px;
+  bottom: 0px;
+  background: @activePulseColor;
+
+  border-radius: @barBorderRadius;
+
+  animation: progress-active @activePulseDuration @defaultEasing infinite;
+}
+@keyframes progress-active {
+  0% {
+    opacity: @activePulseMaxOpacity;
+    width: 0;
+  }
+  90% {
+  }
+  100% {
+    opacity: 0;
+    width: 100%;
+  }
+}
+
+/*--------------
+    Disabled
+---------------*/
+
+.ui.disabled.progress {
+  opacity: 0.35;
+}
+.ui.disabled.progress .bar,
+.ui.disabled.progress .bar::after {
+  animation: none !important;
+}
+
+
+/*******************************
+           Variations
+*******************************/
+
+
+/*--------------
+    Inverted
+---------------*/
+
+.ui.inverted.progress {
+  background: @invertedBackground;
+  border: @invertedBorder;
+}
+.ui.inverted.progress .bar {
+  background: @invertedBarBackground;
+}
+.ui.inverted.progress .bar > .progress {
+  color: @invertedProgressColor;
+}
+.ui.inverted.progress > .label {
+  color: @invertedLabelColor;
+}
+.ui.inverted.progress.success > .label {
+  color: @successColor;
+}
+.ui.inverted.progress.warning > .label {
+  color: @warningColor;
+}
+.ui.inverted.progress.error > .label {
+  color: @errorColor;
+}
+
+/*--------------
+    Attached
+---------------*/
+
+/* bottom attached */
+.ui.progress.attached {
+  background: @attachedBackground;
+  position: relative;
+  border: none;
+  margin: 0em;
+}
+.ui.progress.attached,
+.ui.progress.attached .bar {
+  display: block;
+  height: @attachedHeight;
+  padding: 0px;
+  overflow: hidden;
+  border-radius: 0em 0em @attachedBorderRadius @attachedBorderRadius;
+}
+.ui.progress.attached .bar {
+  border-radius: 0em;
+}
+
+/* top attached */
+.ui.progress.top.attached,
+.ui.progress.top.attached .bar {
+  top: 0px;
+  border-radius: @attachedBorderRadius @attachedBorderRadius 0em 0em;
+}
+.ui.progress.top.attached .bar {
+  border-radius: 0em;
+}
+
+
+/*--------------
+     Colors
+---------------*/
+
+.ui.black.progress .bar {
+  background-color: @black;
+}
+.ui.blue.progress .bar {
+  background-color: @blue;
+}
+.ui.green.progress .bar {
+  background-color: @green;
+}
+.ui.orange.progress .bar {
+  background-color: @orange;
+}
+.ui.pink.progress .bar {
+  background-color: @pink;
+}
+.ui.purple.progress .bar {
+  background-color: @purple;
+}
+.ui.red.progress .bar {
+  background-color: @red;
+}
+.ui.teal.progress .bar {
+  background-color: @teal;
+}
+.ui.yellow.progress .bar {
+  background-color: @yellow;
+}
+
+.ui.black.inverted.progress .bar {
+  background-color: @lightBlack;
+}
+.ui.blue.inverted.progress .bar {
+  background-color: @lightBlue;
+}
+.ui.green.inverted.progress .bar {
+  background-color: @lightGreen;
+}
+.ui.orange.inverted.progress .bar {
+  background-color: @lightOrange;
+}
+.ui.pink.inverted.progress .bar {
+  background-color: @lightPink;
+}
+.ui.purple.inverted.progress .bar {
+  background-color: @lightPurple;
+}
+.ui.red.inverted.progress .bar {
+  background-color: @lightRed;
+}
+.ui.teal.inverted.progress .bar {
+  background-color: @lightTeal;
+}
+.ui.yellow.inverted.progress .bar {
+  background-color: @lightYellow;
+}
+
+/*--------------
+     Sizes
+---------------*/
+
+.ui.small.progress .bar {
+  height: 14px;
+}