Skip to content
This repository was archived by the owner on Mar 26, 2026. It is now read-only.

Rebuild website with Eleventy and interactive hero system #8

Open
JasperNoBoxDev wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Rebuild website with Eleventy and interactive hero system #8

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 16 additions & 0 deletions .eleventy.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
module.exports = function (eleventyConfig) {
eleventyConfig.addPassthroughCopy("styles.css");
eleventyConfig.addPassthroughCopy("main.js");
eleventyConfig.addPassthroughCopy("assets");
eleventyConfig.addPassthroughCopy("CNAME");

return {
dir: {
input: ".",
output: "_site",
includes: "_includes",
},
templateFormats: ["njk"],
htmlTemplateEngine: false,
};
};
3 changes: 3 additions & 0 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
_site/
node_modules/
.DS_Store
34 changes: 34 additions & 0 deletions _includes/base.njk
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="theme-color" content="#FE795D">

<title>{{ title }}</title>
<meta name="description" content="{{ description }}">
<link rel="icon" type="image/svg+xml" href="/assets/images/logo.svg">

<meta property="og:title" content="{{ ogTitle or title }}">
<meta property="og:description" content="{{ ogDescription or description }}">
<meta property="og:type" content="website">
<meta property="og:site_name" content="No Box Dev">
<meta property="og:url" content="{{ canonical }}">
<meta property="og:image" content="{{ ogImage or 'https://noboxdev.com/assets/images/logo.svg' }}">

<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="{{ ogTitle or title }}">
<meta name="twitter:description" content="{{ ogDescription or description }}">

<link rel="canonical" href="{{ canonical }}">
<link rel="stylesheet" href="/styles.css">

{{ headExtra | safe }}
</head>
<body>
{% include "nav.njk" %}
{{ content | safe }}
{% include "footer.njk" %}
<script src="/main.js"></script>
</body>
</html>
28 changes: 28 additions & 0 deletions _includes/footer.njk
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
<footer class="footer">
<div class="container">
<div class="footer-inner">
<div class="footer-brand">
<div class="nav-logo"><img src="/assets/images/logo-footer.svg" alt="No Box Dev"></div>
<p>We build web and mobile applications shaped by psychology and enhanced by AI. We collaborate with founders and teams to build clear, human-centered digital products.</p>
</div>
<div class="footer-links">
<div class="footer-col">
<h4>Navigation</h4>
<a href="/#services">Services</a>
<a href="/#case-studies">Case Studies</a>
<a href="/#how-we-work">How We Work</a>
<a href="/about">About</a>
<a href="/contact">Contact</a>
</div>
<div class="footer-col">
<h4>Legal</h4>
<a href="/privacy">Privacy Policy</a>
<a href="/terms">Terms & Conditions</a>
</div>
</div>
</div>
<div class="footer-bottom">
&copy; 2026 No Box Dev. All rights reserved.
</div>
</div>
</footer>
16 changes: 16 additions & 0 deletions _includes/nav.njk
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
<div class="nav-backdrop"></div>
<nav class="nav nav-transparent">
<div class="container nav-inner">
<a href="/" class="nav-logo"><img src="/assets/images/logo.svg" alt="No Box Dev"></a>
<div class="nav-links">
<a href="/#services">Services</a>
<a href="/#case-studies">Case Studies</a>
<a href="/#how-we-work">How We Work</a>
<a href="/about">About</a>
<a href="/contact" class="btn btn-primary">Contact Us</a>
</div>
<button class="nav-toggle" aria-label="Toggle menu">
<span></span><span></span><span></span>
</button>
</div>
</nav>
59 changes: 59 additions & 0 deletions about.njk
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,59 @@
---
layout: base.njk
title: "About — No Box Dev"
description: "We build web and mobile applications shaped by psychology and enhanced by AI."
canonical: "https://noboxdev.com/about"
permalink: "/about/index.html"
---

<!-- Subpage Header -->
<section class="subpage-header subpage-header--about">
<div class="subpage-wave subpage-wave--1"></div>
<div class="subpage-wave subpage-wave--2"></div>
<div class="container">
<span class="section-label reveal">About Us</span>
<h1 class="reveal">Human-centered. Psychology-driven.</h1>
<p class="reveal">We combine technical expertise with an understanding of human behavior to build digital products that truly work for the people using them.</p>
</div>
</section>

