good video and description

This commit is contained in:
Flatlogic Bot 2026-01-26 22:31:58 +00:00
parent 763c93513d
commit 1e39b8f68a
4 changed files with 25 additions and 21 deletions

View File

@ -2,7 +2,7 @@
require_once __DIR__.'/../includes/pexels.php'; require_once __DIR__.'/../includes/pexels.php';
// We'll try to find a video that combines these themes. // We'll try to find a video that combines these themes.
// Since we can't easily find a single clip with everything, we'll pick the most descriptive one. // Since we can't easily find a single clip with everything, we'll pick the most descriptive one.
$query = 'woman cooking kitchen grocery delivery'; $query = 'woman laptop kitchen budget cooking';
$url = 'https://api.pexels.com/videos/search?query=' . urlencode($query) . '&orientation=portrait&per_page=1&page=1'; $url = 'https://api.pexels.com/videos/search?query=' . urlencode($query) . '&orientation=portrait&per_page=1&page=1';
$data = pexels_get($url); $data = pexels_get($url);

View File

@ -140,7 +140,7 @@ button,
font-weight: bold; font-weight: bold;
font-size: 1.2rem; font-size: 1.2rem;
flex-shrink: 0; flex-shrink: 0;
margin-right: 1.5rem; margin-right: 1rem;
} }
.feature-list h5 { .feature-list h5 {
@ -389,7 +389,7 @@ footer {
} }
.auth-image-overlay { .auth-image-overlay {
background: linear-gradient(135deg, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.3) 100%); background: linear-gradient(135deg, rgba(45, 106, 79, 0.1) 0%, rgba(0, 0, 0, 0.4) 100%);
width: 100%; width: 100%;
height: 100%; height: 100%;
position: relative; position: relative;
@ -402,7 +402,7 @@ footer {
content: ''; content: '';
position: absolute; position: absolute;
border-radius: 50%; border-radius: 50%;
background: rgba(212, 163, 115, 0.2); background: rgba(45, 106, 79, 0.2);
filter: blur(80px); filter: blur(80px);
z-index: 0; z-index: 0;
} }
@ -429,14 +429,14 @@ footer {
} }
.auth-branding-content { .auth-branding-content {
background: rgba(255, 255, 255, 0.08); background: rgba(45, 106, 79, 0.15);
backdrop-filter: blur(25px) saturate(180%); backdrop-filter: blur(25px) saturate(180%);
-webkit-backdrop-filter: blur(25px) saturate(180%); -webkit-backdrop-filter: blur(25px) saturate(180%);
border: 1px solid rgba(255, 255, 255, 0.2); border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 48px; border-radius: 40px;
padding: 60px 50px; padding: 40px;
max-width: 580px; max-width: 520px;
box-shadow: 0 40px 100px -20px rgba(0, 0, 0, 0.4); box-shadow: 0 40px 100px -20px rgba(0, 0, 0, 0.3);
animation: slideUpFade 1s cubic-bezier(0.2, 0.8, 0.2, 1); animation: slideUpFade 1s cubic-bezier(0.2, 0.8, 0.2, 1);
z-index: 1; z-index: 1;
} }
@ -464,14 +464,14 @@ footer {
.auth-branding-content p.lead { .auth-branding-content p.lead {
color: rgba(255, 255, 255, 0.9) !important; color: rgba(255, 255, 255, 0.9) !important;
font-weight: 500; font-weight: 500;
font-size: 1.25rem; font-size: 1.15rem;
line-height: 1.6; line-height: 1.5;
letter-spacing: -0.2px; letter-spacing: -0.2px;
} }
.feature-list h5 { .feature-list h5 {
color: #ffffff !important; color: #ffffff !important;
font-size: 1.3rem; font-size: 1.2rem;
font-weight: 600; font-weight: 600;
margin: 0; margin: 0;
} }

Binary file not shown.

View File

@ -27,7 +27,7 @@
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
<link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>_v13"> <link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>_v16">
</head> </head>
<body> <body>
@ -68,27 +68,31 @@
<div class="position-absolute floating-emoji" style="top: 35%; left: 5%; font-size: 2.5rem; --rotate: -20deg; animation-delay: 2s;">🥖</div> <div class="position-absolute floating-emoji" style="top: 35%; left: 5%; font-size: 2.5rem; --rotate: -20deg; animation-delay: 2s;">🥖</div>
<div class="position-absolute floating-emoji" style="bottom: 25%; right: 5%; font-size: 2rem; --rotate: 10deg; animation-delay: 1.5s;">🥗</div> <div class="position-absolute floating-emoji" style="bottom: 25%; right: 5%; font-size: 2rem; --rotate: 10deg; animation-delay: 1.5s;">🥗</div>
<div class="text-center mb-5 position-relative"> <div class="text-center mb-4 position-relative">
<h1 class="display-3 fw-bold mb-3 text-white" style="letter-spacing: -2px;">FoodieFlow</h1> <h1 class="display-3 fw-bold mb-2 text-white" style="letter-spacing: -2px;">FoodieFlow</h1>
<p class="lead px-4 text-white opacity-75">An AI-powered flow from recipe to grocery every day, every occasion</p> <p class="lead px-4 text-white opacity-75">An AI-powered flow from recipe to grocery every day, every occasion</p>
</div> </div>
<div class="feature-list mt-5 text-start position-relative"> <div class="feature-list mt-4 text-start position-relative">
<div class="d-flex mb-3 align-items-center transition-all feature-item"> <div class="d-flex mb-3 align-items-center transition-all feature-item">
<span class="checkmark"></span> <span class="checkmark"></span>
<h5 class="mb-0">AI Recipes from Photos 📸</h5> <h5 class="mb-0">AI Recipes from Photos</h5>
</div> </div>
<div class="d-flex mb-3 align-items-center transition-all feature-item"> <div class="d-flex mb-3 align-items-center transition-all feature-item">
<span class="checkmark"></span> <span class="checkmark"></span>
<h5 class="mb-0">Smart Shopping Lists 🛒</h5> <h5 class="mb-0">Smart Shopping Lists</h5>
</div> </div>
<div class="d-flex mb-3 align-items-center transition-all feature-item"> <div class="d-flex mb-3 align-items-center transition-all feature-item">
<span class="checkmark"></span> <span class="checkmark"></span>
<h5 class="mb-0">Holiday & Event Planning 🥳</h5> <h5 class="mb-0">AI Recipe Flow on Laptop</h5>
</div>
<div class="d-flex mb-3 align-items-center transition-all feature-item">
<span class="checkmark"></span>
<h5 class="mb-0">Smart Budget Calculator</h5>
</div> </div>
<div class="d-flex align-items-center transition-all feature-item"> <div class="d-flex align-items-center transition-all feature-item">
<span class="checkmark"></span> <span class="checkmark"></span>
<h5 class="mb-0">Expense Control & Splitting 💸</h5> <h5 class="mb-0">Expense Control & Splitting</h5>
</div> </div>
</div> </div>
</div> </div>