Skip to content

Commit

Permalink
docs: launch blankie.rest website
Browse files Browse the repository at this point in the history
codybrom committed Jan 7, 2025
1 parent 7bd279f commit 148558b
Showing 19 changed files with 1,088 additions and 105 deletions.
67 changes: 67 additions & 0 deletions .github/workflows/pages.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,67 @@
name: Deploy GitHub Pages

on:
push:
branches:
- main
paths:
- "docs/**"
- ".github/workflows/pages.yml"
pull_request:
branches:
- main
paths:
- "docs/**"
- ".github/workflows/pages.yml"
workflow_dispatch:

permissions:
contents: read
pages: write
id-token: write

concurrency:
group: "pages"
cancel-in-progress: false

jobs:
build:
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v4

- name: Setup Pages
uses: actions/configure-pages@v5

- name: Setup Ruby
uses: ruby/setup-ruby@v1
with:
ruby-version: "3.3.0"
bundler-cache: true
working-directory: ./docs

- name: Build with Jekyll
uses: actions/jekyll-build-pages@v1
with:
source: ./docs
destination: ./_site
verbose: true
env:
JEKYLL_ENV: production
VERBOSE: true

- name: Upload artifact
uses: actions/upload-pages-artifact@v3

deploy:
runs-on: ubuntu-latest
needs: build
environment:
name: github-pages
url: ${{ steps.deployment.outputs.page_url }}

steps:
- name: Deploy to GitHub Pages
id: deployment
uses: actions/deploy-pages@v4
4 changes: 3 additions & 1 deletion .gitignore
Original file line number Diff line number Diff line change
@@ -78,4 +78,6 @@ iOSInjectionProject/
# Local configuration
Configuration.xcconfig

