rearview 1.0.0.rc1-jruby → 1.0.0.rc2-jruby

data/public/rearview-src/less/alert.less

@@ -0,0 +1,45 @@
+/* bootstrap alert override styles */
+.alert-wrap {
+    top         : -100px;
+    height      : auto;
+    left        : 0;
+    margin-top  : 0;
+    margin-left : 0;
+    display     : block;
+    position    : fixed;
+    width       : 100% !important;
+    z-index     : 1058;
+
+    -webkit-transition: all 1s;
+    .transition-duration(1s);
+
+    .alert {
+        text-align       : center;
+        margin           : 0 25%;
+        border-radius    : 4px !important;
+        border           : none !important;
+        background-color : rgba(0,0,0,0.7) !important;
+        color            : #efc338 !important;
+        text-shadow      : none;
+        line-height      : 30px;
+
+        .proxima-regular(17px);
+    }
+
+    .alert-error {
+        color         : #cc3e3a !important;
+    }
+
+    .alert-success {
+        color         : #6ea933 !important;
+
+        .close {
+            color   : #6ea933 !important;
+            opacity : 0.7 !important;
+        }
+    }
+}
+
+.alert-wrap.active {
+    .transform(translateY(140px)) !important;
+}

data/public/rearview-src/less/dashboard.less

@@ -0,0 +1,173 @@
+.monitor-panel {
+    position : relative;
+    top      : @top-adjustment;
+    width    : 90%;
+
+    .carousel {
+        top : 22px;
+
+        .active .btn {
+            display : inline-block;
+        }
+    }
+
+    .carousel-indicators.middle {
+		left       : 0;
+		right      : 0;
+		top        : -30px;
+		text-align : center;
+	
+		li {
+			float         : none;
+			display       : inline-block;
+			background    : #000;
+			border        : 2px solid #F5F4EE;
+			border-radius : 7px;
+
+			&.active {
+				background : #f5f4ee;
+			}
+		}
+	}
+
+	.carousel-control {
+		border     : none;
+		background : none;
+		height     : auto;
+		width      : 53px;
+		z-index    : 11;
+		top        : 50%;
+        position   : fixed;
+
+		.proxima-regular;
+	
+		&.left {
+			left : 0.5%;
+		}
+		&.right {
+			right : 0.5%;
+		}
+	}
+
+	.carousel-inner {
+		overflow : visible;
+
+        & > .prev {
+            left: -106%;
+        }
+
+        & > .next {
+            left: 106%;
+        }
+
+		.item {
+			min-height : 1184px;
+		}
+
+		.carousel-caption {
+            background : rgba(0,0,0,0.3);
+            position   : fixed;
+            bottom     : 41px;
+            z-index    : 10;
+            opacity    : 1;
+			.proxima-regular;
+
+			h4 {
+				font-weight : normal;
+			}
+		}
+
+		.item.active .carousel-caption {
+			-webkit-transition : opacity 0.5s ease-out 5s;
+               -moz-transition : opacity 0.5s ease-out 5s;
+                 -o-transition : opacity 0.5s ease-out 5s;
+                    transition : opacity 0.5s ease-out 5s;
+            opacity : 0;
+		}
+	}
+}
+
+.monitor-wrap {
+    margin        : 0;
+    padding       : 0;
+    overflow      : visible;
+    width         : 100%;
+    position      : relative;
+    z-index       : 1;
+
+    -webkit-perspective : 0px;
+       -moz-perspective : 0px;
+            perspective : 0px;
+
+    .monitor-grid {
+        margin : 0 0 2em 0;
+        font-size : 16px;
+
+        .row-fluid {
+            display : block;
+        }
+
+        .small-monitor:last {
+            margin-right  : 0;
+            padding-right : 0;
+        }
+    }
+
+    .edit-monitor-wrap {
+        display  : block;
+        height   : inherit;
+        width    : 100%;
+        z-index  : 100;
+        top      : @top-adjustment;
+        right    : 4000px;
+        position : absolute;
+
+        transition         : right 0.4s;
+        -moz-transition    : right 0.4s;
+        -webkit-transition : right 0.4s;
+
+        .edit-monitor {
+            background    : #545954;
+            border-radius : 7px;
+            margin        : 0 6%;
+            padding       : 8px 7px;
+            min-height    : 500px;
+
+            .data-view {
+                background    : #767a76;
+                border-radius : 4px;
+                float         : left;
+                width         : 66%;
+            }
+
+            .metrics-schedule {
+                background    : #767a76;
+                border-radius : 4px;
+            }
+        }
+    }
+
+    .edit-monitor-wrap.active {
+        right : 0;
+    }
+}
+
+.small-monitor-drag {
+    margin-bottom: 34px;    
+}
+
+.small-monitor-wrap {
+    position : relative;
+    z-index  : 1;
+}
+
+/* styles for drag & drop */
+.active-drop {
+    outline : 2px dashed #f5f4ee;
+}
+
+@-moz-document url-prefix() { /* HACK: for jquery UI & border not working right */
+    .active-drop {
+        overflow : hidden;
+    }
+}

