Opendistrib/backend/web/sass/screen.scss

/** 
Copyright distrib (2018) 

contact@opendistrib.net

Ce logiciel est un programme informatique servant à aider les producteurs 
à distribuer leur production en circuits courts. 

Ce logiciel est régi par la licence CeCILL soumise au droit français et
respectant les principes de diffusion des logiciels libres. Vous pouvez
utiliser, modifier et/ou redistribuer ce programme sous les conditions
de la licence CeCILL telle que diffusée par le CEA, le CNRS et l'INRIA 
sur le site "http://www.cecill.info".

En contrepartie de l'accessibilité au code source et des droits de copie,
de modification et de redistribution accordés par cette licence, il n'est
offert aux utilisateurs qu'une garantie limitée.  Pour les mêmes raisons,
seule une responsabilité restreinte pèse sur l'auteur du programme,  le
titulaire des droits patrimoniaux et les concédants successifs.

A cet égard  l'attention de l'utilisateur est attirée sur les risques
associés au chargement,  à l'utilisation,  à la modification et/ou au
développement et à la reproduction du logiciel par l'utilisateur étant 
donné sa spécificité de logiciel libre, qui peut le rendre complexe à 
manipuler et qui le réserve donc à des développeurs et des professionnels
avertis possédant  des  connaissances  informatiques approfondies.  Les
utilisateurs sont donc invités à charger  et  tester  l'adéquation  du
logiciel à leurs besoins dans des conditions permettant d'assurer la
sécurité de leurs systèmes et ou de leurs données et, plus généralement, 
à l'utiliser et l'exploiter dans les mêmes conditions de sécurité. 

Le fait que vous puissiez accéder à cet en-tête signifie que vous avez 
pris connaissance de la licence CeCILL, et que vous en avez accepté les
termes.
*/

@import "compass" ;

$dir-fonts: '../fonts/' ;
@import "_fonts.scss" ;

$color1: #FF7F00 ;
$color2: white ;

.clr {
	clear: both ;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'myriadpro-light' ;
}

a {
    color: $color1; 
    
    &:hover, &:focus, &:active {
        color: darken($color1, 10) ;
    }
}

#block-demo {
    padding: 10px 0px ;
    background-color: $color2 ;
    color: $color1;
    text-align: left ;
    margin-bottom: 20px ;
    border: solid 1px lighten($color1,10) ;
    @include border-radius(5px) ;
    
    a {
        text-decoration: underline ;
    }
}

#env-dev {
    font-family: 'comfortaabold' ;
    text-align: center  ;
    font-size: 18px ;
    padding: 5px 10px ;
    color: white ;
    position: fixed ;
    top: 9px ;
    left: 66px ;
    z-index: 1031 ;
}

.wrap {
    .btn-primary {
        background: none ;
        background-color: $color1 ;
        border: solid 1px $color1 ;

        &:hover, &:focus, &:active {
            background-color: darken($color1, 10) ;
            border: solid 1px darken($color1, 10) ;
        }
    }
}

.nav-header {
    .retour-site {
        border-left : solid 1px $color2 ;
        padding: 10px 15px ;
    }
}

.navbar-brand {
    .logo {
        height: 40px ;
        position: relative ;
        top: -10px ;
    }
}

.container-body {
    padding-top: 117px ;
    padding-bottom: 50px ;
}

.navbar-inverse {
    background: none; 
    background-color: $color1 ;
    border-bottom: 0px none ;
    
    .navbar-nav {
        padding-top: 12px ;
    }
    
    .navbar-nav > li > a {
        color: white ;
        margin-left: 3px; 
        padding: 3px 11px ;
            
        &:hover {
            color: $color2 ;
            //background-color: $color2 ;
        }
    }
    
    .navbar-nav > li.active,
    .navbar-nav > .open {
        a {
            background: none ;
            @include box-shadow(none) ;
            @include text-shadow(none) ;
            margin-left: 3px ;
            background-color: $color2 ;
            color: $color1 ;
            padding: 3px 11px ;
            @include border-radius(5px) ;
            
            &:hover,
            &:focus {
                background-color: $color2 ;
                color: $color1 ;    
            }
        }
    }
    
    .navbar-nav > .open {
        a.dropdown-toggle {
            @include border-radius(5px 5px 0px 0px) ;
        }
        
        ul.dropdown-menu {
            @include box-shadow(0px 0px 5px gray) ;
            @include border-radius(5px 0px 5px 5px) ;
            border-top: 0px none ;
            right: -1px ;
            li {
                a {
                    background-color: transparent ;
                    
                    &:hover { 
                        color: darken($color1,10) ;
                    }
                }
            }            
        }
    }
    
    
    .navbar-nav > .open > a, 
    .navbar-nav > .open > a:hover, 
    .navbar-nav > .open > a:focus {
        
    }
}

