Skip to content

Commit f98743a

Browse files
committed
Se agregaron animaciones al navbar, a imagenes de trabajos y tÃitulos
1 parent 0a70b12 commit f98743a

File tree

1 file changed

+27
-5
lines changed

1 file changed

+27
-5
lines changed

assets/style/style.css

Lines changed: 27 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -192,6 +192,8 @@ article {
192192

193193
.navbar__menu ul a:hover {
194194
border-bottom: 2px #FFFFFF solid;
195+
transform: scale(1.1);
196+
/* transition: all .5s; */
195197
}
196198

197199
.header {
@@ -222,6 +224,10 @@ article {
222224
.header__titulo {
223225
z-index: 2;
224226
width: 40rem;
227+
animation-name: titulo;
228+
animation-duration: 1.5s;
229+
animation-delay: 0.5s;
230+
animation-iteration-count: 1;
225231
}
226232

227233
.header__titulo h1 {
@@ -315,6 +321,9 @@ article {
315321
.section__trabajos__trabajo--home img {
316322
width: 100vw;
317323
}
324+
.section__trabajos__trabajo--home img:hover {
325+
transform:rotate(3deg) scale(.98);
326+
}
318327

319328
.section__trabajos__trabajo__info--home {
320329
padding: 0 2rem;
@@ -483,6 +492,7 @@ article {
483492
.section__trabajos__container__trabajo__imagen {
484493
width: fit-content;
485494
background-color: transparent;
495+
z-index: 1;
486496
}
487497

488498
.section__trabajos__container__trabajo__imagen img {
@@ -496,18 +506,21 @@ article {
496506
background-color: rgba(3, 101, 140, .7);
497507
height: 100%;
498508
width: 100%;
499-
display: none;
509+
display: flex;
510+
justify-content: end;
511+
align-items: end;
512+
opacity: 0;
500513
}
501514

502515
.section__trabajos__container__trabajo__hover__titulo {
503516
color: #FFFFFF;
504517
margin: 0 1rem 1rem 1rem;
505518
}
506519

507-
.section__trabajos__container__trabajo__imagen:hover~.section__trabajos__container__trabajo__hover {
508-
display: flex;
509-
justify-content: end;
510-
align-items: end;
520+
.section__trabajos__container__trabajo:hover .section__trabajos__container__trabajo__hover {
521+
z-index: 2;
522+
opacity: 1;
523+
transition: all 1s;
511524
}
512525

513526
/* NOSOTROS */
@@ -793,4 +806,13 @@ article {
793806
.footer__widget:nth-child(3) {
794807
order: 3;
795808
}
809+
}
810+
811+
/* ANIMACIONES KEYFRAMES */
812+
813+
@keyframes titulo {
814+
0% {opacity: 0; width: 35rem;}
815+
50% {opacity: .5; width: 42rem;}
816+
75% {opacity: .75; width: 38rem;}
817+
100% {opacity: 1; width: 40rem;}
796818
}

0 commit comments

Comments
 (0)