vowel 0.1.6 → 0.1.8

package/content/assets/styles-2.css

@@ -1,128 +0,0 @@
-/* General Reset */
-* {
-	margin: 0;
-	padding: 0;
-	box-sizing: border-box;
-}
-
-body {
-	font-family: Arial, sans-serif;
-	line-height: 1.6;
-	color: #333;
-	background-color: #f4f4f4;
-	padding: 20px;
-}
-
-.container {
-	max-width: 800px;
-	margin: auto;
-	background: white;
-	padding: 20px;
-	border-radius: 5px;
-	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
-}
-
-a {
-	color: #333;
-	text-decoration: none;
-}
-
-/* Header */
-header {
-	margin-bottom: 20px;
-}
-
-header h1 {
-	margin-bottom: 10px;
-}
-
-header nav a.active {
-	font-weight: bold;
-}
-
-.breadcrumbs {
-	display: none;
-}
-
-/* Main Content */
-main.home {
-	margin-bottom: 20px;
-}
-
-main.home > header h2 {
-	display: none;
-}
-
-main.home h2,
-main.home h4 {
-	color: #333;
-	margin-bottom: 10px;
-}
-
-main.home p,
-main.home pre {
-	margin-bottom: 10px;
-}
-
-main ul {
-	margin-inline-start: 1.2rem;
-}
-
-main.home pre {
-	background-color: #eee;
-	padding: 10px;
-	border-radius: 5px;
-	overflow: auto;
-}
-
-main.home code {
-	background-color: #f9f9f9;
-	color: #d63384;
-	padding: 2px 5px;
-	border-radius: 3px;
-}
-
-main > article > :not(header) {
-	display: none;
-}
-
-/* Sitemap Aside */
-aside.sitemap {
-	margin: auto;
-	display: flex;
-	justify-content: center;
-}
-
-aside.sitemap > ul > li:first-child {
-	display: none;
-}
-
-aside.sitemap ul {
-	background: rgba(0, 0, 0, 0.03);
-	padding: 0.5rem;
-	border-radius: 0.5rem;
-	list-style: none;
-	margin-left: 1rem;
-	/* margin-bottom: 20px; */
-}
-
-aside.sitemap ul:not(:last-child) {
-	margin-bottom: 0.5rem;
-}
-
-aside.sitemap ul:not(:has(li)) {
-	display: none;
-}
-
-aside.sitemap a {
-	display: block;
-	padding: 5px 0;
-}
-
-/* Footer */
-footer {
-	text-align: center;
-	margin-top: 20px;
-	font-size: 0.8em;
-	color: #666;
-}

package/content/assets/styles-3.css

