good video and description
This commit is contained in:
parent
763c93513d
commit
1e39b8f68a
@ -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);
|
||||||
|
|
||||||
|
|||||||
@ -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.
20
index.php
20
index.php
@ -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>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user