pizza2d1/tailwind-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
fad04384ab5af8e9fc17a625ec2b631c13d30d18
tailwind-website/includes/all.php
T
pizza2d1 fad04384ab Finished main page
2026-10-01 19:25:39 -06:00

320 lines
20 KiB
PHP
Raw Blame History

<?php
function head($title) {
return "
<head>
<meta charset='UTF-8' />
<meta name='viewport' content='width=device-width, initial-scale=1.0' />
<script src='https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4'></script>
<title>" . $title . "</title>
</head>";
}
function head_css($title, $css, $dots) {
$css_links = "";
foreach($css as $css_item) {
$css_links .= "<link rel='stylesheet' href='". "$dots/css/$css_item" ."'";
}
return "
<head>
<meta charset='UTF-8' />
<meta name='viewport' content='width=device-width, initial-scale=1.0' />
<script src='https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4'></script>
<title>" . $title . "</title>
$css_links
</head>";
}
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);'>
<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);'>
<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'>
";
return "
<header id='_header_icon_nav_h10_001' class='relative bg-white dark:bg-neutral-950 border-b border-slate-100 dark:border-neutral-900'>
<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);'>
<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);'>
<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>
</svg>
</div>
<span class='text-xs font-medium text-slate-600 dark:text-neutral-400 group-hover:text-indigo-600 dark:group-hover:text-indigo-400 transition-colors'>
Home
</span>
</a>
<a href='/projects/' 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 == 2 ? $selected : $unselected) . "
<path stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10'></path>
</svg>
</div>
<span class='text-xs font-medium text-slate-600 dark:text-neutral-400 group-hover:text-indigo-600 dark:group-hover:text-indigo-400 transition-colors'>
Projects
</span>
</a>
<a href='https://pizza2d1.github.io/server_links' 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 == 3 ? $selected : $unselected) . "
<path stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z'></path>
</svg>
</div>
<span class='text-xs font-medium text-slate-600 dark:text-neutral-400 group-hover:text-indigo-600 dark:group-hover:text-indigo-400 transition-colors'>
Services
</span>
</a>
<a href='/wip' 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 == 4 ? $selected : $unselected) . "
<path stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z'></path>
</svg>
</div>
<span class='text-xs font-medium text-slate-600 dark:text-neutral-400 group-hover:text-indigo-600 dark:group-hover:text-indigo-400 transition-colors'>
Certificates
</span>
</a>
<a href='/socials/' 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 == 5 ? $selected : $unselected) . "
<path stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z'></path>
</svg>
</div>
<span class='text-xs font-medium text-slate-600 dark:text-neutral-400 group-hover:text-indigo-600 dark:group-hover:text-indigo-400 transition-colors'>
Socials
</span>
</a>
</nav>
<!-- Right Actions -->
<div data-motion='actions' class='flex items-center gap-2' style='opacity: 1; transform: translateY(0px); filter: blur(0px);'>
<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
</a>
</div>
</div>
</div>
</header>
";
}
function grid() {
return "
<section id='_features_minimal_icons_v6_001' class='py-20 sm:py-24 bg-slate-50 dark:bg-neutral-900'>
<div class='max-w-7xl mx-auto px-4 sm:px-6 lg:px-8'>
<!-- Centered Header -->
<div class='text-center max-w-3xl mx-auto mb-16' data-motion='header' style='opacity: 1;'>
<!-- <h1 class='text-indigo-400 text-l font-bold'>Balls</h1> -->
<h2 class='text-slate-900 dark:text-white text-4xl sm:text-5xl font-bold mb-6'>
Services
</h2>
<div id='content'>
<p data-animate='text' class='text-slate-600 dark:text-neutral-400 text-lg' style='opacity: 1;'>
A list of just SOME of the services that are available on the website FOR FREE (if you want accounts you need to contact me) <a href='/socials'>Contact Page</a>
</p>
</div>
</div>
<!-- Bento Grid Features -->
<div class='grid lg:grid-cols-3 gap-5'>
<!-- Large Feature Card -->
<div data-motion='card' class='lg:col-span-2 p-8 bg-neutral-300 dark:bg-neutral-800 rounded-3xl' style='opacity: 1; transform: translateY(0px); filter: blur(0px);'>
<a href='https://nextcloud.happylizard.me'>
<div class='grid sm:grid-cols-2 gap-8'>
<div>
<div data-motion='icon' class='w-40 h-20 rounded-2xl flex items-center justify-center mb-6'>
<img src='/assets/img/nextcloud.png'>
</div>
<h3 class='text-slate-900 dark:text-white text-2xl font-semibold mb-3'>Nextcloud</h3>
<p class='text-slate-600 dark:text-neutral-400 text-base'>
A open source collaboration tool with file storage, nextcloud talk, nextcloud office and other suite options
</p>
</div>
<div class='rounded-2xl overflow-hidden'>
<img data-motion='image' src='/assets/img/nextcloud_showcase.png' class='w-full object-cover rounded-3xl'>
</div>
</div>
</a>
<a data-motion='button' href='https://nextcloud.com/' class='inline-flex items-center gap-2 text-purple-500 font-medium hover:gap-3 transition-all duration-300 w-fit mt-6' style='opacity: 1; transform: translateY(0px); filter: blur(0px);'>
Nextcloud Official Website
<svg class='w-4 h-4' fill='none' stroke='currentColor' viewBox='0 0 24 24'>
<path stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M17 8l4 4m0 0l-4 4m4-4H3'></path>
</svg>
</a>
</div>
<!-- Accent Card -->
<div data-motion='card' class='p-8 bg-indigo-600 rounded-3xl flex flex-col justify-between'>
<a href='https://navidrome.happylizard.me'>
<div>
<div data-motion='icon' class='w-20 h-20 rounded-xl flex items-center justify-center mb-6'>
<img src='assets/img/navidrome_dark.png'>
</div>
<h3 class='text-white text-xl font-semibold mb-3'>Navidrome</h3>
<p class='text-indigo-100 text-base'>
Music streaming service that you can connect to your laptop/phone with compatible subsonic/opensonic clients (5000+ songs)
</p>
</div>
</a>
<a data-motion='button' href='https://www.navidrome.org/apps/' class='inline-flex items-center gap-2 text-white font-medium hover:gap-3 transition-all duration-300 w-fit mt-6'>
Navidrome compatible clients
<svg class='w-4 h-4' fill='none' stroke='currentColor' viewBox='0 0 24 24'>
<path stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M17 8l4 4m0 0l-4 4m4-4H3'></path>
</svg>
</a>
</div>
<!-- Small Feature Cards -->
<div data-motion='card' class='p-6 bg-white dark:bg-neutral-800 rounded-3xl'>
<a href='https://nextcloud.happylizard.me'>
<div data-motion='icon' class='w-15 h-15 flex items-center justify-center mb-5'>
<img src='assets/img/gitea.png'>
</div>
<h3 class='text-slate-900 dark:text-white text-lg font-semibold mb-2'>Gitea</h3>
<p class='text-slate-600 dark:text-neutral-400 text-sm'>
A self-hosted version of github/gitlab that works pretty well
</p>
</a>
</div>
<div data-motion='card' class='p-6 bg-white dark:bg-neutral-800 rounded-3xl' style='opacity: 1; transform: translateY(0px); filter: blur(0px);'>
<a href='https://nextcloud.happylizard.me'>
<div data-motion='icon' class='w-15 h-15 flex items-center justify-center mb-5'>
<img src='assets/img/portal_runner.png'>
</div>
<h3 class='text-slate-900 dark:text-white text-lg font-semibold mb-2'>Any-File converter</h3>
<p class='text-slate-600 dark:text-neutral-400 text-sm'>
A ffmpeg converter that attempts to take any file and convert it into another format SYNCRONOUSLY
</p>
</a>
<a data-motion='button' href='https://www.youtube.com/watch?v=btUbcsTbVA8' class='inline-flex items-center gap-2 text-white font-medium hover:gap-3 transition-all duration-300 w-fit mt-6'>
Youtube video explaining it
<svg class='w-4 h-4' fill='none' stroke='currentColor' viewBox='0 0 24 24'>
<path stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M17 8l4 4m0 0l-4 4m4-4H3'></path>
</svg>
</a>
<a data-motion='button' href='https://github.com/p2r3/convert' class='inline-flex items-center gap-2 text-white font-medium hover:gap-3 transition-all duration-300 w-fit mt-6'>
Github to project
<svg class='w-4 h-4' fill='none' stroke='currentColor' viewBox='0 0 24 24'>
<path stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M17 8l4 4m0 0l-4 4m4-4H3'></path>
</svg>
</a>
</div>
<div data-motion='card' class='p-6 bg-white dark:bg-neutral-800 rounded-3xl'>
<a href='https://copyparty.happylizard.me'>
<div data-motion='icon' class='w-15 h-15 flex items-center justify-center mb-5'>
<img src='assets/img/copyparty.png'>
</div>
<h3 class='text-slate-900 dark:text-white text-lg font-semibold mb-2'>Copyparty</h3>
<p class='text-slate-600 dark:text-neutral-400 text-sm'>
A web fileserver that anybody can use, hosts most of the server files and has very good network drive support
</p>
</a>
</div>
</div>
</div>
</section>
";
}
function footer() {
return "
<footer id='_footer_nav_contact_button_v6_001' class='py-20 sm:py-24 bg-white dark:bg-neutral-950'>
<div class='max-w-7xl mx-auto px-4 sm:px-6 lg:px-8'>
<!-- Main Content Grid -->
<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);'>
<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);'>
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);'>
<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'>
<svg class='w-5 h-5 text-indigo-500' stroke='currentColor' viewBox='0 0 24 24'>
<path d='M18.59 5.88997C17.36 5.31997 16.05 4.89997 14.67 4.65997C14.5 4.95997 14.3 5.36997 14.17 5.69997C12.71 5.47997 11.26 5.47997 9.83001 5.69997C9.69001 5.36997 9.49001 4.95997 9.32001 4.65997C7.94001 4.89997 6.63001 5.31997 5.40001 5.88997C2.92001 9.62997 2.25001 13.28 2.58001 16.87C4.23001 18.1 5.82001 18.84 7.39001 19.33C7.78001 18.8 8.12001 18.23 8.42001 17.64C7.85001 17.43 7.31001 17.16 6.80001 16.85C6.94001 16.75 7.07001 16.64 7.20001 16.54C10.33 18 13.72 18 16.81 16.54C16.94 16.65 17.07 16.75 17.21 16.85C16.7 17.16 16.15 17.42 15.59 17.64C15.89 18.23 16.23 18.8 16.62 19.33C18.19 18.84 19.79 18.1 21.43 16.87C21.82 12.7 20.76 9.08997 18.61 5.88997H18.59ZM8.84001 14.67C7.90001 14.67 7.13001 13.8 7.13001 12.73C7.13001 11.66 7.88001 10.79 8.84001 10.79C9.80001 10.79 10.56 11.66 10.55 12.73C10.55 13.79 9.80001 14.67 8.84001 14.67ZM15.15 14.67C14.21 14.67 13.44 13.8 13.44 12.73C13.44 11.66 14.19 10.79 15.15 10.79C16.11 10.79 16.87 11.66 16.86 12.73C16.86 13.79 16.11 14.67 15.15 14.67Z' fill='#000000'/>
</svg>
Discord
</a>
<a href='https://signal.me/#eu/14nA-tBiLDlv3Z1DzDlmNSd_hpqwEk2EcjhmY0uWcjbTAQWx9NZGiJfkVOkMR4mS' class='flex items-center gap-3 text-slate-700 dark:text-neutral-300 hover:text-indigo-600 dark:hover:text-indigo-400 transition-colors'>
<svg class='w-5 h-5 text-indigo-500' fill='none' stroke='currentColor' viewBox='0 0 24 24'>
<path stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z'></path>
</svg>
Signal
</a>
<a href='mailto:pizza2d1@proton.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'>
<svg class='w-5 h-5 text-indigo-500' fill='none' stroke='currentColor' viewBox='0 0 24 24'>
<path stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z'></path>
</svg>
pizza2d1@proton.me
</a>
<a href='tel:+3852780007' class='flex items-center gap-3 text-slate-700 dark:text-neutral-300 hover:text-indigo-600 dark:hover:text-indigo-400 transition-colors'>
<svg class='w-5 h-5 text-indigo-500' fill='none' stroke='currentColor' viewBox='0 0 24 24'>
<path stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z'></path>
</svg>
+1 (385) 287-0007
</a>
</div>
</div>
</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>
<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'>
<li><a href='/extras/about_me' class='text-slate-600 dark:text-neutral-400 hover:text-indigo-600 dark:hover:text-indigo-400 transition-colors'>About Me</a></li>
<li><a href='/extras/privacy_policy' class='text-slate-600 dark:text-neutral-400 hover:text-indigo-600 dark:hover:text-indigo-400 transition-colors'>Privacy Policy</a></li>
<li><a href='https://pizza2d1.github.io/server_news' class='text-slate-600 dark:text-neutral-400 hover:text-indigo-600 dark:hover:text-indigo-400 transition-colors'>Server News</a></li>
</ul>
</div>
<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://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>
</nav>
</div>
</div>
</div>
</footer>";
}
function winamp() {
return "
<div id='winamp-container'></div>
<script src='https://unpkg.com/webamp@1.4.0/built/webamp.bundle.min.js'></script>
<script src='/js/webamp.js'></script>";
}
function create_profile_dirs() {
if (!is_dir("/account_uploads/".$_SESSION['username']."_uploads/")) mkdir("/account_uploads/".$_SESSION['username']."_uploads/", 0766);
}
?>
Reference in New Issue View Git Blame Copy Permalink