@@ -1,275 +0,0 @@
-@import '/open-props.css';
-
-/* CONTAINER */
-html {
-	overflow-y: scroll;
-}
-
-.page {
-	display: grid;
-	grid-template-rows: auto 1fr auto;
-	grid-template-columns: 1fr minmax(auto, var(--size-content-3)) 1fr;
-	grid-template-areas:
-		'header header header'
-		'. main .'
-		'aside aside aside'
-		'footer footer footer';
-	min-height: 100vh;
-	padding-block: 3rem;
-	padding-inline: 3vw;
-	row-gap: var(--size-6);
-}
-
-.page.docs {
-	grid-template-areas:
-		'header header header'
-		'aside main main'
-		'footer footer footer';
-	column-gap: var(--size-8);
-}
-
-.page.docs aside.sitemap {
-	margin-top: 0;
-	padding-top: 0;
-}
-
-.page.docs main {
-	max-width: var(--size-content-3);
-}
-
-.page.docs aside.sitemap > ul > li:not(.docs) {
-	display: none;
-}
-
-@media only screen and (max-width: 600px) {
-	.page {
-		grid-template-areas:
-			'header header header'
-			'main main main'
-			'aside aside aside'
-			'footer footer footer';
-	}
-}
-
-/* HEADER */
-
-header {
-	grid-column-start: 1;
-	grid-column-end: 4;
-	display: grid;
-	grid-template-columns: subgrid;
-	row-gap: var(--size-6);
-}
-
-h1 {
-	grid-column-start: 1;
-	grid-column-end: 3;
-	line-height: 1;
-	text-transform: uppercase;
-	font-stretch: 105%;
-}
-
-.slogan {
-	margin-top: auto;
-	margin-left: auto;
-	margin-bottom: 4px;
-	width: min-content;
-	line-height: 0.9;
-	font-size: var(--font-size-1);
-	text-transform: uppercase;
-	font-weight: 100;
-	font-stretch: 115%;
-	text-align: right;
-	grid-column-start: 3;
-	grid-column-end: 4;
-}
-
-nav {
-	grid-column-start: 1;
-	grid-column-end: 4;
-	width: 100%;
-	display: flex;
-	gap: 1rem;
-	/* justify-content: space-between; */
-	padding-block: 0.5rem;
-	border-bottom: 1px solid var(--h1-color);
-	text-transform: uppercase;
-	font-weight: 300;
-	font-stretch: 105%;
-	font-size: var(--font-size-1);
-	opacity: 80%;
-}
-
-nav a {
-	color: var(--h6-color);
-}
-
-nav:not(:first-of-type) {
-	display: none;
-}
-
-.breadcrumbs {
-	font-size: var(--font-size-1);
-	width: 100%;
-	max-width: var(--size-content-3);
-	grid-column-start: 2;
-	grid-column-end: 3;
-}
-
-/* MAIN */
-
-main {
-	grid-area: main;
-	overflow-x: hidden;
-}
-
-/* BREADCRUMBS */
-
-.breadcrumbs {
-	text-transform: uppercase;
-	font-size: 0.8rem;
-}
-
-.breadcrumbs .separator:after {
-	margin-inline: 0.2rem;
-	content: '/';
-}
-
-/* FRONTMATTER */
-
-main > header > h2 {
-	margin-bottom: 5rem;
-	/* color: var(--gray-3); */
-}
-
-header a {
-	color: unset;
-	text-decoration: unset;
-}
-
-time {
-	color: grey;
-	font-family: Arial, Helvetica, sans-serif;
-}
-
-dl {
-	padding: 0;
-	gap: 1rem;
-	grid-template-columns: auto 1fr;
-	grid-column-gap: 1rem;
-	grid-row-gap: 0px;
-	font-family: Georgia;
-	display: none;
-}
-
-dt {
-	display: none;
-}
-
-dd {
-	margin: 0;
-}
-
-dd {
-	display: none;
-}
-
-dd.description {
-	display: block;
-}
-
-/* PAGES */
-
-.home > header > h2 {
-	display: none;
-}
-
-main > .content > :is(h2, h3, h4, pre, ul, ol, p, article) {
-	margin-bottom: var(--size-4);
-}
-
-main > .content > :is(h2, h3, h4) {
-	margin-top: var(--size-6);
-}
-
-/* THUMBNAILS */
-
-.thumbnail .content {
-	display: none;
-}
-
-.thumbnail :is(dl, dd) {
-	display: block;
-	font-family: var(--sans-serif);
-}
-
-.thumbnail {
-	border: 2px solid white;
-	border-radius: var(--size-4);
-	padding: var(--size-4);
-	margin-block: var(--size-4);
-}
-
-.thumbnail a:hover {
-	text-decoration: none;
-}
-
-/* TYPOGRAPHY */
-
-pre {
-	background: var(--surface-2);
-	padding: var(--size-2) var(--size-4);
-	display: block;
-	max-inline-size: 100%;
-	overflow-x: scroll;
-}
-
-/* IMAGES */
-
-p img {
-	margin: 5rem auto;
-}
-
-/* FOOTER */
-
-footer {
-	grid-area: footer;
-	margin: 5rem auto;
-}
-
-/* SITEMAP */
-
-aside.sitemap {
-	display: flex;
-	border-top: 1px solid var(--h6-color);
-	margin-block: 2rem;
-	padding-block: 2rem;
-	grid-area: aside;
-	justify-content: center;
-}
-
-aside.sitemap ul {
-	list-style: none;
-	opacity: 0.8;
-	padding: 0;
-}
-
-aside.sitemap ul {
-	/* margin-block: 0; */
-}
-
-a article.link-preview {
-	/* display: none; */
-}
-
-article.link-preview:has(a) {
-	display: block;
-}
-
-article.link-preview p {
-	color: var(--h5-color);
-}
-
-a:hover:has(article) {
-	text-decoration: none;
-}

package/content/docs/file-structure.md

