framex/framexEngine-pro
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Firts up

Browse Source
This commit is contained in:
webclubz
2026-05-13 21:17:36 +03:00
parent e43b94ba20
commit 3a6ab777c9
49 changed files with 9247 additions and 210 deletions
Download Patch File Download Diff File Expand all files Collapse all files

86
app/views/demo/index.php Normal file
View File

@@ -0,0 +1,86 @@
<?php
$data['title'] = 'Framex Demo Pages';
$data['metaDescription'] = 'Explore modern demo pages built with Framex PHP views, Markdown views, Tailwind CSS, and reusable UI classes.';
$data['bodyClass'] = 'bg-slate-50 text-slate-950 dark:bg-slate-950 dark:text-slate-100';
$demoPages = [
[
'title' => 'Blog List',
'description' => 'A polished editorial index with featured content, filters, and responsive cards.',
'href' => '/demo/blog-list',
'label' => 'PHP view',
'color' => 'bg-pre-blue',
],
[
'title' => 'Blog Post',
'description' => 'A long-form article layout with author metadata, hero content, and related cards.',
'href' => '/demo/blog-post',
'label' => 'PHP view',
'color' => 'bg-pre-emerald',
],
[
'title' => 'Markdown Page',
'description' => 'A content page rendered from Markdown and automatically styled by `.prose`.',
'href' => '/demo/page',
'label' => 'MD view',
'color' => 'bg-pre-amber',
],
];
?>
<main>
<section class="section">
<div class="contain">
<div class="max-w-3xl">
<p class="eyebrow">Demo library</p>
<h1 class="mt-4 text-4xl font-bold text-gradient sm:text-6xl dark:text-white">
Modern pages built with the Framex view system.
</h1>
<p class="mt-6 text-lg leading-8 text-slate-600 dark:text-slate-400">
These demos show how PHP views and Markdown views can share the same template, navigation, footer, light/dark mode, and reusable Tailwind classes.
</p>
</div>
<div class="mt-12 grid gap-5 md:grid-cols-3">
<?php foreach ($demoPages as $page): ?>
<a class="card group flex min-h-72 flex-col justify-between overflow-hidden p-0" href="<?= e($page['href']) ?>">
<div class="<?= e($page['color']) ?> p-6">
<span class="inline-flex rounded-md bg-white/70 px-3 py-1 text-xs font-semibold text-slate-700 ring-1 ring-black/5 dark:bg-black/20 dark:text-white dark:ring-white/10">
<?= e($page['label']) ?>
</span>
<h2 class="mt-8 text-2xl font-bold text-current"><?= e($page['title']) ?></h2>
</div>
<div class="p-6">
<p class="text-sm leading-6 text-slate-600 dark:text-slate-400"><?= e($page['description']) ?></p>
<div class="mt-6 inline-flex items-center gap-2 text-sm font-semibold text-blue-600 group-hover:text-blue-500 dark:text-blue-400">
Open demo
<span aria-hidden="true">-></span>
</div>
</div>
</a>
<?php endforeach; ?>
</div>
</div>
</section>
<section class="section-tight border-y border-slate-200 bg-white dark:border-slate-800 dark:bg-slate-900/40">
<div class="contain grid gap-5 md:grid-cols-4">
<div class="card">
<p class="text-3xl font-semibold text-slate-950 dark:text-white">4</p>
<p class="mt-2 text-sm text-slate-600 dark:text-slate-400">Demo routes</p>
</div>
<div class="card">
<p class="text-3xl font-semibold text-slate-950 dark:text-white">2</p>
<p class="mt-2 text-sm text-slate-600 dark:text-slate-400">View types</p>
</div>
<div class="card">
<p class="text-3xl font-semibold text-slate-950 dark:text-white">4</p>
<p class="mt-2 text-sm text-slate-600 dark:text-slate-400">Preset colors</p>
</div>
<div class="card">
<p class="text-3xl font-semibold text-slate-950 dark:text-white">1</p>
<p class="mt-2 text-sm text-slate-600 dark:text-slate-400">Shared layout</p>
</div>
</div>
</section>
</main>