White icons updated

This commit is contained in:
akash 2025-09-03 16:33:39 +05:30
commit 6d39624ed3
14 changed files with 10 additions and 18 deletions

View File

@ -30,11 +30,7 @@ export default function ServicesSection() {
: service.title}
</Link>
</h3>
<p>
{service?.shortDescription?.length > 70
? service.shortDescription.slice(0, 70) + "..."
: service.shortDescription}
</p>
<p>{service?.shortDescription}</p>
</div>
</div>
</div>

View File

@ -12,7 +12,7 @@
background: #fff;
border-radius: 20px;
transition: all 500ms ease;
overflow: visible; /* ✅ Important: Allow icon to go outside */
overflow: visible;
}
.service-block-one .inner-box:hover {
@ -40,7 +40,6 @@
transform: scale(1.05);
}
/* ✅ LOWER CONTENT STYLING */
.service-block-one .inner-box .lower-content {
position: relative;
display: block;
@ -48,17 +47,17 @@
border-radius: 0px 0px 20px 20px;
padding: 40px 40px 40px 105px;
transition: all 500ms ease;
overflow: visible; /* ✅ Allows icon outside the box */
overflow: visible;
min-height: 285px;
}
.service-block-one .inner-box:hover .lower-content {
border-color: #fff;
}
/* ✅ ICON BOX COMPLETELY OUTSIDE */
.service-block-one .inner-box .lower-content .icon-box {
position: absolute;
left: -13px; /* ✅ Move icon fully outside */
left: -13px;
bottom: 40px;
width: 100px;
height: 100px;
@ -73,16 +72,14 @@
z-index: 10;
}
/* ✅ HOVER EFFECT - ICON SLIDES UP */
.service-block-one .inner-box:hover .lower-content .icon-box {
bottom: 145px;
bottom: 183px;
}
/* ✅ RED TRIANGLE EDGE UNDER ICON */
.service-block-one .inner-box .lower-content .icon-box:before {
position: absolute;
content: '';
background: #bc0000; /* Same red as icon */
background: #bc0000;
width: 12px;
height: 14px;
left: 0px;
@ -90,7 +87,6 @@
clip-path: polygon(0% 0%, 100% 0%, 100% 100%);
}
/* ✅ TITLE STYLING */
.service-block-one .inner-box .lower-content h3 {
position: relative;
display: block;

Binary file not shown.

Before

Width:  |  Height:  |  Size: 8.3 KiB

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 6.0 KiB

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.4 KiB

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 8.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 16 KiB

After

Width:  |  Height:  |  Size: 6.5 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 25 KiB

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 16 KiB

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 10 KiB

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 6.2 KiB

After

Width:  |  Height:  |  Size: 12 KiB

View File

@ -1124,7 +1124,7 @@ export const servicesList = [
sidebarImg: "/assets/images/services/orthotics/left.webp",
bigImg: "/assets/images/services/orthotics/big-img.webp",
icon: "/assets/images/services/icons/orthotics.webp",
shortDescription: "Orthotics are medical devices that you wear inside your shoes to correct biomechanical foot issues. They can also help with foot pain caused by medical.",
shortDescription: "Orthotics are medical devices that you wear inside your shoes to help correct common biomechanical foot issues. They can also help with foot pain caused by medical conditions.",
description: `<div>
<div class="text-box ">
<h2>Orthotics Therapy Clinic</h2>
@ -1272,7 +1272,7 @@ export const servicesList = [
sidebarImg: "/assets/images/services/concussion-management/left.webp",
bigImg: "/assets/images/services/concussion-management/big-img.webp",
icon: "/assets/images/services/icons/concussion-management.webp",
shortDescription: "Concussion is a traumatic brain injury that can cause lasting effects on brain tissue occurs when the brain is violently shaken and changes the chemical.",
shortDescription: "Concussion is a brain injury that can cause lasting effects on brain tissue occurs when the brain is violently shaken and changes the chemical.",
description: `<div>
<div class="text-box ">
<h2>Concussion Management</h2>
@ -1402,7 +1402,7 @@ export const servicesList = [
sidebarImg: "/assets/images/services/chronic-pain/left.webp",
bigImg: "/assets/images/services/chronic-pain/big-img.webp",
icon: "/assets/images/services/icons/chronic-pain.webp",
shortDescription: "The goal of physiotherapy is to enable and empower the individual to gain back control of their life, and reduce the fear and avoidance.",
shortDescription: "The goal of physiotherapy is to empower the individual to regain control of their life, and reduce fear and avoidance.",
description: `<div>
<div class="text-box ">
<h2>Chronic Pain Management Etobicoke</h2>