pizza2d1/tailwind-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add new pages, update main page grid

Browse Source
This commit is contained in:
pizza2d1
2026-10-03 20:08:13 -06:00
parent 63ffa1206c
commit c02bf7f37e
9 changed files with 160 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files
includes/all.php
+69 -10
View File
@@ -39,11 +39,11 @@ function head_css($title, $css, $dots) {
function navbar($highlighted_box) {
$selected = "
<div data-motion='icon' class='w-10 h-10 bg-indigo-100 dark:bg-indigo-900/30 rounded-xl flex items-center justify-center group-hover:bg-indigo-500 transition-colors' style='opacity: 1; transform: scale(1); filter: blur(0px);'>
<div data-motion='icon' class='w-10 h-10 bg-indigo-100 dark:bg-indigo-900/30 rounded-xl flex items-center justify-center group-hover:bg-indigo-500 transition-colors'>
<svg class='w-5 h-5 text-indigo-600 dark:text-indigo-400 group-hover:text-white transition-colors' fill='none' stroke='currentColor' viewBox='0 0 24 24'>
";
$unselected = "
<div data-motion='icon' class='w-10 h-10 bg-slate-100 dark:bg-neutral-800 rounded-xl flex items-center justify-center group-hover:bg-indigo-500 transition-colors' style='opacity: 1; transform: scale(1); filter: blur(0px);'>
<div data-motion='icon' class='w-10 h-10 bg-slate-100 dark:bg-neutral-800 rounded-xl flex items-center justify-center group-hover:bg-indigo-500 transition-colors'>
<svg class='w-5 h-5 text-slate-600 dark:text-neutral-400 group-hover:text-white transition-colors' fill='none' stroke='currentColor' viewBox='0 0 24 24'>
";
@@ -52,12 +52,12 @@ function navbar($highlighted_box) {
<div class='max-w-7xl mx-auto px-4 sm:px-6 lg:px-8'>
<div class='flex items-center justify-between h-20'>
<!-- Logo -->
<a data-motion='logo' href='/' class='flex items-center' style='opacity: 1; transform: scale(1); filter: blur(0px);'>
<a data-motion='logo' href='/' class='flex items-center'>
<img src='/assets/img/pizza-icon.png' ln-logo='' class='h-18' alt='Logo'>
</a>
<!-- Icon Navigation -->
<nav data-motion='nav' class='hidden lg:flex items-center gap-2' style='opacity: 1; transform: translateY(0px); filter: blur(0px);'>
<nav data-motion='nav' class='hidden lg:flex items-center gap-2'>
<a href='/' class='flex flex-col items-center gap-1 px-4 py-2 rounded-xl hover:bg-slate-100 dark:hover:bg-neutral-800 transition-colors group'>
" . ($highlighted_box == 1 ? $selected : $unselected) . "
<path stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6'></path>
@@ -110,7 +110,7 @@ function navbar($highlighted_box) {
</nav>
<!-- Right Actions -->
<div data-motion='actions' class='flex items-center gap-2' style='opacity: 1; transform: translateY(0px); filter: blur(0px);'>
<div data-motion='actions' class='flex items-center gap-2'>
<a href='/login.html' class='h-10 px-5 bg-linear-to-r from-indigo-500 to-indigo-600 text-white text-sm font-semibold rounded-xl hover:shadow-lg hover:shadow-indigo-500/25 transition-all flex items-center gap-2'>
Login
@@ -130,16 +130,16 @@ function footer() {
<div class='grid lg:grid-cols-12 gap-12 pb-16'>
<!-- Logo & Contact Info -->
<div class='lg:col-span-5 flex flex-col gap-8'>
<!-- <a data-motion='logo' href='#' class='flex items-center w-fit' style='opacity: 1; transform: scale(1); filter: blur(0px);'>
<!-- <a data-motion='logo' href='#' class='flex items-center w-fit'>
<img src='https://cdn.ln-cdn.com/image/placeholder-logo-full.png' ln-logo='' class='h-10' alt='Logo'>
</a> -->
<p data-motion='description' class='text-slate-600 dark:text-neutral-400 text-lg leading-relaxed max-w-sm' style='opacity: 1; transform: translateY(0px); filter: blur(0px);'>
<p data-motion='description' class='text-slate-600 dark:text-neutral-400 text-lg leading-relaxed max-w-sm'>
Taking inspiration from transgender CS students since 2022
</p>
<!-- Contact Card -->
<div data-motion='contact-card' class='p-6 bg-indigo-50 dark:bg-indigo-900/20 rounded-2xl' style='opacity: 1; transform: translateY(0px); filter: blur(0px);'>
<div data-motion='contact-card' class='p-6 bg-indigo-50 dark:bg-indigo-900/20 rounded-2xl'>
<h4 class='text-sm font-semibold text-indigo-700 dark:text-indigo-400 uppercase tracking-wide mb-4'>Get in Touch</h4>
<div class='flex flex-col gap-3'>
<a href='https://discordapp.com/users/714918826831118436' class='flex items-center gap-3 text-slate-700 dark:text-neutral-300 hover:text-indigo-600 dark:hover:text-indigo-400 transition-colors'>
@@ -171,8 +171,8 @@ function footer() {
</div>
<!-- Navigation Links -->
<div class='lg:col-span-4'>
<nav data-motion='nav' class='grid grid-cols-2 gap-8' style='opacity: 1; transform: translateY(0px); filter: blur(0px);'>
<div class='lg:col-span-6'>
<nav data-motion='nav' class='grid grid-cols-2 gap-8'>
<div>
<h4 class='text-sm font-semibold text-slate-900 dark:text-white uppercase tracking-wide mb-5'>Extras</h4>
<ul class='flex flex-col gap-3'>
@@ -184,15 +184,74 @@ function footer() {
<div>
<h4 class='text-sm font-semibold text-slate-900 dark:text-white uppercase tracking-wide mb-5'>Services</h4>
<ul class='flex flex-col gap-3'>
<li><a href='https://nextcloud.happylizard.me' class='text-slate-600 dark:text-neutral-400 hover:text-indigo-600 dark:hover:text-indigo-400 transition-colors'>Nextcloud</a></li>
<li><a href='https://navidrome.happylizard.me' class='text-slate-600 dark:text-neutral-400 hover:text-indigo-600 dark:hover:text-indigo-400 transition-colors'>Navidrome</a></li>
<li><a href='https://jellyfin.happylizard.me' class='text-slate-600 dark:text-neutral-400 hover:text-indigo-600 dark:hover:text-indigo-400 transition-colors'>Jellyfin</a></li>
<li><a href='https://jellyfin.happylizard.me' class='text-slate-600 dark:text-neutral-400 hover:text-indigo-600 dark:hover:text-indigo-400 transition-colors'>Jellyfin</a></li>
<li><a href='https://copyparty.happylizard.me' class='text-slate-600 dark:text-neutral-400 hover:text-indigo-600 dark:hover:text-indigo-400 transition-colors'>Copyparty</a></li>
<li><a href='https://gitea.happylizard.me' class='text-slate-600 dark:text-neutral-400 hover:text-indigo-600 dark:hover:text-indigo-400 transition-colors'>Gitea</a></li>
<li><a href='https://convert.happylizard.me' class='text-slate-600 dark:text-neutral-400 hover:text-indigo-600 dark:hover:text-indigo-400 transition-colors'>Any file conversion tool (Portal Runner)</a></li>
</ul>
</div>
<!--
<div>
<div data-motion='contact-card' class='p-2 h-10 bg-indigo-50 dark:bg-rose-600/20 rounded-2xl'>
<a href='https://nextcloud.happylizard.me' class='flex items-center gap-3 text-slate-700 dark:text-neutral-300 hover:text-indigo-600 dark:hover:text-indigo-400 transition-colors'>
<img src='/assets/img/nextcloud_small.png' class='h-6 w-auto'>
Nextcloud
</a>
</div>
<div data-motion='contact-card' class='p-2 h-10 bg-indigo-50 dark:bg-orange-600/20 rounded-2xl'>
<a href='https://jellyfin.happylizard.me' class='flex place-items-center gap-3 text-slate-700 dark:text-neutral-300 hover:text-indigo-600 dark:hover:text-indigo-400 transition-colors'>
Jellyfin
<img src='/assets/img/jellyfin_small.png' class='h-6 w-auto'>
</a>
</div>
</div>
-->
</nav>
</div>
</div>
<!-- Divider -->
<div class='h-px bg-slate-200 dark:bg-neutral-800'></div>
<!-- Bottom Section -->
<div class='pt-10 flex flex-col lg:flex-row items-center justify-between gap-6'>
<!-- Copyright -->
<p data-motion='copyright' class='text-sm text-slate-500 dark:text-neutral-400'>
Copyright © 2026. All rights reserved.
</p>
<!-- Legal Links -->
<ul data-motion='legal' class='flex flex-wrap items-center gap-6'>
<li><a href='/extras/privacy_policy' class='text-sm text-slate-500 dark:text-neutral-400 hover:text-indigo-600 dark:hover:text-indigo-400 transition-colors'>Privacy Policy</a></li>
<li><a href='/extras/terms_of_service' class='text-sm text-slate-500 dark:text-neutral-400 hover:text-indigo-600 dark:hover:text-indigo-400 transition-colors'>Terms of Service</a></li>
<li><a href='/extras/cookie_policy' class='text-sm text-slate-500 dark:text-neutral-400 hover:text-indigo-600 dark:hover:text-indigo-400 transition-colors'>Cookie Policy</a></li>
</ul>
<!-- Social Icons -->
<div data-motion='social' class='flex items-center gap-3'>
<a href='#' aria-label='Signal' class='w-9 h-9 rounded-lg bg-slate-100 dark:bg-neutral-800 hover:bg-indigo-100 dark:hover:bg-indigo-900/30 flex items-center justify-center text-slate-600 dark:text-neutral-400 hover:text-indigo-600 dark:hover:text-indigo-400 transition-all'>
<svg class='w-5 h-5' fill='currentColor' viewBox='0 0 32 32'>
<path d='M16 3.816c-6.726 0.004-12.178 5.457-12.178 12.184 0 2.404 0.696 4.645 1.897 6.533l-0.029-0.049-1.172 4.999 4.999-1.172c1.841 1.176 4.086 1.874 6.493 1.874 6.729 0 12.184-5.455 12.184-12.184s-5.455-12.184-12.184-12.184c-0.004 0-0.007 0-0.011 0h0.001zM9.041 27.688l-2.012 0.469 0.319 1.368 1.481-0.344c1.024 0.57 2.211 1.044 3.46 1.36l0.103 0.022 0.337-1.363c-1.394-0.354-2.619-0.875-3.738-1.555l0.060 0.034zM2.48 24.642l1.368 0.319 0.469-2.012c-0.643-1.062-1.162-2.291-1.492-3.596l-0.020-0.093-1.362 0.337c0.338 1.352 0.812 2.539 1.421 3.64l-0.039-0.076zM5.782 28.443l-2.903 0.679 0.677-2.903-1.368-0.321-0.677 2.903c-0.024 0.096-0.037 0.207-0.037 0.321 0 0.776 0.629 1.406 1.406 1.406 0.114 0 0.224-0.014 0.33-0.039l-0.010 0.002 2.9-0.665zM13.964 2.561c0.612-0.097 1.317-0.152 2.036-0.152s1.424 0.055 2.112 0.162l-0.077-0.010 0.214-1.39c-0.675-0.107-1.454-0.169-2.247-0.169s-1.572 0.061-2.332 0.18l0.085-0.011zM28.84 8.248l-1.205 0.721c0.666 1.083 1.201 2.337 1.538 3.669l0.020 0.094 1.363-0.337c-0.394-1.571-0.984-2.953-1.754-4.212l0.037 0.065zM5.061 7.938c0.822-1.107 1.772-2.057 2.843-2.853l0.036-0.026-0.844-1.132c-1.218 0.905-2.263 1.95-3.139 3.128l-0.028 0.040zM24.060 5.059c1.107 0.822 2.057 1.772 2.853 2.843l0.026 0.036 1.132-0.843c-0.905-1.218-1.95-2.263-3.128-3.139l-0.040-0.028zM26.939 24.063c-0.822 1.106-1.772 2.055-2.843 2.851l-0.036 0.026 0.835 1.132c1.221-0.905 2.269-1.95 3.148-3.128l0.028-0.040zM18.036 29.44c-0.612 0.097-1.317 0.152-2.036 0.152s-1.424-0.055-2.112-0.162l0.077 0.010-0.212 1.39c0.675 0.107 1.454 0.169 2.247 0.169s1.572-0.061 2.332-0.18l-0.085 0.011zM30.557 19.599l-1.362-0.337c-0.358 1.428-0.893 2.683-1.593 3.827l0.034-0.059 1.205 0.726c0.734-1.196 1.324-2.581 1.695-4.053l0.022-0.103zM29.59 16c0 0.003 0 0.006 0 0.009 0 0.716-0.055 1.419-0.162 2.104l0.010-0.076 1.39 0.21c0.107-0.675 0.169-1.454 0.169-2.247s-0.061-1.572-0.18-2.331l0.011 0.085-1.39 0.211c0.097 0.61 0.152 1.312 0.152 2.028 0 0.003 0 0.006 0 0.009v-0zM23.752 28.839l-0.722-1.205c-1.083 0.666-2.337 1.201-3.669 1.538l-0.094 0.020 0.337 1.363c1.572-0.394 2.954-0.984 4.213-1.754l-0.065 0.037zM2.41 15.999c0-0.003 0-0.006 0-0.009 0-0.716 0.055-1.419 0.162-2.104l-0.010 0.076-1.39-0.21c-0.107 0.675-0.169 1.454-0.169 2.247s0.061 1.572 0.179 2.331l-0.011-0.085 1.39-0.211c-0.097-0.61-0.152-1.312-0.152-2.028 0-0.002 0-0.005 0-0.007v0zM3.16 8.248c-0.734 1.195-1.323 2.578-1.695 4.048l-0.022 0.103 1.362 0.337c0.358-1.428 0.894-2.683 1.595-3.827l-0.034 0.059zM19.599 1.442l-0.337 1.362c1.428 0.358 2.683 0.893 3.827 1.593l-0.059-0.034 0.726-1.205c-1.196-0.734-2.581-1.324-4.053-1.695l-0.103-0.022zM12.401 1.442l0.337 1.362c-1.428 0.358-2.683 0.893-3.827 1.593l0.059-0.034-0.722-1.205c1.195-0.734 2.579-1.323 4.049-1.695l0.103-0.022z'></path>
</svg>
</a>
<a href='#' aria-label='Pinterest' class='w-9 h-9 rounded-lg bg-slate-100 dark:bg-neutral-800 hover:bg-indigo-100 dark:hover:bg-indigo-900/30 flex items-center justify-center text-slate-600 dark:text-neutral-400 hover:text-indigo-600 dark:hover:text-indigo-400 transition-all'>
<svg class='w-4 h-4' fill='currentColor' viewBox='0 0 24 24'>
<path d='M12 0c-6.627 0-12 5.372-12 12 0 5.084 3.163 9.426 7.627 11.174-.105-.949-.2-2.405.042-3.441.218-.937 1.407-5.965 1.407-5.965s-.359-.719-.359-1.782c0-1.668.967-2.914 2.171-2.914 1.023 0 1.518.769 1.518 1.69 0 1.029-.655 2.568-.994 3.995-.283 1.194.599 2.169 1.777 2.169 2.133 0 3.772-2.249 3.772-5.495 0-2.873-2.064-4.882-5.012-4.882-3.414 0-5.418 2.561-5.418 5.207 0 1.031.397 2.138.893 2.738.098.119.112.224.083.345l-.333 1.36c-.053.22-.174.267-.402.161-1.499-.698-2.436-2.889-2.436-4.649 0-3.785 2.75-7.262 7.929-7.262 4.163 0 7.398 2.967 7.398 6.931 0 4.136-2.607 7.464-6.227 7.464-1.216 0-2.359-.631-2.75-1.378l-.748 2.853c-.271 1.043-1.002 2.35-1.492 3.146 1.124.347 2.317.535 3.554.535 6.627 0 12-5.373 12-12 0-6.628-5.373-12-12-12z'></path>
</svg>
</a>
<a href='#' aria-label='LinkedIn' class='w-9 h-9 rounded-lg bg-slate-100 dark:bg-neutral-800 hover:bg-indigo-100 dark:hover:bg-indigo-900/30 flex items-center justify-center text-slate-600 dark:text-neutral-400 hover:text-indigo-600 dark:hover:text-indigo-400 transition-all'>
<svg class='w-4 h-4' fill='currentColor' viewBox='0 0 24 24'>
<path d='M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z'></path>
</svg>
</a>
</div>
</div>
</div>
</footer>";
}