pkrm.dev/app/templates/index.html
2023-12-08 03:38:43 +00:00

121 lines
6.5 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- import font awesome through CDN link -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.3.0/css/all.min.css">
<link href="https://fonts.googleapis.com/css2?family=Kanit:wght@200;300;400;500;600;700&display=swap" rel="stylesheet">
<title>Parker | pkrm.dev</title>
<meta name="robots" content="index, follow">
<meta name="theme-color" content="#000" />
<meta name="apple-mobile-web-app-title" content="Parker M." />
<meta property="og:title" content="Parker M." />
<meta property="og:url" content="https://pkrm.dev" />
<meta property="og:type" content="website" />
<meta property="og:description" content="This is my website. Take a look around." />
<meta name="description" content="This is my website. Take a look around." />
<meta name="robots" content="index, follow" />
<meta name="http-equiv" content="X-Robots-Tag : index, follow" />
<meta name="googlebot" content="index, follow" />
<meta name="twitter:card" content="summary" />
<link rel="stylesheet" href="static/index.css">
<script src="/static/index.js" defer></script>
</head>
<body>
<section id="main">
<a id="hamburger"><i class="fa-solid fa-bars"></i></a>
<a id="x"><i class="fa-solid fa-times"></i></a>
<nav>
<a href="#home">Home</a>
<a href="#about">About</a>
<!-- Send to 'end' otherwise the carousel points at the bottom won't appear because of
the footer covering them -->
<a href="#end">Projects</a>
<a href="/contact">Contact</a>
</nav>
<header>
<h2>Hi, I'm</h2>
<h1>PARKER</h1>
</header>
<nav class="icons">
<a href="https://github.com/PacketParker" target="_blank"><i class="fa-brands fa-github"></i></a>
<a href="mailto:contact@pkrm.dev" target="_blank"><i class="fa-solid fa-envelope"></i></a>
</nav>
<a href="#about" id="about-text"><i class="fa fa-angle-down"></i></a>
</section>
<section id="about">
<h1>About Me</h1>
<p>I am a Senior in high school and enjoy learning about new technologies. I currently use HTML/CSS, Python, Javascript, and SQL. I have competed at the district and state levels in SkillsUSA for Cybersecurity and Programming, and have placed 2nd for the Congressional App Challenge. This year I plan on learning more about web3 and artificial intelligence.</p>
<!-- Link to 'end' rather than 'projects' otherwise it wouldn't go to the bottom completely -->
<a href="#end" id="projects-text"><i class="fa fa-angle-down"></i></a>
</section>
<section id="projects">
<div class="slider">
<input type="radio" name="slider" title="slide1" checked="checked" class="slider__nav"/>
<input type="radio" name="slider" title="slide2" class="slider__nav"/>
<input type="radio" name="slider" title="slide3" class="slider__nav"/>
<input type="radio" name="slider" title="slide4" class="slider__nav"/>
<div class="slider__inner">
<div class="slider__contents">
<h2 class="slider__caption">PeakPass</h2>
<p class="slider__txt">
PeakPass is a password manager that also doubles as a tool to check your passwords against those that have been affected in previous data breaches. Along with this we offer a blog to teach users about standards that keep them safe online.
<br>
<br>
<a href="https://github.com/peakpass/peakpass" target="_blank" referrerpolicy="no-referrer" class="slider__button">Source Code</a>
<a href="https://peakpass.pkrm.dev" target="_blank" referrerpolicy="no-referrer" class="slider__button">View Site</a>
</p>
</div>
<div class="slider__contents">
<h2 class="slider__caption">Aqua Bot</h2>
<p class="slider__txt">
A multipurpose Discord bot made with the discord.py 2.0 library. Aqua Bot has features like moderation, an economy, gambling. In addition to this, users can play music from YouTube, Spotify, and SoundCloud thanks to lavalink.py
<br>
<br>
<a href="https://github.com/PacketParker/aquabot" target="_blank" referrerpolicy="no-referrer" class="slider__button">Source Code</a>
</p>
</div>
<div class="slider__contents">
<h2 class="slider__caption">VaultCheck</h2>
<p class="slider__txt">
Uses the bitwarden-cli tool, the Twilio API, and the HaveIBeenPwned API in order to check your vault for leaked passwords. If a compromised password is found, it alerts you with a text message.
<br>
<br>
<a href="https://github.com/PacketParker/bitwarden-password-checker" target="_blank" referrerpolicy="no-referrer" class="slider__button">Source Code</a>
</p>
</div>
<div class="slider__contents">
<h2 class="slider__caption">Messagearr</h2>
<p class="slider__txt">
Docker container that has integration with <a href="https://radarr.video/" class="inner-reference">Radarr</a> in order to allow users to request movies to be downloaded through text messaging. Currently supports the Twilio and Telnyx messaging APIs.
<br>
<br>
<a href="https://github.com/PacketParker/messagearr" target="_blank" referrerpolicy="no-referrer" class="slider__button">Source Code</a>
<a href="https://hub.docker.com/r/packetparker/messagearr" target="_blank" referrerpolicy="no-referrer" class="slider__button">Docker Hub</a>
</p>
</div>
</div>
</div>
</section>
<footer><a title="My PGP Public Key" href="/static/contact.asc">PGP Public Key</a>&emsp;&emsp;Fingerprint: 58B7 6B8B BAB8 794D 21E2 579C 95CD 2E0C 7E32 9F2A</footer>
<a id="end"></a>
</body>
</html>
<script src="https://cdn.jsdelivr.net/npm/@mojs/core"></script>