#alerts-fixed {
    position: fixed ;
    bottom: 20px ;
    left: 20px ;
    
    .alert {
        margin-top: 20px ;
    }
}

.name-producer {
    //font-family: 'Georgia' ;
    margin-bottom: 15px ;
    text-align: left ;
    position: fixed ;
    top: 51px ;
    left: 0px ;
    width: 100% ;
    background-color: #515151 ;
    background-color: $color2 ;
    color: darken($color1,15) ;
    z-index: 100 ;
    font-size: 20px ;
    padding: 8px 15px ;
    padding-bottom: 2px ;
    padding-top: 5px ;
    border-bottom: solid 1px #e0e0e0 ;
    @include box-shadow(0px 0px 5px gray) ;
    
    #select-producer {
        float: left ;
        font-size: 15px ;
    }

    .label {
        font-size: 11px ;
        margin-left: 10px ;
        position: relative ;
        bottom: 3px ;
        a {
            color: white ;
            &:hover {
                text-decoration: none ; 
            }
        }
    }
}


.table {
    thead {
        th.actions {
            width: 220px ;
        }
        th.order {
            width: 58px ;
        }
        th.actif {
            width: 75px ;
            text-align: center;
        }
    }
    tbody {
        td.center {
            text-align: center ;
        }
    }
}

.footer {
    .pull-left {
        a {
            margin-right: 5px ;
            margin-left: 5px ;
            color: gray ;
        }
    } 
    
    #code-source {
        img {
            height: 20px ;
        }
    }
}

a.btn, button.btn {
    position: relative ;

    .glyphicon-triangle-bottom {
        display: none;
        position: absolute;
        top: 26px;
        left: 50%;
        margin-left: -10px;
        font-size: 20px;
        color: #FF7F00;
    }

    &.btn-primary {
        .glyphicon-triangle-bottom {
            display: block ;
        }
    }
}

.app-vuejs {
    #loading {
        position: fixed ; 
        top: 50% ;
        left: 50% ;
        width: 100px ;
        height: 100px ;
        @include border-radius(50px) ;
        background-color: white ;
        z-index: 10 ;
        @include box-shadow(0px 0px 5px #d0d0d0) ;

        img {
            position: relative ;
            top: 35px ;
            left: 35px ;
            width: 30px ;
            height: 30px ;
        }
    }
}

#nav-params {
    margin-bottom: 30px ;

    button {
        margin-right: 10px  ;
    }
}

.panel {
    .panel-heading {
        .panel-title {
            .btn {
                float: right ;
            }
        }
    }
}

/* modals */

.modal-mask {
    position: fixed;
    z-index: 9998;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .5);
    display: table;
    transition: opacity .3s ease;
}

.modal-wrapper {
    display: table-cell;
    vertical-align: middle;
}

.modal-container {
    width: 70%;
    margin: 0px auto;
    padding: 20px 30px;
    background-color: #fff;
    border-radius: 2px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .33);
    transition: all .3s ease;
    font-family: Helvetica, Arial, sans-serif;
}

.modal-header {
    padding-bottom: 0px ;
    h3 {
        margin-top: 0;
        color: #333;
        text-transform: uppercase ;
        margin-bottom: 0px ;
    }
}

.modal-body {
    margin: 20px 0;
    max-height: 300px ;
    height: 300px ;
    overflow-y: scroll ;
}

.modal-default-button {
    float: right;
}

/*
* The following styles are auto-applied to elements with
* transition="modal" when their visibility is toggled
* by Vue.js.
*
* You can easily play with the modal transition by editing
* these styles.
*/

