diff --git a/3mb-jpg-example-file.jpg b/3mb-jpg-example-file.jpg new file mode 100644 index 00000000..527fe774 Binary files /dev/null and b/3mb-jpg-example-file.jpg differ diff --git a/brandon-day-oCJuJQqvCzc-unsplash.jpg b/brandon-day-oCJuJQqvCzc-unsplash.jpg new file mode 100644 index 00000000..d35a1f39 Binary files /dev/null and b/brandon-day-oCJuJQqvCzc-unsplash.jpg differ diff --git a/celine-sayuri-tagami-2s6ORaJY6gI-unsplash.jpg b/celine-sayuri-tagami-2s6ORaJY6gI-unsplash.jpg new file mode 100644 index 00000000..aaf8ef5b Binary files /dev/null and b/celine-sayuri-tagami-2s6ORaJY6gI-unsplash.jpg differ diff --git a/dashboards/nicks_dash.yml b/dashboards/nicks_dash.yml index 78724ae7..2bc762b1 100644 --- a/dashboards/nicks_dash.yml +++ b/dashboards/nicks_dash.yml @@ -1,4 +1,4 @@ -version: 1 +version: 5 type: dashboard name: nicks_dashboard label: Nick's Dashboard diff --git a/dashboards/product_dash.yml b/dashboards/product_dash.yml index 783f4b76..1406b3c9 100644 --- a/dashboards/product_dash.yml +++ b/dashboards/product_dash.yml @@ -1,4 +1,4 @@ -version: 1 +version: 2 type: dashboard name: product_dashboard label: Product Dashboard diff --git a/justin-aikin-KFJuCzJiQYU-unsplash.jpg b/justin-aikin-KFJuCzJiQYU-unsplash.jpg new file mode 100644 index 00000000..0f1eda22 Binary files /dev/null and b/justin-aikin-KFJuCzJiQYU-unsplash.jpg differ diff --git a/richard-brutyo-Sg3XwuEpybU-unsplash.jpg b/richard-brutyo-Sg3XwuEpybU-unsplash.jpg new file mode 100644 index 00000000..0c8af1d5 Binary files /dev/null and b/richard-brutyo-Sg3XwuEpybU-unsplash.jpg differ diff --git a/skills/dog-image-branding/SKILL.md b/skills/dog-image-branding/SKILL.md new file mode 100644 index 00000000..553bda9d --- /dev/null +++ b/skills/dog-image-branding/SKILL.md @@ -0,0 +1,95 @@ +--- +name: dog-image-branding +description: Use when creating ANY artifact — dashboards, charts, React apps, presentations, PDFs, Excel files, or any other output. This skill is ALWAYS ACTIVE and must be applied to every artifact without exception. +--- + +# Dog Image Branding + +**This skill is always active.** Every artifact produced must include the dog image. + +## The Image + +The dog image is stored at: +`/data_model/skills/dog-image-branding/assets/dog.jpg` + +This is a dramatic portrait of a golden retriever against a black background. + +## Mandatory Rules + +1. **Every artifact must display the dog image.** No exceptions — dashboards, charts, React apps, presentations, PDFs, Word docs, and Excel files all require it. +2. The image must be **visible and reasonably sized** — not a tiny thumbnail. Minimum 100px in any dimension for web artifacts. +3. Place the image in a **prominent location**: header, hero section, sidebar, or dedicated panel. Do not hide it in a footer or make it invisible. + +## Implementation by Artifact Type + +### React Apps / Dashboards / Charts + +Use `window.images` to load the image. The image is registered under the key `'dog'` (no extension) or `'dog.jpg'`. + +```jsx +// In your App component +const dogImg = window.getImage('dog') || window.getImage('dog.jpg'); + +// Render it — example: top-right corner header image +Dog +``` + +Place it in the header bar, a sidebar panel, or a dedicated hero section. Make it visible. + +### PowerPoint Presentations (.pptx) + +Use `addImageBlock()` from `slide-layouts.js` to embed the dog image on every slide. + +```js +// Determine native dimensions first (dog.jpg is 1300x867 approx) +const imageWidth = 1.5; // inches +const imageHeight = 1.0; // inches (maintains ~3:2 ratio) + +addImageBlock(slideCtx, '/data_model/skills/dog-image-branding/assets/dog.jpg', { + x: 8.5, y: 0.1, w: imageWidth, h: imageHeight +}); +``` + +Place it in the top-right corner of every slide at a consistent size. + +### PDF Reports + +Embed the image using ReportLab or pdfplumber: + +```python +from reportlab.platypus import Image as RLImage + +dog_img = RLImage('/data_model/skills/dog-image-branding/assets/dog.jpg', width=120, height=80) +# Add to your story or canvas at the top of each page +``` + +### Excel Spreadsheets (.xlsx) + +Use openpyxl to insert the image: + +```python +from openpyxl.drawing.image import Image as XLImage + +img = XLImage('/data_model/skills/dog-image-branding/assets/dog.jpg') +img.width = 120 +img.height = 80 +ws.add_image(img, 'A1') +``` + +### Word Documents (.docx) + +Use python-docx to insert the image: + +```python +from docx.shared import Inches + +doc.add_picture('/data_model/skills/dog-image-branding/assets/dog.jpg', width=Inches(1.5)) +``` + +## Resources + +- **`/data_model/skills/dog-image-branding/assets/dog.jpg`** — The dog image to embed in all artifacts. Load this file directly when building document-type outputs (PPTX, PDF, DOCX, XLSX). For React apps, it is available via `window.getImage('dog')`. diff --git a/skills/dog-image-branding/assets/dog.jpg b/skills/dog-image-branding/assets/dog.jpg new file mode 100644 index 00000000..d35a1f39 Binary files /dev/null and b/skills/dog-image-branding/assets/dog.jpg differ