yusufipek/distromatch
1
0
Fork 0
mirror of https://github.com/yusufipk/distromatch.git synced 2026-09-11 18:56:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add placeholder screenshots and boost super like recommendations

Browse Source 
Add screenshot functionality to desktop environment cards, specify a directory for screenshots, and significantly increase the recommendation weight for "super liked" desktop environments.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: c4fc7b07-53a2-4929-bc12-f392104bb085
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Event-Id: 936a3981-c2af-4a9b-b975-bbce46d12e05
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/55e426a8-5a2b-421b-8bd4-30481ae0063b/c4fc7b07-53a2-4929-bc12-f392104bb085/OOak6Ts
Replit-Helium-Checkpoint-Created: true
This commit is contained in:
yusufipk
2025-12-17 14:25:20 +00:00
parent 3429df4273
commit 2e230b781a
4 changed files with 100 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/components/DECard.tsx
+32 -10
View File
@@ -10,6 +10,7 @@ interface DECardProps {
resourceUsage: string; resourceUsage: string;
customization: string; customization: string;
colorPalette: string[]; colorPalette: string[];
screenshot?: string;
}; };
onSwipe: (direction: 'left' | 'right' | 'super') => void; onSwipe: (direction: 'left' | 'right' | 'super') => void;
isTop: boolean; isTop: boolean;
@@ -113,31 +114,51 @@ export default function DECard({ de, onSwipe, isTop }: DECardProps) {
GEÇ GEÇ
</motion.div> </motion.div>
<div className="relative z-10 flex flex-col items-center justify-center p-12 text-center"> <div className="relative z-10 flex flex-row items-stretch">
{de.screenshot && (
<div className="w-[320px] flex-shrink-0 overflow-hidden rounded-l-3xl">
<img
src={`/de_screenshots/${de.screenshot}`}
alt={`${de.name} screenshot`}
className="h-full w-full object-cover"
onError={(e) => {
e.currentTarget.style.display = 'none';
}}
/>
<div <div
className="mb-6 flex h-24 w-24 items-center justify-center rounded-2xl" className="absolute inset-0 w-[320px]"
style={{
background: `linear-gradient(90deg, transparent 60%, ${primaryColor}40 100%)`,
}}
/>
</div>
)}
<div className="flex flex-1 flex-col items-center justify-center p-8 text-center">
<div
className="mb-4 flex h-16 w-16 items-center justify-center rounded-xl"
style={{ style={{
background: `linear-gradient(135deg, ${primaryColor}, ${secondaryColor})`, background: `linear-gradient(135deg, ${primaryColor}, ${secondaryColor})`,
boxShadow: `0 10px 40px ${primaryColor}50`, boxShadow: `0 8px 30px ${primaryColor}50`,
}} }}
> >
<StyleIcon className="h-12 w-12 text-white" /> <StyleIcon className="h-8 w-8 text-white" />
</div> </div>
<h2 <h2
className="mb-3 font-['Space_Grotesk'] text-4xl font-bold" className="mb-2 font-['Space_Grotesk'] text-3xl font-bold"
style={{ color: primaryColor }} style={{ color: primaryColor }}
> >
{de.name} {de.name}
</h2> </h2>
<p className="mb-8 max-w-md text-lg text-gray-300"> <p className="mb-6 max-w-sm text-base text-gray-300">
{de.description} {de.description}
</p> </p>
<div className="flex flex-wrap justify-center gap-3"> <div className="flex flex-wrap justify-center gap-2">
<span <span
className="rounded-full px-4 py-2 text-sm font-medium" className="rounded-full px-3 py-1.5 text-xs font-medium"
style={{ style={{
backgroundColor: `${primaryColor}30`, backgroundColor: `${primaryColor}30`,
color: primaryColor, color: primaryColor,
@@ -146,7 +167,7 @@ export default function DECard({ de, onSwipe, isTop }: DECardProps) {
{styleLabels[de.style] || de.style} {styleLabels[de.style] || de.style}
</span> </span>
<span <span
className="rounded-full px-4 py-2 text-sm font-medium" className="rounded-full px-3 py-1.5 text-xs font-medium"
style={{ style={{
backgroundColor: `${secondaryColor}30`, backgroundColor: `${secondaryColor}30`,
color: secondaryColor, color: secondaryColor,
@@ -155,13 +176,14 @@ export default function DECard({ de, onSwipe, isTop }: DECardProps) {
{resourceLabels[de.resourceUsage] || de.resourceUsage} {resourceLabels[de.resourceUsage] || de.resourceUsage}
</span> </span>
<span <span
className="rounded-full px-4 py-2 text-sm font-medium bg-white/10 text-gray-300" className="rounded-full px-3 py-1.5 text-xs font-medium bg-white/10 text-gray-300"
> >
Özelleştirme: {de.customization} Özelleştirme: {de.customization}
</span> </span>
</div> </div>
</div> </div>
</div> </div>
</div>
</motion.div> </motion.div>
); );
} }
client/src/components/DistroMatch.tsx
-1
View File
@@ -39,7 +39,6 @@ export default function DistroMatch() {
setLikedDEs(prev => [...prev, currentDE.name]); setLikedDEs(prev => [...prev, currentDE.name]);
} else if (direction === 'super') { } else if (direction === 'super') {
setSuperLikedDEs(prev => [...prev, currentDE.name]); setSuperLikedDEs(prev => [...prev, currentDE.name]);
setLikedDEs(prev => [...prev, currentDE.name]);
} else { } else {
setDislikedDEs(prev => [...prev, currentDE.name]); setDislikedDEs(prev => [...prev, currentDE.name]);
} }
client/src/data/distros.json
+24 -12
View File
@@ -636,7 +636,8 @@
"style": "modern", "style": "modern",
"resourceUsage": "medium-high", "resourceUsage": "medium-high",
"customization": "extreme", "customization": "extreme",
"colorPalette": ["#1D99F3", "#3DAEE9", "#0D5A8F"] "colorPalette": ["#1D99F3", "#3DAEE9", "#0D5A8F"],
"screenshot": "kde.png"
}, },
{ {
"id": "gnome", "id": "gnome",
@@ -645,7 +646,8 @@
"style": "minimalist", "style": "minimalist",
"resourceUsage": "medium-high", "resourceUsage": "medium-high",
"customization": "limited", "customization": "limited",
"colorPalette": ["#4A86CF", "#3584E4", "#1C71D8"] "colorPalette": ["#4A86CF", "#3584E4", "#1C71D8"],
"screenshot": "gnome.png"
}, },
{ {
"id": "xfce", "id": "xfce",
@@ -654,7 +656,8 @@
"style": "traditional", "style": "traditional",
"resourceUsage": "low", "resourceUsage": "low",
"customization": "moderate", "customization": "moderate",
"colorPalette": ["#2EB8E6", "#00AAD4", "#007EA8"] "colorPalette": ["#2EB8E6", "#00AAD4", "#007EA8"],
"screenshot": "xfce.png"
}, },
{ {
"id": "cinnamon", "id": "cinnamon",
@@ -663,7 +666,8 @@
"style": "traditional", "style": "traditional",
"resourceUsage": "medium", "resourceUsage": "medium",
"customization": "good", "customization": "good",
"colorPalette": ["#87CF3E", "#6BBD2B", "#4E9A1A"] "colorPalette": ["#87CF3E", "#6BBD2B", "#4E9A1A"],
"screenshot": "cinnamon.png"
}, },
{ {
"id": "mate", "id": "mate",
@@ -672,7 +676,8 @@
"style": "traditional", "style": "traditional",
"resourceUsage": "low-medium", "resourceUsage": "low-medium",
"customization": "good", "customization": "good",
"colorPalette": ["#6CAD54", "#4E8A3A", "#356425"] "colorPalette": ["#6CAD54", "#4E8A3A", "#356425"],
"screenshot": "mate.png"
}, },
{ {
"id": "lxqt", "id": "lxqt",
@@ -681,7 +686,8 @@
"style": "minimal", "style": "minimal",
"resourceUsage": "very-low", "resourceUsage": "very-low",
"customization": "moderate", "customization": "moderate",
"colorPalette": ["#0099CC", "#0077AA", "#005588"] "colorPalette": ["#0099CC", "#0077AA", "#005588"],
"screenshot": "lxqt.png"
}, },
{ {
"id": "budgie", "id": "budgie",
@@ -690,7 +696,8 @@
"style": "modern", "style": "modern",
"resourceUsage": "medium", "resourceUsage": "medium",
"customization": "moderate", "customization": "moderate",
"colorPalette": ["#6BCA81", "#4CAF50", "#388E3C"] "colorPalette": ["#6BCA81", "#4CAF50", "#388E3C"],
"screenshot": "budgie.png"
}, },
{ {
"id": "pantheon", "id": "pantheon",
@@ -699,7 +706,8 @@
"style": "mac-like", "style": "mac-like",
"resourceUsage": "medium", "resourceUsage": "medium",
"customization": "very-limited", "customization": "very-limited",
"colorPalette": ["#64BAFF", "#3689E6", "#0D52BF"] "colorPalette": ["#64BAFF", "#3689E6", "#0D52BF"],
"screenshot": "pantheon.png"
}, },
{ {
"id": "cosmic", "id": "cosmic",
@@ -708,7 +716,8 @@
"style": "modern", "style": "modern",
"resourceUsage": "medium", "resourceUsage": "medium",
"customization": "good", "customization": "good",
"colorPalette": ["#FAA41A", "#48B9C7", "#574F4A"] "colorPalette": ["#FAA41A", "#48B9C7", "#574F4A"],
"screenshot": "cosmic.png"
}, },
{ {
"id": "dde", "id": "dde",
@@ -717,7 +726,8 @@
"style": "beautiful", "style": "beautiful",
"resourceUsage": "medium-high", "resourceUsage": "medium-high",
"customization": "moderate", "customization": "moderate",
"colorPalette": ["#0082FC", "#006DD9", "#0052A3"] "colorPalette": ["#0082FC", "#006DD9", "#0052A3"],
"screenshot": "dde.png"
}, },
{ {
"id": "i3", "id": "i3",
@@ -726,7 +736,8 @@
"style": "minimal-tiling", "style": "minimal-tiling",
"resourceUsage": "very-low", "resourceUsage": "very-low",
"customization": "extreme", "customization": "extreme",
"colorPalette": ["#285577", "#1C3D5A", "#122A40"] "colorPalette": ["#285577", "#1C3D5A", "#122A40"],
"screenshot": "i3.png"
}, },
{ {
"id": "hyprland", "id": "hyprland",
@@ -735,7 +746,8 @@
"style": "minimal-tiling", "style": "minimal-tiling",
"resourceUsage": "low", "resourceUsage": "low",
"customization": "extreme", "customization": "extreme",
"colorPalette": ["#00D4AA", "#00B894", "#009874"] "colorPalette": ["#00D4AA", "#00B894", "#009874"],
"screenshot": "hyprland.png"
} }
], ],
"criticalQuestions": [ "criticalQuestions": [
client/src/lib/scoring.ts
+11 -10
View File
@@ -57,20 +57,21 @@ export function calculateDistroScores(preferences: UserPreferences): ScoredDistr
}); });
preferences.superLikedDEs.forEach(de => { preferences.superLikedDEs.forEach(de => {
const deKey = de.toLowerCase().replace(/\s+/g, '').replace('plasma', ''); const deKey = de.toLowerCase().replace(/\s+/g, '').replace('plasma', '').replace('/', '');
const matchingDistros = DE_SCORES[deKey] || []; const matchingDistros = DE_SCORES[deKey] || DE_SCORES[de.toLowerCase()] || [];
matchingDistros.forEach(distroId => { matchingDistros.forEach(distroId => {
scores[distroId] = (scores[distroId] || 0) + 15; scores[distroId] = (scores[distroId] || 0) + 50;
if (!matchReasons[distroId]) matchReasons[distroId] = []; if (!matchReasons[distroId]) matchReasons[distroId] = [];
matchReasons[distroId].push(`${de} masaüstü ortamını çok beğendin`); matchReasons[distroId].push(`${de} masaüstü ortamını bayıldın!`);
}); });
}); });
preferences.likedDEs.forEach(de => { preferences.likedDEs.forEach(de => {
const deKey = de.toLowerCase().replace(/\s+/g, '').replace('plasma', ''); if (preferences.superLikedDEs.includes(de)) return;
const matchingDistros = DE_SCORES[deKey] || []; const deKey = de.toLowerCase().replace(/\s+/g, '').replace('plasma', '').replace('/', '');
const matchingDistros = DE_SCORES[deKey] || DE_SCORES[de.toLowerCase()] || [];
matchingDistros.forEach(distroId => { matchingDistros.forEach(distroId => {
scores[distroId] = (scores[distroId] || 0) + 8; scores[distroId] = (scores[distroId] || 0) + 10;
if (!matchReasons[distroId]?.some(r => r.includes(de))) { if (!matchReasons[distroId]?.some(r => r.includes(de))) {
matchReasons[distroId]?.push(`${de} desteği mevcut`); matchReasons[distroId]?.push(`${de} desteği mevcut`);
} }
@@ -78,10 +79,10 @@ export function calculateDistroScores(preferences: UserPreferences): ScoredDistr
}); });
preferences.dislikedDEs.forEach(de => { preferences.dislikedDEs.forEach(de => {
const deKey = de.toLowerCase().replace(/\s+/g, '').replace('plasma', ''); const deKey = de.toLowerCase().replace(/\s+/g, '').replace('plasma', '').replace('/', '');
const matchingDistros = DE_SCORES[deKey] || []; const matchingDistros = DE_SCORES[deKey] || DE_SCORES[de.toLowerCase()] || [];
matchingDistros.forEach(distroId => { matchingDistros.forEach(distroId => {
scores[distroId] = (scores[distroId] || 0) - 5; scores[distroId] = (scores[distroId] || 0) - 15;
}); });
}); });