// organize css
This commit is contained in:
@@ -0,0 +1,233 @@
|
||||
//DASHBOARD
|
||||
|
||||
.size_s, .size_md, .size_l, .size_xl, .size_xxl
|
||||
font-family: $headings-font-family
|
||||
color: $main-color
|
||||
.size_s
|
||||
font-size: 1.1em
|
||||
.size_md
|
||||
font-size: 1.3em
|
||||
.size_l
|
||||
font-size: 1.7em
|
||||
.size_xl
|
||||
font-size: 2em
|
||||
.size_xxl
|
||||
font-size: 2.3em
|
||||
.color_success
|
||||
color: $brand-success
|
||||
.color_danger
|
||||
color: $brand-danger
|
||||
|
||||
.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
|
||||
section
|
||||
header
|
||||
padding: 3px 8px
|
||||
margin: 0 0 3px 0
|
||||
color: white
|
||||
font-size: 1.2em
|
||||
background-color: $brand-primary
|
||||
header.panel-heading
|
||||
color: #555
|
||||
|
||||
.data_list
|
||||
@extend .list-group
|
||||
margin: 0 0 10px 0
|
||||
padding: 0
|
||||
li
|
||||
@extend .list-group-item
|
||||
position: relative
|
||||
.data_label
|
||||
small
|
||||
.data_value
|
||||
line-height: 39px
|
||||
position: absolute
|
||||
top: 0
|
||||
right: 0
|
||||
padding: 0 10px 0 0
|
||||
|
||||
.data_list_small
|
||||
margin: 8px 0 10px 0
|
||||
padding: 0 0 0 0
|
||||
border-top: solid 1px #ddd
|
||||
li
|
||||
padding: 3px 0
|
||||
position: relative
|
||||
border: none
|
||||
margin: 0
|
||||
border-bottom: dashed 1px #ddd
|
||||
.data_label
|
||||
text-transform: uppercase
|
||||
color: #bbb
|
||||
.data_value
|
||||
line-height: 25px
|
||||
position: absolute
|
||||
top: 0
|
||||
right: 0
|
||||
padding: 0
|
||||
|
||||
.data_list_large
|
||||
margin: 8px 0 10px 0
|
||||
padding: 0
|
||||
@extend .list-unstyled
|
||||
li
|
||||
padding: 6px 0
|
||||
position: relative
|
||||
border: none
|
||||
margin: 0
|
||||
.data_label
|
||||
line-height: 0.8em
|
||||
small
|
||||
font-size: 0.6em
|
||||
.data_value
|
||||
text-align: right
|
||||
line-height: 0.6em
|
||||
position: absolute
|
||||
top: 0
|
||||
right: 0
|
||||
padding: 8px 0 0 0
|
||||
small
|
||||
font-size: 0.5em
|
||||
|
||||
.data_list_vertical
|
||||
@extend .list-unstyled
|
||||
@extend .row
|
||||
padding: 0
|
||||
margin: 0 0 10px 0
|
||||
border: 1px solid #ddd
|
||||
@include border-radius(3px)
|
||||
li
|
||||
border-left: solid 1px #ddd
|
||||
@extend .col-xs-4
|
||||
padding: 6px
|
||||
&:first-child
|
||||
border: none
|
||||
.data_label
|
||||
min-height: 32px
|
||||
display: block
|
||||
line-height: 1em
|
||||
text-align: center
|
||||
.data_value
|
||||
display: block
|
||||
text-align: center
|
||||
|
||||
#dashtrends
|
||||
header
|
||||
margin-bottom: 0
|
||||
#dashtrends_toolbar
|
||||
margin: 4px -16px
|
||||
dl
|
||||
margin: 0
|
||||
min-height: 120px
|
||||
text-align: center
|
||||
background-color: white
|
||||
padding: 10px
|
||||
border-left: 1px solid #ddd
|
||||
border-bottom: 1px solid #ddd
|
||||
&:first-child
|
||||
border-left: none
|
||||
&.active
|
||||
background-color: #eee
|
||||
dt
|
||||
text-align: center
|
||||
height: 37px
|
||||
line-height: 1em
|
||||
font: 300 1.1em/120% $headings-font-family
|
||||
svg
|
||||
height: 350px
|
||||
|
||||
#dashproducts
|
||||
header
|
||||
margin-bottom: 0
|
||||
nav
|
||||
border-bottom: solid 1px #ddd
|
||||
margin: 0 -11px
|
||||
ul
|
||||
margin: 0 -5px
|
||||
padding: 0
|
||||
text-decoration: none
|
||||
background-color: white
|
||||
li
|
||||
float: left
|
||||
li.active
|
||||
background-color: $brand-primary
|
||||
a
|
||||
color: white
|
||||
#dashactivity
|
||||
svg
|
||||
height: 150px
|
||||
|
||||
.data_value
|
||||
span, .dash_trend
|
||||
@extend .data_loading
|
||||
.loading
|
||||
.data_value
|
||||
min-width: 30px
|
||||
text-align: center
|
||||
&:before
|
||||
@extend .icon-spin
|
||||
font-size: 0.7em
|
||||
font-family: FontAwesome
|
||||
content: "\f021"
|
||||
color: #ccc
|
||||
span, small
|
||||
display: none
|
||||
.data_trend
|
||||
display: none
|
||||
|
||||
.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
|
||||
opacity: 1
|
||||
+animation(name,bounceG)
|
||||
+animation(duration,0.7s)
|
||||
+animation(direction,linear)
|
||||
+scale(0.7)
|
||||
|
||||
+keyframes(bounceG)
|
||||
0%
|
||||
+opacity(0)
|
||||
+scale(0.1)
|
||||
100%
|
||||
+opacity(1)
|
||||
+scale(1)
|
||||
|
||||
#dash_version
|
||||
@extend .panel
|
||||
padding: 0!important
|
||||
overflow: hidden
|
||||
iframe
|
||||
height: 140px
|
||||
width: 100%
|
||||
Reference in New Issue
Block a user