From 573fe4807e266faa2b39f55525a996f708dd4885 Mon Sep 17 00:00:00 2001 From: HAM!DREZA Date: Thu, 2 May 2024 11:07:45 +0330 Subject: [PATCH] template / create the components of the honor page --- assets/css/main.css | 57 +-- components/home-page/AboutUs.vue | 2 +- components/home-page/Instagram.vue | 2 +- components/home-page/MediaSlider.vue | 127 ++++--- components/honor-page/OurServices.vue | 488 +++++++++++++++++++++++++ components/honor-page/ShinanHonors.vue | 55 +++ components/honor-page/Slider.vue | 21 ++ nuxt.config.ts | 2 +- package-lock.json | 48 ++- package.json | 3 +- pages/about.vue | 45 +-- pages/honor.vue | 241 +----------- public/images/slider.jpg | Bin 0 -> 2113204 bytes 13 files changed, 734 insertions(+), 357 deletions(-) create mode 100644 components/honor-page/OurServices.vue create mode 100644 components/honor-page/ShinanHonors.vue create mode 100644 components/honor-page/Slider.vue create mode 100644 public/images/slider.jpg diff --git a/assets/css/main.css b/assets/css/main.css index 61104cd..fd2419d 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -5,7 +5,7 @@ font-family: "Iransans"; src: url("/public/fonts/IRANSansWebFaNum.woff2"); } -html{ +html { overflow-x: hidden; } body { @@ -54,20 +54,18 @@ body { margin: 0% auto; padding-bottom: 39%; } -.ourStory{ - background-image: url('/public/images/aboutBg.jpg'); -background-repeat: no-repeat; -background-size: 100% 155%; -background-position-y: -10vw; - -} -@media (max-width: 768px) { - .ourStory{ - background-image: url('/public/images/aboutBg.jpg'); +.ourStory { + background-image: url("/public/images/aboutBg.jpg"); background-repeat: no-repeat; - background-size: 180% 155%; - background-position-x: -35vw; - + background-size: 100% 155%; + background-position-y: -10vw; +} +@media (max-width: 768px) { + .ourStory { + background-image: url("/public/images/aboutBg.jpg"); + background-repeat: no-repeat; + background-size: 180% 155%; + background-position-x: -35vw; } .imgWrap { padding-bottom: 5vw !important; @@ -85,7 +83,7 @@ background-position-y: -10vw; justify-content: center; justify-items: center; margin-top: 5vw !important; - + /* background-repeat: no-repeat; */ } .imgWrap .two { @@ -100,8 +98,8 @@ background-position-y: -10vw; left: 74% !important; background-position: 85% 50%; } - } - .imgWrap > div { +} +.imgWrap > div { position: absolute; top: 0; width: 23%; @@ -176,10 +174,21 @@ background-position-y: -10vw; background-position: -2001.4% 0; } -.contact{ - background-image: url('/public/images/aboutBg.jpg'); - background-image: url('/public/images/aboutBg.jpg'); -background-repeat: no-repeat; -background-size: 100% 185%; -background-position-y: -16vw; -} \ No newline at end of file +.contact { + background-image: url("/public/images/aboutBg.jpg"); + background-image: url("/public/images/aboutBg.jpg"); + background-repeat: no-repeat; + background-size: 100% 185%; + background-position-y: -16vw; +} + +.slide1 { + background-image: url('/public/images/slider.jpg'); + background-repeat: no-repeat; + background-size: cover; + +} +.mediagallery{ + background-image: url('/public/images/gallery2.jpg'); +background-size: cover; +} diff --git a/components/home-page/AboutUs.vue b/components/home-page/AboutUs.vue index b52969a..9cfcd89 100644 --- a/components/home-page/AboutUs.vue +++ b/components/home-page/AboutUs.vue @@ -91,7 +91,7 @@
+ class="leading-[1.458vw] absolute w-full lg:w-[27.76vw] bg-white rounded-[25px] pb-[7vw] lg:pb-[2.8vw] p-2 md:start-[42.5vw] top-[18vw] lg:top-[9.2vw]">

لورم ایپسوم

diff --git a/components/home-page/Instagram.vue b/components/home-page/Instagram.vue index b8013aa..299be40 100644 --- a/components/home-page/Instagram.vue +++ b/components/home-page/Instagram.vue @@ -1,5 +1,5 @@