<!-- Mission -->
<section class="mission-section">
<div class="container">
<div class="mission-split reveal">
<div class="mission-text">
<span class="section-label">Our Mission</span>
<h2>Building products that make sense</h2>
<p>At No Box Dev, we believe great digital products aren't just about clean code or pretty screens. They're about understanding how people think, decide, and act — and designing technology that supports those behaviors.</p>
<p>With a psychologist on our team, we go beyond surface-level UX. We design for motivation, reduce friction, and shape behavior with intention. The result: applications that don't just function, but feel intuitive and drive real adoption.</p>
<p>Whether you're a founder with an idea or a team looking to improve an existing product, we bring structure, clarity, and shared ownership to every collaboration.</p>
</div>
<div>
<img src="/assets/images/noboxdevcontact.png" alt="No Box Dev team working" style="border-radius: var(--radius);">
</div>
</div>
</div>
</section>

<!-- Team -->
<section class="team-section">
<div class="container">
<div class="section-header reveal">
<span class="section-label">The Team</span>
<h2>Who We Are</h2>
</div>
<div class="team-placeholder reveal">
<h3>Meet the team</h3>
<p>We're a small, dedicated team of developers, designers, and a psychologist. More details coming soon.</p>
</div>
</div>
</section>

<!-- CTA -->
<section class="collab-cta">
<div class="container reveal">
<h2>Ready to build something together?</h2>
<p>We'd love to hear about your project and explore how we can help.</p>
<a href="/contact" class="btn btn-outline-white">Get in touch</a>
</div>
</section>
69 changes: 69 additions & 0 deletions contact.njk
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,69 @@
---
layout: base.njk
title: "Contact — No Box Dev"
description: "Get in touch with No Box Dev. Tell us about your project and we'll get back to you."
canonical: "https://noboxdev.com/contact"
permalink: "/contact/index.html"
---

<!-- Subpage Header with Contact Form -->
<section class="subpage-header subpage-header--contact">
<div class="subpage-wave subpage-wave--1"></div>
<div class="subpage-wave subpage-wave--2"></div>
<div class="container">
<span class="section-label reveal">Contact</span>
<h1 class="reveal">Let's get started.</h1>
<p class="reveal">Tell us about your project and we'll get back to you within 24 hours.</p>

<div class="contact-grid reveal">
<div>
<form id="contact-form" action="https://formsubmit.co/meme@noboxdev.com" method="POST">
Copy link

@coderabbitai coderabbitai bot Feb 22, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟡 Minor

Suspicious form action email address.

The form action uses meme@noboxdev.com which appears to be a test/placeholder email. This differs from the displayed contact email hello@noboxdev.com on Line 56. Verify this is the intended recipient address before deploying.

🔧 Suggested fix 
-        <form id="contact-form" action="https://formsubmit.co/meme@noboxdev.com" method="POST">
+        <form id="contact-form" action="https://formsubmit.co/hello@noboxdev.com" method="POST">
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
<form id="contact-form" action="https://formsubmit.co/meme@noboxdev.com" method="POST">
<form id="contact-form" action="https://formsubmit.co/hello@noboxdev.com" method="POST">
🤖 Prompt for AI Agents 
Verify each finding against the current code and only fix it if needed.

In `@contact.njk` at line 20, The form with id "contact-form" currently posts to a
suspicious test address via its action attribute ("meme@noboxdev.com"); update
the action to the intended recipient (e.g., change the email in the action URL
to hello@noboxdev.com) or confirm and replace it with the correct production
address so the contact form posts to the same displayed contact email.

<input type="hidden" name="_subject" value="New contact from NoBoxDev website">
<input type="hidden" name="_captcha" value="false">
<input type="hidden" name="_next" value="https://noboxdev.com/contact">
<div class="form-honeypot" aria-hidden="true">
<input type="text" name="_honey" tabindex="-1" autocomplete="off">
</div>

<div class="form-group">
<label for="name">Full Name</label>
<input type="text" id="name" name="name" required>
</div>

<div class="form-group">
<label for="email">Email</label>
<input type="email" id="email" name="email" required inputmode="email">
</div>

<div class="form-group">
<label for="message">Tell us about your project</label>
<textarea id="message" name="message" rows="5" placeholder="Describe your project, goals, and timeline..."></textarea>
</div>

<button type="submit" class="btn btn-primary">Send message</button>
</form>

<div class="form-success">
<h3>Message sent!</h3>
<p>We'll get back to you within 24 hours.</p>
</div>
</div>

<div class="contact-info">
<h3>Or reach us directly.</h3>
<div class="contact-detail">
<div class="label">Email</div>
<a href="mailto:hello@noboxdev.com">hello@noboxdev.com</a>
</div>
<div class="contact-detail">
<div class="label">Location</div>
<p>Available Worldwide</p>
</div>
<div class="contact-detail">
<div class="label">Response Time</div>
<p>Usually within 24 hours</p>
</div>
</div>
</div>
</div>
</section>
Loading