truncgit/citrus
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: update brand color palette from purple to orange across web development template components

Browse Source
This commit is contained in:
Ümit Tunç
2026-05-23 17:53:59 +03:00
parent 945c3ca2ec
commit 0c51fecef8
1 changed files with 19 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/templates/services/web-development.blade.php
+19 -12
View File
@@ -141,7 +141,7 @@
} }
.web-dev-section .accordion-wrapper .card-header button:hover, .web-dev-section .accordion-wrapper .card-header button:hover,
.web-dev-section .accordion-wrapper .card-header button { .web-dev-section .accordion-wrapper .card-header button {
color: #747ed1 !important; color: #f04e23 !important;
} }
/* Technology Card Micro-animations */ /* Technology Card Micro-animations */
@@ -150,7 +150,7 @@
} }
.tech-card:hover { .tech-card:hover {
transform: translateY(-8px) scale(1.03); transform: translateY(-8px) scale(1.03);
box-shadow: 0 1.25rem 2.5rem rgba(116, 126, 209, 0.12) !important; box-shadow: 0 1.25rem 2.5rem rgba(240, 78, 35, 0.12) !important;
} }
.tech-card img { .tech-card img {
transition: transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1); transition: transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
@@ -241,6 +241,13 @@
.web-dev-illustration--platforms { .web-dev-illustration--platforms {
max-width: 36rem; max-width: 36rem;
} }
.bg-gradient-purple {
background: linear-gradient(180deg, #fff3f0 0%, rgba(255, 255, 255, 0) 100%) !important;
}
.btn-soft-purple {
background-color: #fff3f0 !important;
color: #f04e23 !important;
}
.tech-tabs-grid { .tech-tabs-grid {
display: grid !important; display: grid !important;
grid-template-columns: repeat(1, 1fr) !important; grid-template-columns: repeat(1, 1fr) !important;
@@ -270,18 +277,18 @@
border-radius: 0.8rem !important; border-radius: 0.8rem !important;
background: #ffffff !important; background: #ffffff !important;
box-shadow: 0 0.25rem 1.75rem rgba(30, 34, 40, 0.05) !important; box-shadow: 0 0.25rem 1.75rem rgba(30, 34, 40, 0.05) !important;
border: 1px solid rgba(116, 126, 209, 0.08) !important; border: 1px solid rgba(240, 78, 35, 0.08) !important;
padding: 1.25rem !important; padding: 1.25rem !important;
transition: all 0.3s ease !important; transition: all 0.3s ease !important;
} }
.tech-tabs-grid .nav-link:hover { .tech-tabs-grid .nav-link:hover {
transform: translateY(-3px) !important; transform: translateY(-3px) !important;
box-shadow: 0 0.5rem 2rem rgba(116, 126, 209, 0.12) !important; box-shadow: 0 0.5rem 2rem rgba(240, 78, 35, 0.12) !important;
} }
.tech-tabs-grid .nav-link.active { .tech-tabs-grid .nav-link.active {
background: #f0f2fd !important; background: #fff3f0 !important;
border-color: #747ed1 !important; border-color: #f04e23 !important;
box-shadow: 0 0.5rem 2rem rgba(116, 126, 209, 0.15) !important; box-shadow: 0 0.5rem 2rem rgba(240, 78, 35, 0.15) !important;
} }
.tech-tabs-grid .nav-link h4 { .tech-tabs-grid .nav-link h4 {
color: #343f52 !important; color: #343f52 !important;
@@ -293,7 +300,7 @@
} }
.tech-tabs-grid .nav-link:hover h4, .tech-tabs-grid .nav-link:hover h4,
.tech-tabs-grid .nav-link.active h4 { .tech-tabs-grid .nav-link.active h4 {
color: #747ed1 !important; color: #f04e23 !important;
} }
.tech-tabs-grid .nav-link:hover p, .tech-tabs-grid .nav-link:hover p,
.tech-tabs-grid .nav-link.active p { .tech-tabs-grid .nav-link.active p {
@@ -884,8 +891,8 @@
</div> </div>
</div> </div>
<div class="flex justify-center" data-cues="slideInDown" data-group="join" data-delay="900"> <div class="flex justify-center" data-cues="slideInDown" data-group="join" data-delay="900">
<span><a href="#neler-yapiyoruz" class="btn btn-lg btn-purple !text-white !bg-[#747ed1] border-[#747ed1] hover:text-white hover:bg-[#747ed1] hover:!border-[#747ed1] active:text-white active:bg-[#747ed1] active:border-[#747ed1] disabled:text-white disabled:bg-[#747ed1] disabled:border-[#747ed1] !rounded-[50rem] mx-1">{!! t('Çözümlerimiz') !!}</a></span> <span><a href="#neler-yapiyoruz" class="btn btn-lg btn-orange !text-white !bg-[#f04e23] border-[#f04e23] hover:text-white hover:bg-[#f04e23] hover:!border-[#f04e23] active:text-white active:bg-[#f04e23] active:border-[#f04e23] disabled:text-white disabled:bg-[#f04e23] disabled:border-[#f04e23] !rounded-[50rem] mx-1">{!! t('Çözümlerimiz') !!}</a></span>
<span><a href="{{ $contactUrl }}" class="btn btn-lg btn-outline-purple !text-[#747ed1] bg-transparent border-[#747ed1] hover:text-white hover:bg-[#747ed1] hover:!border-[#747ed1] focus:shadow-[rgba(116,126,209,1)] active:text-white active:bg-[#747ed1] active:border-[#747ed1] disabled:!text-[#747ed1] disabled:bg-transparent disabled:border-[#747ed1] !rounded-[50rem] !border-[#747ed1] hover:!bg-[#747ed1] hover:!text-white mx-1">{!! t('Bize Ulaşın') !!}</a></span> <span><a href="{{ $contactUrl }}" class="btn btn-lg btn-outline-orange !text-[#f04e23] bg-transparent border-[#f04e23] hover:text-white hover:bg-[#f04e23] hover:!border-[#f04e23] focus:shadow-[rgba(240,78,35,1)] active:text-white active:bg-[#f04e23] active:border-[#f04e23] disabled:!text-[#f04e23] disabled:bg-transparent disabled:border-[#f04e23] !rounded-[50rem] !border-[#f04e23] hover:!bg-[#f04e23] hover:!text-white mx-1">{!! t('Bize Ulaşın') !!}</a></span>
</div> </div>
<div class="flex flex-wrap mx-[-15px] !mt-[3.5rem]" data-cue="fadeIn" data-delay="1600"> <div class="flex flex-wrap mx-[-15px] !mt-[3.5rem]" data-cue="fadeIn" data-delay="1600">
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto"> <div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
@@ -1060,7 +1067,7 @@
@foreach(array_slice($faqs, 0, 3) as $index => $faq) @foreach(array_slice($faqs, 0, 3) as $index => $faq)
<div class="card accordion-item !mb-5 !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]"> <div class="card accordion-item !mb-5 !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]">
<div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !rounded-[0.4rem] !bg-inherit" id="accordion-heading-wd-1-{{ $index }}"> <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !rounded-[0.4rem] !bg-inherit" id="accordion-heading-wd-1-{{ $index }}">
<button class="!text-[#343f52] !text-[0.9rem] hover:!text-[#747ed1] before:!text-[#747ed1] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-wd-1-{{ $index }}" aria-expanded="false" aria-controls="accordion-collapse-wd-1-{{ $index }}"> <button class="!text-[#343f52] !text-[0.9rem] hover:!text-[#f04e23] before:!text-[#f04e23] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-wd-1-{{ $index }}" aria-expanded="false" aria-controls="accordion-collapse-wd-1-{{ $index }}">
{!! t($faq['question']) !!} {!! t($faq['question']) !!}
</button> </button>
</div> </div>
@@ -1078,7 +1085,7 @@
@foreach(array_slice($faqs, 3, 3) as $index => $faq) @foreach(array_slice($faqs, 3, 3) as $index => $faq)
<div class="card accordion-item !mb-5 !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]"> <div class="card accordion-item !mb-5 !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]">
<div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !rounded-[0.4rem] !bg-inherit" id="accordion-heading-wd-2-{{ $index }}"> <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !rounded-[0.4rem] !bg-inherit" id="accordion-heading-wd-2-{{ $index }}">
<button class="!text-[#343f52] !text-[0.9rem] hover:!text-[#747ed1] before:!text-[#747ed1] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-wd-2-{{ $index }}" aria-expanded="false" aria-controls="accordion-collapse-wd-2-{{ $index }}"> <button class="!text-[#343f52] !text-[0.9rem] hover:!text-[#f04e23] before:!text-[#f04e23] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-wd-2-{{ $index }}" aria-expanded="false" aria-controls="accordion-collapse-wd-2-{{ $index }}">
{!! t($faq['question']) !!} {!! t($faq['question']) !!}
</button> </button>
</div> </div>