warlock/callfi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

tweaks

Browse Source
This commit is contained in:
sewmina7@gmail.com 2024-06-26 11:46:46 +05:30
parent fda61a38ce
commit c2de1d317b
2 changed files with 13 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
app/globals.css
View File

@ -17,6 +17,8 @@ body {
--glassmorphism-gradient: linear-gradient(135deg, rgba(255, 255, 255, 0.05) 0%, rgba(0, 0, 0, 0.2) 100%);
--glassmorphism-gradient-hover: linear-gradient(135deg, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%);
--glassmorphism-bg: rgba(255, 255, 255, 0.03);
--glassmorphism-bg-dark: rgba(0, 0, 0, 0.2);
--glassmorphism-blur: 10px;
--glassmorphism-border: rgba(255, 255, 255, 0.15);
}
@ -30,6 +32,15 @@ body {
overflow: hidden;
transition: background 0.3s ease, box-shadow 0.3s ease, border 0.3s ease;
}
.glassmorphism-dark{
background: var(--glassmorphism-gradient-hover), var(--glassmorphism-bg-dark);
backdrop-filter: blur(var(--glassmorphism-blur));
border: 1px solid var(--glassmorphism-border);
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
position: relative;
overflow: hidden;
transition: background 0.3s ease, box-shadow 0.3s ease, border 0.3s ease;
}
.glassmorphism::before {
content: "";
position: absolute;

4
app/page.tsx
View File

@ -236,7 +236,7 @@ function Home() {
{periods.map((period) => (
<button
key={period}
className={`glassmorphism px-4 py-2 rounded ${selectedPeriod === period ? 'bg-black text-white' : 'bg-gray-700 text-gray-400'}`}
className={`px-4 py-2 rounded ${selectedPeriod === period ? 'bg-black text-white glassmorphism-dark' : 'bg-gray-700 text-gray-400 glassmorphism'}`}
onClick={() => setSelectedPeriod(period)}
>
{period}
@ -246,7 +246,7 @@ function Home() {
<div className="w-full max-w-4xl">
{leaderboardData.map((item) => (
<motion.div key="id" whileHover={{ scale: 1.1, transition: { duration: 0.2 } }}>
<motion.div key="id" whileHover={{ scale: 1.05, transition: { duration: 0.15 } }}>
<div
key={item["id"]}
className={`leaderboard-card glassmorphism ${item["points"] >= 0 ? 'positive' : 'negative'} mx-auto mb-4`}