.modal-enter {
    opacity: 0;
}

.modal-leave-active {
    opacity: 0;
}

.modal-enter .modal-container,
.modal-leave-active .modal-container {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

// liste de commandes
.site-index, .user-commandes {
    #last-orders, #history-orders {

        tr.order-update {
            td {
                background-color: $color2 ;
            }
            .update {
                color: $color1 ;
            }
        }
        
        tr.order-delete {
            td {
                background-color: lighten(#C9302C, 40);
            }
            .delete {
                color: #C9302C ;
            }
        }
        
        td.history {
            min-width: 170px ;
            .small {
                margin-bottom: 7px ;
            }
            
            strong {
            }
        }

        .small, .locality {
            font-size: 12px ;
            color: gray ;
        }
        .comment {
            font-size: 12px ;
        }

        .date {
            text-align: center ;
        }
        
        .comment {
            position: relative ;
            margin-top: 4px ;
            padding-left: 20px ;
            font-style: italic ;
            
            .glyphicon {
                position: absolute ;
                left: 0px ;
            }
        }
    }
}

// tableau de bord
.site-index {
    .panel {
        .panel-title {
            .btn {
                float: right ;
                font-family: 'myriadpro-regular' ;
                
                &.margin-left {
                    margin-left: 5px ;
                }
            }
        }
        .panel-body {
            //height: 250px ;
        }
    }
    
    #billing {
        h2 {
            font-size: 25px ;
            text-align: center ;
        }
        
        .current-month {
            .amount span {
                background-color: white ;
                color: #333 ;
                border: solid 1px gray ;
            }
        }
        
        .amount {
            margin-top: 35px ;
            text-align: center ;
            span {
                font-size: 22px ;
                color: white ;
                background-color: $color1 ;
                padding: 7px 10px 3px;
                font-family: 'myriadpro-regular' ;
                @include border-radius(5px) ;
            }
        }
    }
    
}

