Luigi / wrapper-demo

Download as
Browse Code »

Commit 712f17eb001190fc356fe17a510557d7323122f4

Authored by Nicolás Guarnieri
2 parents 258b595b14 24c5be2776
Exists in master

Merge branch 'master' into 'master' 

Master

See merge request !15
Showing 3 changed files   Show diff stats
img/seguimientoHojaRuta.png
Diff comments   View file @ 712f17e

11.8 KB
img/seguimientoNotaPedido.png
Diff comments   View file @ 712f17e

12 KB
src/sass/_botonera-principal.scss
Diff comments   View file @ 712f17e
1 .botonera-principal { 1 .botonera-principal {
2 menuitem { 2 menuitem {
3 display: inline-block; 3 display: inline-block;
4 height: 130px; 4 height: 130px;
5 text-align: center; 5 text-align: center;
6 width: 180px; 6 width: 180px;
7 @media (max-width: 576px) { 7 @media (max-width: 576px) {
8 width: 100%; 8 width: 100%;
9 } 9 }
10 } 10 }
11 button { 11 button {
12 background-image: url('../img/botonera.png'); 12 background-image: url('../img/botonera.png');
13 border-radius: 12px; 13 border-radius: 12px;
14 border-width: 0; 14 border-width: 0;
15 height: 90px; 15 height: 90px;
16 position: relative; 16 position: relative;
17 width: 90px; 17 width: 90px;
18 span { 18 span {
19 left: 0; 19 left: 0;
20 position: absolute; 20 position: absolute;
21 text-align: center; 21 text-align: center;
22 top: 90px; 22 top: 90px;
23 width: 100%; 23 width: 100%;
24 font-size: 12px; 24 font-size: 12px;
25 color: #777777; 25 color: #777777;
26 } 26 }
27 } 27 }
28 &-menu { 28 &-menu {
29 padding-left: 90px; 29 padding-left: 90px;
30 @media (max-width: 576px) { 30 @media (max-width: 576px) {
31 padding: 0; 31 padding: 0;
32 } 32 }
33 } 33 }
34 &-logo { 34 &-logo {
35 width: 80%; 35 width: 80%;
36 opacity: .8; 36 opacity: .8;
37 @media (max-width: 576px) { 37 @media (max-width: 576px) {
38 width: 100%; 38 width: 100%;
39 } 39 }
40 } 40 }
41 &-vacio { 41 &-vacio {
42 & button { 42 & button {
43 background-position: -4380px 0; 43 background-position: -4380px 0;
44 &:hover { 44 &:hover {
45 background-position: -4380px -90px; 45 background-position: -4380px -90px;
46 } 46 }
47 } 47 }
48 } 48 }
49 &-abrir-turno { 49 &-abrir-turno {
50 & button { 50 & button {
51 background-position: 0 0; 51 background-position: 0 0;
52 &:hover { 52 &:hover {
53 background-position: 0 -90px; 53 background-position: 0 -90px;
54 } 54 }
55 } 55 }
56 } 56 }
57 &-cerrar-turno { 57 &-cerrar-turno {
58 & button { 58 & button {
59 background-position: -90px 0; 59 background-position: -90px 0;
60 &:hover { 60 &:hover {
61 background-position: -90px -90px; 61 background-position: -90px -90px;
62 } 62 }
63 } 63 }
64 } 64 }
65 &-caja { 65 &-caja {
66 & button { 66 & button {
67 background-position: -180px 0; 67 background-position: -180px 0;
68 &:hover { 68 &:hover {
69 background-position: -180px -90px; 69 background-position: -180px -90px;
70 } 70 }
71 } 71 }
72 } 72 }
73 &-facturador { 73 &-facturador {
74 & button { 74 & button {
75 background-position: -270px 0px; 75 background-position: -270px 0px;
76 &:hover { 76 &:hover {
77 background-position: -270px -90px; 77 background-position: -270px -90px;
78 } 78 }
79 } 79 }
80 } 80 }
81 &-nota-pedido { 81 &-nota-pedido {
82 & button { 82 & button {
83 background-position: -1250px 0px; 83 background-position: -1250px 0px;
84 &:hover { 84 &:hover {
85 background-position: -1250px -90px; 85 background-position: -1250px -90px;
86 } 86 }
87 } 87 }
88 } 88 }
89 &-remito { 89 &-remito {
90 & button { 90 & button {
91 background-position: -4560px 0px; 91 background-position: -4560px 0px;
92 &:hover { 92 &:hover {
93 background-position: -4560px -90px; 93 background-position: -4560px -90px;
94 } 94 }
95 } 95 }
96 } 96 }
97 &-hoja-ruta { 97 &-hoja-ruta {
98 & button { 98 & button {
99 background-position: -4650px 0px; 99 background-position: -4650px 0px;
100 &:hover { 100 &:hover {
101 background-position: -4650px -90px; 101 background-position: -4650px -90px;
102 } 102 }
103 } 103 }
104 } 104 }
105 &-hoja-ruta-transportista {
106 & button {
107 background-image: url('../img/hojaRutaVolante.png');
108 background-size: 90px 90px;
109 &:hover {
110 background-color: rgb(250,250,250);
111 }
112 }
113 }
105 &-seguimiento { 114 &-seguimiento {
106 & button { 115 & button {
107 background-position: -4470px 0px; 116 background-image: url('../img/seguimientoNotaPedido.png');
117 background-size: 90px 90px;
118 background-position: 15px 10px;
108 &:hover { 119 &:hover {
109 background-position: -4470px -90px; 120 background-color: rgb(250,250,250);
110 } 121 }
111 } 122 }
112 } 123 }
113 &-seguimiento-hoja-ruta { 124 &-seguimiento-hoja-ruta {
114 & button { 125 & button {
115 background-image: url('../img/hojaRutaVolante.png'); 126 background-image: url('../img/seguimientoHojaRuta.png');
116 background-size: 90px 90px; 127 background-size: 90px 90px;
128 background-position: 15px 10px;
129 &:hover {
130 background-color: rgb(250,250,250);
131 }
117 } 132 }
118 } 133 }
119 &-cobranzas { 134 &-cobranzas {
120 & button { 135 & button {
121 background-position: -1880 0px; 136 background-position: -1880 0px;
122 &:hover { 137 &:hover {
123 background-position: -1880 -90px; 138 background-position: -1880 -90px;
124 } 139 }
125 } 140 }
126 } 141 }
127 &-seguimiento-cobranzas { 142 &-seguimiento-cobranzas {
128 & button { 143 & button {
129 background-image: url('../img/seguimientoCobranza.png'); 144 background-image: url('../img/seguimientoCobranza.png');
130 background-size: 90px 90px; 145 background-size: 90px 90px;
146 background-position: 15px 10px;
147 &:hover {
148 background-color: rgb(250,250,250);
149 }
131 } 150 }
132 } 151 }
133 &-vehiculo { 152 &-vehiculo {
134 & button { 153 & button {
135 background-position: -4560px 0px; 154 background-position: -4560px 0px;
136 &:hover { 155 &:hover {
137 background-position: -4560px -90px; 156 background-position: -4560px -90px;
138 } 157 }
139 } 158 }
140 } 159 }
141 &-precio-condicion { 160 &-precio-condicion {
142 & button { 161 & button {
143 background-position: -4560px 0px; 162 background-position: -4560px 0px;
144 &:hover { 163 &:hover {
145 background-position: -4560px -90px; 164 background-position: -4560px -90px;
146 } 165 }
147 } 166 }
148 } 167 }
149 .swiper-pagination { 168 .swiper-pagination {
150 bottom: 0px !important; 169 bottom: 0px !important;
151 } 170 }
152 171
153 .swiper-button-next { 172 .swiper-button-next {
154 background-image: url('../img/derecha.png'); 173 background-image: url('../img/derecha.png');
155 } 174 }
156 175
157 .swiper-button-prev { 176 .swiper-button-prev {
158 background-image: url('../img/izquierda.png'); 177 background-image: url('../img/izquierda.png');
159 } 178 }
160 } 179 }
161 180