dokio-create-template 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Dokio
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,162 @@
+# dokio-create-template
+
+🚀 **CLI tool to scaffold Dokio templates**
+
+Quickly generate starter templates for Dokio with all the necessary files and configurations.
+
+## Installation
+
+### Global Installation (Recommended)
+
+```bash
+npm install -g dokio-create-template
+```
+
+### Local Installation
+
+```bash
+npm install dokio-create-template
+```
+
+## Usage
+
+### Global Installation
+
+```bash
+dokio-create-template
+```
+
+### Local Installation
+
+```bash
+npx dokio-create-template
+```
+
+## Interactive Prompts
+
+The CLI will guide you through the template creation process with the following prompts:
+
+1. **Template Type**: Choose from General (Image), PDF, Email, or Video
+2. **Template Name**: Enter a human-readable name for your template
+3. **Template ID**: Enter a slug/ID (auto-generated from name by default)
+4. **Subdomain**: Specify the Dokio subdomain (default: `test`)
+5. **Output Directory**: Where to save the template files (default: `./{template-id}`)
+
+### Additional Prompts (PDF Templates)
+
+For PDF templates, you'll also be asked:
+
+- **Prince Version**: Choose between version 11 or 15 (15 supports Flexbox)
+- **Resizable**: Whether the template should support dynamic sizing
+- **Dynamic Pages**: Whether the template should support variable page count
+
+## Generated Files
+
+The tool generates the following files:
+
+- **index.html** - Template markup
+- **style.scss.hbs** - SCSS styles with Handlebars support
+- **data.yaml** - Template configuration and field definitions
+- **CHANGELOG.md** - Version history
+
+## Template Types
+
+### General (Image)
+- Export formats: JPG, PNG
+- Dimensions: 400x400px (customizable)
+- Use case: Social media graphics, banners, thumbnails
+
+### PDF
+- Export formats: Hi-res PDF, Low-res PDF, Print orders
+- Prince XML support (versions 11 or 15)
+- Built-in support for headers, footers, page numbers
+- Use case: Brochures, flyers, certificates, reports
+
+### Email
+- Responsive design (desktop and mobile)
+- Outlook and Gmail compatible
+- Export formats: Standalone HTML, Hosted HTML, URL
+- Built-in accessibility features
+- Use case: Marketing emails, newsletters, transactional emails
+
+### Video
+- Resolution: 1920x1080 (Full HD)
+- Default duration: 30 seconds
+- Export format: 1080p video
+- Use case: Social media videos, ads, animations
+
+## Example
+
+```bash
+$ dokio-create-template
+
+🚀 Dokio Template Generator
+
+? What type of template do you want to create? PDF
+? Template name: Marketing Brochure
+? Template ID (slug): marketing-brochure
+? Subdomain: production
+? Output directory: ./marketing-brochure
+? Prince version: 15
+? Is this a resizable template? No
+? Will this template have dynamic page count? Yes
+
+✔ Template created successfully!
+
+📁 Files created:
+   ./marketing-brochure/index.html
+   ./marketing-brochure/style.scss.hbs
+   ./marketing-brochure/data.yaml
+   ./marketing-brochure/CHANGELOG.md
+
+✨ Next steps:
+   cd marketing-brochure
+   Start customizing your template files
+   Upload to Dokio when ready
+```
+
+## Template Customization
+
+After generating your template, you can customize:
+
+### data.yaml
+- Add/modify fields
+- Configure export options
+- Set page dimensions
+- Define default values
+
+### index.html
+- Add markup structure
+- Use Handlebars syntax for dynamic content
+- Reference field values with `{{{field-name}}}`
+
+### style.scss.hbs
+- Write SCSS styles
+- Use Handlebars for dynamic styling
+- Configure responsive breakpoints (email templates)
+
+### CHANGELOG.md
+- Document template changes
+- Track version history
+
+## Dokio Resources
+
+- **Documentation**: https://docs.dokio.com
+- **Developer Reference**: See your Dokio Developer Reference PDF
+- **Support**: https://support.dokio.com
+
+## Contributing
+
+Contributions are welcome! Please feel free to submit a Pull Request.
+
+## License
+
+MIT
+
+## Author
+
+Dokio - https://dokio.com
+
+---
+
+**Need help?** Check the [Dokio Developer Reference](https://docs.dokio.com) for detailed information on template development.

package/bin/cli.js

@@ -0,0 +1,5 @@
+#!/usr/bin/env node
+
+const { createTemplate } = require('../lib/creator');
+
+createTemplate();

package/index.js

@@ -0,0 +1 @@
+module.exports = require('./lib/creator');

package/lib/creator.js

@@ -0,0 +1,144 @@
+const inquirer = require('inquirer');
+const chalk = require('chalk');
+const ora = require('ora');
+const fs = require('fs');
+const path = require('path');
+
+async function createTemplate() {
+  console.log(chalk.cyan.bold('\n🚀 Dokio Template Generator\n'));
+
+  try {
+    // Ask user for template type
+    const answers = await inquirer.prompt([
+      {
+        type: 'list',
+        name: 'templateType',
+        message: 'What type of template do you want to create?',
+        choices: [
+          { name: 'General (Image)', value: 'general' },
+          { name: 'PDF', value: 'pdf' },
+          { name: 'Email', value: 'email' },
+          { name: 'Video', value: 'video' },
+        ],
+      },
+      {
+        type: 'input',
+        name: 'templateName',
+        message: 'Template name:',
+        default: 'My Template',
+        validate: (input) => input.trim() !== '' || 'Template name cannot be empty',
+      },
+      {
+        type: 'input',
+        name: 'templateId',
+        message: 'Template ID (slug):',
+        default: (answers) => answers.templateName.toLowerCase().replace(/\s+/g, '-'),
+        validate: (input) => /^[a-z0-9-]+$/.test(input) || 'Template ID must be lowercase letters, numbers, and hyphens only',
+      },
+      {
+        type: 'input',
+        name: 'subdomain',
+        message: 'Subdomain:',
+        default: 'test',
+      },
+      {
+        type: 'input',
+        name: 'outputDir',
+        message: 'Output directory:',
+        default: (answers) => `./${answers.templateId}`,
+      },
+    ]);
+
+    // Additional questions for PDF templates
+    let pdfOptions = {};
+    if (answers.templateType === 'pdf') {
+      pdfOptions = await inquirer.prompt([
+        {
+          type: 'list',
+          name: 'princeVersion',
+          message: 'Prince version:',
+          choices: ['11', '15'],
+          default: '15',
+        },
+        {
+          type: 'confirm',
+          name: 'resizable',
+          message: 'Is this a resizable template?',
+          default: false,
+        },
+        {
+          type: 'confirm',
+          name: 'dynamicPages',
+          message: 'Will this template have dynamic page count?',
+          default: false,
+        },
+      ]);
+    }
+
+    // Create the template
+    const spinner = ora('Creating template files...').start();
+    
+    await generateTemplateFiles({
+      ...answers,
+      ...pdfOptions,
+    });
+
+    spinner.succeed(chalk.green('Template created successfully!'));
+    
+    console.log(chalk.cyan('\n📁 Files created:'));
+    console.log(chalk.gray(`   ${answers.outputDir}/index.html`));
+    console.log(chalk.gray(`   ${answers.outputDir}/style.scss.hbs`));
+    console.log(chalk.gray(`   ${answers.outputDir}/data.yaml`));
+    console.log(chalk.gray(`   ${answers.outputDir}/CHANGELOG.md`));
+    
+    console.log(chalk.cyan('\n✨ Next steps:'));
+    console.log(chalk.gray(`   cd ${answers.outputDir}`));
+    console.log(chalk.gray('   Start customizing your template files'));
+    console.log(chalk.gray('   Upload to Dokio when ready\n'));
+
+  } catch (error) {
+    if (error.isTtyError) {
+      console.error(chalk.red('Prompt couldn\'t be rendered in the current environment'));
+    } else {
+      console.error(chalk.red('Error creating template:'), error.message);
+    }
+    process.exit(1);
+  }
+}
+
+async function generateTemplateFiles(config) {
+  const { templateType, outputDir } = config;
+  
+  // Create output directory
+  if (!fs.existsSync(outputDir)) {
+    fs.mkdirSync(outputDir, { recursive: true });
+  }
+
+  // Load template files
+  const templatesDir = path.join(__dirname, '../templates', templateType);
+  
+  // Generate files from templates
+  const files = ['index.html', 'style.scss.hbs', 'data.yaml', 'CHANGELOG.md'];
+  
+  for (const file of files) {
+    const templatePath = path.join(templatesDir, file);
+    let content = fs.readFileSync(templatePath, 'utf8');
+    
+    // Replace placeholders
+    content = replacePlaceholders(content, config);
+    
+    const outputPath = path.join(outputDir, file);
+    fs.writeFileSync(outputPath, content);
+  }
+}
+
+function replacePlaceholders(content, config) {
+  return content
+    .replace(/\{\{TEMPLATE_NAME\}\}/g, config.templateName)
+    .replace(/\{\{TEMPLATE_ID\}\}/g, config.templateId)
+    .replace(/\{\{SUBDOMAIN\}\}/g, config.subdomain)
+    .replace(/\{\{PRINCE_VERSION\}\}/g, config.princeVersion || '15')
+    .replace(/\{\{DATE\}\}/g, new Date().toISOString().split('T')[0]);
+}
+
+module.exports = { createTemplate };

package/package.json

@@ -0,0 +1,50 @@
+{
+  "name": "dokio-create-template",
+  "version": "1.0.0",
+  "description": "CLI tool to scaffold Dokio templates (general, pdf, email, video)",
+  "main": "index.js",
+  "bin": {
+    "dokio-create-template": "bin/cli.js"
+  },
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [
+    "dokio",
+    "template",
+    "cli",
+    "scaffold",
+    "generator",
+    "pdf",
+    "email",
+    "video",
+    "create-template",
+    "boilerplate"
+  ],
+  "author": "Dokio",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/yourusername/dokio-create-template.git"
+  },
+  "bugs": {
+    "url": "https://github.com/yourusername/dokio-create-template/issues"
+  },
+  "homepage": "https://github.com/yourusername/dokio-create-template#readme",
+  "dependencies": {
+    "inquirer": "^8.2.5",
+    "chalk": "^4.1.2",
+    "ora": "^5.4.1"
+  },
+  "engines": {
+    "node": ">=14.0.0"
+  },
+  "files": [
+    "bin/",
+    "lib/",
+    "templates/",
+    "index.js",
+    "README.md",
+    "LICENSE"
+  ]
+}