@@ -1,31 +0,0 @@
----
-title: File structure
-breadcrumb: Files
-description: Organize your files.
----
-
-Your website is made of folders and markdown files. Every folder should have a `home.md` file. Every folder can also have a `settings.md` file to apply folder-level settings, such as the `breadcrumb`.
-
-Almost every file and folder represents a page on your website:
-
-- `home.md` is your homepage, `/`
-- `about.md` would be your about page, `/about`
-- `blog/home.md` would be your blog homepage, `/blog`
-- `blog/hello-world.md` would be a blog post, `/blog/hello-world`
-
-(File names like `Hello World.md` also seem to work fine so far.))
-
-Even if a folder doesn't have a `home.md` file, it will still generate a page, so long as it contains any markdown files. So, if you have a `blog` folder with posts inside it, Vowel will generate a `/blog` homepage even if you don't have a `/blog/home.md` file.
-
-There are a few special files and folders:
-
-- `assets/` contains some static files
-  - `assets/styles.css` contains your stylesheet, which will be automatically applied if present
-  - `assets/favicon.png` is your favicon
-- `templates/` is a commonly-used directory in Obsidian projects, so it will be ignored
-- A `settings.md` file will not generate a page. If you want a page called `settings`, you can create a `/settings/home.md` file.
-- `.cache.json`
-- `.output/`
-- `vercel.json`
-
-Any files prefixed with a period will be ignored, as will any files that are not markdown.

package/content/docs/folder-settings.md

@@ -1,23 +0,0 @@
----
-title: Folder settings
-breadcrumb: Folders
-description: Configure your project.
----
-
-Every folder should have a `settings.md` file with one property:
-
-- `breadcrumb`: A navigation label
-
-At the root of the project, there should be a global settings file with the `breadcrumb` property and any of the following properties:
-
-- All folder settings, plus
-- `title`: Website title
-- `robots`
-  - `google`: Allow Google Search indexing (`true`/`false`)
-  - `google_images`: Allow Google Image indexing (`true`/`false`)
-  - `ai`: Allow AI training (`true`/`false`)
-- `domain`: Full root URL for the website domain (e.g. `https://example.com`)
-- `author`: Website author credit for RSS and copyright
-- `icon`: An emoji to use as the site favicon
-- `slogan`: The website slogan
-- `logo`: The website logo

package/content/docs/home.md

@@ -1,8 +0,0 @@
----
-title: Documentation
-description: Learn how to use Vowel.
----
-
-Let's get started.
-
-/docs?count=100

package/content/docs/images.md

@@ -1,10 +0,0 @@
----
-title: Images
-description: How to host images.
----
-
-You can put images in the `assets` folder, but this is discouraged, as it could result in a large bandwidth bill from your hosting provider.
-
-We recommend hosting images elsewhere.
-
-Images hosted on imgix will automatically be optimized, compressed, and formatted.

package/content/docs/items.md

@@ -1,13 +0,0 @@
-# Items
-
-With Vowel, you can create reusable pieces of content and embed them throughout your website.
-
-To create one, prefix a file or folder with a `$`, such as `$faqs`. The file or folder will not produce a page, but the content can be displayed on other pages, like so:
-
-```md
-Here are answers to common questions:
-
-/$faqs?count=10
-```
-
-This also allows richer content, as the item will be displayed with frontmatter.

package/content/docs/pages.md

