- Agregué módulo botonera principal.

- Agregué estilos para la botonera principal. - Quité la botonera horizontal.

- Agregué módulo botonera principal.
- Agregué estilos para la botonera principal. - Quité la botonera horizontal.
Pablo Marco del Pont
1 parent 2e5fcdbfc6
Showing 10 changed files with 109 additions and 3 deletions Show diff stats
img/botonera.png
index.html
package.json
src/js/app.js
src/sass/_botonera-principal.scss
src/sass/_botonera-secundaria.scss
src/sass/_contenedor.scss
src/sass/_panel-informativo.scss
src/sass/_tabla.scss
src/sass/general.scss
@@ -18,7 +18,7 @@
         <script src="./node_modules/ui-bootstrap4/dist/ui-bootstrap-tpls.js"></script>
  
         <script src="./node_modules/foca-directivas/dist/foca-directivas.min.js"></script>
-        <script src="./node_modules/foca-botonera-horizontal/dist/botonera-horizontal.min.js"></script>
+        <script src="./node_modules/foca-botonera-principal/dist/foca-botonera-principal.min.js"></script>
         <script src="./node_modules/foca-turno-apertura/dist/foca-turno-apertura.min.js"></script>
         <script src="./node_modules/foca-abm-plazo-pago/dist/foca-abm-plazo-pago.min.js"></script>
         <script src="./node_modules/foca-abm-precios-condiciones/dist/foca-abm-precios-condiciones.min.js"></script>
@@ -27,7 +27,7 @@
         "foca-abm-plazo-pago": "git+https://debo.suite.repo/modulos-npm/foca-abm-plazo-pago.git",
         "foca-abm-precios-condiciones": "git+https://debo.suite.repo/modulos-npm/foca-abm-precios-condiciones.git",
         "foca-abm-sectores": "git+https://debo.suite.repo/modulos-npm/foca-abm-sectores",
-        "foca-botonera-horizontal": "git+https://debo.suite.repo/modulos-npm/foca-botonera-horizontal.git",
+        "foca-botonera-principal": "git+https://debo.suite.repo/modulos-npm/foca-botonera-principal.git",
         "foca-busqueda-cliente": "git+https://debo.suite.repo/modulos-npm/foca-busqueda-cliente.git",
         "foca-crear-nota-pedido": "git+https://debo.suite.repo/modulos-npm/foca-crear-nota-pedido.git",
         "foca-directivas": "git+https://debo.suite.repo/modulos-npm/foca-directivas.git",
@@ -5,7 +5,7 @@ angular.module(&#39;appWrapperDemo&#39;, [
     'focaAbmPlazoPago',
     'focaAbmPreciosCondiciones',
     'focaAbmSectores',
-    'focaBotoneraHorizontal',
+    'focaBotoneraPrincipal',
     'focaBusquedaCliente',
     'focaBusquedaProductos',
     'focaCrearNotaPedido',
@@ -0,0 +1,68 @@
+.botonera-principal {
+    margin: 0;
+    padding-left: 30px;
+    padding-top: 30px;
+    & menuitem {
+        display: inline-block;
+        height: 130px;
+        text-align: center;
+        width: 180px;
+    }
+    & button {
+        background-image: url('../img/botonera.png');
+        border-radius: 12px;
+        border-width: 0;
+        height: 90px;
+        position: relative;
+        width: 90px;
+    }
+    & span {
+        left: 0;
+        position: absolute;
+        text-align: center;
+        top: 90px;
+        width: 100%;
+        font-size: 12px;
+        color: #777777;
+    }
+    &-abrir-turno {
+        & button {
+            background-position: 0 0;
+            &:hover {
+                background-position: 0 -90px;
+            }
+        }
+    }
+    &-cerrar-turno {
+        & button {
+            background-position: -90px 0;
+            &:hover {
+                background-position: -90px -90px;
+            }
+        }
+    }
+    &-caja {
+        & button {
+            background-position: -180px 0;
+            &:hover {
+                background-position: -180px -90px;
+            }
+        }
+    }
+    &-facturador {
+        & button {
+            background-position: -270px 0px;
+            &:hover {
+                background-position: -270px -90px;
+            }
+        }
+    }
+    &-nota-pedido {
+        & button {
+            background-position: -270px 0px;
+            &:hover {
+                background-position: -270px -90px;
+            }
+        }
+    }
+}
 .botonera-secundaria {
     background-color: rgba(0, 0, 0, 0.8);
+    .btn-xs {
+        padding: .15rem .5rem;
+        font-size: .8rem;
+        line-height: 1.5;
+        border-radius: .2rem;
+    }
 }
@@ -7,3 +7,17 @@ body {
     min-height: 600px;
     min-width: 800px;
 }
+
+.grilla-articulos {
+    background-color: rgba(0, 0, 0, 0.8);
+    height: 430px;
+}
+
+.crear-nota-pedido {
+    form {
+        margin-bottom: 0;
+    }
+    table {
+        margin-bottom: 0;
+    }
+}
@@ -3,4 +3,17 @@
     .form-group {
         margin-bottom: 5px;
     }
+    .form-control-xs {
+        height: calc(1.6rem);
+        padding: .25rem .5rem;
+        font-size: .8rem;
+        line-height: 1.3;
+        border-radius: .2rem;
+    }
+    .label {
+        font-size: .8em;
+    }
+    .valor {
+        font-size: .8em;
+    }
 }
