Responsive updated for all pages

This commit is contained in:
akash 2025-10-17 16:38:37 +05:30
parent 16f59adc17
commit 95c5868295
8 changed files with 184 additions and 99 deletions

View File

@ -28,7 +28,7 @@ export default function Home() {
<>
<Layout headerStyle={1} footerStyle={1} breadcrumbTitle="Caregivers" bannerImage="/assets/images/caregivers/caregivers-banner.webp">
<section className="feature-section pt_90 pb_90">
<div className="shape">
<div className="shape hide-element">
<Image
src="/assets/images/shape/shape-6.png"
alt="Physiotherapy at Rapharehab"
@ -76,7 +76,7 @@ export default function Home() {
</section>
<section className="about-style-three pt_90 pb_90 bg-color-1">
<div className="pattern-layer" style={{ backgroundImage: 'url(/assets/images/shape/shape-35.webp)' }}></div>
<div className="pattern-layer hide-element" style={{ backgroundImage: 'url(/assets/images/shape/shape-35.webp)' }}></div>
<div className="auto-container">
<div className="row clearfix">
{/* <div className="col-lg-6 col-md-12 col-sm-12 image-column">

View File

@ -26,7 +26,7 @@ export default function About() {
/>
</div>
<div className="pattern-3" style={{ backgroundImage: "url(/assets/images/shape/shape-11.webp)" }}></div>
<div className="pattern-4" style={{ backgroundImage: "url(/assets/images/shape/shape-35.webp)" }}></div>
{/* <div className="pattern-4" style={{ backgroundImage: "url(/assets/images/shape/shape-35.webp)" }}></div> */}
</div>
<div className="auto-container">
<div className="row clearfix">

View File

@ -412,8 +412,8 @@ export default function Home() {
<div className="col-lg-6 col-md-12 col-sm-12 image-column order-2 order-lg-1">
<div className="image_block_two pl_30 pb_30">
<div className="image-box raw-image">
<figure className="image image-1-ho raw "><img src="/assets/images/shortcodes/back.webp" alt="Why choose nanocare" /></figure>
<figure className="image image-2"><img src="/assets/images/shortcodes/front.webp" alt="Why choose nanocare" /></figure>
<figure className="image image-1-ho-new raw "><img src="/assets/images/shortcodes/back.webp" alt="Why choose nanocare" /></figure>
<figure className="image image-2-new "><img src="/assets/images/shortcodes/front.webp" alt="Why choose nanocare" /></figure>
{/* <div className="icon-box"><img src="/assets/images/about-us/section3/icon.webp" alt="" /></div> */}
</div>
</div>

View File

@ -18,7 +18,7 @@ export default function About() {
<div className="pattern-layer" style={{ backgroundImage: 'url(/assets/images/shape/shape-35.webp)' }}></div>
<div className="auto-container">
<div className="row clearfix">
<div className="col-lg-6 col-md-12 col-sm-12 image-column mb-3">
<div className="col-lg-6 col-md-12 col-sm-12 image-column mb-5">
<div className="image_block_three">
<div className="image-box">
<div className="image-shape">

View File

@ -174,6 +174,15 @@
}
.image-1-ho-new img{
position: relative;
top: -63px;
left: -17px;
}
.renderd-area img{
position: relative;

View File

@ -353,6 +353,41 @@
}
@media only screen and (max-width: 992px) and (min-width: 200px) {
.team-block-two .inner-box .lower-content h3{
display: block;
font-size: 20px !important;
line-height: 27px;
font-weight: 600;
margin-bottom: 5px;
}
.team-block-one .inner-box .lower-content h3{
display: block;
font-size: 18px !important;
line-height: 27px;
font-weight: 600;
margin-bottom: 5px;
}
.team-block-one .inner-box .lower-content span{
font-size: 14px !important;
}
.team-block-one .inner-box .lower-content .designation{
font-size: 14px !important;
line-height: 20px !important;
}
}

View File

@ -225,7 +225,16 @@
}
@media only screen and (max-width: 599px) {}
@media only screen and (max-width: 768px) and (min-width: 200px) {
.video-section .inner-box .shape{
display: none !important;
}
}
@media only screen and (max-width: 499px) {}

View File

@ -3343,6 +3343,7 @@
background: #bc0000;
}
.theme-btn-2:before,
.theme-btn-2:after {
content: "";
@ -3568,99 +3569,104 @@
}
/* ✅ Table Base Styles */
.billing-responsive-table {
width: 100%;
border: 1px solid #101A30;
border-collapse: collapse;
}
.billing-responsive-table {
width: 100%;
border: 1px solid #101A30;
border-collapse: collapse;
}
.billing-responsive-table th,
.billing-responsive-table td {
border: 1px solid #101A30;
padding: 8px;
text-align: left;
vertical-align: middle;
}
.billing-responsive-table th,
.billing-responsive-table td {
border: 1px solid #101A30;
padding: 8px;
text-align: left;
vertical-align: middle;
}
.billing-responsive-table thead {
background-color: #f8f9fa;
}
.billing-responsive-table thead {
background-color: #f8f9fa;
}
/* ✅ Responsive Stack for Small Screens */
@media (max-width: 576px) {
.billing-responsive-table thead {
display: none;
}
/* ✅ Responsive Stack for Small Screens */
@media (max-width: 576px) {
.billing-responsive-table thead {
display: none;
}
.billing-responsive-table,
.billing-responsive-table tbody,
.billing-responsive-table tr,
.billing-responsive-table td {
display: block;
width: 100%;
}
.billing-responsive-table,
.billing-responsive-table tbody,
.billing-responsive-table tr,
.billing-responsive-table td {
display: block;
width: 100%;
}
.billing-responsive-table td {
position: relative;
padding: 8px;
text-align: left;
}
.billing-responsive-table td {
position: relative;
padding: 8px;
text-align: left;
}
.billing-responsive-table td::before {
content: attr(data-label);
display: block;
font-weight: bold;
margin-bottom: 4px;
}
}
.billing-responsive-table td::before {
content: attr(data-label);
display: block;
font-weight: bold;
margin-bottom: 4px;
}
}
.section-para{
.section-para {
font-size: 14px !important;
font-size: 14px !important;
}
}
.custom-table {
border: 1px solid #101A30;
border-collapse: collapse;
width: 100%;
}
.custom-table th,
.custom-table td {
border: 1px solid #101A30;
padding: 8px;
text-align: left;
vertical-align: middle;
}
.custom-table thead {
background-color: #f8f9fa;
}
border: 1px solid #101A30;
border-collapse: collapse;
width: 100%;
}
/* ✅ Responsive stacking below 576px */
@media (max-width: 576px) {
.custom-table thead {
display: none;
}
.custom-table,
.custom-table tbody,
.custom-table tr,
.custom-table td {
display: block;
width: 100%;
}
.custom-table td {
text-align: left;
padding: 8px;
position: relative;
}
.custom-table td::before {
content: attr(data-label);
font-weight: bold;
display: block;
margin-bottom: 4px;
}
}
.custom-table th,
.custom-table td {
border: 1px solid #101A30;
padding: 8px;
text-align: left;
vertical-align: middle;
}
.custom-table thead {
background-color: #f8f9fa;
}
/* ✅ Responsive stacking below 576px */
@media (max-width: 576px) {
.custom-table thead {
display: none;
}
.custom-table,
.custom-table tbody,
.custom-table tr,
.custom-table td {
display: block;
width: 100%;
}
.custom-table td {
text-align: left;
padding: 8px;
position: relative;
}
.custom-table td::before {
content: attr(data-label);
font-weight: bold;
display: block;
margin-bottom: 4px;
}
}
@media (max-width: 425px) {
/* .sec-title-2 {
@ -3749,7 +3755,7 @@
}
}
@media (max-width: 426px) and (min-width: 200px) {
@media (max-width: 426px) and (min-width: 200px) {
.blog-details-content .news-block-one .inner-box .lower-content h2 {
font-size: 26px !important;
line-height: 32px;
@ -3839,17 +3845,43 @@
filter: brightness(0) invert(1);
}
@media only screen and (max-width: 426px) and (min-width : 200px) {
@media (max-width: 1023px) {
.hide-element {
display: none;
}
}
@media (max-width:768px) {
.image-1-ho-new img {
position: relative;
top: 13px;
left: 79px;
}
}
@media only screen and (max-width: 500px) and (min-width : 200px) {
.image-1-ho-new img {
position: relative;
top: 13px;
left: -19px;
}
}
@media only screen and (max-width: 426px) and (min-width : 200px) {
.list-style-one li {
position: relative;
display: block;
font-size: 14px !important;
line-height: 26px !important;
color: #101A30;
font-weight: 500;
padding-left: 40px;
margin-bottom: 17px;
}
position: relative;
display: block;
font-size: 14px !important;
line-height: 26px !important;
color: #101A30;
font-weight: 500;
padding-left: 40px;
margin-bottom: 17px;
}
}