@@ -1,64 +0,0 @@
----
-title: Pages
-description: Create content.
----
-
-The `body` element on each page has a class representing the current page. The homepage has classes `"page home"`, while a blog post might have `"page blog-hello-world"`.
-
-Vowel attempts to construct a logical semantic HTML structure based on the files and folders in your website.
-
-To do this, Vowel distinguishes between evergreen pages and ephemeral pages. A page with a `date` property is considered ephemeral, so it is excluded from the navigation and sitemap.
-
-Vowel will automatically create a multi-level nav, with one level for each parent folder for the current page.
-
-Vowel will create a full side navigation that displays all evergreen pages.
-
-# Frontmatter
-
-Reserved properties
-
-- `title`: Page title
-- `image`: Page image
-- `description`: Page description
-- `date`: Date published
-- `breadcrumb`: Short identifier for the page
-
-Vowel will attempt to impute the type of each frontmatter property. Imputed types include:
-
-- Links (Will generate a link preview)
-- Images (will display the image)
-- Date (will render a pretty date in a `time` element)
-
-You can also use lists and objects in frontmatter.
-
-# Markdown
-
-Along with all standard markdown, Vowel also allows the following special elements:
-
-## Rich link previews
-
-Paste a URL on its own line (e.g. `https://example.com`).
-
-## Internal link previews
-
-Paste a relative path to a page (e.g. `/about`).
-
-The link will be rendered as an `article` element with a class representing the linked path (e.g. `page-blog-hello-world`).
-
-## Page lists
-
-A relative path to a folder with a `count` parameter (e.g. `/blog?count=2`). This will exclude the `home.md` file for the folder. In this example, it would return the `/blog/hello-world.md` file but not `/blog/home.md`.
-
-The page list will order pages first by date in reverse chronology (newest to oldest) and then alphabetically (a to z).
-
-The list will be rendered as `article` elements (see above) in a `section` element. The `section` element will have a class representing the folder path (e.g. `folder-blog`).
-
-## Headings
-
-If your document starts with an `h1` (`#`) and has no `title` property, the `h1` will be used as the meta title.
-
-If your document includes `h1`s after the title, all headings will be demoted one level (`#` to `h2`, `##` to `h3`).
-
-## Description
-
-If your document doesn't include a `description`, a meta description will be extracted from the text.

package/content/docs/quickstart.md

@@ -1,52 +0,0 @@
----
-title: Quickstart
-description: Get started with Vowel.
----
-
-## With npx
-
-npx is the easiest way to use vowel:
-
-```
-npx -p svelte@next -p vowel@latest npx vowel
-```
-
-Vowel will attempt to generate a website based on the contents of your file.
-
-## With npm
-
-Create a directory. Then, open that directory and run these commands in your terminal:
-
-```bash
-npm init --y && npm i vowel svelte@next
-```
-
-Edit your `package.json` to add these `scripts`:
-
-```json
-{
-	"dev": "vowel",
-	"build": "vowel build"
-}
-```
-
-Now run `npm run dev`.
-
-## Starter files
-
-Create `home.md` and enter some basic information
-
-```md
-# Your website
-
-Lorem ipsum...
-```
-
-Create `settings.md` and enter some basic information in the frontmatter:
-
-```
----
-breadcrumb: Home
-domain: https://example.com
----
-```

package/content/docs/run-build-deploy.md

@@ -1,20 +0,0 @@
----
-title: Deploy
-description: Get going.
----
-
-See the [quickstart](/docs/quickstart) for instructions on how to use npm.
-
-# Building
-
-Run `npm run build` (`vowel build`) to build your website.
-
-Alternatively, with npx, run:
-
-```
-npx -p svelte@next -p vowel@latest npx vowel build
-```
-
-# Deploy
-
-We recommend deploying on Vercel. Run `npx vercel` to deploy your project. Ignore all of the build settings (except project title), as your project will include a `vercel.json` file with build settings.

package/content/docs/settings.md

@@ -1,4 +0,0 @@
----
-title: Documentation
-breadcrumb: Docs
----

package/content/docs/styling.md

@@ -1,10 +0,0 @@
----
-title: Styling
-description: Add styles to your website.
----
-
-Vowel include some default styles.
-
-Create an `assets/styles.css` file for your styling. We recommend using a style framework like Pico or Open Props. You can simply download their stylesheet and either copy-paste it into your own or include it in `assets/` and `import` it into `assets/styles.css`.
-
-Beware: This project is still in development, so the generated markup is likely to change quickly and without warning, which will break your CSS. You might want to pin your version.

package/content/docs/taxonomies.md

@@ -1,37 +0,0 @@
----
-title: Taxonomies
-description: Create tags, categories, and authors.
----
-
-If the key for a frontmatter property matches a folder at the root of your project, Vowel will attempt to treat it as a taxonomy and link to the respective page.
-
-For instance, in this folder structure:
-
-```
-.
-├── home.md
-├── design.md
-├── recipes.md
-└── category/
-    ├── inspiration.md
-    └── lifestyle.md
-```
-
-You can write the following frontmatter in `design.md`:
-
-```
----
-title: Design
-category: inspiration
----
-```
-
-Vowel will render the property as a link to `/category/inspiration`.
-
-Then, in `category/inspiration.md` (or anywhere) you can display all inspiration posts with a post list:
-
-```
-/?property=category.inspiration
-```
-
-This allows you to create author pages, category pages.