@@ -2,4 +2,8 @@
     &-nonfluid {
         width: auto;
     }
+    &-celda-total {
+        color: #000000;
+        background-color: #FF9900;
+    }
 }
 @import 'bootstrap';
 @import 'botonera';
+@import 'botonera-principal';
 @import 'botonera-secundaria';
 @import 'contenedor';
 @import 'lista';
...	...	@@ -18,7 +18,7 @@
18	18	<script src="./node_modules/ui-bootstrap4/dist/ui-bootstrap-tpls.js"></script>
19	19
20	20	<script src="./node_modules/foca-directivas/dist/foca-directivas.min.js"></script>
21		- <script src="./node_modules/foca-botonera-horizontal/dist/botonera-horizontal.min.js"></script>
	21	+ <script src="./node_modules/foca-botonera-principal/dist/foca-botonera-principal.min.js"></script>
22	22	<script src="./node_modules/foca-turno-apertura/dist/foca-turno-apertura.min.js"></script>
23	23	<script src="./node_modules/foca-abm-plazo-pago/dist/foca-abm-plazo-pago.min.js"></script>
24	24	<script src="./node_modules/foca-abm-precios-condiciones/dist/foca-abm-precios-condiciones.min.js"></script>
...	...	@@ -27,7 +27,7 @@
27	27	"foca-abm-plazo-pago": "git+https://debo.suite.repo/modulos-npm/foca-abm-plazo-pago.git",
28	28	"foca-abm-precios-condiciones": "git+https://debo.suite.repo/modulos-npm/foca-abm-precios-condiciones.git",
29	29	"foca-abm-sectores": "git+https://debo.suite.repo/modulos-npm/foca-abm-sectores",
30		- "foca-botonera-horizontal": "git+https://debo.suite.repo/modulos-npm/foca-botonera-horizontal.git",
	30	+ "foca-botonera-principal": "git+https://debo.suite.repo/modulos-npm/foca-botonera-principal.git",
