mejora en tabla de articulos para responsive

Nicolás Guarnieri
1 parent 5287140275
Showing 4 changed files with 18 additions and 37 deletions Show diff stats
gulpfile.js
package.json
src/sass/_panel-informativo.scss
src/sass/_tabla-articulos.scss
@@ -2,7 +2,7 @@ const gulp    = require(&#39;gulp&#39;);
 const sass    = require('gulp-sass');
 const concat  = require('gulp-concat');
 const rename  = require('gulp-rename');
-const uglify  = require('gulp-uglify-es').default;
+const uglify  = require('gulp-uglify');
 const pump    = require('pump');
 const jshint  = require('gulp-jshint');
 const replace = require('gulp-replace');
@@ -66,14 +66,15 @@ gulp.task(&#39;webserver&#39;, function() {
         connect.server(
             {
                 port: 3000,
-                host: '0.0.0.0'
+                host: '0.0.0.0',
+                livereload: true
             }
         )
     ]
 });
  
 gulp.task('watch', function() {
-    gulp.watch([paths.srcJS], ['uglify']);
+    //gulp.watch([paths.srcJS], ['uglify']);
     gulp.watch('src/sass/*.scss', ['sass']);
 })
  
@@ -87,4 +88,4 @@ gulp.task(&#39;livereload&#39;, function() {
     gulp.watch('vistas/**/*.html', ['reload']);
 });
  
-gulp.task('default', ['webserver']);
+gulp.task('default', ['webserver', 'livereload', 'watch']);
@@ -64,7 +64,7 @@
         "gulp-rename": "^1.4.0",
         "gulp-replace": "^1.0.0",
         "gulp-sass": "^4.0.1",
-        "gulp-uglify-es": "^1.0.4",
+        "gulp-uglify": "^1.0.4",
         "gulp-watch": "^5.0.1",
         "jasmine-core": "^3.2.1",
         "jshint": "^2.9.6",
@@ -17,4 +17,16 @@
     .valor {
         font-size: .8em;
     }
+
+    .nota-pedido {
+        @media (max-width: 576px) {
+            text-align: center;
+        }
+    }
+
+    .numero-pedido {
+        @media (min-width: 576px) {
+            text-align: center;
+        }
+    }
 }
 .tabla-articulo {
     max-height: 420px;
-    display: -moz-groupbox;
-    width: 100%;
-    display: block;
  
     tr {
-        width: 100%;
         display: inline-table;
         table-layout: fixed;
     }
@@ -13,35 +9,7 @@
     tbody {
         overflow-y: auto;
         max-height: 280px;
-        width: 100%;
         display: block;
     }
  
-    &-numero {
-        width: 25px;
-    }
- 
-    &-codigo {
-        width: 70px;
-    }
- 
-    &-descripcion {
-        width: 250px;
-    }
- 
-    &-cantidad {
-        width: 100px;
-    }
- 
-    &-precio {
-        width: 130px;
-    }
- 
-    &-subtotal {
-        width: 130px;
-    }
- 
-    &-boton {
-        width: 52px;
-    }
 }
...	...	@@ -2,7 +2,7 @@ const gulp = require('gulp');
2	2	const sass = require('gulp-sass');
3	3	const concat = require('gulp-concat');
4	4	const rename = require('gulp-rename');
5		-const uglify = require('gulp-uglify-es').default;
	5	+const uglify = require('gulp-uglify');
6	6	const pump = require('pump');
7	7	const jshint = require('gulp-jshint');
8	8	const replace = require('gulp-replace');
...	...	@@ -66,14 +66,15 @@ gulp.task('webserver', function() {
66	66	connect.server(
67	67	{
68	68	port: 3000,
69		- host: '0.0.0.0'
	69	+ host: '0.0.0.0',
	70	+ livereload: true
70	71	}
71	72	)
72	73	]
73	74	});
74	75
75	76	gulp.task('watch', function() {
76		- gulp.watch([paths.srcJS], ['uglify']);
	77	+ //gulp.watch([paths.srcJS], ['uglify']);
77	78	gulp.watch('src/sass/*.scss', ['sass']);
78	79	})
79	80
...	...	@@ -87,4 +88,4 @@ gulp.task('livereload', function() {
87	88	gulp.watch('vistas/*/.html', ['reload']);
88	89	});
89	90
90		-gulp.task('default', ['webserver']);
	91	+gulp.task('default', ['webserver', 'livereload', 'watch']);
...	...	@@ -64,7 +64,7 @@
64	64	"gulp-rename": "^1.4.0",
65	65	"gulp-replace": "^1.0.0",
66	66	"gulp-sass": "^4.0.1",
67		- "gulp-uglify-es": "^1.0.4",
	67	+ "gulp-uglify": "^1.0.4",
68	68	"gulp-watch": "^5.0.1",
69	69	"jasmine-core": "^3.2.1",
70	70	"jshint": "^2.9.6",
...	...	@@ -17,4 +17,16 @@
17	17	.valor {
18	18	font-size: .8em;
19	19	}
	20	+
	21	+ .nota-pedido {
	22	+ @media (max-width: 576px) {
	23	+ text-align: center;
	24	+ }
	25	+ }
	26	+
	27	+ .numero-pedido {
	28	+ @media (min-width: 576px) {
	29	+ text-align: center;
	30	+ }
	31	+ }
20	32	}
1	1	.tabla-articulo {
2	2	max-height: 420px;
3		- display: -moz-groupbox;
4		- width: 100%;
5		- display: block;
6	3
7	4	tr {
8		- width: 100%;
9	5	display: inline-table;
10	6	table-layout: fixed;
11	7	}
...	...	@@ -13,35 +9,7 @@
13	9	tbody {
14	10	overflow-y: auto;
15	11	max-height: 280px;
16		- width: 100%;
17	12	display: block;
18	13	}
19	14
20		- &-numero {
21		- width: 25px;
22		- }
23		-
24		- &-codigo {
25		- width: 70px;
26		- }
27		-
28		- &-descripcion {
29		- width: 250px;
30		- }
31		-
32		- &-cantidad {
33		- width: 100px;
34		- }
35		-
36		- &-precio {
37		- width: 130px;
38		- }
39		-
40		- &-subtotal {
41		- width: 130px;
42		- }
43		-
44		- &-boton {
45		- width: 52px;
46		- }
47	15	}