releases/*
releases/*
docs/.jekyll-cache/
docs/_site/
5 changes: 4 additions & 1 deletion .vscode/settings.json
Original file line number Diff line number Diff line change
@@ -9,7 +9,10 @@
"swift",
"plist",
"pbxproj",
"entitlements"
"entitlements",
"md",
"yml",
"html"
],
"markdownlint.config": {
"default": true,
4 changes: 2 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<img src="brand/icon.png" alt="Blankie logo" width="128" height="128" align="left"/>
<img src="docs/assets/icon.png" alt="Blankie logo" width="128" height="128" align="left"/>

### Blankie

@@ -9,7 +9,7 @@
[![SwiftUI](https://img.shields.io/badge/Swift%20UI-0071e3.svg?logo=swift&logoColor=white)](https://developer.apple.com/xcode/swiftui/)
[![Xcode](https://img.shields.io/badge/XCode%2016-007ACC?logo=xcode&logoColor=white)](https://developer.apple.com/xcode/)
[![GitHub](https://img.shields.io/github/license/codybrom/blankie.svg)](https://github.com/codybrom/blankie/blob/master/LICENSE)
![Screenshot](brand/screenshot.png)
![Screenshot](docs/assets/screenshot.png)

## Description

9 changes: 9 additions & 0 deletions docker-compose.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
services:
jekyll:
image: jekyll/jekyll:4.2.0
command: jekyll serve --force_polling --livereload
ports:
- "4000:4000"
- "35729:35729"
volumes:
- "./docs:/srv/jekyll"
1 change: 1 addition & 0 deletions docs/CNAME
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
blankie.rest
31 changes: 23 additions & 8 deletions docs/_config.yml
Original file line number Diff line number Diff line change
@@ -1,11 +1,26 @@
# _config.yml — Just the Docs configuration
# Site Settings
title: Blankie
description: >-
Ambient sound mixer for macOS
title: "Blankie"
description: "Documentation for Blankie"
markdown: kramdown
plugins:
- jekyll-remote-theme
# Build settings
permalink: pretty

remote_theme: just-the-docs/just-the-docs
# Collections
collections:
pages:
output: true
permalink: /:path/

logo: /brand/icon.png
defaults:
- scope:
path: ""
type: "pages"
values:
layout: "default"

# Exclude files from processing
exclude:
- Gemfile
- Gemfile.lock
- vendor
367 changes: 367 additions & 0 deletions docs/_layouts/default.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,367 @@
<!DOCTYPE html>
<html lang="en" class="dark">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Blankie - {{ page.title }}</title>
<script src="https://cdn.tailwindcss.com"></script>
<script>
tailwind.config = {
darkMode: "class",
theme: {
extend: {
colors: {
"primary-blue": "#2997ff",
"deep-blue": "#0066cc",
"dark-gray": "#1a1a1a",
"light-gray": "#f0f0f0",
"coming-soon": "#71717a",
"open-source-green": "#22c55e",
},
backgroundImage: {
"bg-gradient-light":
"linear-gradient(180deg, #f0f0f0 0%, #ffffff 100%)",
"bg-gradient-dark":
"linear-gradient(180deg, #1a1a1a 0%, #0a0a0a 100%)",
},
textColor: {
skin: {
base: "var(--color-text-base)",
muted: "var(--color-text-muted)",
inverted: "var(--color-text-inverted)",
},
},
backgroundColor: {
skin: {
fill: "var(--color-bg-fill)",
card: "var(--color-bg-card)",
},
},
},
},
};
</script>
<style>
:root {
--color-text-base: #333333;
--color-text-muted: #555555;
--color-text-inverted: #ffffff;
--color-bg-fill: white;
--color-bg-card: rgba(255, 255, 255, 0.8);
}

.dark {
--color-text-base: #e0e0e0;
--color-text-muted: #a0a0a0;
--color-text-inverted: #333333;
--color-bg-fill: #0a0a0a;
--color-bg-card: rgba(255, 255, 255, 0.1);
}

html {
scroll-behavior: smooth;
}

* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text",
"SF Pro Icons", "Helvetica Neue", Helvetica, Arial, sans-serif;
line-height: 1.47059;
font-weight: 400;
letter-spacing: -0.022em;
}

.coming-soon-card {
opacity: 0.6;
filter: grayscale(40%) saturate(60%);
pointer-events: none;
}

.coming-soon-card::before {
content: "Coming Soon";
position: absolute;
top: 10px;
right: 10px;
background-color: #2997ff;
color: white;
padding: 0.3rem 0.6rem;
font-size: 0.8rem;
border-radius: 0.3rem;
font-weight: bold;
pointer-events: none;
opacity: 1;
}

.open-source-badge {
position: absolute;
top: 0.75rem;
left: 0.75rem;
background-color: #22c55e;
padding: 0.25rem 0.5rem;
color: white;
border-radius: 0.25rem;
font-size: 0.75rem;
font-weight: bold;
pointer-events: none;
}
</style>
</head>
<body class="bg-skin-fill text-skin-base overflow-x-hidden">
<header
class="bg-black/80 backdrop-blur-md border-b border-white/10 fixed w-full top-0 z-50"
>
<!-- Changed from bg-main-blue -->
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4">
<!-- Main nav wrapper -->
<nav class="flex justify-between items-center">
<!-- Logo - left side -->
<a
href="/"
class="flex items-center gap-x-3 text-white no-underline"
id="logo-link"
>
<img src="/assets/icon.png" alt="Blankie" class="h-10 w-10" />
<span class="text-2xl font-semibold tracking-tight">Blankie</span>
</a>

<!-- Mobile menu button with hamburger icon -->
<button
id="mobile-menu-button"
class="md:hidden text-white hover:text-primary-blue transition-colors duration-200 p-2"
>
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-6 w-6"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M4 6h16M4 12h16M4 18h16"
/>
</svg>
</button>

<!-- Desktop Navigation -->
<div class="hidden md:flex items-center gap-x-10">
<a
href="/usage"
class="text-white text-sm hover:text-primary-blue transition-colors duration-200"
>How to Use</a
>
<a
href="/privacy"
class="text-white text-sm hover:text-primary-blue transition-colors duration-200"
>Privacy</a
>
<a
href="/credits"
class="text-white text-sm hover:text-primary-blue transition-colors duration-200"
>Credits</a
>
<a
href="/?section=download"
class="bg-primary-blue text-white py-2 px-6 rounded-full text-sm font-normal transition-all duration-300 hover:bg-deep-blue no-underline"
>Download</a
>
</div>
</nav>

<!-- Mobile Navigation -->
<div id="mobile-menu" class="hidden md:hidden">
<div class="flex flex-col gap-y-4 pt-4 pb-6">
<!-- Added pb-6 for better spacing -->
<a
href="/usage"
class="text-white text-sm hover:text-primary-blue transition-colors duration-200"
>How to Use</a
>
<a
href="/privacy"
class="text-white text-sm hover:text-primary-blue transition-colors duration-200"
>Privacy</a
>
<a
href="/credits"
class="text-white text-sm hover:text-primary-blue transition-colors duration-200"
>Credits</a
>
<a
href="/?section=download"
class="bg-primary-blue text-white py-2 px-6 rounded-full text-sm font-normal transition-all duration-300 hover:bg-deep-blue no-underline inline-block text-center"
>Download</a
>
</div>
</div>
</div>
</header>
{{ content }}

<footer
class="bg-gray-100 dark:bg-gray-800 py-10 text-gray-500 dark:text-gray-400 text-center"
>
<div class="flex justify-center gap-x-5 mb-5">
<p>
Inspired by
<a
href="https://apps.gnome.org/Blanket/"
class="hover:text-primary-blue transition-colors duration-300"
>Blanket</a
>
for Linux
</p>
<p>
<a
href="https://github.com/codybrom"
class="hover:text-primary-blue transition-colors duration-300"
>Created by Cody Bromley</a
>
</p>
</div>
<p>© 2025 Blankie. All rights reserved.</p>
<p>
Completely free and open source on
<a
href="https://github.com/codybrom/blankie"
class="hover:text-primary-blue transition-colors duration-300"
>Github</a
>
</p>
</footer>
<script>
// Handle both download and logo links
// Handle download links
document
.querySelectorAll('a[href*="section=download"]')
.forEach((anchor) => {
anchor.addEventListener("click", function (e) {
const href = this.getAttribute("href");
const isIndexPage =
window.location.pathname === "/" ||
window.location.pathname.endsWith("index.html");

// Always prevent default if we're already on index page
if (isIndexPage) {
e.preventDefault();
const target = document.querySelector("#download");

if (target) {
const headerHeight = 80;
const additionalOffset = 200;
const totalOffset = headerHeight + additionalOffset;

const elementPosition = target.getBoundingClientRect().top;
const offsetPosition =
elementPosition + window.pageYOffset - totalOffset;

window.scrollTo({
top: offsetPosition,
behavior: "smooth",
});

// Update URL without reload
history.pushState(null, null, href);
}
return;
}
});
});

// Handle logo click
document
.getElementById("logo-link")
.addEventListener("click", function (e) {
const isIndexPage =
window.location.pathname === "/" ||
window.location.pathname.endsWith("index.html");

if (isIndexPage) {
e.preventDefault();
window.scrollTo({
top: 0,
behavior: "smooth",
});
history.pushState(null, null, "/");
}
// If not on index page, let the normal navigation happen
});

// Handle initial load with query param
window.addEventListener("load", function () {
const params = new URLSearchParams(window.location.search);
const section = params.get("section");

if (section === "download") {
const target = document.querySelector("#download");

if (target) {
const headerHeight = 80;
const additionalOffset = 200;
const totalOffset = headerHeight + additionalOffset;

requestAnimationFrame(() => {
const elementPosition = target.getBoundingClientRect().top;
const offsetPosition =
elementPosition + window.pageYOffset - totalOffset;

window.scrollTo({
top: offsetPosition,
behavior: "smooth",
});
});
}
}
});

// Mobile menu functionality
const mobileMenuButton = document.getElementById("mobile-menu-button");
const mobileMenu = document.getElementById("mobile-menu");

mobileMenuButton.addEventListener("click", () => {
// Toggle menu visibility
if (mobileMenu.classList.contains("hidden")) {
mobileMenu.classList.remove("hidden");
mobileMenu.classList.add("block");
} else {
mobileMenu.classList.add("hidden");
mobileMenu.classList.remove("block");
}
});

// Close mobile menu when clicking outside
document.addEventListener("click", (e) => {
if (
!mobileMenu.contains(e.target) &&
!mobileMenuButton.contains(e.target)
) {
mobileMenu.classList.add("hidden");
mobileMenu.classList.remove("block");
}
});

// Close mobile menu when window is resized to desktop size
window.addEventListener("resize", () => {
if (window.innerWidth >= 768) {
// 768px is the md breakpoint in Tailwind
mobileMenu.classList.add("hidden");
mobileMenu.classList.remove("block");
}
});

// Close mobile menu when clicking a link
mobileMenu.querySelectorAll("a").forEach((link) => {
link.addEventListener("click", () => {
mobileMenu.classList.add("hidden");
mobileMenu.classList.remove("block");
});
});
</script>
</body>
</html>
File renamed without changes
File renamed without changes
369 changes: 369 additions & 0 deletions docs/credits.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,369 @@
---
layout: default
title: Credits
permalink: /credits
---

<main class="max-w-5xl mx-auto px-5 pt-20 pb-10">
<section class="text-skin-base bg-skin-fill">
<h1 class="text-4xl font-semibold mb-6">Credits</h1>
<p class="text-skin-muted mb-4">
<strong>Developer</strong>:
<a
href="https://github.com/codybrom"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Cody Bromley</a
>
</p>

<p class="text-skin-muted mb-4">
<strong>Inspired by</strong>:
<a
href="https://github.com/rafaelmardojai/blanket"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Blanket by Rafael Mardojai CM</a
>
</p>
<h2 class="text-2xl font-semibold mt-8 mb-3">Licensing</h2>
<p class="text-skin-muted mb-4">
Blankie is © 2025 Cody Bromley and licensed under the
<a
href="https://choosealicense.com/licenses/mit/"
class="text-primary-blue hover:text-deep-blue transition-colors"
>MIT License</a
>.
</p>
<h2 class="text-2xl font-semibold mt-8 mb-3">Sound Credits</h2>
<p class="text-skin-muted mb-4">
The following table lists the sound credits for each sound used in
Blankie. You can also find these on the About panel of the app.
</p>
<div class="overflow-x-auto">
<table class="min-w-full text-left text-sm font-light">
<thead class="border-b font-medium dark:border-neutral-500">
<tr>
<th scope="col" class="px-6 py-4">Sound Name</th>
<th scope="col" class="px-6 py-4">Author</th>
<th scope="col" class="px-6 py-4">License</th>
<th scope="col" class="px-6 py-4">Editor</th>
<th scope="col" class="px-6 py-4">URL</th>
</tr>
</thead>
<tbody>
<tr class="border-b dark:border-neutral-500">
<td class="whitespace-nowrap px-6 py-4 font-medium">Birds</td>
<td class="whitespace-nowrap px-6 py-4">kvgarlic</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://creativecommons.org/publicdomain/zero/1.0/"
class="text-primary-blue hover:text-deep-blue transition-colors"
>CC0</a
>
</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://github.com/Porrumentzio"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Porrumentzio</a
>
</td>

<td class="whitespace-nowrap px-6 py-4">
<a
href="https://freesound.org/people/kvgarlic/sounds/156826/"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Link</a
>
</td>
</tr>
<tr class="border-b dark:border-neutral-500">
<td class="whitespace-nowrap px-6 py-4 font-medium">Boat</td>
<td class="whitespace-nowrap px-6 py-4">Falcet</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://creativecommons.org/publicdomain/zero/1.0/"
class="text-primary-blue hover:text-deep-blue transition-colors"
>CC0</a
>
</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://github.com/Porrumentzio"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Porrumentzio</a
>
</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://freesound.org/people/Falcet/sounds/439365/"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Link</a
>
</td>
</tr>
<tr class="border-b dark:border-neutral-500">
<td class="whitespace-nowrap px-6 py-4 font-medium">City</td>
<td class="whitespace-nowrap px-6 py-4">gezortenplotz</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://creativecommons.org/licenses/by/4.0/"
class="text-primary-blue hover:text-deep-blue transition-colors"
>CC BY</a
>
</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://github.com/Porrumentzio"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Porrumentzio</a
>
</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://freesound.org/people/gezortenplotz/sounds/44796/"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Link</a
>
</td>
</tr>
<tr class="border-b dark:border-neutral-500">
<td class="whitespace-nowrap px-6 py-4 font-medium">Coffee Shop</td>
<td class="whitespace-nowrap px-6 py-4">stephan</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://wiki.creativecommons.org/wiki/Public_domain"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Public Domain</a
>
</td>
<td class="whitespace-nowrap px-6 py-4"></td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://soundbible.com/1664-Restaurant-Ambiance.html"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Link</a
>
</td>
</tr>
<tr class="border-b dark:border-neutral-500">
<td class="whitespace-nowrap px-6 py-4 font-medium">Fireplace</td>
<td class="whitespace-nowrap px-6 py-4">ezwa</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://wiki.creativecommons.org/wiki/Public_domain"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Public Domain</a
>
</td>
<td class="whitespace-nowrap px-6 py-4"></td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://soundbible.com/1543-Fireplace.html"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Link</a
>
</td>
</tr>
<tr class="border-b dark:border-neutral-500">
<td class="whitespace-nowrap px-6 py-4 font-medium">Pink noise</td>
<td class="whitespace-nowrap px-6 py-4">Omegatron</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://creativecommons.org/licenses/by-sa/4.0/"
class="text-primary-blue hover:text-deep-blue transition-colors"
>CC BY-SA</a
>
</td>
<td class="whitespace-nowrap px-6 py-4"></td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://es.wikipedia.org/wiki/Archivo:Pink_noise.ogg"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Link</a
>
</td>
</tr>
<tr class="border-b dark:border-neutral-500">
<td class="whitespace-nowrap px-6 py-4 font-medium">Rain</td>
<td class="whitespace-nowrap px-6 py-4">alex36917</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://creativecommons.org/licenses/by/4.0/"
class="text-primary-blue hover:text-deep-blue transition-colors"
>CC BY</a
>
</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://github.com/Porrumentzio"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Porrumentzio</a
>
</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://freesound.org/people/alex36917/sounds/524605/"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Link</a
>
</td>
</tr>
<tr class="border-b dark:border-neutral-500">
<td class="whitespace-nowrap px-6 py-4 font-medium">
Summer night
</td>
<td class="whitespace-nowrap px-6 py-4">Lisa Redfern</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://wiki.creativecommons.org/wiki/Public_domain"
class="text-primary-blue hover:text-deep-blue transition-colors"
>
Public Domain</a
>
</td>
<td class="whitespace-nowrap px-6 py-4"></td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://soundbible.com/2083-Crickets-Chirping-At-Night.html"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Link</a
>
</td>
</tr>
<tr class="border-b dark:border-neutral-500">
<td class="whitespace-nowrap px-6 py-4 font-medium">Storm</td>
<td class="whitespace-nowrap px-6 py-4">Digifish music</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://creativecommons.org/licenses/by/4.0/"
class="text-primary-blue hover:text-deep-blue transition-colors"
>CC BY</a
>
</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://github.com/Porrumentzio"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Porrumentzio</a
>
</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://freesound.org/people/digifishmusic/sounds/41739/"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Link</a
>
</td>
</tr>
<tr class="border-b dark:border-neutral-500">
<td class="whitespace-nowrap px-6 py-4 font-medium">Stream</td>
<td class="whitespace-nowrap px-6 py-4">gluckose</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://creativecommons.org/publicdomain/zero/1.0/"
class="text-primary-blue hover:text-deep-blue transition-colors"
>CC0</a
>
</td>
<td class="whitespace-nowrap px-6 py-4"></td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://freesound.org/people/gluckose/sounds/333987/"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Link</a
>
</td>
</tr>
<tr class="border-b dark:border-neutral-500">
<td class="whitespace-nowrap px-6 py-4 font-medium">Train</td>
<td class="whitespace-nowrap px-6 py-4">SDLx</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://creativecommons.org/licenses/by/3.0/"
class="text-primary-blue hover:text-deep-blue transition-colors"
>CC BY 3.0</a
>
</td>
<td class="whitespace-nowrap px-6 py-4"></td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://freesound.org/people/SDLx/sounds/259988/"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Link</a
>
</td>
</tr>
<tr class="border-b dark:border-neutral-500">
<td class="whitespace-nowrap px-6 py-4 font-medium">Waves</td>
<td class="whitespace-nowrap px-6 py-4">Luftrum</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://creativecommons.org/licenses/by/4.0/"
class="text-primary-blue hover:text-deep-blue transition-colors"
>CC BY</a
>
</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://github.com/Porrumentzio"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Porrumentzio</a
>
</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://freesound.org/people/Luftrum/sounds/48412/"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Link</a
>
</td>
</tr>
<tr class="border-b dark:border-neutral-500">
<td class="whitespace-nowrap px-6 py-4 font-medium">White noise</td>
<td class="whitespace-nowrap px-6 py-4">Jorge Stolfi</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://creativecommons.org/licenses/by-sa/4.0/"
class="text-primary-blue hover:text-deep-blue transition-colors"
>CC BY-SA</a
>
</td>
<td class="whitespace-nowrap px-6 py-4"></td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://commons.wikimedia.org/w/index.php?title=File%3AWhite-noise-sound-20sec-mono-44100Hz.ogg"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Link</a
>
</td>
</tr>
<tr class="border-b dark:border-neutral-500">
<td class="whitespace-nowrap px-6 py-4 font-medium">Wind</td>
<td class="whitespace-nowrap px-6 py-4">felix.blume</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://creativecommons.org/publicdomain/zero/1.0/"
class="text-primary-blue hover:text-deep-blue transition-colors"
>CC0</a
>
</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://github.com/Porrumentzio"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Porrumentzio</a
>
</td>
<td class="whitespace-nowrap px-6 py-4">
<a
href="https://freesound.org/people/felix.blume/sounds/217506/"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Link</a
>
</td>
</tr>
</tbody>
</table>
</div>
</section>
</main>
19 changes: 0 additions & 19 deletions docs/credits.md

This file was deleted.

117 changes: 117 additions & 0 deletions docs/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,117 @@
---
layout: default
title: Ambient sound mixer for macOS
permalink: /
---

<!-- Hero Section -->
<section
class="relative overflow-hidden bg-black text-white min-h-screen flex items-center justify-center pt-10"
>
<div class="absolute top-0 left-0 right-0 bottom-0 bg-black/80 opacity-90">
<video
autoplay
loop
muted
playsinline
class="absolute top-1/2 left-1/2 min-w-full min-h-full -translate-x-1/2 -translate-y-1/2 object-cover opacity-40"
>
<source src="waves.mp4" type="video/mp4" />
</video>
</div>
<div class="relative z-10 max-w-4xl mx-auto px-5 text-center py-20">
<h1
class="text-5xl md:text-6xl font-semibold leading-tight tracking-tighter my-2"
>
Ambient sounds for your flow state.
</h1>
<h2
class="text-2xl md:text-3xl font-normal leading-normal tracking-tight mb-6"
>
<div class="flex md:justify-center flex-col md:flex-row md:space-x-2">
<span>Work smarter.</span>
<span>Focus better.</span>
<span>Rest deeper.</span>
</div>
</h2>
<img
src="/assets/screenshot.png"
alt="Screenshot of the Blankie app"
class="rounded-lg mx-auto max-w-full block transition duration-300 hover:scale-102"
/>
<div
id="download"
class="flex flex-col items-center max-w-fit mx-auto gap-y-5 mt-4"
>
<a
href="https://testflight.apple.com/join/XgpBpWv8"
class="bg-blue-500 text-white py-3 px-8 rounded-full text-lg font-normal cursor-pointer no-underline hover:bg-blue-900 transition-all duration-300 flex items-center gap-x-2"
>
Join the TestFlight</a
>
</div>
<p class="text-lg my-3">Completely free and open source</p>
</div>
</section>

<!-- Features Section -->
<section class="max-w-5xl mx-auto px-5 py-10" id="features">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
<div
class="feature-card bg-skin-card rounded-xl p-8 transition-transform duration-300 hover:translate-y-1 relative"
>
<div class="text-3xl mb-5">🔊</div>
<h3 class="text-xl font-semibold mb-2">Dulcet Tones</h3>
<p class="text-skin-muted text-base">
Built-in collection of high-quality ambient soundscapes.
</p>
</div>
<div
class="feature-card bg-skin-card rounded-xl p-8 transition-transform duration-300 hover:translate-y-1 relative"
>
<div class="text-3xl mb-5">🎚️</div>
<h3 class="text-xl font-semibold mb-2">Mixed by You</h3>
<p class="text-skin-muted text-base">
Fine-tune with individual and global volume controls.
</p>
</div>

<div
class="feature-card bg-skin-card rounded-xl p-8 transition-transform duration-300 hover:translate-y-1 relative"
>
<div class="text-3xl mb-5">💾</div>
<h3 class="text-xl font-semibold mb-2">Preset Perfection</h3>
<p class="text-skin-muted text-base">
Quick access to your favorite ambient blends.
</p>
</div>
<div
class="feature-card bg-skin-card rounded-xl p-8 transition-transform duration-300 hover:translate-y-1 relative"
>
<div class="text-3xl mb-5"></div>
<h3 class="text-xl font-semibold mb-2">Made for Mac</h3>
<p class="text-skin-muted text-base">
<i class="font-semibold">It just works</i> with media keys, Control
Center & AirPod controls.
</p>
</div>
<div
class="feature-card bg-skin-card rounded-xl p-8 transition-transform duration-300 hover:translate-y-1 relative"
>
<div class="text-3xl mb-5">♾️</div>
<h3 class="text-xl font-semibold mb-2">Open-Source & Free</h3>
<p class="text-skin-muted text-base">
No in-app purchases or subscriptions. Ever.
</p>
</div>
<div
class="feature-card bg-skin-card rounded-xl p-8 transition-transform duration-300 hover:translate-y-1 coming-soon-card relative"
>
<div class="text-3xl mb-5">📁</div>
<h3 class="text-xl font-semibold mb-2">Custom Sounds</h3>
<p class="text-skin-muted text-base">
Soon, you'll be able to add your own sounds for a truly custom mix.
</p>
</div>
</div>
</section>
20 changes: 0 additions & 20 deletions docs/index.md

This file was deleted.

59 changes: 59 additions & 0 deletions docs/privacy.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,59 @@
---
layout: default
title: Privacy Policy
permalink: /privacy
---

<main class="max-w-5xl mx-auto px-5 pt-20 pb-10">
<section class="text-skin-base bg-skin-fill">
<h1 class="text-4xl font-semibold mb-6">Privacy Policy</h1>

<p class="text-skin-muted mb-4">
<strong>Effective Date</strong>: January 1, 2025
</p>

<p class="text-skin-muted mb-4">
Your privacy is important to us. Blankie does not collect, store, or share
any personal information. There are no tracking or analytics frameworks
implemented in the app.
</p>

<h2 class="text-2xl font-semibold mt-8 mb-3">Data Collection</h2>
<ul class="text-skin-muted list-disc pl-5 mb-4">
<li>
<strong>No Personal Data</strong>: We do not request or store any
personal data such as names, emails, or physical addresses.
</li>
<li>
<strong>No Usage Analytics</strong>: Blankie does not include
third-party analytics or trackers.
</li>
<li>
<strong>No Device Data</strong>: We do not access or collect information
about your device.
</li>
</ul>

<h2 class="text-2xl font-semibold mt-8 mb-3">
Data Sharing and Disclosure
</h2>
<p class="text-skin-muted mb-4">
Since we do not collect any data, we cannot share anything with any third
party.
</p>
<h2 class="text-2xl font-semibold mt-8 mb-3">Updates</h2>
<p class="text-skin-muted mb-4">
We may occasionally update this Privacy Policy to reflect changes in the
app or legal requirements. Any updates will be posted here.
</p>
<h2 class="text-2xl font-semibold mt-8 mb-3">Contact</h2>
<p class="text-skin-muted mb-4">
For questions or concerns regarding this policy, please contact us via
<a
href="https://github.com/codybrom/blankie/issues"
class="text-primary-blue hover:text-deep-blue transition-colors"
>GitHub Issues</a
>.
</p>
</section>
</main>
29 changes: 0 additions & 29 deletions docs/privacy.md

This file was deleted.

67 changes: 67 additions & 0 deletions docs/usage.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,67 @@
---
layout: default
title: Usage
permalink: /usage
---

<main class="max-w-5xl mx-auto px-5 pt-20 pb-10">
<section class="text-skin-base bg-skin-fill">
<h1 class="text-4xl font-semibold mb-6">Usage</h1>
<h2 class="text-2xl font-semibold mt-8 mb-3">Installing and Running</h2>
<ol class="text-skin-muted list-decimal pl-5 mb-4">
<li>
<strong>Download</strong> the latest <code>.zip</code> from the
<a
href="https://github.com/codybrom/blankie/releases"
class="text-primary-blue hover:text-deep-blue transition-colors"
>Releases</a
>.
</li>
<li><strong>Copy</strong> the app to your Applications folder.</li>
<li><strong>Open</strong> Blankie and click a sound to start!</li>
</ol>
<h2 class="text-2xl font-semibold mt-8 mb-3">
Basics of Controlling Blankie
</h2>
<ul class="text-skin-muted list-disc pl-5 mb-4">
<li>
<strong>Play/Pause:</strong> The main play/pause button (the bigger
play/pause icon) at the bottom center of the main window will toggle all
currently selected sounds on or off simultaneously.
</li>
<li>
<strong>Volume:</strong> In addition to the individual sound sliders,
there is a global slider available from the controls bar (click the
speaker icon to the left of the Play/Plause button), that's handy for
blending Blankie's soundscapes with other apps.
</li>
<li>
<strong>Presets:</strong> You can save and load different sets of
active/inactive sounds and volumes. The dropdown menu for presets will
not appear until you save your first preset using the menu button next
to the Play/Pause button.
</li>
</ul>
<h2 class="text-2xl font-semibold mt-8 mb-3">Advanced Options</h2>
<ul class="text-skin-muted list-disc pl-5 mb-4">
<li>
<strong>Hide Inactive Sounds:</strong> In the vertical ellipses menu,
you can choose to toggle the "Hide Inactive Sounds" setting. This will
hide any sounds that are not active, giving you a cleaner and smaller
list of sounds to look at.
</li>
<li>
<strong>Keyboard Shortcuts:</strong> You can trigger main app
functionalities, such as the play/pause button and the preferences
window, using main shortcuts. The full list of these shortcuts is
visible in a "Keyboard Shortcuts" panel, available in the Titlebar menu.
</li>
<li>
<strong>Preferences:</strong> You can customize the way Blankie looks
and autoplay on startup behavior in the "Preferences" area, available
from the Settings menu in your mac's menubar under Blankie, or from the
titlebar menu.
</li>
</ul>
</section>
</main>
25 changes: 0 additions & 25 deletions docs/usage.md

This file was deleted.

Binary file added docs/waves.mp4
Binary file not shown.

0 comments on commit 148558b

Please sign in to comment.