diff --git a/assets/images/hover-contact-2.png b/assets/images/hover-contact-2.png new file mode 100644 index 0000000..8dd5a7d Binary files /dev/null and b/assets/images/hover-contact-2.png differ diff --git a/assets/images/hover-contact.png b/assets/images/hover-contact.png deleted file mode 100644 index b26fcc3..0000000 Binary files a/assets/images/hover-contact.png and /dev/null differ diff --git a/assets/images/hover-galery-2.png b/assets/images/hover-galery-2.png new file mode 100644 index 0000000..9ec3293 Binary files /dev/null and b/assets/images/hover-galery-2.png differ diff --git a/assets/images/hover-galery.png b/assets/images/hover-galery.png deleted file mode 100644 index bdea6d9..0000000 Binary files a/assets/images/hover-galery.png and /dev/null differ diff --git a/assets/images/hover-index-2.png b/assets/images/hover-index-2.png new file mode 100644 index 0000000..06682e2 Binary files /dev/null and b/assets/images/hover-index-2.png differ diff --git a/assets/images/hover-index.png b/assets/images/hover-index.png deleted file mode 100644 index c990293..0000000 Binary files a/assets/images/hover-index.png and /dev/null differ diff --git a/assets/images/hover-shop-2.png b/assets/images/hover-shop-2.png new file mode 100644 index 0000000..1f2f6f0 Binary files /dev/null and b/assets/images/hover-shop-2.png differ diff --git a/assets/images/hover-shop.png b/assets/images/hover-shop.png deleted file mode 100644 index eebb13a..0000000 Binary files a/assets/images/hover-shop.png and /dev/null differ diff --git a/components/Header.vue b/components/Header.vue index 19b94a1..50a2fd0 100644 --- a/components/Header.vue +++ b/components/Header.vue @@ -62,6 +62,12 @@ export default { width: auto; position: relative; margin-top: 1rem; + > .hover_el_active { + top: -100% !important; + left: -40% !important; + width: 170% !important; + height: 300% !important; + } > a { position: relative; padding: 10px; @@ -69,10 +75,6 @@ export default { z-index: 1; } } - h1 .hover_el_active { - left: -40% !important; - width: 170% !important; - } h1:hover .hover_el_active, h1.active .hover_el_active { opacity: 1; @@ -101,10 +103,10 @@ export default { } .hover_el_active { position: absolute; - top: -70%; - left: -15%; - width: 130%; - height: 240%; + top: -75%; + left: -25%; + width: 150%; + height: 250%; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; @@ -113,22 +115,20 @@ export default { transition: opacity 0.3s ease; } #indexActive { - background-image: url('/assets/images/hover-index.png'); + background-image: url('/assets/images/hover-index-2.png'); } #galeryActive { - background-image: url('/assets/images/hover-index.png'); - left: -30%; - width: 160%; + background-image: url('/assets/images/hover-galery-2.png'); } #shopActive { - background-image: url('/assets/images/hover-index.png'); + background-image: url('/assets/images/hover-shop-2.png'); } #contactActive { - background-image: url('/assets/images/hover-index.png'); + background-image: url('/assets/images/hover-contact-2.png'); } } > div { - width: 3rem; + width: 2rem; z-index: 1; img { padding-top: 10px; @@ -149,6 +149,10 @@ export default { flex-direction: row; h1 { margin-top: 0; + > .hover_el_active { + top: -130% !important; + height: 350% !important; + } } ul { margin-top: 0; @@ -157,8 +161,11 @@ export default { } } } - > div > a > img { - padding: 10px; + > div { + width: 3rem; + > a > img { + padding: 10px; + } } } } diff --git a/components/Projects.vue b/components/Projects.vue index aae282f..4c0fc4e 100644 --- a/components/Projects.vue +++ b/components/Projects.vue @@ -25,7 +25,7 @@ @slideChange="onSlideChange" @swiper="onSwiper" > - +