31	31	"foca-busqueda-cliente": "git+https://debo.suite.repo/modulos-npm/foca-busqueda-cliente.git",
32	32	"foca-crear-nota-pedido": "git+https://debo.suite.repo/modulos-npm/foca-crear-nota-pedido.git",
33	33	"foca-directivas": "git+https://debo.suite.repo/modulos-npm/foca-directivas.git",
...	...	@@ -5,7 +5,7 @@ angular.module('appWrapperDemo', [
5	5	'focaAbmPlazoPago',
6	6	'focaAbmPreciosCondiciones',
7	7	'focaAbmSectores',
8		- 'focaBotoneraHorizontal',
	8	+ 'focaBotoneraPrincipal',
9	9	'focaBusquedaCliente',
10	10	'focaBusquedaProductos',
11	11	'focaCrearNotaPedido',
...	...	@@ -0,0 +1,68 @@
	1	+.botonera-principal {
	2	+ margin: 0;
	3	+ padding-left: 30px;
	4	+ padding-top: 30px;
	5	+ & menuitem {
	6	+ display: inline-block;
	7	+ height: 130px;
	8	+ text-align: center;
	9	+ width: 180px;
	10	+ }
	11	+ & button {
	12	+ background-image: url('../img/botonera.png');
	13	+ border-radius: 12px;
	14	+ border-width: 0;
	15	+ height: 90px;
	16	+ position: relative;
	17	+ width: 90px;
	18	+ }
	19	+ & span {
	20	+ left: 0;
	21	+ position: absolute;
	22	+ text-align: center;
	23	+ top: 90px;
	24	+ width: 100%;
	25	+ font-size: 12px;
	26	+ color: #777777;
	27	+ }
	28	+ &-abrir-turno {
	29	+ & button {
	30	+ background-position: 0 0;
	31	+ &:hover {
	32	+ background-position: 0 -90px;
	33	+ }
	34	+ }
	35	+ }
	36	+ &-cerrar-turno {
	37	+ & button {
	38	+ background-position: -90px 0;
	39	+ &:hover {
	40	+ background-position: -90px -90px;
	41	+ }
	42	+ }
	43	+ }
	44	+ &-caja {
	45	+ & button {
	46	+ background-position: -180px 0;
	47	+ &:hover {
	48	+ background-position: -180px -90px;
	49	+ }
	50	+ }
	51	+ }
	52	+ &-facturador {
	53	+ & button {
	54	+ background-position: -270px 0px;
	55	+ &:hover {
	56	+ background-position: -270px -90px;
	57	+ }
	58	+ }
	59	+ }
	60	+ &-nota-pedido {
	61	+ & button {
	62	+ background-position: -270px 0px;
	63	+ &:hover {
	64	+ background-position: -270px -90px;
	65	+ }
	66	+ }
	67	+ }
	68	+}
1	1	.botonera-secundaria {
2	2	background-color: rgba(0, 0, 0, 0.8);
	3	+ .btn-xs {
	4	+ padding: .15rem .5rem;
	5	+ font-size: .8rem;
	6	+ line-height: 1.5;
	7	+ border-radius: .2rem;
	8	+ }
3	9	}
...	...	@@ -7,3 +7,17 @@ body {
7	7	min-height: 600px;
8	8	min-width: 800px;
9	9	}
	10	+
	11	+.grilla-articulos {
	12	+ background-color: rgba(0, 0, 0, 0.8);
	13	+ height: 430px;
	14	+}
	15	+
	16	+.crear-nota-pedido {
	17	+ form {
	18	+ margin-bottom: 0;
	19	+ }
	20	+ table {
	21	+ margin-bottom: 0;
	22	+ }
	23	+}
...	...	@@ -3,4 +3,17 @@
3	3	.form-group {
4	4	margin-bottom: 5px;
5	5	}
	6	+ .form-control-xs {
	7	+ height: calc(1.6rem);
	8	+ padding: .25rem .5rem;
	9	+ font-size: .8rem;
	10	+ line-height: 1.3;
	11	+ border-radius: .2rem;
	12	+ }
	13	+ .label {
	14	+ font-size: .8em;
	15	+ }
	16	+ .valor {
	17	+ font-size: .8em;
	18	+ }
6	19	}
...	...	@@ -2,4 +2,8 @@
2	2	&-nonfluid {
3	3	width: auto;
4	4	}
	5	+ &-celda-total {
	6	+ color: #000000;
	7	+ background-color: #FF9900;
	8	+ }
5	9	}
1	1	@import 'bootstrap';
2	2	@import 'botonera';
	3	+@import 'botonera-principal';
3	4	@import 'botonera-secundaria';
4	5	@import 'contenedor';
5	6	@import 'lista';