Commit a182bde67f3884a2e5b37128aba9cf4cca2f5fa4

Authored by Eric Fernandez
Exists in master

Merge branch 'master' into 'master'

foca-botonera-lateral y cambio de estilos

See merge request !25
... ... @@ -34,8 +34,9 @@
34 34 <script src="./node_modules/foca-abm-precios-condiciones/dist/foca-abm-precios-condiciones.min.js"></script>
35 35 <script src="./node_modules/foca-abm-sectores/dist/foca-abm-sectores.min.js"></script>
36 36 <script src="./node_modules/foca-admin-seguimiento/dist/foca-admin-seguimiento.min.js"></script>
37   - <script src="./node_modules/foca-botonera-principal/dist/foca-botonera-principal.min.js"></script>
38 37 <script src="./node_modules/foca-botonera-facturador/dist/foca-botonera-facturador.min.js"></script>
  38 + <script src="./node_modules/foca-botonera-lateral/dist/foca-botonera-lateral.min.js"></script>
  39 + <script src="./node_modules/foca-botonera-principal/dist/foca-botonera-principal.min.js"></script>
39 40 <script src="./node_modules/foca-busqueda-cliente/dist/foca-busqueda-cliente.min.js"></script>
40 41 <script src="./node_modules/foca-cabecera-facturador/dist/foca-cabecera-facturador.min.js"></script>
41 42 <script src="./node_modules/foca-configuracion/dist/foca-configuracion.min.js"></script>
... ... @@ -86,19 +87,14 @@
86 87 <foca-nombre-empresa></foca-nombre-empresa>
87 88 <div ng-view class="container contenedor"></div>
88 89 <div ng-controller="appWrapperDemoController" class="teclado-container container d-none d-md-block ">
89   - <div
90   - class="btn-group-toggle"
91   - data-toggle="buttons"
92   - ng-click="cambioUsoTeclado()">
93   - <label
94   - class="btn btn-secondary active boton-activar-teclado"
95   - ng-class="{'teclado-activar': usarTeclado}">
96   - <input
97   - type="checkbox"
98   - autocomplete="off"
99   - >
100   - Teclado
101   - </label>
  90 + <div class="container">
  91 + <div class="row">
  92 + <div class="col-auto my-2 col-lg-2 offset-lg-10 d-none d-md-flex" style="min-height: 176px">
  93 + <div class="px-2 mt-auto">
  94 + <foca-botonera-lateral></foca-botonera-lateral>
  95 + </div>
  96 + </div>
  97 + </div>
102 98 </div>
103 99 <foca-teclado
104 100 ng-show="usarTeclado && mostrarTeclado"
... ... @@ -35,6 +35,7 @@
35 35 "foca-abm-vehiculo": "git+ssh://git@debonline.dyndns.org:npm/foca-abm-vehiculo.git",
36 36 "foca-admin-seguimiento": "git+ssh://git@debonline.dyndns.org:npm/foca-admin-seguimiento.git",
37 37 "foca-botonera-principal": "git+ssh://git@debonline.dyndns.org:npm/foca-botonera-principal.git",
  38 + "foca-botonera-lateral": "git+ssh://git@debonline.dyndns.org:npm/foca-botonera-lateral.git",
