Commit 19939d4e6ed4473938c0deafc9814f9ac8dda903
Exists in
master
Merge branch 'master' into 'master'
arreglos estilo para mobile See merge request Wrappers/wrapper-demo!26
Showing
5 changed files
Show diff stats
index.html
1 | <html ng-app="appWrapperDemo"> | 1 | <html ng-app="appWrapperDemo"> |
2 | <head> | 2 | <head> |
3 | <meta charset="UTF-8"/> | 3 | <meta charset="UTF-8"/> |
4 | <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> | 4 | <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> |
5 | <base href="./"> | 5 | <base href="./"> |
6 | 6 | ||
7 | <!--CSS--> | 7 | <!--CSS--> |
8 | <link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/> | 8 | <link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/> |
9 | <link href="./node_modules/font-awesome/css/font-awesome.min.css" rel="stylesheet"/> | 9 | <link href="./node_modules/font-awesome/css/font-awesome.min.css" rel="stylesheet"/> |
10 | <link rel="stylesheet" href="node_modules/angular-ui-swiper/dist/angular-ui-swiper.css"> | 10 | <link rel="stylesheet" href="node_modules/angular-ui-swiper/dist/angular-ui-swiper.css"> |
11 | <link href="./node_modules/ladda/dist/ladda-themeless.min.css" rel="stylesheet"> | 11 | <link href="./node_modules/ladda/dist/ladda-themeless.min.css" rel="stylesheet"> |
12 | <link href="css/general.css" rel="stylesheet"/> | 12 | <link href="css/general.css" rel="stylesheet"/> |
13 | 13 | ||
14 | <!--VENDOR JS--> | 14 | <!--VENDOR JS--> |
15 | <script src="./node_modules/jquery/dist/jquery.min.js"></script> | 15 | <script src="./node_modules/jquery/dist/jquery.min.js"></script> |
16 | <script src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script> | 16 | <script src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script> |
17 | <script src="./node_modules/angular/angular.min.js"></script> | 17 | <script src="./node_modules/angular/angular.min.js"></script> |
18 | <script src="./node_modules/angular-route/angular-route.min.js"></script> | 18 | <script src="./node_modules/angular-route/angular-route.min.js"></script> |
19 | <script src="./node_modules/angular-cookies/angular-cookies.min.js"></script> | 19 | <script src="./node_modules/angular-cookies/angular-cookies.min.js"></script> |
20 | <script src="./node_modules/ui-bootstrap4/dist/ui-bootstrap-tpls.js"></script> | 20 | <script src="./node_modules/ui-bootstrap4/dist/ui-bootstrap-tpls.js"></script> |
21 | <script src="./node_modules/angular-on-screen-keyboard/dist/angular-on-screen-keyboard.min.js"></script> | 21 | <script src="./node_modules/angular-on-screen-keyboard/dist/angular-on-screen-keyboard.min.js"></script> |
22 | <script src="./node_modules/angular-sanitize/angular-sanitize.min.js"></script> | 22 | <script src="./node_modules/angular-sanitize/angular-sanitize.min.js"></script> |
23 | <script src="./node_modules/angular-i18n/angular-locale_es-ar.js"></script> | 23 | <script src="./node_modules/angular-i18n/angular-locale_es-ar.js"></script> |
24 | <script src="./node_modules/angular-ui-swiper/dist/angular-ui-swiper.js"></script> | 24 | <script src="./node_modules/angular-ui-swiper/dist/angular-ui-swiper.js"></script> |
25 | <script src="./node_modules/ladda/dist/spin.min.js"></script> | 25 | <script src="./node_modules/ladda/dist/spin.min.js"></script> |
26 | <script src="./node_modules/ladda/dist/ladda.min.js"></script> | 26 | <script src="./node_modules/ladda/dist/ladda.min.js"></script> |
27 | <script src="./node_modules/angular-ladda/dist/angular-ladda.min.js"></script> | 27 | <script src="./node_modules/angular-ladda/dist/angular-ladda.min.js"></script> |
28 | 28 | ||
29 | <script src="./node_modules/foca-directivas/dist/foca-directivas.min.js"></script> | 29 | <script src="./node_modules/foca-directivas/dist/foca-directivas.min.js"></script> |
30 | <script src="./node_modules/foca-botonera-principal/dist/foca-botonera-principal.min.js"></script> | 30 | <script src="./node_modules/foca-botonera-principal/dist/foca-botonera-principal.min.js"></script> |
31 | <script src="./node_modules/foca-turno-apertura/dist/foca-turno-apertura.min.js"></script> | 31 | <script src="./node_modules/foca-turno-apertura/dist/foca-turno-apertura.min.js"></script> |
32 | <script src="./node_modules/foca-abm-plazo-pago/dist/foca-abm-plazo-pago.min.js"></script> | 32 | <script src="./node_modules/foca-abm-plazo-pago/dist/foca-abm-plazo-pago.min.js"></script> |
33 | <script src="./node_modules/foca-abm-precios-condiciones/dist/foca-abm-precios-condiciones.min.js"></script> | 33 | <script src="./node_modules/foca-abm-precios-condiciones/dist/foca-abm-precios-condiciones.min.js"></script> |
34 | <script src="./node_modules/foca-abm-sectores/dist/foca-abm-sectores.min.js"></script> | 34 | <script src="./node_modules/foca-abm-sectores/dist/foca-abm-sectores.min.js"></script> |
35 | <script src="./node_modules/foca-crear-nota-pedido/dist/foca-crear-nota-pedido.min.js"></script> | 35 | <script src="./node_modules/foca-crear-nota-pedido/dist/foca-crear-nota-pedido.min.js"></script> |
36 | <script src="./node_modules/foca-login/dist/foca-login.min.js"></script> | 36 | <script src="./node_modules/foca-login/dist/foca-login.min.js"></script> |
37 | <script src="./node_modules/foca-modal/dist/foca-modal.min.js"></script> | 37 | <script src="./node_modules/foca-modal/dist/foca-modal.min.js"></script> |
38 | <script src="./node_modules/foca-modal-busqueda-productos/dist/foca-busqueda-productos.min.js"></script> | 38 | <script src="./node_modules/foca-modal-busqueda-productos/dist/foca-busqueda-productos.min.js"></script> |
39 | <script src="./node_modules/foca-modal-cotizacion/dist/foca-modal-cotizacion.min.js"></script> | 39 | <script src="./node_modules/foca-modal-cotizacion/dist/foca-modal-cotizacion.min.js"></script> |
40 | <script src="./node_modules/foca-modal-flete/dist/foca-modal-flete.min.js"></script> | 40 | <script src="./node_modules/foca-modal-flete/dist/foca-modal-flete.min.js"></script> |
41 | <script src="./node_modules/foca-modal-moneda/dist/foca-modal-moneda.min.js"></script> | 41 | <script src="./node_modules/foca-modal-moneda/dist/foca-modal-moneda.min.js"></script> |
42 | <script src="./node_modules/foca-modal-precio-condiciones/dist/foca-modal-precio-condiciones.min.js"></script> | 42 | <script src="./node_modules/foca-modal-precio-condiciones/dist/foca-modal-precio-condiciones.min.js"></script> |
43 | <script src="./node_modules/foca-modal-proveedor/dist/foca-modal-proveedor.min.js"></script> | 43 | <script src="./node_modules/foca-modal-proveedor/dist/foca-modal-proveedor.min.js"></script> |
44 | <script src="./node_modules/foca-modal-vendedores/dist/foca-modal-vendedores.min.js"></script> | 44 | <script src="./node_modules/foca-modal-vendedores/dist/foca-modal-vendedores.min.js"></script> |
45 | <script src="./node_modules/foca-busqueda-cliente/dist/foca-busqueda-cliente.min.js"></script> | 45 | <script src="./node_modules/foca-busqueda-cliente/dist/foca-busqueda-cliente.min.js"></script> |
46 | <script src="./node_modules/foca-teclado/dist/foca-teclado.min.js"></script> | 46 | <script src="./node_modules/foca-teclado/dist/foca-teclado.min.js"></script> |
47 | <script src="./node_modules/foca-modal-domicilio/dist/foca-modal-domicilios.min.js"></script> | 47 | <script src="./node_modules/foca-modal-domicilio/dist/foca-modal-domicilios.min.js"></script> |
48 | 48 | ||
49 | <!-- BUILD --> | 49 | <!-- BUILD --> |
50 | <script src="./src/js/app.js"></script> | 50 | <script src="./src/js/app.js"></script> |
51 | <script src="./src/js/controller.js"></script> | 51 | <script src="./src/js/controller.js"></script> |
52 | <script src="./src/etc/develop.js"></script> | 52 | <script src="./src/etc/develop.js"></script> |
53 | <!-- /BUILD --> | 53 | <!-- /BUILD --> |
54 | 54 | ||
55 | </head> | 55 | </head> |
56 | <body> | 56 | <body> |
57 | <style> | 57 | <style> |
58 | </style> | 58 | </style> |
59 | <botonera-horizontal></botonera-horizontal> | 59 | <botonera-horizontal></botonera-horizontal> |
60 | <div ng-view class="container contenedor"></div> | 60 | <div ng-view class="container contenedor"></div> |
61 | <div ng-controller="appWrapperDemoController" class="container"> | 61 | <div ng-controller="appWrapperDemoController" class="container d-none d-sm-block"> |
62 | <div | 62 | <div |
63 | class="btn-group-toggle" | 63 | class="btn-group-toggle" |
64 | data-toggle="buttons" | 64 | data-toggle="buttons" |
65 | ng-click="mostrarTeclado = !mostrarTeclado"> | 65 | ng-click="mostrarTeclado = !mostrarTeclado"> |
66 | <label | 66 | <label |
67 | class="btn btn-secondary active boton-activar-teclado" | 67 | class="btn btn-secondary active boton-activar-teclado" |
68 | ng-class="{'teclado-activar': mostrarTeclado}"> | 68 | ng-class="{'teclado-activar': mostrarTeclado}"> |
69 | <input | 69 | <input |
70 | type="checkbox" | 70 | type="checkbox" |
71 | autocomplete="off" | 71 | autocomplete="off" |
72 | > | 72 | > |
73 | <i class="fa fa-keyboard-o fa-3x" aria-hidden="true"></i> | 73 | <i class="fa fa-keyboard-o fa-3x" aria-hidden="true"></i> |
74 | </label> | 74 | </label> |
75 | </div> | 75 | </div> |
76 | <foca-teclado | 76 | <foca-teclado |
77 | ng-show="mostrarTeclado && hasFocus" | 77 | ng-show="mostrarTeclado && hasFocus" |
78 | alfanumeric="true" | 78 | alfanumeric="true" |
79 | numeric="true" | 79 | numeric="true" |
80 | > | 80 | > |
81 | </foca-teclado> | 81 | </foca-teclado> |
82 | </div> | 82 | </div> |
83 | </body> | 83 | </body> |
84 | </html> | 84 | </html> |
85 | 85 |
src/sass/_acciones-mobile.scss
File was created | 1 | .acciones-mobile { | |
2 | line-height: 2.5em; | ||
3 | color: orange; | ||
4 | font-size: 1.25em | ||
5 | } |
src/sass/_bootstrap.scss
1 | .active{ | 1 | .active{ |
2 | color: #fff; | 2 | color: #fff; |
3 | text-decoration: none; | 3 | text-decoration: none; |
4 | outline: 0; | 4 | outline: 0; |
5 | background-color: #337ab7; | 5 | background-color: #337ab7; |
6 | } | 6 | } |
7 | .btn-xs { | 7 | .btn-xs { |
8 | padding: .15rem .5rem; | 8 | padding: .15rem .5rem; |
9 | font-size: .8rem; | 9 | font-size: .8rem; |
10 | line-height: 1.5; | 10 | line-height: 1.5; |
11 | border-radius: .2rem; | 11 | border-radius: .2rem; |
12 | } | ||
13 | .no-border-bottom { | ||
14 | border-bottom: 0 !important; | ||
15 | } | ||
16 | .no-border-top { | ||
17 | border-top: 0 !important; | ||
18 | } | ||
19 | .no-border { | ||
20 | border: 0 !important; | ||
21 | } | ||
22 | .margin-bottom-mobile { | ||
23 | margin-bottom: 2.5em !important; | ||
24 | } | ||
25 | .tamaño-boton { | ||
26 | width:44px; | ||
12 | } | 27 | } |
src/sass/_contenedor.scss
1 | body { | 1 | body { |
2 | background-color: #cccccc; | 2 | background-color: #cccccc; |
3 | } | 3 | } |
4 | 4 | ||
5 | .contenedor { | 5 | .contenedor { |
6 | background-image: radial-gradient(circle at 50% 50%, #ebecf1, #abaec3); | 6 | background-image: radial-gradient(circle at 50% 50%, #ebecf1, #abaec3); |
7 | min-height: 600px; | 7 | @media (min-width: 768px) { |
8 | min-width: 800px; | 8 | min-height: 600px; |
9 | min-width: 800px; | ||
10 | } | ||
11 | |||
9 | } | 12 | } |
10 | 13 | ||
11 | .grilla-articulo { | 14 | .grilla-articulo { |
12 | background-color: rgba(0, 0, 0, 0.8); | 15 | background-color: rgba(0, 0, 0, 0.8); |
13 | height: 430px; | 16 | @media (min-width: 768px) { |
17 | height: 430px; | ||
18 | } | ||
14 | } | 19 | } |
15 | 20 |
src/sass/general.scss
1 | @import 'bootstrap'; | 1 | @import 'bootstrap'; |
2 | @import 'botonera'; | 2 | @import 'botonera'; |
3 | @import 'botonera-lateral'; | 3 | @import 'botonera-lateral'; |
4 | @import 'botonera-principal'; | 4 | @import 'botonera-principal'; |
5 | @import 'botonera-secundaria'; | 5 | @import 'botonera-secundaria'; |
6 | @import 'contenedor'; | 6 | @import 'contenedor'; |
7 | @import 'lista'; | 7 | @import 'lista'; |
8 | @import 'login'; | 8 | @import 'login'; |
9 | @import 'panel-informativo'; | 9 | @import 'panel-informativo'; |
10 | @import 'tabla'; | 10 | @import 'tabla'; |
11 | @import 'teclado'; | 11 | @import 'teclado'; |
12 | @import 'tabla-articulos'; | 12 | @import 'tabla-articulos'; |
13 | @import 'acciones-mobile'; | ||
13 | @import 'swiper'; | 14 | @import 'swiper'; |
14 | @import 'crear-nota-pedido'; | 15 | @import 'crear-nota-pedido'; |
15 | 16 |