package/templates/email/CHANGELOG.md

@@ -0,0 +1,14 @@
+# Changelog - {{TEMPLATE_NAME}}
+
+## [1.0.0] - {{DATE}}
+
+### Added
+- Initial email template creation
+- Responsive design (desktop and mobile)
+- Subject line and preheader fields
+- Customizable brand color
+- CTA button with URL field
+- Gmail and Outlook compatibility
+- Accessibility features (role attributes, semantic HTML)
+- Multiple export options (standalone, hosted HTML, URL)
+- Unsubscribe link support

package/templates/email/data.yaml

@@ -0,0 +1,70 @@
+---
+name: {{TEMPLATE_ID}} - {{TEMPLATE_NAME}}
+mode: email
+status: 0
+subdomain: {{SUBDOMAIN}}
+sendable: true
+allow_pdf_proof: true
+export_options:
+  downloadables:
+    standalone:
+      title: Standalone Download (local assets)
+      host_files: false
+      output: zip
+    hosted-html:
+      title: HTML Download (hosted assets)
+      host_files: true
+      output: zip
+    hosted-url:
+      title: URL (hosted assets)
+      host_files: true
+      output: url
+fields_data:
+  subject-line:
+    type: text
+    title: Email Subject Line
+    default: "{{TEMPLATE_NAME}}"
+    placeholder: Enter subject line
+    maximum_characters: 100
+  
+  preheader:
+    type: text
+    title: Preheader Text
+    default: "Preview text appears here"
+    placeholder: Enter preheader text
+    maximum_characters: 150
+  
+  heading:
+    type: text
+    title: Heading
+    default: Welcome
+    placeholder: Enter heading text
+  
+  body-text:
+    type: textarea
+    title: Body Text
+    default: |
+      This is your email body text.
+      Add your content here.
+    output_html_safe: true
+    output_auto_br: true
+  
+  cta-text:
+    type: text
+    title: Call to Action Text
+    default: Learn More
+    placeholder: Enter button text
+  
+  cta-url:
+    type: url
+    title: Call to Action URL
+    placeholder: https://example.com
+  
+  brand-color:
+    type: colour
+    title: Brand Colour
+    customisable: true
+    options:
+      '0079C8': Blue
+      'FF6B35': Orange
+      '004E89': Navy