38 39 "foca-botonera-facturador": "git+ssh://git@debonline.dyndns.org:npm/foca-botonera-facturador.git",
39 40 "foca-busqueda-cliente": "git+ssh://git@debonline.dyndns.org:npm/foca-busqueda-cliente.git",
40 41 "foca-cabecera-facturador": "git+ssh://git@debonline.dyndns.org:npm/foca-cabecera-facturador.git",
... ... @@ -17,8 +17,9 @@ angular.module(&#39;appWrapperDemo&#39;, [
17 17 'focaAbmVehiculo',
18 18 'focaAbmChofer',
19 19 'focaAdminSeguimiento',
20   - 'focaBotoneraPrincipal',
21 20 'focaBotoneraFacturador',
  21 + 'focaBotoneraLateral',
  22 + 'focaBotoneraPrincipal',
22 23 'focaBusquedaCliente',
23 24 'focaBusquedaProductos',
24 25 'focaCabeceraFacturador',
src/sass/_botonera-lateral.scss
1 1 .botonera-lateral {
2   - >.row {
3   - height: 420px;
4   - }
5 2  
6 3 @media (min-width: 768px){
7 4 display: grid !important;
8 5 }
  6 +
  7 + button{
  8 + pointer-events: all;
  9 + background-color: #DDD;
  10 + }
  11 +
  12 + .teclado-activar {
  13 + background-color: #17d236 !important;
  14 + color: #FFF !important;
  15 + }
  16 +
  17 + button, .btn-group-toggle{
  18 + background-color: #DDD;
  19 + color: #000;
  20 + text-transform: uppercase;
  21 + min-width: 109px;
  22 + &:hover{
  23 + color: #FFF;
  24 + .boton-activar-teclado{
  25 + color: #FFF;
  26 + }
  27 + background-color: #000;
  28 + }
  29 + }
  30 +
  31 +
  32 + .btn-group-toggle{
  33 + pointer-events: all;
  34 + &.active{
  35 + background-color: $primary-color;
  36 + .boton-activar-teclado{
  37 + color: #FFF;
  38 + }
  39 + }
  40 +
  41 + .boton-activar-teclado{
  42 + cursor: pointer;
  43 + color: #000;
  44 + background-color: transparent;
  45 + }
  46 +
  47 + input{
  48 + display: none;
  49 + }
  50 + }
  51 +}
  52 +.teclado-container > div{
  53 + pointer-events: none;
  54 + position: absolute;
  55 + z-index: 100000;
  56 + left: 0;
  57 + right: 0;
  58 + top: 449px;
  59 + .row{
  60 + margin: 0 !important;
  61 + pointer-events: none;
  62 + }
  63 +
9 64 }
src/sass/_botonera-secundaria.scss
... ... @@ -33,4 +33,22 @@
33 33 font-weight: 700;
34 34 }
35 35 }
  36 + @media(min-width: 1200px){
  37 + .btn{
  38 + min-height: 85px;
  39 + }
  40 + }
  41 +
  42 + @media(min-width: 992px) and (max-width: 1200px){
  43 + .btn{
  44 + min-height: 73px;
  45 + }
  46 + }
  47 +
  48 + @media(min-width: 768px) and (max-width: 992px){
  49 + .btn{
  50 + min-height: 62px;
  51 + }
  52 + }
  53 +
36 54 }
src/sass/_contenedor.scss
... ... @@ -2,18 +2,13 @@ body {
2 2 @media (min-width: 768px) {
3 3 background-color: #cccccc;
4 4 }
5   - @media (max-width: 768px) {
6   - background-image: radial-gradient(circle at 50% 50%, #ebecf1, #abaec3);
7   - }
8 5 }
9 6  
10 7 .contenedor {
11 8 @media (min-width: 768px) {
12   - background-image: radial-gradient(circle at 50% 50%, #ebecf1, #abaec3);
13 9 min-height: 600px;
14 10 min-width: 800px;
15 11 }
16   -
17 12 }
18 13  
19 14 .grilla-articulo {
src/sass/_swiper.scss
1 1 .swiper {
2 2 &-container {
3   - height: 400px;
  3 + height: 300px;
4 4 }
5 5 &-slide {
6 6 background: transparent;
src/sass/_teclado.scss
... ... @@ -65,19 +65,3 @@
65 65 height: 50px;
66 66 }
67 67 }
68   -.teclado-container > div{
69   - position: relative;
70   -}
71   -.teclado-activar {
72   - background-color: #17d236;
73   -}
74   -.boton-activar-teclado {
75   - top: -450px;
76   - position: absolute;
77   - z-index: 100000;
78   - right: 1.6rem;
79   -
80   - @media(min-width: 1200px){
81   - right: 2.5rem !important;
82   - }
83   -}
src/sass/general.scss
  1 +$primary-color: #e09125;
1 2 @import 'admin-seguimiento';
2 3 @import 'bootstrap';
3 4 @import 'botonera';