#page-order {

        #row2 {
            
        }
    
	h1 {
            .btn-group {
                    float: right ;
            }
	}
        
        #col-left, #col-right {
            padding-left: 0px ;
            padding-right: 0px ;
        }
        #col-right {
            padding-left: 20px ;
        }
	
	#jours-production {
		display: none ;
	}
	
	#calendar {
                h2 {
                    font-size: 20px ;
                    position: relative ;
                    top: 3px ;
                }
            
		.fc-header-title {
			margin-left: 10px ;
		}
		
		$back-day-with-event: lighten(#FDD44B,13) ; 
		//$back-day-with-event: #FDD44B ;
		.dayWithEvent { 
			background-color: $back-day-with-event ; 
			cursor: pointer;
		}
		.fc-event-container {display: none;}
		.fc-today {
			border-bottom: solid 1px #C9302C ;
			background-color: white ;
			
			&.dayWithEvent {
				background-color: $back-day-with-event ;	
			}
		}
		
		.fc-day {
			cursor: pointer ;
			text-align: center ;
			&:hover {
				@include box-shadow(0px 0px 2px black inset) ;
			}
		}
		
		.current-date {
			@include box-shadow(0px 0px 2px black inset) ;
		}
		
		.fc-day-number {
			float: none ;
			padding-top: 2px ;
		}
	}
        
        .btn-active-week {
            display: block ;
            margin-top: 10px ;
        }
        
        #bloc-production {
            
            .label {
                float: right ;
                font-size: 13px ;
            }
            
            #productions-point-vente {
                margin-top: 15px ;
                padding: 10px ;
                border: solid 1px #e0e0e0 ;
                background-color: #F5F5F5 ;
                @include border-radius(5px) ;
                label {
                    display: block ;
                    font-weight: normal ;
                }
                
                .checkbox-list {
                    margin-left: 10px ;
                    margin-top: 10px ;
                }
            }
        }
	
	#produits-production {
            
            .overflow {
                
                table {
                    width: 100%;
                }

                thead, tbody, tr, td, th { display: block; }

                tr:after {
                    content: ' ';
                    display: block;
                    visibility: hidden;
                    clear: both;
                }

                thead th {
                    height: 30px;

                }

                tbody {
                    height: 500px;
                    overflow-y: auto;
                }

                thead {
                }

                thead th {
                    width: 32%;
                    float: left;
                }
                
                tbody td{
                    width: 33%;
                    float: left;
                }
                
                .td-produit {
                    width: 60% ;
                }
                .td-active, .td-max {
                    width: 20% ;
                    text-align: center ;
                }
                
                thead {
                    .td-product {
                        width: 57% ;
                    }
                }
            }
            
            input.quantity-max {
                background-color: white;
                border: 1px solid #e0e0e0;
                text-align: center;
                width: 50px;
            }

            td {
                label {
                    font-weight: normal ;
                }
            }
	}
        
        #btn-export-commandes, 
        #btn-commandes-auto {
            float: right ;
            position: relative; 
            top: -5px ;
            right: -7px ;
            padding: 2px 5px ;
        }
        
        #btn-export-commandes,
        #btn-commandes-auto {
            color: white ;
            margin-left: 10px ;
            padding: 1px 5px ;
        }
        
        #btn-commandes-auto {
            top: -7px ;
            .btn {
                padding: 2px 5px; 
                span {
                    top: 2px ;
                }
            }
        }
        
        #bloc-totaux {
            .table-products {
                .depasse {
                    color: #b32815 ;
                }

                .total strong span {
                    font-weight: normal ;
                    font-size: 13px ;
                }
            }
        }
        
        #commandes-points-vente {
            
            .tab-pane {
                padding-top: 20px ;
            }
            
            .recap-pv {
                
                &.no-commande {
                    .recettes {
                        display: none;
                    }
                }
                
                .recettes {
                    float: right ;
                    color: $color1 ;
                    border: solid 1px $color1 ;
                    padding: 4px 10px ;
                    @include border-radius(10px) ;
                    font-weight: bold ;
                    position: relative ;
                    top: -3px ;
                }
            }
            
            .alert.comment {
                display: none ;
            }
            
            ul.liste-commandes {
                margin-top: 10px ;
                list-style-type: none ;
                height: 100% ;
                max-height: 400px ;
                margin-left: 0 ;
                padding-left: 0 ;
                margin-top: 0px ;
                width: 100% ;
                overflow-y: scroll ;

                &.no-commande {
                    display: none ;
                }
                
                li {
                    padding: 0 ;
                    margin: 0 ;
                    a {
                        text-align: left;
                        @include border-radius(0px) ;
                        display: block ;
                        padding: 7px ;
                        color: #333 ;
                        
                        .montant {
                            float: right ;
                            color: $color1 ;
                            font-weight: bold ;
                            
                            &.paye {
                                color: #5cb85c ;
                                color: #519951 ;
                            }
                        }
                        
                        .glyphicon-comment {
                            color: $color1 ;
                        }
                        
                        &:hover, &:active, &.active {
                            text-decoration: none ;
                            background-color: #FCF8E3 ;
                            outline: none ;
                            border-color: #ccc ;
                            @include transition(all 0.1s) ;
                        }
                    }
                }
            }
            
            .creer-commande,
            .commandes-auto {
                width: 100% ;
                margin-bottom: 10px ;
            }
            
            .bloc-commande {
                padding-top: 20px ;
                margin-top: 20px ;
                display: none ;
            }
            
            .title-user {
                display: none ;
                font-size: 19px ;
                margin-top: 0px ;
                font-family: "Helvetica Neue",Helvetica,Arial,sans-serif ;
                
                .btn-edit, .btn-remove,
                .btn-cancel, .btn-save {
                    float: right ;
                    position: relative ;
                    top: -6px ;
                }
                
                .btn-edit, .btn-cancel {
                    margin-right: 10px ;
                }
                
                .buttons-save-cancel {
                    display: none ;
                }
                
                .choix-user {
                    display: none ;
                    
                    .form-control {
                        width: 200px ;
                        display: inline ;
                    }
                }
            }
            
            table.table-produits {
                .td-order {
                    text-align: center ;
                }
                input.form-control {
                    text-align: center ;
                }
                
                tr.disabled {
                    .td-product {
                        color: gray ;
                    }
                }
            }
         
            .td-produit,
            .th-produit {
                width: 70% ;
            }
            
            .td-commande,
            .th-commande {
                width: 30% ;
                text-align: center ;
            }
            
            .td-produit {
                text-transform: uppercase ;
            }
            
            .td-commande {
                font-weight: bold ;
            }
            
            .td-total {
                font-size: 18px ;
                text-align: center ;
                
                span {
                    padding: 2px 10px ;
                    background-color: $color1 ;
                    color: white ;
                    font-weight: bold ;
                    @include border-radius(8px) ;
                }
            }
            
            .td-paiement {
                .buttons-credit {
                    float: right ;
                }
            }
            
            .panel-commande-auto {
                .field-subscriptionform-id_user,
                .field-subscriptionform-id_producer
                {
                    display: none ;
                }
                
                .days {
                    .form-group {
                        float: left ;
                        margin-right: 10px ;
                    }
                }
            }
            
        }
        
        #old-commandes {
            display: none ;
        }
	
	.form-commandes-point-vente {
	
		margin-top: 20px ;
                
                table {
                    border-bottom: solid 1px #e0e0e0 ;
                }
                
		.title-point-sale {
			background-color: lighten(#fdd44b, 30) ;
			border-left: solid 3px $color1 ;
			font-weight: bold ; 
                        text-align: left ;
                        padding: 10px ;
		}
                
                .title-totals {
                    text-align: center ;
                }
                
                .border-left {
                    border-left: solid 1px #e0e0e0 ;
                }
                
                .border-right {
                    border-right: solid 1px #e0e0e0 ;
                }
	
		input.quantity {
                        width: 30px ;
			background-color: white ;
			border: solid 1px #e0e0e0 ;
			text-align: center ;
		}
		
		.td-product {
			text-align: center ;
		}	
	
		.submit-point-sale {
			float: right ;
		}
		
		.select-user {
			background-color: #F9F9F9 ;
			border: solid 1px #e0e0e0 ;
		}
		
		.date-order {
			font-size: 12px ;
		}
		
		.datepicker, .text {
			background-color: white ;
			border: solid 1px #e0e0e0 ;
			margin-top: 3px ;
			width: 100px ;
		}
		
		
		td.center {
			text-align: center ;
		}
                
		.depasse {
			color: #b32815 ;
		}
	
		.total strong span {
			font-weight: normal ;
			font-size: 13px ;
		}

                td.user {
                    text-align: left ;
                    padding: 3px ;
                    .date-order {
                        color: gray ;
                    }
                }
	
	}
        
        .table-header-rotated {
            border-top: 0px ;
            border-left: 0px ;
            border-right: 0px ;
            width: 100% ;
            width: auto ;
            
            .total strong {
                border-bottom: solid 1px gray ;
            }
        }
        
        .table-header-rotated th.row-header{
            width: auto;
          }

          .table-header-rotated td{
            width: 40px;
            border-top: 1px solid #dddddd;
            border-left: 1px solid #dddddd;
            border-right: 1px solid #dddddd;
            vertical-align: middle;
            text-align: center;
          }

          .table-header-rotated th.rotate-45{
           font-weight: normal ;
            height: 80px;
            width: 40px;
            min-width: 40px;
            max-width: 40px;
            position: relative;
            vertical-align: bottom;
            padding: 0;
            font-size: 14px;
            line-height: 1;
            border: 0px none;
          }

          .table-header-rotated th.rotate-45 > div{
              background-color: #F5F5F5 ;
            position: relative;
            top: 0px;
            left: 40px; /* 80 * tan(45) / 2 = 40 where 80 is the height on the cell and 45 is the transform angle*/
            height: 100%;
            -ms-transform:skew(-45deg,0deg);
            -moz-transform:skew(-45deg,0deg);
            -webkit-transform:skew(-45deg,0deg);
            -o-transform:skew(-45deg,0deg);
            transform:skew(-45deg,0deg);
            overflow: hidden;
            border-left: 1px solid #dddddd;
            border-right: 1px solid #dddddd;
            border-top: 1px solid #dddddd;
          }

          .table-header-rotated th.rotate-45 span {
            -ms-transform:skew(45deg,0deg) rotate(315deg);
            -moz-transform:skew(45deg,0deg) rotate(315deg);
            -webkit-transform:skew(45deg,0deg) rotate(315deg);
            -o-transform:skew(45deg,0deg) rotate(315deg);
            transform:skew(45deg,0deg) rotate(315deg);
            position: absolute;
            bottom: 30px; /* 40 cos(45) = 28 with an additional 2px margin*/
            left: -25px; /*Because it looked good, but there is probably a mathematical link here as well*/
            display: inline-block;
            // width: 100%;
            width: 85px; /* 80 / cos(45) - 40 cos (45) = 85 where 80 is the height of the cell, 40 the width of the cell and 45 the transform angle*/
            text-align: left;
            // white-space: nowrap; /*whether to display in one line or not*/
          }
	
          .table-header-rotated .disabled {
              color: gray ;
          }
	
}

