Skip to content

Commit 23c7331

Browse files
shahealamitshahealamit
authored
add service section
1 parent 8830fe3 commit 23c7331

1 file changed

Lines changed: 175 additions & 2 deletions

File tree

‎index.html‎

Lines changed: 175 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -115,6 +115,7 @@ <h1>DevOps Engineer in Patna</h1>
115115
<a href="/#about" class="hover:text-teal-400 transition-colors">About</a>
116116
<a href="/#skills" class="hover:text-teal-400 transition-colors">Skills</a>
117117
<a href="/#resume" class="hover:text-teal-400 transition-colors">Journey</a>
118+
<a href="/#services" class="hover:text-teal-400 transition-colors"> Services</a>
118119
<a href="/#projects" class="hover:text-teal-400 transition-colors">Projects</a>
119120
<a href="/#contact"
120121
class="px-5 py-2 border border-teal-500 text-teal-400 rounded-full
@@ -136,7 +137,10 @@ <h1>DevOps Engineer in Patna</h1>
136137
<a href="/#home" class="block hover:text-teal-400">Home</a>
137138
<a href="/#about" class="block hover:text-teal-400">About</a>
138139
<a href="/#resume" class="block hover:text-teal-400">Journey</a>
140+
<a href="/#services" class="block hover:text-teal-400">Services</a>
139141
<a href="/#projects" class="block hover:text-teal-400">Projects</a>
142+
143+
140144
<a href="/#contact" class="block text-teal-400 font-bold">Contact Me</a>
141145
</div>
142146
</div>
@@ -555,7 +559,178 @@ <h4 class="text-lg font-bold text-white">
555559
</div>
556560
</section>
557561

562+
<!-- ================= SERVICES ================= -->
563+
<section id="services" class="py-24 relative bg-slate-950 overflow-hidden">
564+
565+
<!-- Background Glow -->
566+
<div class="absolute top-0 left-1/2 -translate-x-1/2 w-full h-full pointer-events-none">
567+
<div class="absolute top-[-10%] left-[-10%] w-[40%] h-[40%] bg-teal-500/10 blur-[120px] rounded-full"></div>
568+
<div class="absolute bottom-[-10%] right-[-10%] w-[40%] h-[40%] bg-purple-500/10 blur-[120px] rounded-full"></div>
569+
</div>
570+
571+
<div class="max-w-6xl mx-auto px-6 relative z-10">
572+
573+
<!-- Heading -->
574+
<div class="text-center mb-20">
575+
<h2 class="text-4xl md:text-6xl font-extrabold text-white mb-6 tracking-tight">
576+
What I
577+
<span class="bg-gradient-to-r from-teal-400 to-blue-500 bg-clip-text text-transparent">
578+
Offer
579+
</span>
580+
</h2>
581+
582+
<p class="text-slate-400 text-lg max-w-2xl mx-auto leading-relaxed">
583+
Production-ready DevOps services focused on automation, security,
584+
scalability, and faster releases.
585+
</p>
586+
</div>
587+
588+
<!-- Services Grid -->
589+
<div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6">
590+
591+
<!-- CI/CD -->
592+
<div class="group relative bg-slate-900/40 backdrop-blur-md border border-slate-800/60 rounded-3xl p-8
593+
hover:border-teal-500/50 transition-all duration-300 hover:-translate-y-2
594+
hover:shadow-[0_20px_40px_-15px_rgba(20,184,166,0.3)]">
595+
596+
<div class="w-12 h-12 bg-teal-500/10 rounded-2xl flex items-center justify-center mb-6
597+
group-hover:scale-110 transition-transform">
598+
<svg class="w-6 h-6 text-teal-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
599+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
600+
d="M13 10V3L4 14h7v7l9-11h-7z"/>
601+
</svg>
602+
</div>
603+
604+
<h3 class="text-xl font-bold text-white mb-4">CI/CD Pipelines</h3>
605+
<p class="text-slate-400 text-sm mb-6">
606+
Automated build and test pipelines that help teams release faster with reliability.
607+
</p>
608+
609+
<ul class="text-[13px] text-slate-300 space-y-3 mb-8">
610+
<li class="flex items-center gap-2">
611+
<span class="w-1.5 h-1.5 rounded-full bg-teal-400"></span>
612+
Jenkins & GitHub Actions
613+
</li>
614+
<li class="flex items-center gap-2">
615+
<span class="w-1.5 h-1.5 rounded-full bg-teal-400"></span>
616+
Testing & Validation
617+
</li>
618+
</ul>
619+
620+
<a href="/jenkins-ci-cd.html"
621+
class="inline-flex items-center text-teal-400 font-bold text-xs tracking-widest uppercase">
622+
Explore CI/CD →
623+
</a>
624+
</div>
625+
626+
<!-- AWS -->
627+
<div class="group relative bg-slate-900/40 backdrop-blur-md border border-slate-800/60 rounded-3xl p-8
628+
hover:border-blue-500/50 transition-all duration-300 hover:-translate-y-2
629+
hover:shadow-[0_20px_40px_-15px_rgba(59,130,246,0.3)]">
630+
631+
<div class="w-12 h-12 bg-blue-500/10 rounded-2xl flex items-center justify-center mb-6
632+
group-hover:scale-110 transition-transform">
633+
<svg class="w-6 h-6 text-blue-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
634+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
635+
d="M3 15a4 4 0 004 4h9a5 5 0 10-.1-9.999A5.002 5.002 0 103.22 11.1 4.001 4.001 0 003 15z"/>
636+
</svg>
637+
</div>
638+
639+
<h3 class="text-xl font-bold text-white mb-4">AWS Cloud</h3>
640+
<p class="text-slate-400 text-sm mb-6">
641+
Scalable and cost-optimized AWS infrastructure for production workloads.
642+
</p>
558643

