Projet

Général

Profil

0001-grenoble-metropole-add-hover-effect-and-increase-cat.patch

Serghei Mihai, 06 juin 2018 18:17

Télécharger (59,5 ko)

Voir les différences: 

Subject: [PATCH] grenoble-metropole: add hover effect and increase categories
 text size (#24317)


 static/grenoble-metropole/_custom.scss        |  37 ++++++++++++++++--
 .../img/administration-hover.png              | Bin 0 -> 1495 bytes
 .../grenoble-metropole/img/dechets-hover.png  | Bin 0 -> 2750 bytes
 .../img/eau_potable-hover.png                 | Bin 0 -> 3933 bytes
 .../img/eaux_usees-hover.png                  | Bin 0 -> 4123 bytes
 .../grenoble-metropole/img/economie-hover.png | Bin 0 -> 4532 bytes
 .../grenoble-metropole/img/logement-hover.png | Bin 0 -> 2851 bytes
 static/grenoble-metropole/img/rh-hover.png    | Bin 0 -> 6658 bytes
 .../img/solidarite-hover.png                  | Bin 0 -> 7804 bytes
 .../img/urbanisme-hover.png                   | Bin 0 -> 4019 bytes
 .../grenoble-metropole/img/voirie-hover.png   | Bin 0 -> 4124 bytes
 11 files changed, 34 insertions(+), 3 deletions(-)
 create mode 100644 static/grenoble-metropole/img/administration-hover.png
 create mode 100644 static/grenoble-metropole/img/dechets-hover.png
 create mode 100644 static/grenoble-metropole/img/eau_potable-hover.png
 create mode 100644 static/grenoble-metropole/img/eaux_usees-hover.png
 create mode 100644 static/grenoble-metropole/img/economie-hover.png
 create mode 100644 static/grenoble-metropole/img/logement-hover.png
 create mode 100644 static/grenoble-metropole/img/rh-hover.png
 create mode 100644 static/grenoble-metropole/img/solidarite-hover.png
 create mode 100644 static/grenoble-metropole/img/urbanisme-hover.png
 create mode 100644 static/grenoble-metropole/img/voirie-hover.png
static/grenoble-metropole/_custom.scss
216 216 
				background-position: 0.5rem center;
217 217 
				background-size: 1.8rem;
218 218 
				padding-left: 3rem;
219 
				&:hover {
220 
					&::before {
221 
						background-image: url("img/#{$category}-hover.png");
222 
						background-repeat: no-repeat;
223 
						background-position: 0.5rem center;
224 
						background-size: 1.8rem;
225 
						padding-left: 3rem;
226 
					}
227 
				}
219 228 
			}
220 229 
		}
221 230 
		> div {
222 231 
			> div {
223 232 
				h2:first-child {
224 233 
					font-family: Roboto !important;
225 
					font-size: 1rem;
234 
					font-size: 1.1rem;
226 235 
					font-weight: normal;
227 236 
					background-color: $primary-color;
228 237 
					box-shadow: 0px 0px 10px #888888;
229 238 
					color: #000;
230 239 
					padding: 1rem;
231 
					&:before {
232 
						display: none;
240 
					box-sizing: border-box;
241 
					@include vendor-prefix(transform, translateZ(0px));
242 
					&::before {
243 
						height: auto;
244 
						width: auto;
245 
						background: #000000;
246 
						bottom: 0;
247 
						content: " ";
248 
						left: 0;
249 
						position: absolute;
250 
						right: 0;
251 
						top: 0;
252 
						@include vendor-prefix(transform, scaleX(0));
253 
						@include vendor-prefix(transform-origin, 0 50%);
254 
						@include vendor-prefix(transition-duration, 0.3s);
255 
						@include vendor-prefix(transition-property, transform);
256 
						@include vendor-prefix(transition-timing-function, ease-out);
257 
						z-index: -1;
233 258 
					}
234 259 
					&:after {
235 260 
						content: '\f105';
236 261 
						font-family: FontAwesome;
237 262 
						float: right;
238 263 
					}
264 
					&:hover {
265 
						color: $primary-color;
266 
						&::before {
267 
							@include vendor-prefix(transform, scaleX(1));
268 
						}
269 
					}
239 270 
				}
240 271 
				ul {
241 272 
					display: none;