.product-create, .product-update {
    #days-distribution {
        .form-group {
            float: left ;
            margin-right: 15px ;
            
            label {
                font-weight: normal ;
            }
        }
    }
    .field-product-id_producer {
        display: none; 
    }
}

.table-striped > tbody > tr:nth-of-type(2n) {
    background-color: white ;
}


/* communiquer */

.communicate-index {
    #email {
        .btn-point-sale {
            margin-bottom: 8px ;
            margin-right: 5px ;
        }
    }
}

.communicate-instructions {
    
    border: solid 1px #e0e0e0 ;
    padding: 10px ;
    @include border-radius(10px) ;
    margin-bottom: 30px ;
    font-family: 'Arial' ;
    
    .header {
        .logo {
            display: none ;
            float: left ;
            width: 75px ;
            padding-right: 20px ;
            padding-top: 10px ;
            
            img {
                width: 75px ;
            }
         }
    }
    
    h1, h2, h3, h4 {
        text-align: center ;
    }
    
    h1 {
        font-family: 'highvoltageregular' ;
        font-size: 40px ;
        line-height: 40px ;
        margin-top: 0px ;
        margin-bottom: 0px ;
        font-weight: normal ;
    }

    h2 {
        margin-top: 0px ;
        font-family: 'capsuularegular' ;
        font-size: 20px ;
        margin-top: 0px ;
        position: relative ;
        left: 2px ;
        font-weight: normal ;
    }
    
    h3 {
        font-size: 18px ;
        color: $color1 ;
        margin-top: 0px ;
        margin-bottom: 0px ;
        line-height: 20px; 
        font-family: 'capsuularegular' ;
    }
    
    h4 {
        font-size: 16px ;
        margin-top: 8px ;
        font-weight: normal;
        font-family: 'capsuularegular' ;
        
        span {
            border-bottom: dotted 1px black ;
        }
        
    }
}

