// BO Dashboard loading et trends

admin-dev/themes/default/css/admin-theme.sass

@@ -940,10 +940,19 @@ fieldset > .row
 .size_xxl
 	font-size: 2.3em
 
+
 .dash_trend_down
 	color: red
+	&:before
+		margin-right: 4px
+		font-family: FontAwesome
+		content: "\f0ab"
 .dash_trend_up
 	color: green
+	&:before
+		margin-right: 4px
+		font-family: FontAwesome
+		content: "\f0aa"
 
 
 #dashboard
@@ -1083,3 +1092,72 @@ fieldset > .row
 	#dash_activity
 		svg
 			height: 150px
+
+	.loading
+		.data_value
+			//background-color: black
+			min-width: 40px
+			text-align: center
+			&:before
+				@extend .icon-spin
+				font-size: 0.7em
+				font-family: FontAwesome
+				content: "\f021"
+				color: #ccc
+				margin-right: 4px
+		.data_table
+
+		.data_chart
+
+		.data_trends
+
+
+
+=animation($name,$value)
+	-webkit-animation-#{$name}: $value
+	animation-#{$name}: $value
+
+=keyframes($name)
+	@-webkit-keyframes #{$name}
+		@content
+	@-moz-keyframes #{$name}
+		@content
+	@-ms-keyframes #{$name}
+		@content
+	@-o-keyframes #{$name}
+		@content
+	@keyframes #{$name}
+		@content
+
+.data_loading
+	width: 20px
+	margin: 0 auto
+	.lb
+		background-color: #eee
+		//border: 1px solid #ccc
+		float: left
+		height: 14px
+		margin-left: 1px
+		width: 4px
+		opacity: 0.1
+		+animation(name,bounceG)
+		+animation(duration,0.7s)
+		+animation(iteration-count,infinite)
+		+animation(direction,linear)
+		+scale(0.7)
+		&.lb1
+			+animation(delay,0.20999999999999996s)
+
+		&.lb2
+			+animation(delay,0.27999999999999997s)
+
+		&.lb3
+			+animation(delay,0.35s)
+
++keyframes(bounceG)
+	0%
+		+opacity(1)
+		+scale(1.2)
+	100%
+		+scale(0.7)
+		+opacity(0.1)

modules/dashactivity/views/templates/hook/dashboard_zone_one.tpl

@@ -43,8 +43,12 @@
 					<small class="text-muted">{l s='Within the last seven days'}</small>
 				</span>
 				<span class="data_value size_xxl">
-					<span id="order_nbr"></span><br/>
-					<small class="dash_trend dash_trend_up"><i class="icon-circle-arrow-up"></i> <span id="orders_trends"></span>%</small>
+					<span id="order_nbr">
+
+
+
+					</span><br/>
+					<small class="dash_trend dash_trend_up"><span id="orders_trends"></span>%</small>
 				</span>
 			</li>
 		</ul>			

modules/dashtrends/views/templates/hook/dashboard_zone_two.tpl

@@ -39,32 +39,32 @@
 		<dl class="col-xs-4 col-lg-2 active">
 			<dt>{l s='Sales'}</dt>
 			<dd class="size_l">$150,365</dd>
-			<dd class="dash_trend dash_trend_up"><i class="icon-circle-arrow-up"></i> 0.66%</dd>
+			<dd class="dash_trend dash_trend_up">0.66%</dd>
 		</dl>
 		<dl class="col-xs-4 col-lg-2">
 			<dt>{l s='Orders'}</dt>
 			<dd class="size_l">20,432</dd>
-			<dd class="dash_trend dash_trend_down"><i class="icon-circle-arrow-down"></i> 0.66%</dd>
+			<dd class="dash_trend dash_trend_down">0.66%</dd>
 		</dl>
 		<dl class="col-xs-4 col-lg-2">
 			<dt>{l s='Cart Value'}</dt>
 			<dd class="size_l">$125</dd>
-			<dd class="dash_trend dash_trend_up"><i class="icon-circle-arrow-up"></i> 0.66%</dd>
+			<dd class="dash_trend dash_trend_up">0.66%</dd>
 		</dl>
 		<dl class="col-xs-4 col-lg-2">
 			<dt>{l s='Visits'}</dt>
 			<dd class="size_l">1,200</dd>
-			<dd class="dash_trend dash_trend_down"><i class="icon-circle-arrow-down"></i> 0.66%</dd>
+			<dd class="dash_trend dash_trend_down">0.66%</dd>
 		</dl>
 		<dl class="col-xs-4 col-lg-2">
 			<dt>{l s='Converstion Rate'}</dt>
 			<dd class="size_l">23%</dd>
-			<dd class="dash_trend dash_trend_up"><i class="icon-circle-arrow-up"></i> 0.66%</dd>
+			<dd class="dash_trend dash_trend_up">0.66%</dd>
 		</dl>
 		<dl class="col-xs-4 col-lg-2">
 			<dt>{l s='Net Profits'}</dt>
 			<dd class="size_l">$23,568</dd>
-			<dd class="dash_trend dash_trend_up"><i class="icon-circle-arrow-up"></i> 0.66%</dd>
+			<dd class="dash_trend dash_trend_up">0.66%</dd>
 		</dl>
 	</div>