devfolio-page 0.2.9 → 0.2.10

package/README.md

@@ -95,12 +95,16 @@ devfolio-page validate portfolio.yaml
 
 ## YAML Schema
 
+### Basic Example
+
 ```yaml
 meta:
   name: Your Name
   title: Your Title
   location: Your Location
   timezone: America/Los_Angeles  # optional
+  tagline: A short tagline        # optional
+  avatar: images/avatar.jpg       # optional
 
 contact:
   email: you@example.com
@@ -113,6 +117,14 @@ bio: |
   A few sentences about yourself.
   Can be multiple lines.
 
+# Extended about section (generates dedicated /about page)
+about:
+  short: Brief intro for homepage
+  long: |
+    Longer bio with markdown support.
+
+    Multiple paragraphs work great here.
+
 sections:
   experience:
     - company: Company Name
@@ -142,6 +154,7 @@ sections:
       url: https://...
       date: 2024-12
       description: Brief description  # optional
+      featured: true  # optional
 
   education:
     - institution: University Name
@@ -163,6 +176,81 @@ settings:
   animate: subtle        # none, subtle, or full
 ```
 
+### Rich Projects (Case Studies)
+
+For a multi-page portfolio with dedicated project pages, use the top-level `projects` field:
+
+```yaml
+projects:
+  - id: my-project           # URL slug: /projects/my-project.html
+    title: My Project
+    subtitle: A brief tagline
+    featured: true
+    thumbnail: images/project-thumb.jpg
+    hero: images/project-hero.jpg
+    meta:
+      year: 2024
+      role: Lead Developer
+      timeline: 3 months
+      tech: [React, Node.js, PostgreSQL]
+      links:
+        github: https://github.com/...
+        demo: https://demo.example.com
+        live: https://example.com
+    sections:
+      - type: overview
+        content: |
+          Markdown content describing the project.
+      - type: image
+        src: images/screenshot.png
+        caption: Main dashboard view
+      - type: metrics
+        data:
+          - label: Users
+            value: "10,000+"
+          - label: Uptime
+            value: "99.9%"
+      - type: outcomes
+        content: |
+          What was achieved and lessons learned.
+```
+
+### Experiments
+
+For side projects and explorations:
+
+```yaml
+experiments:
+  - title: Creative Coding
+    description: Generative art experiments
+    image: images/experiment.png
+    github: https://github.com/...
+    demo: https://demo.example.com
+    tags: [p5.js, WebGL]
+```
+
+### Page Customization
+
+Customize titles and descriptions for each page:
+
+```yaml
+pages:
+  projects:
+    title: My Work
+    description: A curated selection of projects and case studies.
+  about:
+    title: About Me
+    description: Designer, developer, and coffee enthusiast.
+  experiments:
+    title: Lab
+    description: Creative experiments and explorations.
+  writing:
+    title: Blog
+    description: Thoughts on design and technology.
+```
+
+If not specified, each theme provides sensible defaults.
+
 ## Themes
 
 ### SRCL (Default)

package/dist/generator/themes/srcl/templates/about.html

@@ -35,8 +35,8 @@
 
   <main class="content">
     <header class="page-header">
