limepotato/limepot-xyz
1
0
Fork 0
Code Issues 3 Pull requests Activity

add blog button

Browse source
This commit is contained in:
nelle 2024-02-17 19:44:02 -07:00
parent c376c0eb83
commit 4681ed7441
10 changed files with 314 additions and 279 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
.vscode/launch.json vendored
View file

@ -1,6 +1,12 @@
{ {
"version": "0.2.0", "version": "0.2.0",
"configurations": [ "configurations": [
{
"command": "./node_modules/.bin/astro build",
"name": "Build prod",
"request": "launch",
"type": "node-terminal"
},
{ {
"command": "./node_modules/.bin/astro dev", "command": "./node_modules/.bin/astro dev",
"name": "Development server", "name": "Development server",

14
dist/about/index.html vendored
View file

@ -38,21 +38,23 @@
<a class="navbar-item" href="/projects"> <a class="navbar-item" href="/projects">
<span class="text-gradient">Projects</span> <span class="text-gradient">Projects</span>
</a> </a>
</div>
</div>
<div class="navbar-end"><!-- <a class="navbar-item" href="/blog">
<span class="text-gradient">Blog</span>
</a>
</div>
</div>
</nav>
<div class="navbar-end">
<!--
<a class="navbar-item" href="https://ko-fi.com/limepot"> <a class="navbar-item" href="https://ko-fi.com/limepot">
<img src="/assets/other-branding/ko-fi-button-red.png"> <img src="/assets/other-branding/ko-fi-button-red.png">
</a>--> </a>-->
</div> </div>
<!-- This JS is required for mobile users to navigate the site, working on a mobile alternative --> <!-- This JS is required for mobile users to navigate the site, working on a mobile alternative -->
<!-- This JS is required for mobile users to navigate the site, working on a mobile alternative --> <!-- This JS is required for mobile users to navigate the site, working on a mobile alternative -->
</nav>
<section class="section"> <section class="section">
<div class="container"> <div class="container">

14
dist/blog/index.html vendored
View file

@ -38,21 +38,23 @@
<a class="navbar-item" href="/projects"> <a class="navbar-item" href="/projects">
<span class="text-gradient">Projects</span> <span class="text-gradient">Projects</span>
</a> </a>
</div>
</div>
<div class="navbar-end"><!-- <a class="navbar-item" href="/blog">
<span class="text-gradient">Blog</span>
</a>
</div>
</div>
</nav>
<div class="navbar-end">
<!--
<a class="navbar-item" href="https://ko-fi.com/limepot"> <a class="navbar-item" href="https://ko-fi.com/limepot">
<img src="/assets/other-branding/ko-fi-button-red.png"> <img src="/assets/other-branding/ko-fi-button-red.png">
</a>--> </a>-->
</div> </div>
<!-- This JS is required for mobile users to navigate the site, working on a mobile alternative --> <!-- This JS is required for mobile users to navigate the site, working on a mobile alternative -->
<!-- This JS is required for mobile users to navigate the site, working on a mobile alternative --> <!-- This JS is required for mobile users to navigate the site, working on a mobile alternative -->
</nav>
<section class="section"> <section class="section">
<div class="container"> <div class="container">

14
dist/boilerplate/index.html vendored
View file

@ -37,21 +37,23 @@
<a class="navbar-item" href="/projects"> <a class="navbar-item" href="/projects">
<span class="text-gradient">Projects</span> <span class="text-gradient">Projects</span>
</a> </a>
</div>
</div>
<div class="navbar-end"><!-- <a class="navbar-item" href="/blog">
<span class="text-gradient">Blog</span>
</a>
</div>
</div>
</nav>
<div class="navbar-end">
<!--
<a class="navbar-item" href="https://ko-fi.com/limepot"> <a class="navbar-item" href="https://ko-fi.com/limepot">
<img src="/assets/other-branding/ko-fi-button-red.png"> <img src="/assets/other-branding/ko-fi-button-red.png">
</a>--> </a>-->
</div> </div>
<!-- This JS is required for mobile users to navigate the site, working on a mobile alternative --> <!-- This JS is required for mobile users to navigate the site, working on a mobile alternative -->
<!-- This JS is required for mobile users to navigate the site, working on a mobile alternative --> <!-- This JS is required for mobile users to navigate the site, working on a mobile alternative -->
</nav>
<section class="section"> <section class="section">
<div class="container"> <div class="container">

14
dist/index.html vendored
View file

@ -37,21 +37,23 @@
<a class="navbar-item" href="/projects"> <a class="navbar-item" href="/projects">
<span class="text-gradient">Projects</span> <span class="text-gradient">Projects</span>
</a> </a>
</div>
</div>
<div class="navbar-end"><!-- <a class="navbar-item" href="/blog">
<span class="text-gradient">Blog</span>
</a>
</div>
</div>
</nav>
<div class="navbar-end">
<!--
<a class="navbar-item" href="https://ko-fi.com/limepot"> <a class="navbar-item" href="https://ko-fi.com/limepot">
<img src="/assets/other-branding/ko-fi-button-red.png"> <img src="/assets/other-branding/ko-fi-button-red.png">
</a>--> </a>-->
</div> </div>
<!-- This JS is required for mobile users to navigate the site, working on a mobile alternative --> <!-- This JS is required for mobile users to navigate the site, working on a mobile alternative -->
<!-- This JS is required for mobile users to navigate the site, working on a mobile alternative --> <!-- This JS is required for mobile users to navigate the site, working on a mobile alternative -->
</nav>
<section class="section"> <section class="section">
<div class="container"> <div class="container">

14
dist/policy/index.html vendored
View file

@ -37,21 +37,23 @@
<a class="navbar-item" href="/projects"> <a class="navbar-item" href="/projects">
<span class="text-gradient">Projects</span> <span class="text-gradient">Projects</span>
</a> </a>
</div>
</div>
<div class="navbar-end"><!-- <a class="navbar-item" href="/blog">
<span class="text-gradient">Blog</span>
</a>
</div>
</div>
</nav>
<div class="navbar-end">
<!--
<a class="navbar-item" href="https://ko-fi.com/limepot"> <a class="navbar-item" href="https://ko-fi.com/limepot">
<img src="/assets/other-branding/ko-fi-button-red.png"> <img src="/assets/other-branding/ko-fi-button-red.png">
</a>--> </a>-->
</div> </div>
<!-- This JS is required for mobile users to navigate the site, working on a mobile alternative --> <!-- This JS is required for mobile users to navigate the site, working on a mobile alternative -->
<!-- This JS is required for mobile users to navigate the site, working on a mobile alternative --> <!-- This JS is required for mobile users to navigate the site, working on a mobile alternative -->
</nav>
<section class="section"> <section class="section">
<div class="container"> <div class="container">

14
dist/posts/post-1/index.html vendored
View file

@ -34,21 +34,23 @@
<a class="navbar-item" href="/projects"> <a class="navbar-item" href="/projects">
<span class="text-gradient">Projects</span> <span class="text-gradient">Projects</span>
</a> </a>
</div>
</div>
<div class="navbar-end"><!-- <a class="navbar-item" href="/blog">
<span class="text-gradient">Blog</span>
</a>
</div>
</div>
</nav>
<div class="navbar-end">
<!--
<a class="navbar-item" href="https://ko-fi.com/limepot"> <a class="navbar-item" href="https://ko-fi.com/limepot">
<img src="/assets/other-branding/ko-fi-button-red.png"> <img src="/assets/other-branding/ko-fi-button-red.png">
</a>--> </a>-->
</div> </div>
<!-- This JS is required for mobile users to navigate the site, working on a mobile alternative --> <!-- This JS is required for mobile users to navigate the site, working on a mobile alternative -->
<!-- This JS is required for mobile users to navigate the site, working on a mobile alternative --> <!-- This JS is required for mobile users to navigate the site, working on a mobile alternative -->
</nav>
<center> <center>
<h1 class="title">My First Blog Post</h1> <h1 class="title">My First Blog Post</h1>
<h2 class="subtitle"><em>Summary: This is the first post of my new blog. - Written by LimePotato on 2023-10-29</em></h2> <h2 class="subtitle"><em>Summary: This is the first post of my new blog. - Written by LimePotato on 2023-10-29</em></h2>

14
dist/posts/post-2/index.html vendored
View file

@ -34,21 +34,23 @@
<a class="navbar-item" href="/projects"> <a class="navbar-item" href="/projects">
<span class="text-gradient">Projects</span> <span class="text-gradient">Projects</span>
</a> </a>
</div>
</div>
<div class="navbar-end"><!-- <a class="navbar-item" href="/blog">
<span class="text-gradient">Blog</span>
</a>
</div>
</div>
</nav>
<div class="navbar-end">
<!--
<a class="navbar-item" href="https://ko-fi.com/limepot"> <a class="navbar-item" href="https://ko-fi.com/limepot">
<img src="/assets/other-branding/ko-fi-button-red.png"> <img src="/assets/other-branding/ko-fi-button-red.png">
</a>--> </a>-->
</div> </div>
<!-- This JS is required for mobile users to navigate the site, working on a mobile alternative --> <!-- This JS is required for mobile users to navigate the site, working on a mobile alternative -->
<!-- This JS is required for mobile users to navigate the site, working on a mobile alternative --> <!-- This JS is required for mobile users to navigate the site, working on a mobile alternative -->
</nav>
<center> <center>
<h1 class="title">My Second Blog Post</h1> <h1 class="title">My Second Blog Post</h1>
<h2 class="subtitle"><em>Summary: This is the second post of my new blog. - Written by LimePotato on 2023-10-29</em></h2> <h2 class="subtitle"><em>Summary: This is the second post of my new blog. - Written by LimePotato on 2023-10-29</em></h2>

14
dist/projects/index.html vendored
View file

@ -38,21 +38,23 @@
<a class="navbar-item" href="/projects"> <a class="navbar-item" href="/projects">
<span class="text-gradient">Projects</span> <span class="text-gradient">Projects</span>
</a> </a>
</div>
</div>
<div class="navbar-end"><!-- <a class="navbar-item" href="/blog">
<span class="text-gradient">Blog</span>
</a>
</div>
</div>
</nav>
<div class="navbar-end">
<!--
<a class="navbar-item" href="https://ko-fi.com/limepot"> <a class="navbar-item" href="https://ko-fi.com/limepot">
<img src="/assets/other-branding/ko-fi-button-red.png"> <img src="/assets/other-branding/ko-fi-button-red.png">
</a>--> </a>-->
</div> </div>
<!-- This JS is required for mobile users to navigate the site, working on a mobile alternative --> <!-- This JS is required for mobile users to navigate the site, working on a mobile alternative -->
<!-- This JS is required for mobile users to navigate the site, working on a mobile alternative --> <!-- This JS is required for mobile users to navigate the site, working on a mobile alternative -->
</nav>
<section class="section"> <section class="section">
<div class="container"> <div class="container">

51
src/components/Header.astro
View file

@ -1,12 +1,22 @@
--- ---
--- ---
<nav class="navbar" role="navigation" aria-label="main navigation"> <nav class="navbar" role="navigation" aria-label="main navigation">
<div class="navbar-brand"> <div class="navbar-brand">
<a class="navbar-item" href="/"> <a class="navbar-item" href="/">
<img src="/assets/profileimages/lunanelle.jpeg" style="border-radius: 20%"> <img
src="/assets/profileimages/lunanelle.jpeg"
style="border-radius: 20%"
/>
<span class="text-gradient">LimePot</span> <span class="text-gradient">LimePot</span>
</a> </a>
<a role="button" class="navbar-burger" data-target="navMenu" aria-label="menu" aria-expanded="false"> <a
role="button"
class="navbar-burger"
data-target="navMenu"
aria-label="menu"
aria-expanded="false"
>
<span aria-hidden="true"></span> <span aria-hidden="true"></span>
<span aria-hidden="true"></span> <span aria-hidden="true"></span>
<span aria-hidden="true"></span> <span aria-hidden="true"></span>
@ -21,38 +31,41 @@
<a class="navbar-item" href="/projects"> <a class="navbar-item" href="/projects">
<span class="text-gradient">Projects</span> <span class="text-gradient">Projects</span>
</a> </a>
<a class="navbar-item" href="/blog">
<span class="text-gradient">Blog</span>
</a>
</div> </div>
</div> </div>
</div> </nav>
<div class="navbar-end"><!-- <div class="navbar-end">
<!--
<a class="navbar-item" href="https://ko-fi.com/limepot"> <a class="navbar-item" href="https://ko-fi.com/limepot">
<img src="/assets/other-branding/ko-fi-button-red.png"> <img src="/assets/other-branding/ko-fi-button-red.png">
</a>--> </a>-->
</div> </div>
</div>
</div>
</div>
<!-- This JS is required for mobile users to navigate the site, working on a mobile alternative -->
<script>document.addEventListener('DOMContentLoaded', () => {
<!-- This JS is required for mobile users to navigate the site, working on a mobile alternative -->
<script>
document.addEventListener("DOMContentLoaded", () => {
// Get all "navbar-burger" elements // Get all "navbar-burger" elements
const $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0); const $navbarBurgers = Array.prototype.slice.call(
document.querySelectorAll(".navbar-burger"),
0
);
// Add a click event on each of them // Add a click event on each of them
$navbarBurgers.forEach( el => { $navbarBurgers.forEach((el) => {
el.addEventListener('click', () => { el.addEventListener("click", () => {
// Get the target from the "data-target" attribute // Get the target from the "data-target" attribute
const target = el.dataset.target; const target = el.dataset.target;
const $target = document.getElementById(target); const $target = document.getElementById(target);
// Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu" // Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu"
el.classList.toggle('is-active'); el.classList.toggle("is-active");
$target.classList.toggle('is-active'); $target.classList.toggle("is-active");
}); });
}); });
});
});</script> </script>
<!-- This JS is required for mobile users to navigate the site, working on a mobile alternative --> <!-- This JS is required for mobile users to navigate the site, working on a mobile alternative -->
</nav>