Safak/SWE
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Update file homepage.php

Browse Source
This commit is contained in:
Kelvi Yawo Jules Agbessi Awuklu
2024-11-16 22:34:39 +01:00
parent a813cda944
commit db6919dddf
1 changed files with 179 additions and 124 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
webseite/homepage.php
View File

@@ -136,20 +136,71 @@
require_once ("classes/SubjectData.php"); require_once ("classes/SubjectData.php");
$subjects = SubjectData::getAll(); $subjects = SubjectData::getAll();
// Function to generate color variants from base color
function generateColorVariants($baseColor) {
// Remove # if present
$baseColor = ltrim($baseColor, '#');
// Convert to RGB
$r = hexdec(substr($baseColor, 0, 2));
$g = hexdec(substr($baseColor, 2, 2));
$b = hexdec(substr($baseColor, 4, 2));
// Generate lighter variant for secondary
$secondary = sprintf("#%02x%02x%02x",
min(255, $r + 70),
min(255, $g + 70),
min(255, $b + 70)
);
// Generate very light variant for background
$light = sprintf("#%02x%02x%02x",
min(255, $r + 140),
min(255, $g + 140),
min(255, $b + 140)
);
return [
'primary' => '#' . $baseColor,
'secondary' => $secondary,
'light' => $light
];
}
// Generate colors for each subject
foreach ($subjects as $subject) { foreach ($subjects as $subject) {
$colors = generateColorVariants($subject->color);
?> ?>
<a href="subject.php?subject=<?php echo($subject->id); ?>" class="block"> <a href="subject.php?subject=<?php echo($subject->id); ?>" class="block">
<div class="gradient-border p-6 card-hover bg-white"> <div class="gradient-border p-6 card-hover" style="
background: linear-gradient(145deg,
<?php echo $colors['light']; ?> 0%,
white 100%
);
border: 2px solid <?php echo $colors['secondary']; ?>;
border-radius: 1rem;
box-shadow: 0 4px 6px -1px <?php echo $colors['light']; ?>,
0 2px 4px -2px <?php echo $colors['secondary']; ?>;">
<div class="flex items-start space-x-4"> <div class="flex items-start space-x-4">
<div class="w-12 h-12 rounded-lg bg-purple-100 flex items-center justify-center"> <div class="w-12 h-12 rounded-lg flex items-center justify-center"
<i class="fas <?php echo($subject->icon); ?> text-2xl text-purple-600"></i> style="background-color: rgba(<?php
$hex = ltrim($colors['primary'], '#');
$r = hexdec(substr($hex, 0, 2));
$g = hexdec(substr($hex, 2, 2));
$b = hexdec(substr($hex, 4, 2));
echo "$r, $g, $b, 0.1";
?>)">
<i class="fas <?php echo($subject->icon); ?> text-2xl"
style="color: <?php echo $colors['primary']; ?>"></i>
</div> </div>
<div class="flex-1"> <div class="flex-1">
<h3 class="text-xl font-bold text-gray-900 mb-2"><?php echo($subject->displayName); ?></h3> <h3 class="text-xl font-bold text-gray-900 mb-2"><?php echo($subject->displayName); ?></h3>
<p class="text-gray-600 mb-4"><?php echo($subject->description); ?></p> <p class="text-gray-600 mb-4"><?php echo($subject->description); ?></p>
<div class="grid grid-cols-3 gap-4 mb-4"> <div class="grid grid-cols-3 gap-4 mb-4">
<div class="text-center p-2 rounded-lg bg-purple-50"> <div class="text-center p-2 rounded-lg"
<div class="font-bold text-purple-600">150+</div> style="background-color: <?php echo $colors['light']; ?>">
<div class="font-bold"
style="color: <?php echo $colors['primary']; ?>">150+</div>
<div class="text-sm text-gray-600">Übungen</div> <div class="text-sm text-gray-600">Übungen</div>
</div> </div>
<div class="text-center p-2 rounded-lg bg-purple-50"> <div class="text-center p-2 rounded-lg bg-purple-50">
@@ -163,7 +214,11 @@
</div> </div>
<div class="flex items-center space-x-2"> <div class="flex items-center space-x-2">
<span class="text-sm text-gray-500">Aktuelle Einheit:</span> <span class="text-sm text-gray-500">Aktuelle Einheit:</span>
<span class="px-2 py-1 rounded-full bg-purple-100 text-purple-600 text-sm">Bruchrechnung</span> <span class="px-2 py-1 rounded-full text-sm"
style="background-color: <?php echo $colors['light']; ?>;
color: <?php echo $colors['primary']; ?>">
Bruchrechnung
</span>
</div> </div>
</div> </div>
</div> </div>