1387 lines
28 KiB
Sass
Executable File
1387 lines
28 KiB
Sass
Executable File
//light
|
|
//$main-color: #F7F7F7
|
|
//$main-color: #DBD8CF //sable
|
|
//$main-color: #CFD7DD //bleu
|
|
//$main-color: #E0E0E0 //gris
|
|
//$main-color: #D7D6DE //violet
|
|
//$main-color: #F1F8FE //theme wordpress
|
|
//dark
|
|
//$main-color: #272A31 //bleu PrestaShop
|
|
//$main-color: #3D3D3D //gris
|
|
//$main-color: #515561 //gris bleu clair
|
|
//$main-color: #4D4645 //taupe
|
|
//$main-color: #272822 //gris vert
|
|
//$main-color: #313A45 //gris bleu
|
|
//$main-color: #443A42 //violet
|
|
//$main-color: #373E35 //vert camo
|
|
//$main-color: #262C3F //bleu nuit - pretty sure that a girl could do better naming the colors, sorry about that...
|
|
//$main-color: #8C8574
|
|
$main-color: #3A3A4A
|
|
|
|
//$secondary-color: white //blanc
|
|
//$secondary-color: #F5792B //orange
|
|
//$secondary-color: #81A98C //vert d'eau
|
|
//$secondary-color: #1EAEC0 //bleu
|
|
//$secondary-color: #00C3C1 //turquoise
|
|
//$secondary-color: #97C885 //vert menthe
|
|
//$secondary-color: #4691D2 //bleu ciel
|
|
//$secondary-color: #814C76 //violet
|
|
//$secondary-color: #FE635F //saumon
|
|
//$secondary-color: #F8235A //rose
|
|
//$secondary-color: #F2B100 //moutarde
|
|
//$secondary-color: #F7854E //abricot
|
|
//$secondary-color: #937976 //taupe clair
|
|
//$secondary-color: #60C276 //vert
|
|
//$secondary-color: #9DC44B //vert pomme
|
|
//$secondary-color: #6992AF //theme wordpress
|
|
//$secondary-color: #8BC954 //vert PrestaShop
|
|
|
|
//some tests
|
|
//$secondary-color: #79C09D
|
|
//$secondary-color: invert($main-color)
|
|
//$secondary-color: lighten(invert($main-color),20%)
|
|
//$secondary-color: adjust-hue($main-color, 80%)
|
|
//$hue: hue(adjust-hue($main-color, 80%))
|
|
//$secondary-color: hsl($hue, 50%, 50%) //Creates a Color from hue, saturation, and lightness values
|
|
$secondary-color: #00A89C
|
|
|
|
//dark and light, love and war, fire and ice, etc...
|
|
$contrasted-dark-default: #333
|
|
$contrasted-light-default: white
|
|
$contrasted-lightness-threshold: 10% //30% default
|
|
|
|
//50 shades of gray
|
|
//$bg-content-color: #F8F9FB //bleu gris clair
|
|
//$bg-content-color: #F8FBF8 //vert gris clair
|
|
//$bg-content-color: #F8F4E3 //gris foncé
|
|
//$bg-content-color: #F6F6F6 //gris
|
|
$bg-content-color: #F8F8F8 //gris
|
|
|
|
//heading
|
|
//$bg-header-color: darken($secondary-color,20%)
|
|
$bg-header-color: #242424
|
|
$bg-footer-color: #242424
|
|
$bg-page-head-color : $secondary-color
|
|
$bg-panel-heading-color: hsl(hue($secondary-color), 10, 90)
|
|
|
|
//others
|
|
$badge-notif-color: #EF1778
|
|
$icon-color: #87C795
|
|
|
|
@import "compass"
|
|
@import "bootstrap/variables"
|
|
@import "bootstrap"
|
|
@import "font-awesome"
|
|
@import "toggle-switch"
|
|
|
|
//@import url("//fonts.googleapis.com/css?family=Ubuntu:300|Open+Sans")
|
|
|
|
html, body
|
|
height: 100%
|
|
|
|
#header_infos
|
|
@extend .navbar
|
|
@extend .navbar-inverse
|
|
@extend .navbar-fixed-top
|
|
background-color: $bg-header-color
|
|
#header_shopname
|
|
@extend .navbar-brand
|
|
font: 300 1.3em/100% $headings-font-family
|
|
#header_notifs_icon_wrapper
|
|
@extend .hidden-xs
|
|
@extend .nav
|
|
@extend .navbar-nav
|
|
> li > a > i
|
|
font-size: 1.2em
|
|
color: white
|
|
.notifs_badge
|
|
@extend .badge
|
|
background-color: $badge-notif-color
|
|
.notifs_dropdown
|
|
background-color: transparent
|
|
border: none
|
|
box-shadow: none
|
|
.notifs_panel
|
|
@extend .panel
|
|
@extend .panel-default
|
|
width: 300px
|
|
@include box-shadow(rgba(black,0.5) 2px 2px 8px)
|
|
.notifs_panel_header
|
|
@extend .panel-heading
|
|
h3
|
|
padding: 0
|
|
font-size: 1.3em
|
|
margin: 0
|
|
.notifs_panel_footer
|
|
@extend .panel-footer
|
|
|
|
#header_nav_toggle
|
|
background-color: black
|
|
border: none
|
|
color: white
|
|
#header_employee_box
|
|
@extend .nav
|
|
@extend .navbar-nav
|
|
@extend .navbar-right
|
|
#header_search
|
|
@extend .navbar-form
|
|
@extend .navbar-left
|
|
#header_quick
|
|
@extend .nav
|
|
@extend .navbar-nav
|
|
@extend .navbar-left
|
|
|
|
#main
|
|
min-height: 100%
|
|
//height: auto!important
|
|
padding: 36px 0 60px
|
|
margin: 0 0 -60px 0
|
|
background-color: $bg-content-color
|
|
//background-image: url('../img/patterns/bedge_grunge.png') // texture
|
|
|
|
#content
|
|
padding: 90px 20px 0
|
|
margin-left: 240px
|
|
@include transition-property(margin)
|
|
@include transition-duration(0.4s)
|
|
@include transition-timing-function(ease-out)
|
|
fieldset, .panel
|
|
padding: 20px
|
|
margin-bottom: 20px
|
|
border: solid 1px darken($bg-content-color,10%)
|
|
background-color: lighten($bg-content-color,20%)
|
|
@include border-radius(5px)
|
|
@include box-shadow(rgba(black,0.10) 0 2px 0, white 0 0 0 3px inset)
|
|
.panel-heading
|
|
@extend h3
|
|
h3, .panel-heading
|
|
border: none
|
|
height: 30px
|
|
padding: 0 5px
|
|
margin: -16px -16px 15px -16px
|
|
color: contrasted($bg-panel-heading-color)
|
|
font-size: 1.2em
|
|
line-height: 30px
|
|
font-weight: 300
|
|
text-transform: uppercase
|
|
background-color: $bg-panel-heading-color
|
|
i, a
|
|
color: contrasted($bg-panel-heading-color)
|
|
.badge
|
|
background-color: lighten($bg-panel-heading-color,20%)
|
|
@include border-radius(none)
|
|
height: 29px
|
|
line-height: 25px
|
|
font-size: 1.3em
|
|
margin-right: 7px
|
|
font-weight: 300
|
|
float: left
|
|
margin-left: -5px
|
|
.panel-danger .panel-heading
|
|
background-color: $badge-notif-color!important
|
|
.panel-heading-big
|
|
font-size: 2em
|
|
text-align: center
|
|
form .alert
|
|
clear: both
|
|
color: darken(#D6D2CF,40%)
|
|
border: solid 1px darken(#D6D2CF,5%)
|
|
background-color: lighten(#D6D2CF,5%)
|
|
&.alert-info
|
|
background-color: white
|
|
color: darken(#DAEAF8,30%)
|
|
border: none
|
|
border-bottom: solid 1px darken($bg-content-color,10%)
|
|
@include box-shadow(white 0 0 0 1px inset)
|
|
@media (max-width: $screen-tablet)
|
|
margin-left: 0
|
|
width: 100%
|
|
|
|
.page-head
|
|
width: 100%
|
|
height: 55px
|
|
padding: 0 10px 0 0
|
|
margin: 0
|
|
border-bottom: 4px solid darken($secondary-color,10%)
|
|
position: fixed
|
|
top: 36px
|
|
left: 0px
|
|
z-index: 499
|
|
background-color: $secondary-color
|
|
@include box-shadow(rgba(black,0.15) 0 7px 0)
|
|
h2.page-title
|
|
@extend .pull-left
|
|
padding: 0 0 0 260px
|
|
font-size: 18px
|
|
color: white
|
|
text-transform: uppercase
|
|
@media (max-width: $screen-tablet)
|
|
padding: 0 0 0 20px
|
|
.btn-toolbar
|
|
margin: 0
|
|
padding: 3px 0 0 0
|
|
.nav-tabs
|
|
margin: 0
|
|
.nav-tabs > li > a
|
|
color: #333
|
|
> .active > a, > .active > a:hover
|
|
//color: #3399ff
|
|
//background: #f5f5f5
|
|
|
|
#nav-sidebar
|
|
height: 100%!important
|
|
z-index: 500
|
|
float: left
|
|
width: 240px
|
|
background-color: $main-color
|
|
border-bottom: 1px solid lighten($main-color,5%)
|
|
.menu
|
|
border-top: 1px black solid
|
|
.maintab > a [class^="icon-"], .menu .maintab > a [class*=" icon-"]
|
|
font-size: 20px
|
|
@include border-radius(40px)
|
|
height: 30px
|
|
width: 30px
|
|
color: white
|
|
display: inline-block
|
|
text-align: center
|
|
line-height: 30px
|
|
ul
|
|
margin: 0
|
|
padding: 0
|
|
li
|
|
list-style: none
|
|
li:not(.active)
|
|
ul
|
|
display: none
|
|
li.expanded
|
|
ul
|
|
display: block
|
|
background-color: white
|
|
> ul
|
|
> li
|
|
position: relative
|
|
&.active > a
|
|
color: contrast-color($main-color, white, #333, 10%)
|
|
background-color: $secondary-color
|
|
border-top: 1px solid lighten($secondary-color,5%)
|
|
border-bottom: 1px solid darken($secondary-color,20%)
|
|
@include box-shadow(darken($secondary-color,10%) -4px 0 0 inset)
|
|
i
|
|
color: $brand-primary!important
|
|
background-color: white
|
|
&.active:hover > a
|
|
color: contrast-color($main-color, white, #333, 10%)
|
|
@include box-shadow(darken($secondary-color,10%) -4px 0 0 inset)
|
|
&:hover > a
|
|
@include box-shadow($brand-primary -4px 0 0 inset)
|
|
i
|
|
color: $secondary-color!important
|
|
background-color: white
|
|
> a
|
|
display: block
|
|
padding: 2px 0 2px 8px
|
|
border-top: 1px solid lighten($main-color,5%)
|
|
border-bottom: 1px solid darken($main-color,10%)
|
|
font-size: 12px
|
|
line-height: 28px
|
|
$color: contrast-color($main-color, white, #333, 10%)
|
|
color: mix($main-color, $color, 30%)
|
|
background-color: $main-color
|
|
text-transform: uppercase
|
|
text-decoration: none
|
|
@include transition-property(background-color, border, box-shadow)
|
|
@include transition-duration(0.4s)
|
|
@include transition-timing-function(ease-out)
|
|
@include box-shadow(darken($main-color,15%) -4px 0 0 inset)
|
|
i
|
|
color: lighten($main-color,25%)
|
|
background-color: darken($main-color,25%)
|
|
@include transition-property(color)
|
|
@include transition-duration(0.4s)
|
|
@include transition-timing-function(ease-out)
|
|
ul.submenu
|
|
a
|
|
display: block
|
|
padding: 2px 5px 2px 10px
|
|
font-size: 12px
|
|
border: none
|
|
border-bottom: solid 1px #eee
|
|
background-color: white
|
|
i
|
|
margin-top: 3px
|
|
color: $secondary-color
|
|
&:hover
|
|
color: $brand-primary
|
|
background-color: mix(white, $main-color, 90%)
|
|
text-decoration: none
|
|
i
|
|
color: $main-color
|
|
li.active
|
|
a
|
|
color: contrast-color($brand-primary, white, #333, 10%)
|
|
background-color: $brand-primary
|
|
i
|
|
color: contrast-color($brand-primary, white, #333, 10%)
|
|
@media (max-width: $screen-tablet)
|
|
display: none
|
|
|
|
|
|
.page-sidebar-closed
|
|
#nav-sidebar
|
|
width: 50px
|
|
@include transition-property(width)
|
|
@include transition-duration(0.4s)
|
|
@include transition-timing-function(ease-out)
|
|
span.title
|
|
display: none
|
|
ul.submenu
|
|
display: none!important
|
|
padding-top: 38px
|
|
position: relative
|
|
top: 0
|
|
@include box-shadow(rgba(black,0.3) 2px 2px 4px)
|
|
> ul > li:hover
|
|
width: 250px!important
|
|
position: relative
|
|
span.title
|
|
display: inline-block
|
|
ul.submenu
|
|
display: block!important
|
|
position: absolute
|
|
left: 50px
|
|
width: 200px!important
|
|
#content
|
|
margin-left: 50px
|
|
.page-head h2.page-title
|
|
padding: 0 0 0 70px
|
|
@media (max-width: $screen-tablet)
|
|
padding: 0 0 0 20px
|
|
@media (max-width: $screen-tablet)
|
|
margin-left: 0
|
|
width: 100%
|
|
|
|
.menu-collapse
|
|
height: 54px
|
|
width: 100%
|
|
font-size: 2em
|
|
text-align: center
|
|
line-height: 55px
|
|
display: block
|
|
background-color: darken($secondary-color,10%)
|
|
border-bottom: 3px solid darken($secondary-color,20%)
|
|
i
|
|
color: lighten($secondary-color,10%)
|
|
|
|
// Tool bar
|
|
.toolbar_btn
|
|
position: relative
|
|
padding: 2px 5px !important
|
|
margin-right: 3px
|
|
font-size: 12px
|
|
font-weight: 600
|
|
color: white
|
|
text-align: center
|
|
text-shadow: none
|
|
&:hover
|
|
color: $secondary-color
|
|
border-color: white
|
|
background-color: white!important
|
|
|
|
.icon-AdminDashboard
|
|
@extend .icon-dashboard
|
|
background-color: adjust-hue($icon-color, 0)
|
|
.icon-AdminCatalog
|
|
@extend .icon-book
|
|
background-color: adjust-hue($icon-color, 30)
|
|
.icon-AdminParentOrders
|
|
@extend .icon-credit-card
|
|
background-color: adjust-hue($icon-color, 60)
|
|
.icon-AdminParentCustomer
|
|
@extend .icon-group
|
|
background-color: adjust-hue($icon-color, 90)
|
|
.icon-AdminPriceRule
|
|
@extend .icon-tags
|
|
background-color: adjust-hue($icon-color, 120)
|
|
.icon-AdminParentShipping
|
|
@extend .icon-truck
|
|
background-color: adjust-hue($icon-color, 150)
|
|
.icon-AdminParentLocalization
|
|
@extend .icon-globe
|
|
background-color: adjust-hue($icon-color, 180)
|
|
.icon-AdminParentModules
|
|
@extend .icon-puzzle-piece
|
|
background-color: adjust-hue($icon-color, 210)
|
|
.icon-AdminParentPreferences
|
|
@extend .icon-wrench
|
|
background-color: adjust-hue($icon-color, 240)
|
|
.icon-AdminTools
|
|
@extend .icon-cogs
|
|
background-color: adjust-hue($icon-color, 270)
|
|
.icon-AdminAdmin
|
|
@extend .icon-cog
|
|
background-color: adjust-hue($icon-color, 300)
|
|
.icon-AdminParentStats
|
|
@extend .icon-bar-chart
|
|
background-color: adjust-hue($icon-color, 330)
|
|
.icon-AdminStock
|
|
@extend .icon-archive
|
|
background-color: adjust-hue($icon-color, 360)
|
|
|
|
[class^="icon-Admin"]
|
|
background-color: darken($main-color,10%)
|
|
margin-right: 6px
|
|
color: lighten($main-color,10%)!important
|
|
|
|
[class^="process-icon-"], [class*=" process-icon-"]
|
|
height: 25px
|
|
min-width: 32px
|
|
background-position: center
|
|
background-repeat: no-repeat
|
|
display: block
|
|
font-family: FontAwesome
|
|
font-weight: normal
|
|
font-style: normal
|
|
font-size: 25px
|
|
line-height: 25px
|
|
text-decoration: inherit
|
|
-webkit-font-smoothing: antialiased
|
|
*margin-right: .3em
|
|
|
|
.process-icon-new
|
|
@extend .icon-plus-sign-alt
|
|
.process-icon-save
|
|
@extend .icon-save
|
|
.process-icon-back
|
|
@extend .icon-arrow-left
|
|
.process-icon-save-and-stay
|
|
@extend .icon-save
|
|
.process-icon-help
|
|
@extend .icon-question-sign
|
|
.process-icon-export
|
|
@extend .icon-cloud-download
|
|
.process-icon-import
|
|
@extend .icon-cloud-upload
|
|
.process-icon-help-new
|
|
@extend .icon-question-sign
|
|
.process-icon-edit
|
|
@extend .icon-edit
|
|
.process-icon-newAttributes
|
|
@extend .icon-plus-sign-alt
|
|
.process-icon-modules-list
|
|
@extend .icon-puzzle-piece
|
|
.process-icon-save-date
|
|
@extend .icon-download
|
|
.process-icon-save-status
|
|
@extend .icon-download
|
|
.process-icon-new-module
|
|
@extend .icon-plus
|
|
.process-icon-delete
|
|
@extend .icon-trash
|
|
.process-icon-update
|
|
@extend icon-refresh
|
|
.process-icon-preview
|
|
@extend .icon-eye-open
|
|
.process-icon-previewURL
|
|
@extend .icon-eye-open
|
|
.process-icon-stats
|
|
@extend .icon-bar-chart
|
|
.process-icon-duplicate
|
|
@extend .icon-copy
|
|
.process-icon-newCombination.toolbar-new
|
|
@extend .icon-plus-sign
|
|
.process-icon-newCombination.toolbar-cancel
|
|
@extend .icon-minus-sign
|
|
.process-icon-partial_refund
|
|
@extend .icon-exchange
|
|
.process-icon-cancel
|
|
@extend .icon-remove
|
|
.process-icon-new-url
|
|
@extend .icon-plus-sign-alt
|
|
.process-icon-anchor
|
|
@extend .icon-anchor
|
|
.process-icon-refresh
|
|
@extend .icon-refresh
|
|
.process-icon-configure
|
|
@extend .icon-cog
|
|
|
|
.navbar-inner
|
|
box-shadow: none!important
|
|
.input-append
|
|
margin-bottom: 0
|
|
|
|
//form
|
|
label.control-label
|
|
font-size: 13px
|
|
font-weight: normal
|
|
color: #666
|
|
|
|
label.control-label span.label-tooltip
|
|
text-decoration: none
|
|
font-size: 13px
|
|
background-color: darken($bg-content-color,5%)
|
|
border: none
|
|
border-bottom: solid 1px darken($bg-content-color,10%)
|
|
padding: 0 5px
|
|
@include border-radius(3px)
|
|
|
|
.tooltip
|
|
font-size: 12px
|
|
|
|
label.required:before
|
|
content: '*'
|
|
color: red
|
|
font-size: 14px
|
|
position: relative
|
|
line-height: 12px
|
|
|
|
select.input-tiny,
|
|
input[type="text"].input-tiny,
|
|
input[type="password"].input-tiny
|
|
width: 80px
|
|
float: left
|
|
|
|
.btn-group-action
|
|
min-width: 150px
|
|
a
|
|
text-decoration: none
|
|
|
|
.btn-default
|
|
@include box-shadow(darken($btn-default-bg,10%) 0 -2px 0 inset)
|
|
|
|
.btn-primary
|
|
@include box-shadow(lighten($brand-success,30%) 0 -2px 0 inset)
|
|
|
|
.btn-default[disabled]
|
|
border-color: $gray-light
|
|
color: $gray-light
|
|
background-color: lighten($gray-light,35%)
|
|
@include box-shadow(lighten($gray-light,20%) 0 -2px 0 inset)
|
|
|
|
.btn
|
|
text-transform: uppercase
|
|
.caret
|
|
border-top-color: $gray-dark!important
|
|
&:hover, &:focus
|
|
.caret
|
|
border-top-color: white!important
|
|
|
|
hr
|
|
border-color: darken($bg-content-color,10%)
|
|
border-bottom: 1px solid white
|
|
|
|
//table
|
|
.table
|
|
@extend .table-striped
|
|
@extend .table-hover
|
|
border-collapse: separate
|
|
border-spacing: 0 2px
|
|
margin-bottom: 5px
|
|
thead th
|
|
background-color: darken($bg-content-color,10%)
|
|
thead > tr > th
|
|
font-weight: normal
|
|
vertical-align: top
|
|
span.title_box
|
|
display: block
|
|
word-wrap: nowrap
|
|
white-space: nowrap
|
|
&.active
|
|
font-weight: bold
|
|
a
|
|
text-decoration: none
|
|
a.active
|
|
color: black
|
|
input, select
|
|
margin: 0
|
|
tbody > tr > td
|
|
border-top: none
|
|
background-color: white
|
|
tbody > tr > td
|
|
padding: 3px 7px 3px 7px
|
|
vertical-align: middle
|
|
word-wrap: nowrap
|
|
font-size: 12px
|
|
@include box-shadow(rgba(black,0.15) 0 1px 0)
|
|
|
|
td.center, th.center
|
|
text-align: center
|
|
tr td:first-child,
|
|
tr th:first-child
|
|
border-top-left-radius: 3px
|
|
border-bottom-left-radius: 3px
|
|
tr td:last-child,
|
|
tr th:last-child
|
|
border-top-right-radius: 3px
|
|
border-bottom-right-radius: 3px
|
|
|
|
//filter table
|
|
tr.filter
|
|
background-color: $bg-content-color
|
|
input[type="text"].filter, input[type="password"].filter, select.filter
|
|
font-size: 12px
|
|
|
|
.breadcrumb
|
|
background-color: lighten($bg-content-color,7%)
|
|
|
|
.badge
|
|
background-color: $secondary-color
|
|
|
|
.badge-success
|
|
@extend .badge
|
|
background-color: $brand-success
|
|
|
|
.badge-error
|
|
@extend .badge
|
|
background-color: $brand-danger
|
|
|
|
.icon-big
|
|
font-size: 4em
|
|
color: darken($bg-content-color,20%)
|
|
|
|
#module-list
|
|
h3
|
|
position: relative
|
|
top: 0
|
|
left: 0
|
|
margin: 0
|
|
padding: 0
|
|
background-color: transparent
|
|
color: $main-color
|
|
font-weight: 500
|
|
|
|
#footer
|
|
z-index: 600
|
|
min-height: 60px
|
|
display: block
|
|
width: 100%
|
|
padding: 15px 0 0 0
|
|
background-color: $bg-footer-color
|
|
color: #888
|
|
a
|
|
color: #ccc
|
|
a.link-social
|
|
&:hover
|
|
text-decoration: none
|
|
i
|
|
font-size: 2em
|
|
width: 30px
|
|
height: 30px
|
|
display: inline-block
|
|
line-height: 30px
|
|
text-align: center
|
|
@include border-radius(30px)
|
|
.link-twitter i
|
|
color: white
|
|
background-color: #7CCEEF
|
|
.link-facebook i
|
|
color: white
|
|
background-color: #557DBB
|
|
.link-github i
|
|
color: black
|
|
background-color: white
|
|
.link-google i
|
|
color: white
|
|
background-color: #E6644E
|
|
#go-top
|
|
position: fixed
|
|
bottom: 10px
|
|
height: 30px
|
|
width: 30px
|
|
text-align: center
|
|
line-height: 30px
|
|
right: 10px
|
|
z-index: 9003
|
|
display: block
|
|
padding: 0px 6px 0px 6px
|
|
margin: -2px 0px 0px
|
|
text-decoration: none
|
|
color: #fff
|
|
cursor: pointer
|
|
font-size: 16px
|
|
background-color: rgba(0,0,0,0.5)
|
|
&:hover
|
|
background-color: black
|
|
|
|
#nobootstrap
|
|
float: left
|
|
|
|
|
|
//WIP
|
|
|
|
//some helpers to get fixed width
|
|
.fixed-width-XS
|
|
width: 40px
|
|
.fixed-width-S
|
|
width: 80px
|
|
.fixed-width-M
|
|
width: 120px
|
|
.fixed-width-L
|
|
width: 160px
|
|
.fixed-width-XL
|
|
width: 200px
|
|
|
|
|
|
// temp fix for latest bootstrap
|
|
input[type="text"],input[type="search"],input[type="password"], textarea, select
|
|
@extend .form-control
|
|
fieldset > .row
|
|
@extend .form-group
|
|
|
|
|
|
.box-stats
|
|
padding: 10px
|
|
margin-bottom: 20px
|
|
background-color: white
|
|
@include box-shadow(rgba(black,0.10) 0 2px 0, white 0 0 0 3px inset)
|
|
.boxchart-overlay
|
|
padding: 10px
|
|
margin-right: 10px
|
|
float: left
|
|
color: white
|
|
@include border-radius(3px)
|
|
i
|
|
@include border-radius(3px)
|
|
float: left
|
|
color: white
|
|
font-size: 30px
|
|
height: 50px
|
|
width: 50px
|
|
text-align: center
|
|
line-height: 50px
|
|
margin-right: 10px
|
|
.title
|
|
color: #999
|
|
display: block
|
|
.value
|
|
font-size: 25px
|
|
.color1
|
|
i, .boxchart-overlay
|
|
background-color: #2BA8E3
|
|
@include box-shadow(rgba(black,0.15) 0 -3px 0 inset)
|
|
.value
|
|
color: #2BA8E3
|
|
.color2
|
|
i, .boxchart-overlay
|
|
background-color: #FF5450
|
|
@include box-shadow(rgba(black,0.15) 0 -3px 0 inset)
|
|
.value
|
|
color: #FF5450
|
|
.color3
|
|
i, .boxchart-overlay
|
|
background-color: #9E5BA1
|
|
@include box-shadow(rgba(black,0.15) 0 -3px 0 inset)
|
|
.value
|
|
color: #9E5BA1
|
|
.color4
|
|
i, .boxchart-overlay
|
|
background-color: #95CC6B
|
|
@include box-shadow(rgba(black,0.15) 0 -3px 0 inset)
|
|
.value
|
|
color: #95CC6B
|
|
|
|
.data_chart
|
|
rect
|
|
fill: white
|
|
path
|
|
stroke: white
|
|
stroke-width: 2
|
|
fill: none
|
|
line
|
|
stroke: black
|
|
.area
|
|
fill: rgba(white,0.30)
|
|
stroke-width: 0
|
|
|
|
.highlighted
|
|
background-color: blue
|
|
|
|
//.list-toolbar-btn
|
|
#topbar
|
|
position: fixed
|
|
left: 80
|
|
width: 100%
|
|
height: 25px
|
|
z-index: 600
|
|
background-color: $main-color
|
|
border-top: black solid 1px
|
|
border-bottom: black solid 1px
|
|
a
|
|
line-height: 25px
|
|
color: white
|
|
i
|
|
height: 25px
|
|
width: 25px
|
|
line-height: 25px
|
|
color: white
|
|
font-size: 20px
|
|
.menu-collapse
|
|
display: none
|
|
.menu
|
|
padding: 0 0 0 60px
|
|
display: inline
|
|
li
|
|
display: inline
|
|
.submenu
|
|
display: none
|
|
|
|
|
|
.hook_panel
|
|
@extend .well
|
|
@include box-shadow(rgba(white,0.9) 0 0 0 1px inset)
|
|
padding: 10px 10px 5px 10px
|
|
margin-bottom: 3px!important
|
|
.module_name
|
|
font-size: 1.2em
|
|
.module_description
|
|
@extend .text-muted
|
|
.hook_panel_header
|
|
margin: 0 -10px 0 -10px
|
|
padding: 0 10px 10px 10px
|
|
.hook_name
|
|
font-weight: 400
|
|
font-size: 1.2em
|
|
@include border-radius(3px)
|
|
color: $brand-primary
|
|
border: solid 1px #ccc
|
|
background-color: white
|
|
padding: 0 4px
|
|
.hook_title
|
|
text-transform: uppercase
|
|
font-size: 1em
|
|
.hook_description
|
|
@extend .text-muted
|
|
padding: 3px 0 0 3px
|
|
.module_list
|
|
.module_list_item
|
|
display: table
|
|
width: 100%
|
|
padding: 5px 0
|
|
margin-bottom: 4px
|
|
background-color: white
|
|
@include box-shadow(rgba(0,0,0,0.3) 0 0 3px,rgba(black,0.10) 0 -2px 0 inset)
|
|
@include border-radius(3px)
|
|
.module_col_select
|
|
display: table-cell
|
|
width: 22px
|
|
min-height: 35px
|
|
vertical-align: middle
|
|
text-align: center
|
|
border-right: 1px solid #ddd
|
|
.module_col_position
|
|
display: table-cell
|
|
width: 60px
|
|
vertical-align: middle
|
|
text-align: right
|
|
.positions
|
|
font-family: $headings-font-family
|
|
font-weight: 200
|
|
@include text-shadow(white 1px 1px)
|
|
padding: 0 5px
|
|
font-size: 1.6em
|
|
color: #aaa
|
|
@include border-radius(3px)
|
|
@include box-shadow(rgba(0,0,0,0.2) 0 1px 3px inset)
|
|
border: solid 1px #ccc
|
|
background-color: #eee
|
|
.module_col_icon
|
|
display: table-cell
|
|
width: 50px
|
|
text-align: center
|
|
vertical-align: middle
|
|
|
|
.module_col_infos
|
|
display: table-cell
|
|
height: 50px
|
|
vertical-align: middle
|
|
|
|
.module_col_actions
|
|
display: table-cell
|
|
width: 160px
|
|
padding: 0 10px
|
|
vertical-align: middle
|
|
text-align: right
|
|
.btn-group
|
|
text-align: left
|
|
|
|
.panel-heading-action
|
|
@extend .pull-right
|
|
margin-right: -5px
|
|
a.list-tooolbar-btn
|
|
float: left
|
|
height: 30px
|
|
width: 30px
|
|
color: $brand-primary
|
|
border-left: solid 1px white
|
|
&:hover
|
|
text-decoration: none
|
|
color: white
|
|
background-color: $brand-primary
|
|
i
|
|
text-align: center
|
|
font-size: 1.2em
|
|
line-height: 30px
|
|
|
|
|
|
//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)
|
|
|
|
|
|
|
|
|
|
$treeBackgroundHover: lighten(blue,30%)
|
|
$treeBackgroundSelect: blue
|
|
|
|
|
|
.tree
|
|
border: 1px solid #BBBBBB
|
|
border-radius: 4px 4px 4px 4px
|
|
overflow-y: auto
|
|
overflow-x: hidden
|
|
padding: 10px 15px 0 15px
|
|
position: relative
|
|
.tree-folder
|
|
width: 100%
|
|
min-height: 20px
|
|
cursor: pointer
|
|
margin-top: 1px
|
|
.tree-folder-header
|
|
position: relative
|
|
height: 20px
|
|
-webkit-border-radius: 6px
|
|
-moz-border-radius: 6px
|
|
border-radius: 6px
|
|
&:hover
|
|
background-color: $treeBackgroundHover
|
|
|
|
i
|
|
position: absolute
|
|
float: left
|
|
top: 1px
|
|
left: 5px
|
|
.tree-folder-name
|
|
padding-left: 29px
|
|
white-space: nowrap
|
|
overflow: hidden
|
|
text-overflow: ellipsis
|
|
|
|
.tree-folder-content
|
|
margin-left: 23px
|
|
|
|
.tree-item
|
|
position: relative
|
|
width: 100%
|
|
height: 20px
|
|
cursor: pointer
|
|
margin-top: 1px
|
|
-webkit-border-radius: 6px
|
|
-moz-border-radius: 6px
|
|
border-radius: 6px
|
|
|
|
&:hover
|
|
background-color: $treeBackgroundHover
|
|
|
|
.tree-item-name
|
|
position: absolute
|
|
left: 29px
|
|
.tree-dot
|
|
position: absolute
|
|
top: 8px
|
|
left: 10px
|
|
display: block
|
|
width: 4px
|
|
height: 4px
|
|
background-color: #ccc
|
|
-webkit-border-radius: 6px
|
|
-moz-border-radius: 6px
|
|
border-radius: 6px
|
|
|
|
.icon-ok
|
|
position: absolute
|
|
top: 1px
|
|
left: 5px
|
|
.tree-selected
|
|
background-color: $treeBackgroundSelect
|
|
&:hover
|
|
background-color: $treeBackgroundSelect
|
|
|
|
|
|
|
|
|
|
#carrier_wizard.swMain
|
|
position: relative
|
|
display: block
|
|
.stepContainer
|
|
position: relative
|
|
display: block
|
|
overflow: hidden
|
|
clear: both
|
|
div.content
|
|
position: absolute
|
|
display: block
|
|
width: 100%
|
|
clear: both
|
|
.StepTitle
|
|
display: block
|
|
position: relative
|
|
clear: both
|
|
|
|
ul.anchor
|
|
position: relative
|
|
display: block
|
|
float: left
|
|
list-style: none
|
|
padding: 0
|
|
margin: 0 0 10px 0
|
|
clear: both
|
|
width: 100%
|
|
&.nbr_steps_4
|
|
li
|
|
width: 25%
|
|
float: left
|
|
&.nbr_steps_5
|
|
li
|
|
width: 25%
|
|
float: left
|
|
li
|
|
position: relative
|
|
display: block
|
|
overflow: hidden
|
|
a
|
|
color: #ccc
|
|
height: 32px
|
|
display: block
|
|
position: relative
|
|
margin: 0 16px 0 0
|
|
text-decoration: none
|
|
outline-style: none
|
|
.stepNumber
|
|
position: relative
|
|
float: left
|
|
width: 24px
|
|
height: 32px
|
|
margin-right: 3px
|
|
text-align: center
|
|
padding: 0 5px
|
|
font-size: 30px
|
|
line-height: 32px
|
|
color: white
|
|
.stepDesc
|
|
position: relative
|
|
text-align: left
|
|
font-size: 13px
|
|
height: 32px
|
|
display: table-cell
|
|
vertical-align: middle
|
|
line-height: 13px
|
|
.chevron
|
|
border: 16px solid transparent
|
|
border-left: 14px solid white
|
|
border-right: 0
|
|
position: absolute
|
|
//background-color: #ccc
|
|
right: -16px
|
|
top: 0
|
|
&:after
|
|
border: 16px solid transparent
|
|
border-left: 14px solid #ccc
|
|
border-right: 0
|
|
position: absolute
|
|
content: ""
|
|
right: 2px
|
|
top: -16px
|
|
a.disabled
|
|
color: #777
|
|
background-color: #ccc
|
|
.chevron:after
|
|
border-left: 14px solid #ccc
|
|
a.selected
|
|
color: #F8F8F8
|
|
cursor: text
|
|
background-color: $main-color
|
|
.chevron:after
|
|
border-left: 14px solid $main-color
|
|
a.done
|
|
color: white
|
|
background-color: $brand-success
|
|
.chevron:after
|
|
border-left: 14px solid $brand-success
|
|
.loader
|
|
display: none
|
|
.buttonNext
|
|
@extend .btn
|
|
@extend .btn-default
|
|
.buttonDisabled
|
|
@extend .btn
|
|
@extend .btn-disabled
|
|
.buttonPrevious
|
|
@extend .btn
|
|
@extend .btn-default
|
|
.buttonFinish
|
|
@extend .btn
|
|
@extend .btn-primary
|
|
.msgBox
|
|
position: relative
|
|
display: none
|
|
float: left
|
|
margin: 4px 0 0 5px
|
|
padding: 5px
|
|
border: 1px solid #FFD700
|
|
background-color: #FFFFDD
|
|
color: #5A5655
|
|
+border-radius(5px)
|
|
.msgBox .content
|
|
padding: 0px
|
|
float: left
|
|
#carrier_logo_block
|
|
right: 10px
|
|
.wizard_error
|
|
@extend .alert
|
|
@extend .alert-danger
|
|
.range_inf td, .range_sup td
|
|
background-color: #ccc
|
|
|
|
.range_type
|
|
width: 220px
|
|
text-align: right
|
|
font-weight: bold
|
|
.range_data
|
|
width: 110px
|
|
.range_sign
|
|
width: 18px
|
|
font-size: 20px
|
|
text-align: center
|
|
.range_data_new
|
|
width: 110px
|
|
table#zones_table
|
|
width: auto
|
|
.field_error
|
|
border-color: $brand-danger
|
|
|
|
|
|
|