Move assets directory to top level

Copy assets to the top level of the output directory, rather than an `assets/` subdirectory.
samwilson · Jan 29, 2025 · 069b7c3 · 069b7c3
1 parent 9cc6ee5
commit 069b7c3
Show file tree

Hide file tree

Showing 11 changed files with 146 additions and 90 deletions.
diff --git a/composer.lock b/composer.lock
diff --git a/docs/content/content.md b/docs/content/content.md
@@ -8,7 +8,8 @@ All pages of a site live in the content directory:
 each is a separate text file, and the file names and directory hierarchy are not prescribed.
 Content files have two parts: one, a Yaml-formatted frontmatter, delimited by three hyphens; and two, a main body that can be in any format.
 The file extension should match the format of the body; often this is Markdown (`.md`), but it doesn't have to be
-— you could easily have all your content files be HTML if that suits your site better.
+— you could easily have all your content files be HTML if that suits your site better
+(change it via the `ext` key in `basildon.yaml`).
 
 An example of a page file at `content/topics/goats.md`:
 

diff --git a/docs/content/index.md b/docs/content/index.md
@@ -40,13 +40,18 @@ The structure within that directory can be anything.
 
 *[Read more about Templates.](templates.html)*
 
-## Assets (stylesheets and scripts)
-
-Every stylesheet and script in the `assets/` directory
-will be copied to `output/assets/`.
-
-Images should be in the `content/` directory;
-for more information, see the [Content documentation page](content.html).
+## Assets (stylesheets, scripts, etc.)
+
+All files (CSS, JS, images, etc.) in the `assets/` directory,
+and all non-page files in the `content/` directory,
+will be copied to `output/`.
+"Non-page" means anything without a `.md` file extension
+(or whatever your default is as defined by the `ext` key in `basildon.yaml`).
+
+Images (and other files) can be in either the `assets/` or `content/` directories,
+depending on how they're used in the site.
+There is no real difference as far as how they end up in the `output/` directory.
+This means that you must be careful to avoid name collisions.
 
 ## Output
 

diff --git a/docs/content/templates.md b/docs/content/templates.md
@@ -26,8 +26,8 @@ these are explained on this page.
 2. `flickr(photo_id)` – Get information about a [Flickr](https://www.flickr.com/) photo.
    To use this, you need to set the `flickr.api_key` and `flickr.api_secret` values
    in your site's `basildon.local.yaml` file.
-3. `qrcode(text)` – Returns an asset-directory path to a QR code SVG file,
-   such as `/assets/8a482ae2afb51a1de85b7eb9087f7cc2.svg`.
+3. `qrcode(text)` – Returns an output-directory path to a QR code SVG file,
+   such as `/qrcodes/8a482ae2afb51a1de85b7eb9087f7cc2.svg`.
    For example: `<img src="{{ page.link(qrcode('string')) }}" />`
 4. `wikidata(qid)` – Returns information about the given [Wikidata](https://www.wikidata.org/) item.
    For example, `{{ wikidata('Q42').descriptions.en.value }}` will return something like "English writer and humorist".

diff --git a/docs/templates/index.html.twig b/docs/templates/index.html.twig
@@ -4,7 +4,7 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>{{page.metadata.title}}: {{page.metadata.subtitle}}</title>
-    <link rel="stylesheet" href="{{ page.link('/assets/style.css') }}" />
+    <link rel="stylesheet" href="{{ page.link('/style.css') }}" />
 </head>
 <body>
 <header>

diff --git a/example/assets/style.css → example/content/style.css b/example/assets/style.css → example/content/style.css
diff --git a/example/templates/index.html.twig b/example/templates/index.html.twig
@@ -4,7 +4,7 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>{{ site.title }}</title>
-    <link rel="stylesheet" href="{{ page.link('/assets/style.css') }}" />
+    <link rel="stylesheet" href="{{ page.link('/style.css') }}" />
 </head>
 <body>
     <header class="site-header">