data/public/rearview-src/less/ecosystem.less

@@ -0,0 +1,221 @@
+/* ecosystem/dashboard styles */
+.ecosystem-dashboard-wrap {
+    margin     : 0 20px 0 0;
+    padding    : 0;
+    text-align : center;
+    position   : relative;
+    top        : 8em;
+    z-index    : 0;
+
+    -webkit-perspective : 0px;
+       -moz-perspective : 0px;
+         -o-perspective : 0px;
+            perspective : 0px;
+
+    .btn {
+        .rounded(4px);
+    }
+
+    .dashboard-tile {
+        margin        : 0 0 20px 20px;
+        display       : inline-block;
+        width         : 200px;
+        height        : 200px;
+        cursor        : pointer;
+        border-radius : 4px;
+        box-shadow    : 0 0 12px #222;
+
+        -webkit-transition       : -webkit-transform 1s;
+           -moz-transition       :    -moz-transform 1s;
+             -o-transition       :      -o-transform 1s;
+                transition       :         transform 1s;
+        -webkit-transform-style  : preserve-3d;
+           -moz-transform-style  : preserve-3d;
+             -o-transform-style  : preserve-3d;
+                transform-style  : preserve-3d;
+        -webkit-transform-origin : right center;
+           -moz-transform-origin : right center;
+             -o-transform-origin : right center;
+                transform-origin : right center;
+    }
+
+    .dashboard-tile.flipped {
+        .transform(translateX( -100% ) rotateY( -180deg ));
+    }
+
+    .dashboard-tile figure {
+        margin        : 0;
+        display       : block;
+        height        : 100%;
+        width         : 100%;
+        border-radius : 4px;
+        position      : absolute;
+
+        -webkit-backface-visibility : hidden;
+           -moz-backface-visibility : hidden;
+             -o-backface-visibility : hidden;
+                backface-visibility : hidden;
+    }
+
+    .dashboard-tile .front {
+        padding    : 12px;
+        background : #545954;
+
+        .box-sizing(border-box);
+
+        p {
+          line-height    : 40px;
+          text-align     : center;
+          color          : #fff;
+          text-transform : uppercase;
+
+          .proxima-regular(18px);
+        }
+
+        fieldset {
+            margin   : 0;
+            display  : block;
+            position : absolute;
+            bottom   : 0;
+            left     : 0;
+            width    : 100%;
+            float    : right;
+            opacity  : 0;
+
+            -webkit-transition : opacity 0.3s ease-in-out;
+               -moz-transition : opacity 0.3s ease-in-out;
+                    transition : opacity 0.3s ease-in-out;
+
+            button {
+                margin-bottom : 5px;
+                margin-right  : 5px;
+                float         : right;
+            }
+        }
+    }
+
+    .dashboard-tile .front:hover {
+        fieldset {
+          opacity : 1;
+        }
+        /* -moz-transform:scale(1.1); just an idea atm */
+    }
+
+    .dashboard-tile .back {
+        background : #f5f4ee;
+        cursor     : default;
+        .transform(rotateY( 180deg ));
+
+        fieldset {
+            margin : 5px;
+
+            input {
+                width : 176px;
+            }
+
+            .btn-wrap {
+                position : absolute;
+                bottom   : 0;
+                right    : 0;
+                width    : 100%;
+            }
+
+            button {
+                margin-bottom : 5px;
+                margin-right  : 5px;
+                float         : right;
+            }
+        }
+    }
+
+    .dashboard-tile.flipped .front,
+    .dashboard-tile.flipped .front:hover {
+        button {
+          visibility : hidden;
+          opacity : 0;
+        }
+    }
+
+    .dashboard-tile.red {
+        .front {
+            background : #735854;
+        }
+    }
+}
+
+/* delete/reset monitor styles */
+.reset-monitor,
+.delete-monitor {
+    .hero-unit {
+        margin-top : 20px;
+    }
+}
+
+/* add dashboard styles */
+.add-dashboard {
+    .dashboard-name,
+    .dashboard-description {
+        width : 100%;
+    }
+}
+
+/* delete/reset monitor styles */
+.reset-monitor,
+.delete-monitor {
+    .hero-unit {
+        margin-top : 20px;
+    }
+}
+
+/* add dashboard styles */
+.add-dashboard {
+    .dashboard-name,
+    .dashboard-description {
+        width : 100%;
+    }
+}
+
+/* delete/reset monitor styles */
+.reset-monitor,
+.delete-monitor {
+    .hero-unit {
+        margin-top : 20px;
+    }
+}
+
+/* add dashboard styles */
+.add-dashboard {
+    .dashboard-name,
+    .dashboard-description {
+        width : 100%;
+    }
+}
+
+/* add dashboard styles */
+.add-category {
+    .category-name,
+    .category-description {
+        width : 100%;
+    }
+}
+
+.nav-tabs.nav-stacked {
+    li {
+        margin-left : 0; 
+    }
+
+    & > li > a,
+    & > li > a:hover, {
+        color : #adabac;
+        background : #333;
+        border : 1px solid #b6b3a6;
+        cursor:default;
+    }
+}
+
+.existing-categories {
+    p, a {
+        margin : 0;
+        .proxima-regular(14px);
+    }
+}

