Skip to content

sujata / Akruti-Frontend

Go to a project
Toggle navigation
Toggle navigation pinning
Commit 558f7ebd by Ravindra Kanojiya
Options

updated contact form

1 parent 036aaa0b
Inline Side-by-side
Showing 8 changed files with 76 additions and 32 deletions
components/Brands/InnerDetailsBrands.js
......@@ -46,9 +46,9 @@ const InnerDetailsBrands = ({ subCategories }) => {
<Col xs={6} className="d-flex justify-content-end">
<>
<FilterButton
// onClick={() => setShowFilter(true)}
/>
{/* <FilterButton
onClick={() => setShowFilter(true)}
/> */}
{/* {showFilter && (
<div className="filter-panel">
......
components/Collection/InnerDetailsSubCategory.js
......@@ -43,9 +43,9 @@ const [showFilter, setShowFilter] = useState(false);
<Col xs={6} className="d-flex justify-content-end">
<>
<FilterButton
// onClick={() => setShowFilter(true)}
/>
{/* <FilterButton
onClick={() => setShowFilter(true)}
/> */}
{/* {showFilter && (
<div className="filter-panel">
......
components/Heading.js
......@@ -20,7 +20,7 @@ const Heading = ({
// ✅ IF HTML → render directly
if (isHtml) {
return (
<div className={`headings mb-4 ${className}`}>
<div className={`headings mb-2 ${className}`}>
{subheading && <Wrapper className="subheading">{subheading}</Wrapper>}
<Wrapper
className="heading"
......@@ -45,7 +45,7 @@ const Heading = ({
};
return (
<div className={`headings mb-4 ${className}`}>
<div className={`headings mb-2 ${className}`}>
<Wrapper className="subheading">{subheading}</Wrapper>
<div className="heading-container">
{headingArray.map((item, index) => (
......
container/Home/BlogHome.js
......@@ -78,7 +78,7 @@ const BlogHome = () => {
<div className="blog-content ms-md-3 mt-2 mt-md-0">
<p className="blog-date mb-1">{blog.date}</p>
<h5 className="mb-1">{blog.title}</h5>
<h5 className="">{blog.title}</h5>
<p className="blog_desc">{blog.desc}</p>
<button className="read-more-btn">
Read More
......
container/Home/Catalogues.js
......@@ -74,7 +74,7 @@ const Catalogues = ({cataloguesData}) => {
))}
</Swiper>
</FadeInStagger>
<div className="text-center">
<div className="text-center mt-5">
<Link href="/catalogue" className="btn3">View More <i className="fa-solid fa-arrow-right"></i></Link>
</div>
</Col>
......
container/Home/Collection.js
......@@ -8,6 +8,7 @@ import { Container, Row, Col } from "react-bootstrap";
import FadeInStagger from "@/components/FadeInStagger";
import Heading from "@/components/Heading";
import { cleanImage } from "@/components/services/imageHandling";
import Link from "next/link";
// const CollectionData = [
// { image: "/image/collection/01.png", title: "Kitchen" },
......@@ -23,7 +24,7 @@ const CollectionSlider = ({CollectionData}) => {
<div className="collection-section sec_padd h-slider">
<Container className="custom_container_leftAuto">
{/* Heading + Nav Row */}
<Row className="align-items-center justify-content-md-between mb-4">
<Row className="align-items-center justify-content-md-between">
<Col lg={8} md={8}>
<Heading el="h2" heading={CollectionData?.title} />
......@@ -34,7 +35,7 @@ const CollectionSlider = ({CollectionData}) => {
</div>
</FadeInStagger>
</Col>
<Col lg={4} md={4} className="d-flex justify-content-md-end pe-5 mt-2">
<Col lg={4} md={4} className="d-flex justify-content-end pe-0 pe-md-5 mt-2 mb-3 mb-md-0">
<div className="d-flex gap-2">
<button className="cust-swiper-button-prev">
<svg
......@@ -134,14 +135,14 @@ const CollectionSlider = ({CollectionData}) => {
>
{CollectionData?.item?.map((item, index) => (
<SwiperSlide key={index}>
<div className="collection-card">
<Link href={item?.url || "#"} className="collection-card">
<img
src={cleanImage(item?.image?.url)}
alt={item.title}
alt={item?.title}
className="img-fluid rounded-lg hover-zooms"
/>
<p className="mt-3">{item.title}</p>
</div>
<p className="mt-3">{item?.title}</p>
</Link>
</SwiperSlide>
))}
</Swiper>
......
styles/globals.css
body{
font-size: 0.83vw;
color: #666;
}
/* =====Navigation Button=== */
.swiperbtn1 {
top: 50%;
......@@ -54,7 +59,7 @@
/* Heading animation */
.slide-content h2 {
font-size: 42px;
font-size: 1.67vw;
font-weight: 400;
margin-bottom: 12px;
text-transform: uppercase;
......@@ -92,7 +97,7 @@
}
.text-btn-row p {
font-size: 16px;
font-size: 0.83vw;
line-height: 1.6;
margin: 0;
flex: 1;
......@@ -104,7 +109,7 @@
border: 1px solid #fff;
color: #fff;
padding: 12px 28px;
font-size: 14px;
font-size: 0.73vw;
font-weight: 500;
cursor: pointer;
letter-spacing: 0.5px;
......@@ -152,7 +157,7 @@
color: #fff;
border: none;
padding: 12px 28px;
font-size: 14px;
font-size: 0.73vw;
font-weight: 500;
cursor: pointer;
transition: all 0.3s ease;
......@@ -173,7 +178,7 @@
.btn3 {
border: 1px solid #000;
padding: 12px 28px;
font-size: 14px;
font-size: 0.73vw;
font-weight: 500;
cursor: pointer;
background-color: #fff;
......@@ -187,7 +192,7 @@
.btn4 {
border: 1px solid #000;
padding: 12px 28px;
font-size: 14px;
font-size: 0.73vw;
font-weight: 500;
cursor: pointer;
transition: all 0.3s ease;
......@@ -426,6 +431,7 @@ input:focus-visible {
color: #000;
width: auto;
padding: 0;
margin-bottom: 0.5rem;
}
.collections-item {
margin-bottom: 2rem;
......@@ -440,7 +446,9 @@ input:focus-visible {
object-fit: cover;
}
.collections-item .title {
margin-top: 1rem;
margin-top: 0.5rem;
font-size: 1.04vw;
color: #000;
}
.product-banner {
position: relative;
......@@ -538,13 +546,19 @@ aspect-ratio: 16 / 7;
position: relative;
height: 450px;
}
.collectionSwiper .collection-card p{
font-size: 1.04vw;
line-height: 1.04vw;
text-transform: capitalize;
color: #000;
}
.collectionSwiper .collection-card img {
width: 100%;
height: 460px;
object-fit: cover;
display: block;
transition: height 0.4s ease; /* 👈 add this */
position: absolute;
/* position: absolute; */
}
.h-slider .collectionSwiper .collection-card:hover img {
......@@ -559,13 +573,13 @@ aspect-ratio: 16 / 7;
.blog-date {
color: #333;
background-color: #f5f5f5;
font-size: 14px;
font-size: 0.73vw;
width: fit-content;
padding: 4px 15px;
}
.blog_desc {
color: #666666;
font-size: 15px;
.blog-content h5{
font-size: 1.04vw;
margin: 0.5rem 0 0.5rem 0;
}
.custom-navbar .dropdown-menu {
width: 100%;
......@@ -887,6 +901,15 @@ footer li {
color: #0F0F0F !important;
font-size: 14px;
}
footer a:hover{
font-weight: 700;
color: #000;
}
.custom_container h3{
font-size: 1.25vw;
color: #000;
margin-bottom: 1rem;
}
@media only screen and (max-width: 1023px) {
}
/* ===== Mobile ===== */
......@@ -977,6 +1000,24 @@ footer li {
}
/* ===Media query==== */
@media (max-width: 767px) {
body{
font-size: 12px;
}
footer a, footer li {
font-size: 12px;
}
.text-btn-row p {
font-size: 12px;
}
.blog-date {
font-size: 12px;
}
.btn1,.btn2,.btn3,.btn4{
font-size: 12px;
}
.collectionSwiper .collection-card p {
font-size: 14px;
}
.about-info-section .luxury-items.option02 {
padding: 2rem 0rem 2rem 0rem;
}
......@@ -1107,6 +1148,7 @@ font-size: 12px;
}
.blog-section h5 {
font-size: 16px;
line-height: 24px;
font-weight: 700;
}
.project-section .swiper {
......
styles/style.css
......@@ -56,9 +56,10 @@ a {
}
p {
font-size: calc(16px + (17 - 16) * ((100vw - 320px) / (1920 - 320)));
line-height: 1.6;
/* font-size: calc(16px + (16 - 16) * ((100vw - 320px) / (1920 - 320))); */
line-height: 1.9;
font-family: Roboto-Regular;
/* margin-bottom: 0.5rem; */
}
/* ===== Scrollbar ===== */
......@@ -107,7 +108,7 @@ p {
.gray-text {
color: #666;
font-size: 16px;
/* font-size: 16px; */
text-transform: capitalize;
}
......@@ -355,7 +356,7 @@ footer h6 {
border: none;
padding: 0;
color: #000; /* adjust to theme */
font-size: 14px;
/* font-size: 14px; */
font-weight: 500;
cursor: pointer;
display: inline-flex;
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!