-      <h1>About</h1>
-      {{#tagline}}<p class="page-description">{{tagline}}</p>{{/tagline}}
+      <h1>{{#page_title}}{{page_title}}{{/page_title}}{{^page_title}}About{{/page_title}}</h1>
+      {{#page_description}}<p class="page-description">{{page_description}}</p>{{/page_description}}{{^page_description}}{{#tagline}}<p class="page-description">{{tagline}}</p>{{/tagline}}{{/page_description}}
     </header>
 
     <div class="about-content">

package/dist/generator/themes/srcl/templates/experiments-index.html

@@ -35,8 +35,8 @@
 
   <main class="content">
     <header class="page-header">
-      <h1>Experiments</h1>
-      <p class="page-description">Side projects, explorations, and things I'm tinkering with.</p>
+      <h1>{{#page_title}}{{page_title}}{{/page_title}}{{^page_title}}Experiments{{/page_title}}</h1>
+      <p class="page-description">{{#page_description}}{{page_description}}{{/page_description}}{{^page_description}}Side projects, explorations, and things I'm tinkering with.{{/page_description}}</p>
     </header>
 
     <div class="experiments-grid full-width">

package/dist/generator/themes/srcl/templates/projects-index.html

@@ -35,8 +35,8 @@
 
   <main class="content">
     <header class="page-header">
-      <h1>Projects</h1>
-      <p class="page-description">A collection of work spanning product development, open source, and research.</p>
+      <h1>{{#page_title}}{{page_title}}{{/page_title}}{{^page_title}}Projects{{/page_title}}</h1>
+      <p class="page-description">{{#page_description}}{{page_description}}{{/page_description}}{{^page_description}}A collection of work spanning product development, open source, and research.{{/page_description}}</p>
     </header>
 
     <div class="projects-grid full-width">

package/dist/generator/themes/srcl/templates/writing-index.html

@@ -35,8 +35,8 @@
 
   <main class="content">
     <header class="page-header">
-      <h1>Writing</h1>
-      <p class="page-description">Articles, blog posts, and technical writing.</p>
+      <h1>{{#page_title}}{{page_title}}{{/page_title}}{{^page_title}}Writing{{/page_title}}</h1>
+      <p class="page-description">{{#page_description}}{{page_description}}{{/page_description}}{{^page_description}}Articles, blog posts, and technical writing.{{/page_description}}</p>
     </header>
 
     <ul class="writing-list full-width">

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "devfolio-page",
-  "version": "0.2.9",
+  "version": "0.2.10",
   "description": "Your portfolio as code. Version control it like software.",
   "type": "module",
   "bin": {

package/src/generator/themes/srcl/templates/about.html

@@ -35,8 +35,8 @@
 
   <main class="content">
     <header class="page-header">
-      <h1>About</h1>
-      {{#tagline}}<p class="page-description">{{tagline}}</p>{{/tagline}}
+      <h1>{{#page_title}}{{page_title}}{{/page_title}}{{^page_title}}About{{/page_title}}</h1>
+      {{#page_description}}<p class="page-description">{{page_description}}</p>{{/page_description}}{{^page_description}}{{#tagline}}<p class="page-description">{{tagline}}</p>{{/tagline}}{{/page_description}}
     </header>
 
     <div class="about-content">

package/src/generator/themes/srcl/templates/experiments-index.html

@@ -35,8 +35,8 @@
 
   <main class="content">
     <header class="page-header">
-      <h1>Experiments</h1>
-      <p class="page-description">Side projects, explorations, and things I'm tinkering with.</p>
+      <h1>{{#page_title}}{{page_title}}{{/page_title}}{{^page_title}}Experiments{{/page_title}}</h1>
+      <p class="page-description">{{#page_description}}{{page_description}}{{/page_description}}{{^page_description}}Side projects, explorations, and things I'm tinkering with.{{/page_description}}</p>
     </header>
 
     <div class="experiments-grid full-width">

package/src/generator/themes/srcl/templates/projects-index.html

@@ -35,8 +35,8 @@
 
   <main class="content">
     <header class="page-header">
-      <h1>Projects</h1>
-      <p class="page-description">A collection of work spanning product development, open source, and research.</p>
+      <h1>{{#page_title}}{{page_title}}{{/page_title}}{{^page_title}}Projects{{/page_title}}</h1>
+      <p class="page-description">{{#page_description}}{{page_description}}{{/page_description}}{{^page_description}}A collection of work spanning product development, open source, and research.{{/page_description}}</p>
     </header>
 
     <div class="projects-grid full-width">

package/src/generator/themes/srcl/templates/writing-index.html

@@ -35,8 +35,8 @@
 
   <main class="content">
     <header class="page-header">
-      <h1>Writing</h1>
-      <p class="page-description">Articles, blog posts, and technical writing.</p>
+      <h1>{{#page_title}}{{page_title}}{{/page_title}}{{^page_title}}Writing{{/page_title}}</h1>
+      <p class="page-description">{{#page_description}}{{page_description}}{{/page_description}}{{^page_description}}Articles, blog posts, and technical writing.{{/page_description}}</p>
     </header>
 
     <ul class="writing-list full-width">