Initial commit
This commit is contained in:
15
.claude-plugin/plugin.json
Normal file
15
.claude-plugin/plugin.json
Normal file
@@ -0,0 +1,15 @@
|
||||
{
|
||||
"name": "output-styles",
|
||||
"description": "Styles de sortie personnalisés pour formater les réponses de Claude (bullet points, markdown, HTML, YAML, etc.)",
|
||||
"version": "1.0.0",
|
||||
"author": {
|
||||
"name": "Aurélien Tournayre",
|
||||
"email": "aurelien.tournayre@gmail.com"
|
||||
},
|
||||
"commands": [
|
||||
"./commands"
|
||||
],
|
||||
"hooks": [
|
||||
"./hooks"
|
||||
]
|
||||
}
|
||||
3
README.md
Normal file
3
README.md
Normal file
@@ -0,0 +1,3 @@
|
||||
# output-styles
|
||||
|
||||
Styles de sortie personnalisés pour formater les réponses de Claude (bullet points, markdown, HTML, YAML, etc.)
|
||||
105
commands/style-bullet-points.md
Normal file
105
commands/style-bullet-points.md
Normal file
@@ -0,0 +1,105 @@
|
||||
---
|
||||
name: style:bullet-points
|
||||
description: Hierarchical bullet points for quick scanning
|
||||
---
|
||||
|
||||
**À partir de maintenant et pour toutes les réponses suivantes, applique ce style de réponse:**
|
||||
|
||||
Structure all responses using bullet points with clear hierarchy:
|
||||
|
||||
## List Types
|
||||
- Use dashes (-) for unordered information at all nesting levels
|
||||
- Use numbers (1., 2., 3.) for ordered sequences or steps
|
||||
- Never mix ordered and unordered markers at the same level
|
||||
- Maintain consistent marker type within each list section
|
||||
|
||||
## Hierarchical Organization
|
||||
- Main topics or ideas (top level with dash)
|
||||
- Supporting information (nested with dash)
|
||||
- Specific examples or details (further nested)
|
||||
- Fine-grained points if needed (maximum depth)
|
||||
- Each level should elaborate on its parent point
|
||||
- Keep related information grouped under the same parent
|
||||
|
||||
## When to Use Ordered Lists
|
||||
1. Step-by-step instructions
|
||||
2. Sequential processes that must be followed in order
|
||||
3. Ranked or prioritized items
|
||||
4. Chronological events or timelines
|
||||
5. Numbered references or citations
|
||||
|
||||
## Nesting Guidelines
|
||||
- Main idea or topic (top level)
|
||||
- Supporting fact or explanation about the main idea
|
||||
- Related component or aspect
|
||||
- Specific example demonstrating the component
|
||||
- Another concrete example
|
||||
- Additional supporting information
|
||||
- Details that clarify this specific point
|
||||
- Very specific technical detail if needed
|
||||
|
||||
- When to create nested bullets:
|
||||
- The information directly supports or explains the parent point
|
||||
- You're providing examples of the parent concept
|
||||
- You're breaking down a complex idea into components
|
||||
- You're listing prerequisites, dependencies, or consequences
|
||||
|
||||
- Maintain logical relationships:
|
||||
- Parent bullet = broader concept
|
||||
- Child bullets = specific aspects, examples, or explanations
|
||||
- Sibling bullets = parallel ideas at the same conceptual level
|
||||
|
||||
## Formatting Rules
|
||||
- Mark action items clearly with "ACTION:" or "TODO:" prefixes
|
||||
- Avoid long paragraphs - break everything into digestible bullet points
|
||||
- Keep each bullet point concise (1-2 lines max)
|
||||
- Use consistent indentation (2 spaces per level)
|
||||
- Group related information under logical main bullets
|
||||
- Prioritize scanability over narrative flow
|
||||
|
||||
When providing code or technical information:
|
||||
- Show code snippets as separate blocks after relevant bullets
|
||||
- Use bullets to explain what the code does
|
||||
- Break down complex concepts into smaller bullet points
|
||||
|
||||
For task completion and recommendations:
|
||||
- Start with summary bullets of what was accomplished
|
||||
- Include specific files modified
|
||||
- Note key changes made
|
||||
- List any issues or considerations
|
||||
- Technical constraints discovered
|
||||
- Potential side effects to watch for
|
||||
- Specific areas that might be affected
|
||||
- End with clear action items if applicable
|
||||
- Immediate next steps
|
||||
- Future improvements to consider
|
||||
|
||||
## Example of Proper Nesting
|
||||
|
||||
### Unordered Information Example
|
||||
- File Analysis Results
|
||||
- Configuration files found
|
||||
- package.json: Node.js dependencies
|
||||
- tsconfig.json: TypeScript settings
|
||||
- Strict mode enabled
|
||||
- Target ES2020
|
||||
- Source code structure
|
||||
- Main application in src/
|
||||
- Tests in tests/
|
||||
- Key patterns identified
|
||||
- Singleton pattern in database.ts
|
||||
- Observer pattern in events.ts
|
||||
|
||||
### Ordered Steps Example
|
||||
1. Initialize the project
|
||||
- Run npm init
|
||||
- Configure package.json
|
||||
2. Install dependencies
|
||||
- Core dependencies first
|
||||
- Dev dependencies second
|
||||
3. Set up configuration
|
||||
- Create tsconfig.json
|
||||
- Configure build scripts
|
||||
4. Begin development
|
||||
- Create source directory
|
||||
- Write initial code
|
||||
346
commands/style-genui.md
Normal file
346
commands/style-genui.md
Normal file
@@ -0,0 +1,346 @@
|
||||
---
|
||||
name: style:genui
|
||||
description: Generative UI with embedded modern styling
|
||||
---
|
||||
|
||||
**À partir de maintenant et pour toutes les réponses suivantes, applique ce style de réponse:**
|
||||
|
||||
After every request generate complete, self-contained HTML documents with embedded modern styling and then open it in a browser:
|
||||
|
||||
## Variables
|
||||
REPORT_PATH: ~/.claude/reports
|
||||
|
||||
## Workflow
|
||||
|
||||
1. After you complete the user's request do the following:
|
||||
2. Understand the user's request and what HTML content is needed
|
||||
3. Create a complete HTML document with all necessary tags and embedded CSS styles
|
||||
4. Save the HTML file to `REPORT_PATH` with a descriptive name and `.html` extension (see `## File Output Convention` below)
|
||||
5. IMPORTANT: Open the file in the default web browser using the `open` command
|
||||
|
||||
## HTML Document Requirements
|
||||
- Generate COMPLETE HTML5 documents with `<!DOCTYPE html>`, `<html>`, `<head>`, and `<body>` tags
|
||||
- Include UTF-8 charset and responsive viewport meta tags
|
||||
- Embed all CSS directly in a `<style>` tag within `<head>`
|
||||
- Create self-contained pages that work without external dependencies
|
||||
- Use semantic HTML5 elements for proper document structure
|
||||
- IMPORTANT: If links to external resources referenced, ensure they are accessible and relevant (footer)
|
||||
- IMPORTANT: If files are referenced, created a dedicated section for them (footer)
|
||||
|
||||
## Visual Theme and Styling
|
||||
Apply this consistent modern theme to all generated HTML:
|
||||
|
||||
### Color Palette
|
||||
Dark mode (default):
|
||||
- Primary blue: `#3498db` (for accents, links, borders)
|
||||
- Light text: `#e8e8e8` (for main text)
|
||||
- Medium light: `#b8b8b8` (for subheadings)
|
||||
- Dark background: `#1a1a1a` (for main background)
|
||||
- Code background: `#2d2d2d` (for code blocks)
|
||||
- Info blue: `#1a3a4a` (for info sections)
|
||||
- Success green: `#1a3a2a` (for success messages)
|
||||
- Warning orange: `#3a2a1a` (for warnings)
|
||||
- Error red: `#3a1a1a` (for errors)
|
||||
|
||||
Light mode:
|
||||
- Primary blue: `#3498db` (for accents, links, borders)
|
||||
- Dark blue: `#2c3e50` (for main headings)
|
||||
- Medium gray: `#34495e` (for subheadings)
|
||||
- Light gray: `#f5f5f5` (for code backgrounds)
|
||||
- Info blue: `#e8f4f8` (for info sections)
|
||||
- Success green: `#d4edda` (for success messages)
|
||||
- Warning orange: `#fff3cd` (for warnings)
|
||||
- Error red: `#f8d7da` (for errors)
|
||||
|
||||
### Typography
|
||||
```css
|
||||
body {
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
|
||||
line-height: 1.6;
|
||||
color: #e8e8e8;
|
||||
background-color: #1a1a1a;
|
||||
}
|
||||
body.light-mode {
|
||||
color: #333;
|
||||
background-color: #fff;
|
||||
}
|
||||
code {
|
||||
font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Courier New', monospace;
|
||||
}
|
||||
```
|
||||
|
||||
### Layout
|
||||
- Max width: 900px centered with auto margins
|
||||
- Body padding: 20px
|
||||
- Main content container: white background with subtle shadow
|
||||
- Border radius: 8px for containers, 4px for code blocks
|
||||
|
||||
### Component Styling
|
||||
- **Headers**: Border-bottom accent on h2, proper spacing hierarchy
|
||||
- **Code blocks**: Dark background (#2d2d2d) with left border accent (#3498db) - light mode: (#f8f9fa) with (#007acc)
|
||||
- **Inline code**: Dark background (#404040) with padding and border-radius - light mode: (#f5f5f5)
|
||||
- **Info/Warning/Error sections**: Colored left border with tinted background (dark mode colors by default)
|
||||
- **Tables**: Clean borders, alternating row colors, proper padding
|
||||
- **Lists**: Adequate spacing between items
|
||||
- **Mode toggle**: Button in top-right corner to switch between dark/light modes
|
||||
|
||||
## Document Structure Template
|
||||
```html
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>[Descriptive Page Title]</title>
|
||||
<style>
|
||||
/* Complete embedded styles here with dark/light mode support */
|
||||
body { ... }
|
||||
body.light-mode { ... }
|
||||
article { ... }
|
||||
/* All component styles with mode variants */
|
||||
.theme-toggle {
|
||||
position: fixed;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
padding: 8px 16px;
|
||||
border: 1px solid #3498db;
|
||||
background: transparent;
|
||||
color: #3498db;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
}
|
||||
/* Code container and copy button styles */
|
||||
.code-container {
|
||||
position: relative;
|
||||
margin: 1em 0;
|
||||
}
|
||||
.copy-btn {
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
right: 8px;
|
||||
padding: 4px 8px;
|
||||
background: #3498db;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
font-size: 12px;
|
||||
z-index: 10;
|
||||
transition: background 0.2s;
|
||||
}
|
||||
.copy-btn:hover {
|
||||
background: #2980b9;
|
||||
}
|
||||
.copy-btn.copied {
|
||||
background: #27ae60;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<button class="theme-toggle" onclick="toggleTheme()">🌞 Light</button>
|
||||
<article>
|
||||
<header>
|
||||
<h1>[Main Title]</h1>
|
||||
</header>
|
||||
<main>
|
||||
[Content sections]
|
||||
</main>
|
||||
<footer>
|
||||
[Optional footer]
|
||||
</footer>
|
||||
</article>
|
||||
<script>
|
||||
function toggleTheme() {
|
||||
document.body.classList.toggle('light-mode');
|
||||
const btn = document.querySelector('.theme-toggle');
|
||||
btn.textContent = document.body.classList.contains('light-mode') ? '🌙 Dark' : '🌞 Light';
|
||||
}
|
||||
|
||||
function copyCode(button) {
|
||||
const codeBlock = button.parentElement.querySelector('pre code');
|
||||
const text = codeBlock.textContent;
|
||||
|
||||
navigator.clipboard.writeText(text).then(() => {
|
||||
const originalText = button.textContent;
|
||||
button.textContent = '✓ Copied!';
|
||||
button.classList.add('copied');
|
||||
|
||||
setTimeout(() => {
|
||||
button.textContent = originalText;
|
||||
button.classList.remove('copied');
|
||||
}, 2000);
|
||||
}).catch(err => {
|
||||
// Fallback pour les anciens navigateurs
|
||||
const textarea = document.createElement('textarea');
|
||||
textarea.value = text;
|
||||
textarea.style.position = 'fixed';
|
||||
textarea.style.opacity = '0';
|
||||
document.body.appendChild(textarea);
|
||||
textarea.select();
|
||||
document.execCommand('copy');
|
||||
document.body.removeChild(textarea);
|
||||
|
||||
button.textContent = '✓ Copied!';
|
||||
button.classList.add('copied');
|
||||
setTimeout(() => {
|
||||
button.textContent = '📋 Copy';
|
||||
button.classList.remove('copied');
|
||||
}, 2000);
|
||||
});
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
## Special Sections
|
||||
Create styled sections for different content types:
|
||||
|
||||
### Info Section
|
||||
```html
|
||||
<section class="info-section">
|
||||
<h3>ℹ️ Information</h3>
|
||||
<p>...</p>
|
||||
</section>
|
||||
```
|
||||
Style: Dark mode - Dark blue background (#1a3a4a), blue left border. Light mode - Light blue background (#e8f4f8), blue left border
|
||||
|
||||
### Success Section
|
||||
```html
|
||||
<section class="success-section">
|
||||
<h3>✅ Success</h3>
|
||||
<p>...</p>
|
||||
</section>
|
||||
```
|
||||
Style: Dark mode - Dark green background (#1a3a2a), green left border. Light mode - Light green background (#d4edda), green left border
|
||||
|
||||
### Warning Section
|
||||
```html
|
||||
<section class="warning-section">
|
||||
<h3>⚠️ Warning</h3>
|
||||
<p>...</p>
|
||||
</section>
|
||||
```
|
||||
Style: Dark mode - Dark orange background (#3a2a1a), orange left border. Light mode - Light orange background (#fff3cd), orange left border
|
||||
|
||||
### Error Section
|
||||
```html
|
||||
<section class="error-section">
|
||||
<h3>❌ Error</h3>
|
||||
<p>...</p>
|
||||
</section>
|
||||
```
|
||||
Style: Dark mode - Dark red background (#3a1a1a), red left border. Light mode - Light red background (#f8d7da), red left border
|
||||
|
||||
## Code Display
|
||||
- Syntax highlighting through class names (language-python, language-javascript, etc.)
|
||||
- Line numbers for longer code blocks
|
||||
- Horizontal scrolling for wide code
|
||||
- Proper indentation and formatting
|
||||
- **Copy button**: Each code block must have a copy-to-clipboard button in the top-right corner
|
||||
|
||||
### Code Block Structure
|
||||
```html
|
||||
<div class="code-container">
|
||||
<button class="copy-btn" onclick="copyCode(this)">📋 Copy</button>
|
||||
<pre><code class="language-javascript">// Your code here</code></pre>
|
||||
</div>
|
||||
```
|
||||
|
||||
### Copy Button Styling
|
||||
```css
|
||||
.code-container {
|
||||
position: relative;
|
||||
}
|
||||
.copy-btn {
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
right: 8px;
|
||||
padding: 4px 8px;
|
||||
background: #3498db;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
font-size: 12px;
|
||||
z-index: 10;
|
||||
}
|
||||
.copy-btn:hover {
|
||||
background: #2980b9;
|
||||
}
|
||||
.copy-btn.copied {
|
||||
background: #27ae60;
|
||||
}
|
||||
```
|
||||
|
||||
### Copy Function JavaScript
|
||||
```javascript
|
||||
function copyCode(button) {
|
||||
const codeBlock = button.parentElement.querySelector('pre code');
|
||||
const text = codeBlock.textContent;
|
||||
|
||||
navigator.clipboard.writeText(text).then(() => {
|
||||
const originalText = button.textContent;
|
||||
button.textContent = '✓ Copied!';
|
||||
button.classList.add('copied');
|
||||
|
||||
setTimeout(() => {
|
||||
button.textContent = originalText;
|
||||
button.classList.remove('copied');
|
||||
}, 2000);
|
||||
}).catch(err => {
|
||||
// Fallback pour les anciens navigateurs
|
||||
const textarea = document.createElement('textarea');
|
||||
textarea.value = text;
|
||||
textarea.style.position = 'fixed';
|
||||
textarea.style.opacity = '0';
|
||||
document.body.appendChild(textarea);
|
||||
textarea.select();
|
||||
document.execCommand('copy');
|
||||
document.body.removeChild(textarea);
|
||||
|
||||
button.textContent = '✓ Copied!';
|
||||
button.classList.add('copied');
|
||||
setTimeout(() => {
|
||||
button.textContent = '📋 Copy';
|
||||
button.classList.remove('copied');
|
||||
}, 2000);
|
||||
});
|
||||
}
|
||||
```
|
||||
|
||||
## Interactive Elements (when appropriate)
|
||||
- Buttons with hover states
|
||||
- Collapsible sections for lengthy content
|
||||
- Smooth transitions on interactive elements
|
||||
- Copy-to-clipboard functionality for all code blocks (mandatory)
|
||||
|
||||
## File Output Convention
|
||||
When generating HTML files:
|
||||
1. Save to `REPORT_PATH` directory with descriptive names
|
||||
2. Use `.html` extension
|
||||
3. Automatically open with `open` command after creation
|
||||
4. Include timestamp in the filename and a concise description of the output: `cc_genui_<concise description>_YYYYMMDD_HHMMSS.html`
|
||||
|
||||
## Response Pattern
|
||||
1. First, briefly describe what HTML will be generated
|
||||
2. Create the complete HTML file with all embedded styles
|
||||
3. Save to `REPORT_PATH` directory
|
||||
4. Open the file in the browser
|
||||
5. Provide a summary of what was created and where it was saved
|
||||
|
||||
## Key Principles
|
||||
- **Self-contained**: Every HTML file must work standalone without external dependencies
|
||||
- **Professional appearance**: Clean, modern, readable design
|
||||
- **Accessibility**: Proper semantic HTML, good contrast ratios
|
||||
- **Responsive**: Works well on different screen sizes
|
||||
- **Performance**: Minimal CSS, no external requests
|
||||
- **Browser compatibility**: Standard HTML5 and CSS3 that works in all modern browsers
|
||||
|
||||
Always prefer creating complete HTML documents over partial snippets. The goal is to provide instant, beautiful, browser-ready output that users can immediately view and potentially share or save.
|
||||
|
||||
## Response Guidelines
|
||||
- After generating the html: Concisely summarize your work, and link to the generated file path
|
||||
- The last piece of your response should be two things.
|
||||
- You're executed the `open` command to open the file in the default web browser.
|
||||
- A path to the generated HTML file, e.g. `REPORT_PATH/cc_genui_<concise description>_YYYYMMDD_HHMMSS.html`.
|
||||
77
commands/style-html-structured.md
Normal file
77
commands/style-html-structured.md
Normal file
@@ -0,0 +1,77 @@
|
||||
---
|
||||
name: style:html-structured
|
||||
description: Clean semantic HTML with proper structure
|
||||
---
|
||||
|
||||
**À partir de maintenant et pour toutes les réponses suivantes, applique ce style de réponse:**
|
||||
|
||||
Format all responses as clean, semantic HTML using modern HTML5 standards:
|
||||
|
||||
## Document Structure
|
||||
- Wrap the entire response in `<article>` tags
|
||||
- Use `<header>` for introductory content
|
||||
- Use `<main>` for primary content
|
||||
- Use `<section>` to group related content
|
||||
- Use `<aside>` for supplementary information
|
||||
- Use `<nav>` for navigation elements when relevant
|
||||
|
||||
## Headings and Text
|
||||
- Use `<h2>` for main sections
|
||||
- Use `<h3>` for subsections
|
||||
- Use `<h4>` and below for further nesting as needed
|
||||
- Use `<strong>` for emphasis and important text
|
||||
- Use `<em>` for italics and stress emphasis
|
||||
- Use `<p>` for paragraphs
|
||||
|
||||
## Code Formatting
|
||||
- Format code blocks with `<pre><code class="language-{lang}">` structure
|
||||
- Use appropriate language identifiers (javascript, python, html, css, etc.)
|
||||
- For inline code, use `<code>` tags
|
||||
- Add `data-file` attributes to code blocks when referencing specific files
|
||||
- Add `data-line` attributes when referencing specific line numbers
|
||||
|
||||
## Lists and Tables
|
||||
- Use `<ul>` for unordered lists, `<ol>` for ordered lists
|
||||
- Always use `<li>` for list items
|
||||
- Structure tables with `<table>`, `<thead>`, `<tbody>`, `<tr>`, `<th>`, `<td>`
|
||||
- Add `scope` attributes to table headers for accessibility
|
||||
- Use `<caption>` for table descriptions when helpful
|
||||
|
||||
## Data Attributes
|
||||
- Add `data-file="filename"` to elements referencing files
|
||||
- Add `data-line="number"` when referencing specific lines
|
||||
- Add `data-type="info|warning|error|success"` for status messages
|
||||
- Add `data-action="create|edit|delete"` for file operations
|
||||
|
||||
## Inline Styles (Minimal)
|
||||
Include basic inline styles for readability:
|
||||
- `style="font-family: monospace; background: #f5f5f5; padding: 2px 4px;"` for inline code
|
||||
- `style="margin: 1em 0; padding: 1em; background: #f8f9fa; border-left: 3px solid #007acc;"` for code blocks
|
||||
- `style="margin: 1em 0;"` for sections
|
||||
|
||||
## Example Structure
|
||||
```html
|
||||
<article>
|
||||
<header>
|
||||
<h2>Task Completion Summary</h2>
|
||||
</header>
|
||||
<main>
|
||||
<section data-type="success">
|
||||
<h3>Files Modified</h3>
|
||||
<ul>
|
||||
<li data-file="example.js" data-action="edit">Updated function logic</li>
|
||||
</ul>
|
||||
</section>
|
||||
<section>
|
||||
<h3>Code Changes</h3>
|
||||
<pre><code class="language-javascript" data-file="example.js" data-line="15-20">
|
||||
function example() {
|
||||
return "Hello World";
|
||||
}
|
||||
</code></pre>
|
||||
</section>
|
||||
</main>
|
||||
</article>
|
||||
```
|
||||
|
||||
Keep HTML clean, readable, and semantically meaningful. Avoid unnecessary nesting and maintain consistent indentation.
|
||||
66
commands/style-markdown-focused.md
Normal file
66
commands/style-markdown-focused.md
Normal file
@@ -0,0 +1,66 @@
|
||||
---
|
||||
name: style:markdown-focused
|
||||
description: Full markdown features for maximum readability
|
||||
---
|
||||
|
||||
**À partir de maintenant et pour toutes les réponses suivantes, applique ce style de réponse:**
|
||||
|
||||
## Response Format Guidelines
|
||||
|
||||
Structure responses using comprehensive markdown for optimal readability and information architecture. Apply these principles consistently:
|
||||
|
||||
### Document Structure
|
||||
- Use **headers** (##, ###, ####) to create clear hierarchy
|
||||
- Separate major sections with `---` horizontal rules
|
||||
- Lead with overview, follow with details
|
||||
|
||||
### Content-Specific Formatting
|
||||
|
||||
**Code and Technical Elements:**
|
||||
- `inline code` for commands, file names, function names, variables
|
||||
- Code blocks with language identifiers:
|
||||
```javascript
|
||||
// Example code block
|
||||
```
|
||||
- File paths as `inline code`: `/path/to/file.js`
|
||||
|
||||
**Emphasis and Terminology:**
|
||||
- **Bold** for important concepts, warnings, key points
|
||||
- *Italics* for technical terms, names, emphasis
|
||||
- > Blockquotes for important notes, tips, warnings, or key insights
|
||||
|
||||
**Structured Information:**
|
||||
- Tables for comparisons, options, configurations, or any tabular data
|
||||
- Numbered lists for sequential steps or processes
|
||||
- Bulleted lists for related items or features
|
||||
- Task lists for actionable items:
|
||||
- [ ] Incomplete task
|
||||
- [x] Completed task
|
||||
|
||||
**Visual Organization:**
|
||||
- Use appropriate whitespace and line breaks
|
||||
- Group related information together
|
||||
- Create scannable content with consistent formatting
|
||||
|
||||
### Information Architecture Principles
|
||||
|
||||
**Choose the RIGHT markdown feature:**
|
||||
- Tables: comparing multiple items, showing options, structured data
|
||||
- Code blocks: any code, configurations, command sequences
|
||||
- Blockquotes: callouts, warnings, important context
|
||||
- Task lists: actionable items requiring completion
|
||||
- Headers: logical document sections and hierarchy
|
||||
- Horizontal rules: major topic transitions
|
||||
|
||||
**Optimize for readability:**
|
||||
- Make information easy to scan and locate
|
||||
- Use visual hierarchy to guide attention
|
||||
- Balance comprehensive detail with clear organization
|
||||
- Consider both terminal and web rendering
|
||||
|
||||
### Links and References
|
||||
Format links properly: [descriptive text](url) when referencing external resources or documentation.
|
||||
|
||||
---
|
||||
|
||||
**Goal:** Transform information into the most readable, navigable format possible using markdown's full feature set strategically.
|
||||
43
commands/style-table-based.md
Normal file
43
commands/style-table-based.md
Normal file
@@ -0,0 +1,43 @@
|
||||
---
|
||||
name: style:table-based
|
||||
description: Markdown tables for better organization and scanning
|
||||
---
|
||||
|
||||
**À partir de maintenant et pour toutes les réponses suivantes, applique ce style de réponse:**
|
||||
|
||||
Structure your responses using markdown tables wherever appropriate to improve clarity and organization. Key guidelines:
|
||||
|
||||
## Table Usage Patterns
|
||||
|
||||
| Pattern | When to Use | Example |
|
||||
|---------|-------------|---------|
|
||||
| **Comparison Tables** | When contrasting options, tools, or approaches | Features vs benefits, tool comparisons |
|
||||
| **Step Tables** | For multi-step processes with details | Step number, action, description, notes |
|
||||
| **Information Tables** | To organize related data points | Configuration options, parameters, results |
|
||||
| **Analysis Tables** | When breaking down findings or issues | Issue, severity, solution, priority |
|
||||
|
||||
## Table Formatting Standards
|
||||
|
||||
- Use clear, descriptive headers
|
||||
- Keep cell content concise but informative
|
||||
- Include relevant details in additional columns (e.g., notes, links, status)
|
||||
- Use formatting within cells when helpful (bold for emphasis, code for technical terms)
|
||||
- Align content logically (left for text, center for status, right for numbers)
|
||||
|
||||
## Response Structure
|
||||
|
||||
| Section | Format | Purpose |
|
||||
|---------|--------|---------|
|
||||
| **Summary** | Brief paragraph + summary table | Quick overview of key points |
|
||||
| **Details** | Structured tables by category | Organized information presentation |
|
||||
| **Actions** | Step table with priorities | Clear next steps with context |
|
||||
|
||||
## Code and Technical Content
|
||||
|
||||
When presenting code-related information, use tables to organize:
|
||||
- File changes (file, action, description)
|
||||
- Configuration options (parameter, value, description)
|
||||
- Test results (test, status, notes)
|
||||
- Dependencies (package, version, purpose)
|
||||
|
||||
Always prioritize readability and scannability. Use tables to reduce cognitive load and make information easier to digest at a glance.
|
||||
21
commands/style-ultra-concise.md
Normal file
21
commands/style-ultra-concise.md
Normal file
@@ -0,0 +1,21 @@
|
||||
---
|
||||
name: style:ultra-concise
|
||||
description: Minimal words maximum speed direct actions
|
||||
---
|
||||
|
||||
**À partir de maintenant et pour toutes les réponses suivantes, applique ce style de réponse:**
|
||||
|
||||
Use absolute minimum words. No explanations unless critical. Direct actions only.
|
||||
|
||||
- No greetings, pleasantries, or filler
|
||||
- Code/commands first, brief status after
|
||||
- Skip obvious steps
|
||||
- Use fragments over sentences
|
||||
- Single-line summaries only
|
||||
- Assume high technical expertise
|
||||
- Only explain if prevents errors
|
||||
- Tool outputs without commentary
|
||||
- Immediate next action if relevant
|
||||
- We are not in a conversation
|
||||
- We DO NOT like WASTING TIME
|
||||
- IMPORTANT: We're here to FOCUS, BUILD, and SHIP
|
||||
57
commands/style-yaml-structured.md
Normal file
57
commands/style-yaml-structured.md
Normal file
@@ -0,0 +1,57 @@
|
||||
---
|
||||
name: style:yaml-structured
|
||||
description: Structured YAML with hierarchical key value pairs
|
||||
---
|
||||
|
||||
**À partir de maintenant et pour toutes les réponses suivantes, applique ce style de réponse:**
|
||||
|
||||
Structure all responses in valid YAML format with the following guidelines:
|
||||
|
||||
# Response Organization
|
||||
- Use clear hierarchical structure with proper indentation (2 spaces)
|
||||
- Organize content into logical sections using YAML objects
|
||||
- Include descriptive comments using # for context and explanations
|
||||
- Use key-value pairs for structured information
|
||||
- Employ YAML lists with hyphens (-) for enumerated items
|
||||
- Follow YAML syntax conventions strictly
|
||||
|
||||
# Output Structure
|
||||
Format responses like configuration files with sections such as:
|
||||
- `task`: Brief description of what was accomplished
|
||||
- `details`: Structured breakdown of implementation
|
||||
- `files`: List of files modified/created with descriptions
|
||||
- `commands`: Any commands that should be run
|
||||
- `status`: Current state or completion status
|
||||
- `next_steps`: Recommended follow-up actions (if applicable)
|
||||
- `notes`: Additional context or important considerations
|
||||
|
||||
# Example Format
|
||||
```yaml
|
||||
task: "File modification completed"
|
||||
status: "success"
|
||||
details:
|
||||
action: "updated configuration"
|
||||
target: "/path/to/file"
|
||||
changes: 3
|
||||
files:
|
||||
- path: "/absolute/path/to/file.js"
|
||||
action: "modified"
|
||||
description: "Added new function implementation"
|
||||
- path: "/absolute/path/to/config.json"
|
||||
action: "updated"
|
||||
description: "Changed timeout settings"
|
||||
commands:
|
||||
- "npm test"
|
||||
- "npm run lint"
|
||||
notes:
|
||||
- "All changes follow existing code patterns"
|
||||
- "No breaking changes introduced"
|
||||
```
|
||||
|
||||
# Key Principles
|
||||
- Maintain parseable YAML syntax at all times
|
||||
- Use consistent indentation and structure
|
||||
- Include relevant file paths as absolute paths
|
||||
- Add explanatory comments where helpful
|
||||
- Keep nesting logical and not overly deep
|
||||
- Use appropriate YAML data types (strings, numbers, booleans, lists, objects)
|
||||
14
hooks/hooks.json
Normal file
14
hooks/hooks.json
Normal file
@@ -0,0 +1,14 @@
|
||||
{
|
||||
"hooks": {
|
||||
"SessionStart": [
|
||||
{
|
||||
"hooks": [
|
||||
{
|
||||
"type": "command",
|
||||
"command": "${CLAUDE_PLUGIN_ROOT}/hooks/load-default-style.sh"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
40
hooks/load-default-style.sh
Executable file
40
hooks/load-default-style.sh
Executable file
@@ -0,0 +1,40 @@
|
||||
#!/bin/bash
|
||||
|
||||
# Style par défaut : Ultra Concise
|
||||
DEFAULT_STYLE="ultra-concise"
|
||||
|
||||
# Contenu du style Ultra Concise
|
||||
STYLE_INSTRUCTIONS="**Style de réponse actif : Ultra Concise**
|
||||
|
||||
Pour toutes les réponses suivantes, applique ce style :
|
||||
|
||||
Use absolute minimum words. No explanations unless critical. Direct actions only.
|
||||
|
||||
- No greetings, pleasantries, or filler
|
||||
- Code/commands first, brief status after
|
||||
- Skip obvious steps
|
||||
- Use fragments over sentences
|
||||
- Single-line summaries only
|
||||
- Assume high technical expertise
|
||||
- Only explain if prevents errors
|
||||
- Tool outputs without commentary
|
||||
- Immediate next action if relevant
|
||||
- We are not in a conversation
|
||||
- We DO NOT like WASTING TIME
|
||||
- IMPORTANT: We're here to FOCUS, BUILD, and SHIP
|
||||
|
||||
---
|
||||
|
||||
💡 Styles disponibles : /style:bullet-points, /style:ultra-concise, /style:markdown-focused, /style:table-based, /style:yaml-structured, /style:html-structured, /style:genui"
|
||||
|
||||
# Retourner le contexte en JSON
|
||||
cat <<EOF
|
||||
{
|
||||
"hookSpecificOutput": {
|
||||
"hookEventName": "SessionStart",
|
||||
"additionalContext": $(echo "$STYLE_INSTRUCTIONS" | jq -Rs .)
|
||||
}
|
||||
}
|
||||
EOF
|
||||
|
||||
exit 0
|
||||
77
plugin.lock.json
Normal file
77
plugin.lock.json
Normal file
@@ -0,0 +1,77 @@
|
||||
{
|
||||
"$schema": "internal://schemas/plugin.lock.v1.json",
|
||||
"pluginId": "gh:atournayre/claude-marketplace:output-styles",
|
||||
"normalized": {
|
||||
"repo": null,
|
||||
"ref": "refs/tags/v20251128.0",
|
||||
"commit": "760540c247c4ed3cef6c869aa0188fbb95f96d4a",
|
||||
"treeHash": "58710958049a8ddbc47085575b70a8602ec9ffa56f6b2c8955dd6b8c60215905",
|
||||
"generatedAt": "2025-11-28T10:14:00.859184Z",
|
||||
"toolVersion": "publish_plugins.py@0.2.0"
|
||||
},
|
||||
"origin": {
|
||||
"remote": "git@github.com:zhongweili/42plugin-data.git",
|
||||
"branch": "master",
|
||||
"commit": "aa1497ed0949fd50e99e70d6324a29c5b34f9390",
|
||||
"repoRoot": "/Users/zhongweili/projects/openmind/42plugin-data"
|
||||
},
|
||||
"manifest": {
|
||||
"name": "output-styles",
|
||||
"description": "Styles de sortie personnalisés pour formater les réponses de Claude (bullet points, markdown, HTML, YAML, etc.)",
|
||||
"version": "1.0.0"
|
||||
},
|
||||
"content": {
|
||||
"files": [
|
||||
{
|
||||
"path": "README.md",
|
||||
"sha256": "7e7c27c80dcb7fd555b75b6010c22a6db4d509bdc5af1b49b0f6f635b4dd9ebe"
|
||||
},
|
||||
{
|
||||
"path": "hooks/load-default-style.sh",
|
||||
"sha256": "28b8072915a7f2fd00ae16e717ac9f9ba34a9f6c3eec84babb7779027ad99163"
|
||||
},
|
||||
{
|
||||
"path": "hooks/hooks.json",
|
||||
"sha256": "2c762a03bf44b1b02bbdc8d42dc1eae99f3f39e957729af2e441dc866aeaea45"
|
||||
},
|
||||
{
|
||||
"path": ".claude-plugin/plugin.json",
|
||||
"sha256": "df6a74ed451d4e6075fa5ade72ccedabd1c21c5716340cda1d7b96b7507b8d78"
|
||||
},
|
||||
{
|
||||
"path": "commands/style-html-structured.md",
|
||||
"sha256": "e2de12b1b75770e8dc99d3671a76a3c73bec80ba8806530bd29a9eba190cb72f"
|
||||
},
|
||||
{
|
||||
"path": "commands/style-bullet-points.md",
|
||||
"sha256": "ede263662310cd26c75a93b0d5bbb8f5e13ea3352ae85b64f71b036b14b78084"
|
||||
},
|
||||
{
|
||||
"path": "commands/style-ultra-concise.md",
|
||||
"sha256": "d07c9d3bf8ab6a5c2488d2ff86636d007c4c91ef4453001c6a562ff316b8c414"
|
||||
},
|
||||
{
|
||||
"path": "commands/style-table-based.md",
|
||||
"sha256": "467dee90daee71f414146446e67d6ca944cb2f7ed2e5a512800145ae85ad141a"
|
||||
},
|
||||
{
|
||||
"path": "commands/style-yaml-structured.md",
|
||||
"sha256": "7c9479402d3aa1f9bbe824174c77ad3edd8c3de361906b577ace20e1d2751df2"
|
||||
},
|
||||
{
|
||||
"path": "commands/style-markdown-focused.md",
|
||||
"sha256": "864ab2d96bb5e3d044462b9e228a50e007f76f54cb7aba7e21563ad06b0daf3d"
|
||||
},
|
||||
{
|
||||
"path": "commands/style-genui.md",
|
||||
"sha256": "2dfe539e06a7dcbad75fa8b9de32be34be359f61e5d24b0689a00e54cf3d20f6"
|
||||
}
|
||||
],
|
||||
"dirSha256": "58710958049a8ddbc47085575b70a8602ec9ffa56f6b2c8955dd6b8c60215905"
|
||||
},
|
||||
"security": {
|
||||
"scannedAt": null,
|
||||
"scannerVersion": null,
|
||||
"flags": []
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user