data/public/rearview-src/less/elements.less

@@ -0,0 +1,168 @@
+/*---------------------------------------------------
+    LESS Elements 0.6
+  ---------------------------------------------------
+    A set of useful LESS mixins by Dmitry Fadeyev
+    Special thanks for mixin suggestions to:
+      Kris Van Herzeele,
+      Benoit Adam,
+      Portenart Emile-Victor,
+      Ryan Faerman
+
+    More info at: http://lesselements.com
+
+    More added by: Ian Quattlebaum
+-----------------------------------------------------*/
+.box-sizing(@sizing) {
+    -webkit-box-sizing : @sizing;
+       -moz-box-sizing : @sizing;
+        -ms-box-sizing : @sizing;
+            box-sizing : @sizing;
+}
+
+.background-gradient(@background-image, @color: #F5F5F5, @start: #EEE, @stop: #FFF) {
+    background : @color;
+    background : @background-image, 
+                 -webkit-gradient(linear,
+                                  left bottom,
+                                  left top,
+                                  color-stop(0, @start),
+                                  color-stop(1, @stop));
+    background : @background-image,
+                 -ms-linear-gradient(bottom,
+                                     @start,
+                                     @stop);
+    background : @background-image,
+                 -moz-linear-gradient(center bottom,
+                                      @start 0%,
+                                      @stop 100%);
+}
+
+.gradient(@color : #F5F5F5, @start: #EEE, @stop: #FFF) {
+    background : @color;
+    background : -webkit-gradient(linear,
+                                  left bottom,
+                                  left top,
+                                  color-stop(0, @start),
+                                  color-stop(1, @stop));
+    background : -ms-linear-gradient(bottom,
+                                     @start,
+                                     @stop);
+    background : -moz-linear-gradient(center bottom,
+                                      @start 0%,
+                                      @stop 100%);
+}
+.bw-gradient(@color : #F5F5F5, @start : 0, @stop : 255) {
+    background : @color;
+    background : -webkit-gradient(linear,
+                                  left bottom,
+                                  left top,
+                                  color-stop(0, rgb(@start,@start,@start)),
+                                  color-stop(1, rgb(@stop,@stop,@stop)));
+    background : -ms-linear-gradient(bottom,
+                                     rgb(@start,@start,@start) 0%,
+                                     rgb(@start,@start,@start) 100%);
+    background : -moz-linear-gradient(center bottom,
+                                      rgb(@start,@start,@start) 0%,
+                                      rgb(@stop,@stop,@stop) 100%);
+}
+.bordered(@top-color : #EEE, @right-color : #EEE, @bottom-color : #EEE, @left-color : #EEE) {
+    border-top    : solid 1px @top-color;
+    border-left   : solid 1px @left-color;
+    border-right  : solid 1px @right-color;
+    border-bottom : solid 1px @bottom-color;
+}
+.drop-shadow(@x-axis: 0, @y-axis: 1px, @blur: 2px, @alpha: 0.1) {
+  -webkit-box-shadow: @x-axis @y-axis @blur rgba(0, 0, 0, @alpha);
+  -moz-box-shadow: @x-axis @y-axis @blur rgba(0, 0, 0, @alpha);
+  box-shadow: @x-axis @y-axis @blur rgba(0, 0, 0, @alpha);
+}
+.rounded(@radius: 2px) {
+    -webkit-border-radius : @radius;
+       -moz-border-radius : @radius;
+            border-radius : @radius;
+
+    -webkit-background-clip : padding-box;
+       -moz-background-clip : padding;
+            background-clip : padding-box;
+}
+.border-radius(@topleft: 0, @topright: 0, @bottomright: 0, @bottomleft: 0) {
+    -webkit-border-top-right-radius    : @topright;
+    -webkit-border-bottom-right-radius : @bottomright;
+    -webkit-border-bottom-left-radius  : @bottomleft;
+    -webkit-border-top-left-radius     : @topleft;
+       -moz-border-radius-topright     : @topright;
+       -moz-border-radius-bottomright  : @bottomright;
+       -moz-border-radius-bottomleft   : @bottomleft;
+       -moz-border-radius-topleft      : @topleft;
+            border-top-right-radius    : @topright;
+            border-bottom-right-radius : @bottomright;
+            border-bottom-left-radius  : @bottomleft;
+            border-top-left-radius     : @topleft;
+
+    -webkit-background-clip : padding-box; 
+       -moz-background-clip : padding; 
+            background-clip : padding-box; 
+}
+.opacity(@opacity: 0.5) {
+  -moz-opacity: @opacity;
+  -khtml-opacity: @opacity;
+  -webkit-opacity: @opacity;
+  opacity: @opacity;
+}
+.transition-duration(@duration: 0.2s) {
+  -moz-transition-duration: @duration;
+  -webkit-transition-duration: @duration;
+  transition-duration: @duration;
+}
+.rotation(@deg:5deg){
+  -webkit-transform: rotate(@deg);
+  -moz-transform: rotate(@deg);
+  transform: rotate(@deg);
+}
+.scale(@ratio:1.5){
+  -webkit-transform:scale(@ratio);
+  -moz-transform:scale(@ratio);
+  transform:scale(@ratio);
+}
+.transition(@duration:0.2s, @ease:ease-out) {
+  -webkit-transition: all @duration @ease;
+  -moz-transition: all @duration @ease;
+  transition: all @duration @ease;
+}
+.inner-shadow(@horizontal:0, @vertical:1px, @blur:2px, @alpha: 0.4) {
+  -webkit-box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha);
+  -moz-box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha);
+  box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha);
+}
+.box-shadow(@arguments) {
+  -webkit-box-shadow: @arguments;
+  -moz-box-shadow: @arguments;
+  box-shadow: @arguments;
+}
+.columns(@colwidth: 250px, @colcount: 0, @colgap: 50px, @columnRuleColor: #EEE, @columnRuleStyle: solid, @columnRuleWidth: 1px) {
+  -moz-column-width: @colwidth;
+  -moz-column-count: @colcount;
+  -moz-column-gap: @colgap;
+  -moz-column-rule-color: @columnRuleColor;
+  -moz-column-rule-style: @columnRuleStyle;
+  -moz-column-rule-width: @columnRuleWidth;
+  -webkit-column-width: @colwidth;
+  -webkit-column-count: @colcount;
+  -webkit-column-gap: @colgap;
+  -webkit-column-rule-color: @columnRuleColor;
+  -webkit-column-rule-style: @columnRuleStyle;
+  -webkit-column-rule-width: @columnRuleWidth;
+  column-width: @colwidth;
+  column-count: @colcount;
+  column-gap: @colgap;
+  column-rule-color: @columnRuleColor;
+  column-rule-style: @columnRuleStyle;
+  column-rule-width: @columnRuleWidth;
+}
+.translate(@x:0, @y:0) {
+  -moz-transform: translate(@x, @y);
+  -webkit-transform: translate(@x, @y);
+  -o-transform: translate(@x, @y);
+  -ms-transform: translate(@x, @y);
+  transform: translate(@x, @y);
+}