Commit 7f8f75818926972ace67d46e6506396e44a6920c
1 parent
a3805326ef
Exists in
master
foca-botonera-lateral y cambio de estilos
Showing
9 changed files
with
93 additions
and
40 deletions
Show diff stats
index.html
... | ... | @@ -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" |
package.json
... | ... | @@ -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", |
src/js/app.js
... | ... | @@ -17,8 +17,9 @@ angular.module('appWrapperDemo', [ |
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 | + } | |
9 | 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 | + | |
64 | +} | |
10 | 65 | \ No newline at end of file |
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
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 | -} |