franpcode/create-better-t-stack
1
0
Fork 0
mirror of https://github.com/FranP-code/create-better-t-stack.git synced 2025-10-12 23:52:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

improve text effects

Browse Source
This commit is contained in:
fgrreloaded
2025-03-01 22:16:40 +05:30
parent 2c3300ea04
commit 332d738ac0
1 changed files with 27 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
apps/web/src/app/(home)/page.tsx
View File

@@ -5,7 +5,7 @@ import CodeContainer from "./_components/CodeContainer";
import CustomizableSection from "./_components/CustomizableSection";
import NpmPackage from "./_components/NpmPackage";
import TechConstellation from "./_components/TechConstellation";
import TerminalDisplay from "./_components/Terminal";
// import TerminalDisplay from "./_components/Terminal";
import Testimonials from "./_components/Testimonials";
export default function HomePage() {
@@ -47,35 +47,43 @@ export default function HomePage() {
<div className="absolute inset-0 bg-gradient-to-r from-purple-500/20 to-indigo-500/20 blur-3xl transform -skew-y-12" />
</div>
</div>
<TerminalDisplay />
{/* <TerminalDisplay /> */}
<div className="w-full max-w-6xl mx-auto space-y-12 mt-12 relative z-50">
<div className="text-center space-y-6 relative z-10">
<h2 className="sm:text-4xl text-3xl md:text-5xl font-bold bg-clip-text text-transparent bg-gradient-to-r from-slate-700 via-gray-100 to-stone-600 pb-2">
A Symphony of Modern Tech
</h2>
<div className="text-center space-y-6 relative z-10 border border-gray-700/30 p-6 rounded-md bg-gray-950/30 backdrop-blur-3xl">
<div className="relative">
<h2 className="relative sm:text-4xl text-3xl md:text-5xl font-bold pb-3 group">
<span className="text-blue-400 font-mono mr-1 animate-pulse">
{">"}
</span>
<span className="bg-clip-text text-transparent bg-gradient-to-r from-blue-400 via-white to-indigo-500 hover:from-indigo-400 hover:to-blue-500 transition-all duration-300">
A Symphony of Modern Tech
</span>
</h2>
<div className="absolute -inset-1 bg-gradient-to-r from-gray-800/0 via-gray-700/10 to-gray-800/0 blur-xl -z-10" />
</div>
<div className="space-y-4 max-w-3xl mx-auto">
<p className="sm:text-xl text-gray-300 leading-relaxed">
Carefully orchestrated stack of{" "}
<span className="text-blue-400 font-semibold">
<p className="sm:text-xl text-gray-300 leading-relaxed font-mono">
<span className="text-yellow-400">$</span> carefully orchestrated
stack of{" "}
<span className="text-blue-500 font-semibold">
cutting-edge technologies
</span>
, working in perfect harmony to deliver an exceptional development
experience.
</p>
, working in perfect harmony
</p>{" "}
<div className="flex flex-wrap justify-center sm:gap-4 gap-2 sm:text-sm text-xs text-gray-400">
<span className="px-3 py-1 bg-gray-800/50 rounded-full hover:bg-gray-800 transition-colors">
End-to-end Type Safety
<span className="px-3 py-1 bg-black border border-gray-700 rounded-sm hover:bg-gray-900/50 transition-colors">
--end-to-end-type-safety
</span>
<span className="px-3 py-1 bg-gray-800/50 rounded-full hover:bg-gray-800 transition-colors">
Lightning Fast Performance
<span className="px-3 py-1 bg-black border border-gray-700 rounded-sm hover:bg-gray-900/50 transition-colors">
--lightning-fast
</span>
<span className="px-3 py-1 bg-gray-800/50 rounded-full hover:bg-gray-800 transition-colors">
Modern Development Tools
<span className="px-3 py-1 bg-black border border-gray-700 rounded-sm hover:bg-gray-900/50 transition-colors">
--modern-tools
</span>
</div>
</div>
<div className="absolute inset-0 bg-gradient-to-b from-gray-900 via-gray-900/50 to-transparent -z-10 blur-xl" />
{/* <div className="absolute inset-0 bg-gradient-to-b from-black via-gray-900/10 to-transparent -z-10" /> */}
</div>
</div>
<TechConstellation />