.communicate-instructions-inset {
    width: auto ;
    margin-top: 20px ;
    .header {
        .logo {
            width: 60px ;
            margin-right: 20px ;
            padding-top: 5px ;
            
            img {
                width: 60px ;
                
            }
         }
        
        h1 {
            margin-bottom: 3px ;
        }
        
    }
    
    h3 {
        margin-top: 15px ;
        margin-bottom: 0px ;
        font-size: 18px ;
    }
    
    h4 {
        
    }
}

.block-instructions-pdf {
    width: 49.9% ;
    float: left;
    border-bottom: dotted 1px gray ;
}

.block-instructions-border {
    border-right: dotted 1px gray ;
    border-bottom: dotted 1px gray ;
}

.communicate-instructions-pdf {
    border: 0px none ;
    //border-bottom: dotted 1px gray ;
    @include border-radius(0px) ;
    margin-bottom: 0px;
    padding: 20px 0px 20px 30px ;
    
    .header {
        .logo {
            float: left ;
            width: 55px ;
            padding-right: 15px ;
            padding-top: 10px ;

            img {
                width: 55px ;
            }
        }
        h1 {
            font-size: 32px ;
        }
        h2 {
           font-size: 16px ; 
        }
    }
    
    h3 {
        font-weight: normal ;
    }
}

.block-instructions-bottom {
    border-bottom: 0px none ;
    border-bottom: solid 1px white;
}


/* abonnements */