package/templates/email/index.html

@@ -0,0 +1,96 @@
+<!DOCTYPE html>
+<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="x-apple-disable-message-reformatting">
+  <meta name="format-detection" content="telephone=no,address=no,email=no,date=no,url=no">
+  <title>{{{subject-line}}}</title>
+  
+  <!--[if mso]>
+  <style>
+    * { font-family: Arial, sans-serif !important; }
+  </style>
+  <![endif]-->
+</head>
+
+<body width="100%" style="margin: 0; padding: 0 !important; mso-line-height-rule: exactly; background-color: #f4f4f4;">
+  
+  <!-- Preheader (hidden) -->
+  <div style="display: none; max-height: 0px; overflow: hidden;">
+    {{{preheader}}}
+  </div>
+  
+  <!-- Gmail fix -->
+  <span style="display: block; width: 600px !important; max-width: 600px !important; height: 1px" class="mobileOff"></span>
+  
+  <!-- Email Container -->
+  <center role="article" aria-roledescription="email" lang="en" style="width: 100%; background-color: #f4f4f4;">
+    
+    <!-- Outer table -->
+    <table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%" style="margin: auto;">
+      <tr>
+        <td style="padding: 20px 0;">
+          
+          <!-- Main Email Table -->
+          <table role="presentation" cellspacing="0" cellpadding="0" border="0" width="600" style="margin: auto; background-color: #ffffff;" class="email-container">
+            
+            <!-- Header -->
+            <tr>
+              <td style="padding: 40px 30px; text-align: center; background-color: #{{brand-color}};">
+                <h1 style="margin: 0; font-family: Arial, sans-serif; font-size: 28px; line-height: 36px; color: #ffffff; font-weight: bold;">
+                  {{{heading}}}
+                </h1>
+              </td>
+            </tr>
+            
+            <!-- Body -->
+            <tr>
+              <td style="padding: 40px 30px; font-family: Arial, sans-serif; font-size: 16px; line-height: 24px; color: #333333;">
+                <p style="margin: 0 0 20px 0;">
+                  {{{body-text}}}
+                </p>
+              </td>
+            </tr>
+            
+            <!-- CTA Button -->
+            {{#if cta-url}}
+            <tr>
+              <td style="padding: 0 30px 40px 30px;">
+                <table role="presentation" cellspacing="0" cellpadding="0" border="0" style="margin: 0 auto;">
+                  <tr>
+                    <td style="background-color: #{{brand-color}}; text-align: center; border-radius: 4px;" class="button-td">
+                      <a href="{{{cta-url.full_url}}}" style="background-color: #{{brand-color}}; border: 15px solid #{{brand-color}}; font-family: Arial, sans-serif; font-size: 16px; line-height: 20px; text-align: center; text-decoration: none; display: block; border-radius: 4px; font-weight: bold;" class="button-a">
+                        <span style="color: #ffffff;" class="button-link">{{{cta-text}}}</span>
+                      </a>
+                    </td>
+                  </tr>
+                </table>
+              </td>
+            </tr>
+            {{/if}}
+            
+            <!-- Footer -->
+            <tr>
+              <td style="padding: 30px; background-color: #f8f8f8; text-align: center; font-family: Arial, sans-serif; font-size: 12px; line-height: 18px; color: #666666;">
+                <p style="margin: 0;">
+                  © {{TEMPLATE_NAME}}<br>
+                  {{#if unsubscribe_link}}
+                  <a href="{{unsubscribe_link}}" style="color: #666666; text-decoration: underline;">Unsubscribe</a>
+                  {{/if}}
+                </p>
+              </td>
+            </tr>
+            
+          </table>
+          <!-- End Main Email Table -->
+          
+        </td>
+      </tr>
+    </table>
+    <!-- End Outer table -->
+    
+  </center>
+</body>
+</html>

package/templates/email/style.scss.hbs

@@ -0,0 +1,56 @@
+// {{TEMPLATE_NAME}} Email Styles
+// Mode: Email
+
+// Mobile styles
+@media screen and (max-width: 599px) {
+  
+  // Gmail fix
+  .mobileOff {
+    width: 0px !important;
+    display: none !important;
+  }
+  
+  // Stack columns
+  .email-container {
+    width: 100% !important;
+    max-width: 100% !important;
+  }
+  
+  // Full width on mobile
+  .mobile-full-width {
+    width: 100% !important;
+    max-width: 100% !important;
+  }
+  
+  // Adjust padding on mobile
+  .mobile-padding {
+    padding: 20px !important;
+  }
+  
+  // Center buttons on mobile
+  .button-td,
+  .button-a {
+    text-align: center !important;
+    display: block !important;
+  }
+}
+
+// Outlook-specific styles
+<!--[if mso]>
+<style type="text/css">
+  table {
+    border-collapse: collapse !important;
+    mso-table-lspace: 0pt !important;
+    mso-table-rspace: 0pt !important;
+  }
+  
+  img {
+    -ms-interpolation-mode: bicubic;
+  }
+  
+  .button-td {
+    padding-left: 20px !important;
+    padding-right: 20px !important;
+  }
+</style>
+<![endif]-->

package/templates/general/CHANGELOG.md

@@ -0,0 +1,9 @@
+# Changelog - {{TEMPLATE_NAME}}
+
+## [1.0.0] - {{DATE}}
+
+### Added
+- Initial template creation
+- Basic heading and body text fields
+- Background color selector
+- JPG and PNG export options

package/templates/general/data.yaml

@@ -0,0 +1,43 @@
+---
+name: {{TEMPLATE_ID}} - {{TEMPLATE_NAME}}
+mode: general
+subdomain: {{SUBDOMAIN}}
+dimension_mode: px
+compositing_data: {}
+page_count: 1
+dimension_width: 400
+dimension_height: 400
+export_options:
+  downloadables:
+    jpg_chrome:
+      title: JPG
+      renderer: image
+      format: jpg
+    png_chrome:
+      title: PNG
+      renderer: image
+      format: png
+fields_data:
+  heading:
+    type: text
+    title: Heading
+    default: Welcome to {{TEMPLATE_NAME}}
+    placeholder: Enter heading text
+  
+  body-text:
+    type: textarea
+    title: Body Text
+    default: |
+      This is your template body text.
+      Add your content here.
+    output_html_safe: true
+    output_auto_br: true
+  
+  background-color:
+    type: colour
+    title: Background Colour
+    customisable: true
+    options:
+      'ffffff': White
+      '000000': Black
+      '0079C8': Blue

package/templates/general/index.html

@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>{{TEMPLATE_NAME}}</title>
+</head>
+<body>
+  <div class="container" style="background-color: #{{background-color}};">
+    <div class="content">
+      <h1 class="heading">{{{heading}}}</h1>
+      <div class="body-text">{{{body-text}}}</div>
+    </div>
+  </div>
+</body>
+</html>

package/templates/general/style.scss.hbs

@@ -0,0 +1,41 @@
+// {{TEMPLATE_NAME}} Styles
+// Mode: General (Image)
+
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+body {
+  font-family: Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.container {
+  width: 400px;
+  height: 400px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 40px;
+}
+
+.content {
+  text-align: center;
+}
+
+.heading {
+  font-size: 32px;
+  font-weight: bold;
+  margin-bottom: 20px;
+  color: #333;
+}
+
+.body-text {
+  font-size: 16px;
+  line-height: 1.6;
+  color: #666;
+  white-space: pre-line;
+}

package/templates/pdf/CHANGELOG.md

@@ -0,0 +1,12 @@
+# Changelog - {{TEMPLATE_NAME}}
+
+## [1.0.0] - {{DATE}}
+
+### Added
+- Initial PDF template creation
+- Prince version {{PRINCE_VERSION}} support
+- Rich text editor for body content
+- Customizable primary color
+- Page numbers and headers
+- Hi-res and low-res PDF export options
+- Print-ready with bleed and crop marks

package/templates/pdf/data.yaml

@@ -0,0 +1,70 @@
+---
+name: {{TEMPLATE_ID}} - {{TEMPLATE_NAME}}
+mode: pdf
+prince_version: {{PRINCE_VERSION}}
+status: 0
+subdomain: {{SUBDOMAIN}}
+dimension_mode: mm
+page_count: 1
+draft_proofable: true
+dimension_width: 210
+dimension_height: 297
+compositing_data: {}
+export_options:
+  orderable:
+    title: Print order
+    description: Order from Snap
+    description_complete: Ordered from Snap
+    title_download: This is the title for the orderable download
+    description_download: Download for your own printer
+    description_download_complete: Downloaded for your own printer
+    marks: true
+    bleed: true
+    supplier_choice: true
+  downloadables:
+    hi_res:
+      title: Hi-res Download
+      description: High resolution PDF for printing
+      renderer: pdf
+      marks: true
+      bleed: true
+      slug: false
+      approval_required: false
+      disable_printing: false
+    low-res-pdf:
+      title: Local Printer PDF
+      description: Use this version when emailing or printing in-house
+      renderer: pdf
+      bleed: false
+      slug: false
+      marks: false
+      approval_required: false
+      disable_printing: false
+      resolution: 200
+fields_data:
+  heading:
+    type: text
+    title: Heading
+    default: {{TEMPLATE_NAME}}
+    placeholder: Enter heading text
+  
+  body-text:
+    type: richtext
+    title: Body Text
+    placeholder: Enter your content here
+    font_sizes: 10px:14px 12px:16px 16px:18px:p 18px:20px
+    toolbar:
+      - bold
+      - italic
+      - link
+      - ul
+      - ol
+  
+  primary-color:
+    type: colour
+    title: Primary Colour
+    customisable: true
+    options:
+      '0079C8': Blue
+      'FF6B35': Orange
+      '004E89': Navy

package/templates/pdf/index.html

@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>{{TEMPLATE_NAME}}</title>
+</head>
+<body>
+  <div class="page">
+    <div class="content">
+      <h1 class="heading" style="color: #{{primary-color}};">{{{heading}}}</h1>
+      <div class="body-text">{{{body-text}}}</div>
+    </div>
+  </div>
+</body>
+</html>

package/templates/pdf/style.scss.hbs

@@ -0,0 +1,108 @@
+// {{TEMPLATE_NAME}} Styles
+// Mode: PDF
+// Prince Version: {{PRINCE_VERSION}}
+
+// Page setup
+@page {
+  size: A4 portrait;
+  margin: 15mm;
+  
+  @top-center {
+    content: "{{TEMPLATE_NAME}}";
+    font-size: 10pt;
+    color: #999;
+  }
+  
+  @bottom-right {
+    content: "Page " counter(page);
+    font-size: 10pt;
+    color: #999;
+  }
+}
+
+// PDF color conversion
+@prince-pdf {
+  prince-pdf-color-conversion: full;
+}
+
+// Reset
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+body {
+  font-family: Arial, sans-serif;
+  font-size: 12pt;
+  line-height: 1.6;
+  color: #333;
+}
+
+.page {
+  width: 210mm;
+  height: 297mm;
+  position: relative;
+}
+
+.content {
+  padding: 20mm;
+}
+
+.heading {
+  font-size: 24pt;
+  font-weight: bold;
+  margin-bottom: 10mm;
+  line-height: 1.2;
+}
+
+.body-text {
+  font-size: 12pt;
+  line-height: 1.6;
+  
+  p {
+    margin-bottom: 5mm;
+  }
+  
+  p:last-child {
+    margin-bottom: 0;
+  }
+  
+  strong {
+    font-weight: bold;
+  }
+  
+  em {
+    font-style: italic;
+  }
+  
+  ul, ol {
+    margin-left: 10mm;
+    margin-bottom: 5mm;
+    list-style-position: outside;
+  }
+  
+  li {
+    margin-bottom: 2mm;
+  }
+  
+  a {
+    color: #0079C8;
+    text-decoration: underline;
+  }
+}
+
+// Utility: prevent orphans and widows
+p {
+  orphans: 3;
+  widows: 3;
+}
+
+// Utility: page breaks
+.page-break {
+  page-break-before: always;
+}
+
+.avoid-break {
+  page-break-inside: avoid;
+}

package/templates/video/CHANGELOG.md

@@ -0,0 +1,11 @@
+# Changelog - {{TEMPLATE_NAME}}
+
+## [1.0.0] - {{DATE}}
+
+### Added
+- Initial video template creation
+- 1920x1080 Full HD resolution
+- 30 second duration
+- Customizable background and text colors
+- Fade-in animation effects
+- Main text and subheading fields

package/templates/video/data.yaml

@@ -0,0 +1,43 @@
+---
+name: {{TEMPLATE_ID}} - {{TEMPLATE_NAME}}
+mode: video
+subdomain: {{SUBDOMAIN}}
+duration: '30'
+highlight_point: '27'
+dimension_height: 1080
+dimension_width: 1920
+export_options:
+  downloadables:
+    hi-res:
+      title: 1080p
+fields_data:
+  main-text:
+    type: text
+    title: Main Text
+    default: {{TEMPLATE_NAME}}
+    placeholder: Enter main text
+  
+  subheading:
+    type: text
+    title: Subheading
+    default: Your message here
+    placeholder: Enter subheading
+  
+  background-color:
+    type: colour
+    title: Background Colour
+    customisable: true
+    options:
+      '0079C8': Blue
+      'FF6B35': Orange
+      '000000': Black
+      'FFFFFF': White
+  
+  text-color:
+    type: colour
+    title: Text Colour
+    customisable: true
+    options:
+      'FFFFFF': White
+      '000000': Black
+      '0079C8': Blue

package/templates/video/index.html

@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>{{TEMPLATE_NAME}}</title>
+</head>
+<body>
+  <div class="video-container" style="background-color: #{{background-color}};">
+    <div class="content">
+      <h1 class="main-text" style="color: #{{text-color}};">{{{main-text}}}</h1>
+      <p class="subheading" style="color: #{{text-color}};">{{{subheading}}}</p>
+    </div>
+  </div>
+</body>
+</html>

package/templates/video/style.scss.hbs

@@ -0,0 +1,57 @@
+// {{TEMPLATE_NAME}} Video Styles
+// Mode: Video
+// Duration: 30 seconds
+// Dimensions: 1920x1080 (Full HD)
+
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+body {
+  font-family: Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.video-container {
+  width: 1920px;
+  height: 1080px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: relative;
+}
+
+.content {
+  text-align: center;
+  padding: 100px;
+  max-width: 1400px;
+}
+
+.main-text {
+  font-size: 120px;
+  font-weight: bold;
+  line-height: 1.2;
+  margin-bottom: 40px;
+  animation: fadeIn 1s ease-in;
+}
+
+.subheading {
+  font-size: 60px;
+  line-height: 1.4;
+  animation: fadeIn 1.5s ease-in;
+}
+
+// Animation keyframes
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+    transform: translateY(20px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}