644+
<ul class="text-[13px] text-slate-300 space-y-3 mb-8">
645+
<li class="flex items-center gap-2">
646+
<span class="w-1.5 h-1.5 rounded-full bg-blue-400"></span>
647+
EC2, S3, RDS & IAM
648+
</li>
649+
<li class="flex items-center gap-2">
650+
<span class="w-1.5 h-1.5 rounded-full bg-blue-400"></span>
651+
VPC & Network Security
652+
</li>
653+
</ul>
654+
655+
<a href="/aws-devops-engineer.html"
656+
class="inline-flex items-center text-blue-400 font-bold text-xs tracking-widest uppercase">
657+
Explore AWS →
658+
</a>
659+
</div>
660+
661+
<!-- Docker -->
662+
<div class="group relative bg-slate-900/40 backdrop-blur-md border border-slate-800/60 rounded-3xl p-8
663+
hover:border-purple-500/50 transition-all duration-300 hover:-translate-y-2
664+
hover:shadow-[0_20px_40px_-15px_rgba(168,85,247,0.3)]">
665+
666+
<div class="w-12 h-12 bg-purple-500/10 rounded-2xl flex items-center justify-center mb-6
667+
group-hover:scale-110 transition-transform">
668+
<svg class="w-6 h-6 text-purple-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
669+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
670+
d="M20 7l-8-4-8 4m16 0l-8 4m8-4v10l-8 4m0-10L4 7m8 4v10"/>
671+
</svg>
672+
</div>
673+
674+
<h3 class="text-xl font-bold text-white mb-4">Docker Support</h3>
675+
<p class="text-slate-400 text-sm mb-6">
676+
Containerized deployments for consistent environments across stages.
677+
</p>
678+
679+
<ul class="text-[13px] text-slate-300 space-y-3 mb-8">
680+
<li class="flex items-center gap-2">
681+
<span class="w-1.5 h-1.5 rounded-full bg-purple-400"></span>
682+
Docker & Compose
683+
</li>
684+
<li class="flex items-center gap-2">
685+
<span class="w-1.5 h-1.5 rounded-full bg-purple-400"></span>
686+
Container Optimization
687+
</li>
688+
</ul>
689+
690+
<a href="/docker-containerization.html"
691+
class="inline-flex items-center text-purple-400 font-bold text-xs tracking-widest uppercase">
692+
Explore Docker →
693+
</a>
694+
</div>
695+
696+
<!-- Linux -->
697+
<div class="group relative bg-slate-900/40 backdrop-blur-md border border-slate-800/60 rounded-3xl p-8
698+
hover:border-emerald-500/50 transition-all duration-300 hover:-translate-y-2
699+
hover:shadow-[0_20px_40px_-15px_rgba(16,185,129,0.3)]">
700+
701+
<div class="w-12 h-12 bg-emerald-500/10 rounded-2xl flex items-center justify-center mb-6
702+
group-hover:scale-110 transition-transform">
703+
<svg class="w-6 h-6 text-emerald-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
704+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
705+
d="M5 12h14M5 12a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v4M5 12v4a2 2 0 002 2h14a2 2 0 002-2v-4"/>
706+
</svg>
707+
</div>
708+
709+
<h3 class="text-xl font-bold text-white mb-4">Linux Automation</h3>
710+
<p class="text-slate-400 text-sm mb-6">
711+
Automated server management, monitoring, and security hardening.
712+
</p>
713+
714+
<ul class="text-[13px] text-slate-300 space-y-3 mb-8">
715+
<li class="flex items-center gap-2">
716+
<span class="w-1.5 h-1.5 rounded-full bg-emerald-400"></span>
717+
Bash & Shell Scripting
718+
</li>
719+
<li class="flex items-center gap-2">
720+
<span class="w-1.5 h-1.5 rounded-full bg-emerald-400"></span>
721+
Security & Hardening
722+
</li>
723+
</ul>
724+
725+
<a href="/linux-cloud-automation.html"
726+
class="inline-flex items-center text-emerald-400 font-bold text-xs tracking-widest uppercase">
727+
Explore Linux →
728+
</a>
729+
</div>
730+
731+
</div>
732+
</div>
733+
</section>
559734
<!-- certificate -->
560735
<!-- <section id="certifications" class="py-24 relative overflow-hidden bg-slate-950">
561736
@@ -836,8 +1011,6 @@ <h2 class="text-4xl md:text-5xl font-bold text-center text-white mb-24" data-aos
8361011
</div>
8371012
</section>
8381013

839-
840-
8411014
<!-- Contact Section -->
8421015
<section id="contact" class="py-24 relative overflow-hidden bg-slate-950">
8431016

0 commit comments

Comments
 (0)