.subscription-form {
    
    #block-select-user {
        padding-left: 0px ;
    }
    
    #or-user {
        font-size: 20px ;
        text-align: center ;
        span {
            position: relative ;
            top: 24px ;
        }
    }
    
    .field-subscriptionform-id_producer {
        display: none ;
    }
    .days {
        .form-group {
            float: left; 
            margin-right: 20px ; 
        }
    }
    
    .products {
        .table {
            width: 500px ;
        }
        .quantity {
            text-align: center ;
        }
    }
}

/* points de vente */

.point-sale-form {
    #pointsale-users {
        display: none ;
        height: 500px ;
        overflow-y: scroll ;
        label {
            font-weight: normal ;
            display: block ;
        }
        .comment {
            display: none ;
            margin-left: 17px ;
            width: 200px ;
        }
    }
    
    #delivery-days {
        .form-group {
            float: left ;
            margin-right: 15px ;
            
            label {
                font-weight: normal ;
            }
        }
    }
}

/* utilisateurs */

#menu-users {
    #nav-points-sale {
        margin-bottom: 30px ;
    }
    
    #submenu {
        margin-bottom: 30px ;
        text-align: left ;
    }
    
    a {
        margin-bottom: 15px ;
    }
}

.user-index {
    .input-group  {
        width: 180px ; 
        
        .input-credit {
            text-align: center ;
        }
    }
}

.user-credit {
    .the-credit {
        float: right ;
        font-weight: bold ;
        background-color: $color1 ;
        color: white ;
        @include border-radius(8px) ;
        padding: 3px 10px ;
        padding-top: 7px ; 
        position: relative ;
        top: -12px ;
    }
}

/* facturation */

#free-price {
    padding: 20px ;
    background-color: #F9F9F9 ;

    h2 {
        font-family: 'myriadpro-it' ;
    }
    .amount {
        span {
            font-size: 25px ;
            color: white ;
            background-color: $color1 ;
            @include border-radius(5px) ;
            padding: 3px 10px ;
            padding-top: 7px ;
            font-family: 'myriadpro-regular' ;
        }
    }
    
    label {
        text-transform: uppercase ;
        font-family: "myriadpro-light" ;
        font-size: 20px ;
        
        span {
            font-size: 16px ;
        }
    }
    
    .field-producer-free_price {
        .input-group {
            width: 200px ;
        }
    }
    
    .field-user-free_price {
        label {
            display: none ;
        }
    }
    
    #producer-free_price {
        width: 100px ;
        height: 60px ;
        font-size: 30px ;
        padding: 10px ;
        text-align: center ;
    }
}

.development-index {
    ul#tabs-status-developments {
        margin-bottom: 30px ;
        border-bottom: solid 3px $color1 ;
        
        a {
            text-transform: uppercase ;
        }
        .active {
            border: 0px none ;
            background: none ;
            a {
                background-color: $color1 ;
                color: white ;        
            }
        }
    }
    
    #tab-developments {
        .btn-group-priority {
            width: 100% ;
            margin-bottom: 5px ;

            .btn-priority {
                display: block ;
                float: none ;
                width: 100% ;
            }
        }
        
        .label-priority {
            display: block ;
            width: 100% ;
            margin-bottom: 2px ;
            padding: 5px 8px ;
        }
    }
}

/* stats */

.stats-products {
    
    #nav-year {
        float: right ;
    }
    
    tr.month {
        th {
            text-align: center ;
        }
    }
    tr.sub-head {
        th {
            font-weight: normal ;
            font-size: 12px ;    
        }
    }
    
    td.name {
        text-transform: uppercase ;
    }
    
    td.align-center {
        text-align: center ;
    }
}

@import "_adminlte.scss" ;
@import "_alerts.scss" ;
@import "site/_index.scss" ;
@import "subscription/_index.scss" ;
@import "subscription/_form.scss" ;
@import "product/_index.scss" ;
@import "product/_form.scss" ;
@import "stats/_products.scss" ;
@import "distribution/_index.scss" ; 
@import "user/_emails.scss" ; 
@import "user/_credit.scss" ; 
@import "user/_form.scss" ; 
@import "producer/_update.scss" ; 
@import "point_sale/_index.scss" ; 
@import "report/_index.scss" ;
@import "document/_form.scss" ;
@import "document/_index.scss" ;
@import "_responsive.scss" ;