v0.0.08

- Moved the CSS from the JS file to it's own file. - Added CHANGELOG.md - Added package.json for ComfyUI Manager compliance - Added pyproject.toml for registry compliance - Reworked the README - Added the "helpers" folder to the .gitignore - Added an icon to the pyproject.toml
Stop tracking PSD files
2025-11-05 14:21:04 +01:00 · 2025-10-12 21:39:32 +02:00 · 2025-10-12 21:37:32 +02:00 · 2025-10-12 00:13:34 +02:00 · 2025-10-12 00:11:32 +02:00 · 2025-10-11 23:40:48 +02:00
30 changed files with 622 additions and 595 deletions
@@ -1,2 +1,19 @@
-# Auto detect text files and perform LF normalization
+# Set default behavior to automatically normalize line endings
 * text=auto
+
+# Explicitly declare text files you want to always be normalized and converted
+*.md text
+*.py text
+*.js text
+*.css text
+*.html text
+
+# Declare files that will always have CRLF line endings on checkout
+*.bat text eol=crlf
+
+# Denote all files that are truly binary and should not be modified
+*.png binary
+*.jpg binary
+*.gif binary
+*.ico binary
+*.zip binary
@@ -84,4 +84,7 @@ yarn-debug.log*
 yarn-error.log*

 # AF specific
-Status.txt
+Status.txt
+*.psd
+*.docx
+helpers/
@@ -1,179 +1,171 @@
-# ****** ComfyUI-AF - Enhanced HTML-NOTE ******
-#
-# Creator: Alex Furer - Co-Creator(s): Claude AI & DeepSeek
-#
-# Praise, comment, bugs, improvements: https://github.com/alFrame/ComfyUI_AF_FindNodeByID
-#
-# LICENSE: MIT License
-#
-# v0.0.06
-#
-# Description:
-# A ComfyUI Note node with html capabilities. Create notes, UI's and ReadMe's directly inside the workflow, using html.
-#
-# Usage:
-# Read Me on Github
-#
-# Changelog:
-# "v0.0.06 - Removed all Java Script functionality for links and updated README",
-# "v0.0.05 - Made edit mode less intrusive and keep ComfyUI canvas navigation (panning, zooming [space bar] and [H] now work to pan around the canvas)",
-# "v0.0.04 - Fixed node selection and resizing by removing OUTPUT_NODE and using proper widget approach. Double clicking is now used to edit the html Mouse interaction is now persistent to ComfyUI behavior. Except middle mouse button for panning.",
-# "v0.0.03 - Fixed node resizing issues on save/reload. Improved selection and edit mode behavior to match ComfyUI core notes. Fixed middle mouse button panning over the node. Improved HTML indentation in default content",
-# "v0.0.02 - Fixed naming consistency to HTML_Note Implemented single-window toggle behavior",
-# "v0.0.01 - Initial Version"
-#
-
-class AF_Enhanced_HTML_Note:
-    """
-    AF Enhanced HTML-Note node with colored sections and rich formatting
-    """
-    
-    @classmethod
-    def INPUT_TYPES(cls):
-        return {
-            "required": {
-                "html_content": ("STRING", {
-                    "multiline": True,
-                    "default": """<h2>Positive Prompt Section</h2>
-<div class="af-section af-positive">
-	<h2>🟢 Positive Prompts</h2>
-	<p><strong>masterpiece, best quality, highly detailed</strong></p>
-	<ul>
-		<li>Professional lighting</li>
-		<li>Sharp focus</li>
-		<li>8K resolution</li>
-	</ul>
-</div>
-
-
-<h2>Negative Prompt Section</h2>
-<div class="af-section af-negative">
-	<h2>🔴 Negative Prompts</h2>
-	<p><em>low quality, blurry, distorted</em></p>
-	<p><code>nsfw, watermark, signature, bad anatomy</code></p>
-</div>
-
-
-<h2>Neutral Prompt Section</h2>
-<div class="af-section af-neutral">
-	<h3>📝 Notes</h3>
-	<p>General notes and information...</p>
-	<ul>
-		<li>Item 1</li>
-		<li>Item 2</li>
-		<li>Item 3</li>
-	</ul>
-</div>
-
-<h2>Info Section</h2>
-<div class="af-section af-info">
-	<h3>ℹ️ Information</h3>
-	<p>Using: <strong>SDXL 1.0</strong></p>
-	<p>Steps: <code>25</code> | CFG: <code>7.5</code> | Sampler: <code>DPM++ 2M Karras</code></p>
-</div>
-
-<h2>Warning Section</h2>
-<div class="af-section af-warning">
-	<h3>⚠️ Warning</h3>
-	<p>This workflow requires:</p>
-	<ol>
-		<li>High VRAM (8GB+)</li>
-		<li>Latest ComfyUI version</li>
-		<li>SDXL compatible models</li>
-	</ol>
-</div>
-
-<h2>Column Layouts</h2>
-<div class="row">
-	<div class="af-column-half-left">
-		<div class="af-section af-positive">
-			<h3>🎨 Style Settings</h3>
-			<ul>
-				<li>Style: Photorealistic</li>
-				<li>Aspect: 16:9</li>
-				<li>Quality: Ultra High</li>
-			</ul>
-		</div>
-		
-		<div class="af-spacer"></div>
-		
-		<div class="af-section af-info">
-			<h3>⚙️ Technical</h3>
-			<p>Resolution: <code>1920x1080</code></p>
-			<p>Batch: <code>4</code></p>
-		</div>
-	</div>
-	
-	<div class="af-column-half-right">
-		<div class="af-section af-negative">
-			<h3>🚫 Exclusions</h3>
-			<ul>
-				<li>No text in image</li>
-				<li>Avoid oversaturation</li>
-				<li>No watermarks</li>
-			</ul>
-		</div>
-		
-		<div class="af-spacer"></div>
-		
-		<div class="af-section af-warning">
-			<h3>💡 Tips</h3>
-			<p>Use lower CFG for more creative results</p>
-		</div>
-	</div>
-</div>
-
-<h2>Clickable Links & Actions</h2>
-<div class="af-section af-info">
-	<h3>🔗 Interactive Links</h3>
-	
-	<!-- External links (opens in new tab with Ctrl+click) -->
-	<h4>External link (opens in new tab with Ctrl+click)</h4>
-	<p><a href="https://www.fullframestudios.ch/">Full Frame Studios - Alex Furer</a></p>
-	
-	<h4>Anchor Links</h4>
-	<p><a href="https://www.fullframestudios.ch/#ThreeDee">Full Frame Studios - Alex Furer - 3D</a></p>
-</div>
-
-<h2>Custom Info Cards</h2>
-<div style="display: flex; gap: 10px; flex-wrap: wrap;">
-	<div style="flex: 1; min-width: 150px; background: rgba(144, 238, 144, 0.1); border: 1px solid #90EE90; padding: 12px; border-radius: 6px; text-align: center;">
-		<strong style="color: #90EE90; display: block; margin-bottom: 4px;">Steps</strong>
-		<p style="margin: 0; font-size: 24px; color: #fff; font-weight: bold;">25</p>
-	</div>
-	
-	<div style="flex: 1; min-width: 150px; background: rgba(135, 206, 235, 0.1); border: 1px solid #87CEEB; padding: 12px; border-radius: 6px; text-align: center;">
-		<strong style="color: #87CEEB; display: block; margin-bottom: 4px;">CFG Scale</strong>
-		<p style="margin: 0; font-size: 24px; color: #fff; font-weight: bold;">7.5</p>
-	</div>
-	
-	<div style="flex: 1; min-width: 150px; background: rgba(186, 85, 211, 0.1); border: 1px solid #BA55D3; padding: 12px; border-radius: 6px; text-align: center;">
-		<strong style="color: #BA55D3; display: block; margin-bottom: 4px;">Batch Size</strong>
-		<p style="margin: 0; font-size: 24px; color: #fff; font-weight: bold;">4</p>
-	</div>
-</div>""",
-                    "placeholder": "Enter your HTML content here..."
-                }),
-            }
-        }
-
-    RETURN_TYPES = ()
-    FUNCTION = "display_html"
-    CATEGORY = "AF - Nodes"
-    OUTPUT_NODE = False
-
-    def display_html(self, html_content):
-        """
-        Display enhanced HTML content
-        """
-        return {"ui": {"text": html_content}, "result": (html_content,)}
-
-# Node mappings for ComfyUI
-NODE_CLASS_MAPPINGS = {
-    "AF_Enhanced_HTML_Note": AF_Enhanced_HTML_Note,
-}
-
-NODE_DISPLAY_NAME_MAPPINGS = {
-    "AF_Enhanced_HTML_Note": "AF - Enhanced HTML Note",
-}
-
+# ****** ComfyUI-AF - Enhanced HTML-NOTE ******
+#
+# Creator: Alex Furer - Co-Creator(s): Claude AI & DeepSeek
+#
+# Description: A ComfyUI Note node with html capabilities. Create notes, UI's and ReadMe's directly inside the workflow, using html.
+#
+# Repo and ReadMe URL: https://github.com/alFrame/ComfyUI-AF-Enhanced_HTML_Note
+#
+# Issues praise, comment, bugs, improvements: https://github.com/alFrame/ComfyUI-AF-Enhanced_HTML_Note/issues
+#
+# LICENSE: MIT License
+#
+# Usage: https://github.com/alFrame/ComfyUI-AF-Enhanced_HTML_Note
+#
+# Feature Requests / Wet Dreams
+# -
+
+class AF_Enhanced_HTML_Note:
+    """
+    AF Enhanced HTML-Note node with colored sections and rich formatting
+    """
+    
+    @classmethod
+    def INPUT_TYPES(cls):
+        return {
+            "required": {
+                "html_content": ("STRING", {
+                    "multiline": True,
+                    "default": """<h2>Positive Prompt Section</h2>
+<div class="af-section af-positive">
+	<h2>🟢 Positive Prompts</h2>
+	<p><strong>masterpiece, best quality, highly detailed</strong></p>
+	<ul>
+		<li>Professional lighting</li>
+		<li>Sharp focus</li>
+		<li>8K resolution</li>
+	</ul>
+</div>
+
+
+<h2>Negative Prompt Section</h2>
+<div class="af-section af-negative">
+	<h2>🔴 Negative Prompts</h2>
+	<p><em>low quality, blurry, distorted</em></p>
+	<p><code>nsfw, watermark, signature, bad anatomy</code></p>
+</div>
+
+
+<h2>Neutral Prompt Section</h2>
+<div class="af-section af-neutral">
+	<h3>📝 Notes</h3>
+	<p>General notes and information...</p>
+	<ul>
+		<li>Item 1</li>
+		<li>Item 2</li>
+		<li>Item 3</li>
+	</ul>
+</div>
+
+<h2>Info Section</h2>
+<div class="af-section af-info">
+	<h3>ℹ️ Information</h3>
+	<p>Using: <strong>SDXL 1.0</strong></p>
+	<p>Steps: <code>25</code> | CFG: <code>7.5</code> | Sampler: <code>DPM++ 2M Karras</code></p>
+</div>
+
+<h2>Warning Section</h2>
+<div class="af-section af-warning">
+	<h3>⚠️ Warning</h3>
+	<p>This workflow requires:</p>
+	<ol>
+		<li>High VRAM (8GB+)</li>
+		<li>Latest ComfyUI version</li>
+		<li>SDXL compatible models</li>
+	</ol>
+</div>
+
+<h2>Column Layouts</h2>
+<div class="row">
+	<div class="af-column-half-left">
+		<div class="af-section af-positive">
+			<h3>🎨 Style Settings</h3>
+			<ul>
+				<li>Style: Photorealistic</li>
+				<li>Aspect: 16:9</li>
+				<li>Quality: Ultra High</li>
+			</ul>
+		</div>
+		
+		<div class="af-spacer"></div>
+		
+		<div class="af-section af-info">
+			<h3>⚙️ Technical</h3>
+			<p>Resolution: <code>1920x1080</code></p>
+			<p>Batch: <code>4</code></p>
+		</div>
+	</div>
+	
+	<div class="af-column-half-right">
+		<div class="af-section af-negative">
+			<h3>🚫 Exclusions</h3>
+			<ul>
+				<li>No text in image</li>
+				<li>Avoid oversaturation</li>
+				<li>No watermarks</li>
+			</ul>
+		</div>
+		
+		<div class="af-spacer"></div>
+		
+		<div class="af-section af-warning">
+			<h3>💡 Tips</h3>
+			<p>Use lower CFG for more creative results</p>
+		</div>
+	</div>
+</div>
+
+<h2>Clickable Links & Actions</h2>
+<div class="af-section af-info">
+	<h3>🔗 Interactive Links</h3>
+	
+	<!-- External links (opens in new tab with Ctrl+click) -->
+	<h4>External link (opens in new tab with Ctrl+click)</h4>
+	<p><a href="https://www.fullframestudios.ch/">Full Frame Studios - Alex Furer</a></p>
+	
+	<h4>Anchor Links</h4>
+	<p><a href="https://www.fullframestudios.ch/#ThreeDee">Full Frame Studios - Alex Furer - 3D</a></p>
+</div>
+
+<h2>Custom Info Cards</h2>
+<div style="display: flex; gap: 10px; flex-wrap: wrap;">
+	<div style="flex: 1; min-width: 150px; background: rgba(144, 238, 144, 0.1); border: 1px solid #90EE90; padding: 12px; border-radius: 6px; text-align: center;">
+		<strong style="color: #90EE90; display: block; margin-bottom: 4px;">Steps</strong>
+		<p style="margin: 0; font-size: 24px; color: #fff; font-weight: bold;">25</p>
+	</div>
+	
+	<div style="flex: 1; min-width: 150px; background: rgba(135, 206, 235, 0.1); border: 1px solid #87CEEB; padding: 12px; border-radius: 6px; text-align: center;">
+		<strong style="color: #87CEEB; display: block; margin-bottom: 4px;">CFG Scale</strong>
+		<p style="margin: 0; font-size: 24px; color: #fff; font-weight: bold;">7.5</p>
+	</div>
+	
+	<div style="flex: 1; min-width: 150px; background: rgba(186, 85, 211, 0.1); border: 1px solid #BA55D3; padding: 12px; border-radius: 6px; text-align: center;">
+		<strong style="color: #BA55D3; display: block; margin-bottom: 4px;">Batch Size</strong>
+		<p style="margin: 0; font-size: 24px; color: #fff; font-weight: bold;">4</p>
+	</div>
+</div>""",
+                    "placeholder": "Enter your HTML content here..."
+                }),
+            }
+        }
+
+    RETURN_TYPES = ()
+    FUNCTION = "display_html"
+    CATEGORY = "AF - Nodes"
+    OUTPUT_NODE = False
+
+    def display_html(self, html_content):
+        """
+        Display enhanced HTML content
+        """
+        return {"ui": {"text": html_content}, "result": (html_content,)}
+
+# Node mappings for ComfyUI
+NODE_CLASS_MAPPINGS = {
+    "AF_Enhanced_HTML_Note": AF_Enhanced_HTML_Note,
+}
+
+NODE_DISPLAY_NAME_MAPPINGS = {
+    "AF_Enhanced_HTML_Note": "AF - Enhanced HTML Note",
+}
+
@@ -0,0 +1,31 @@
+## Changelog
+
+### v0.0.08
+- Moved the CSS from the JS file to it's own file.
+- Added CHANGELOG.md
+- Added package.json for ComfyUI Manager compliance
+- Added pyproject.toml for registry compliance
+- Reworked the README
+- Added the "helpers" folder to the .gitignore
+- Added an icon to the pyproject.toml
+
+### v0.0.07
+- Comsetics, making tis a version
+
+### v0.0.06
+- Removed all Java Script functionality for links and updated README
+
+### v0.0.05
+- Made edit mode less intrusive and keep ComfyUI canvas navigation (panning, zooming [space bar] and [H] now work to pan around the canvas)
+
+### v0.0.04
+- Fixed node selection and resizing by removing OUTPUT_NODE and using proper widget approach. Double clicking is now used to edit the html Mouse interaction is now persistent to ComfyUI behavior. Except middle mouse button for panning.
+
+### v0.0.03
+- Fixed node resizing issues on save/reload. Improved selection and edit mode behavior to match ComfyUI core notes. Fixed middle mouse button panning over the node. Improved HTML indentation in default content
+
+### v0.0.02
+- Fixed naming consistency to HTML_Note Implemented single-window toggle behavior
+
+### v0.0.01
+- Initial Version
@@ -2,10 +2,6 @@

 A ComfyUI Note node with HTML capabilities. Create notes, UI's and ReadMe's directly inside the workflow using rich HTML formatting.

-![Version](https://img.shields.io/badge/version-0.0.5-blue)
-![License](https://img.shields.io/badge/license-MIT-green)
-![ComfyUI](https://img.shields.io/badge/ComfyUI-Compatible-orange)
-
 ---

 ## ✨ Key Features
@@ -20,6 +16,35 @@ A ComfyUI Note node with HTML capabilities. Create notes, UI's and ReadMe's dire

 ---

+## 🛠️ Installation
+
+### Via ComfyUI Manager (Recommended)
+1. Open ComfyUI Manager
+2. Search for "AF - Enhanced HTML Note"
+3. Install
+
+### Manual Installation
+1. Clone this repository into your `ComfyUI/custom_nodes/` directory:
+   ```bash
+   git clone https://github.com/alFrame/ComfyUI-AF-Enhanced_HTML_Note.git
+	```
+	
+---
+
+## ⚠️ Disclaimer
+
+This ComfyUI custom node is developed through AI-assisted coding, prompted and directed by a human developer. While considerable care has been taken to ensure proper functionality, security, and compatibility, this software is provided **"as is" without warranty of any kind**, express or implied.
+
+**By using this custom node, you acknowledge that:**
+- You install and run this software at your own risk
+- The creator is not liable for any damages, data loss, or issues arising from its use
+- Compatibility with your specific setup is not guaranteed
+- You should test thoroughly in a safe environment before production use
+
+This node has been carefully designed and tested, but individual system configurations may vary. Please report any issues on the GitHub repository.
+
+---
+
 ## 🎮 Interaction Guide

 ### Editing Content
@@ -60,7 +85,7 @@ The node comes with several predefined colored section styles. Click each sectio
 ```

 ### Rendered Result:
-![Positive Section Example](examples/positive-section.png)
+![Positive Section Example](Docs/examples/positive-section.webp)

 </details>

@@ -77,7 +102,7 @@ The node comes with several predefined colored section styles. Click each sectio
 ```

 ### Rendered Result:
-![Negative Section Example](examples/negative-section.png)
+![Negative Section Example](Docs/examples/negative-section.webp)

 </details>

@@ -98,7 +123,7 @@ The node comes with several predefined colored section styles. Click each sectio
 ```

 ### Rendered Result:
-![Neutral Section Example](examples/neutral-section.png)
+![Neutral Section Example](Docs/examples/neutral-section.webp)

 </details>

@@ -115,7 +140,7 @@ The node comes with several predefined colored section styles. Click each sectio
 ```

 ### Rendered Result:
-![Info Section Example](examples/info-section.png)
+![Info Section Example](Docs/examples/info-section.webp)

 </details>

@@ -136,7 +161,7 @@ The node comes with several predefined colored section styles. Click each sectio
 ```

 ### Rendered Result:
-![Warning Section Example](examples/warning-section.png)
+![Warning Section Example](Docs/examples/warning-section.webp)

 </details>

@@ -152,7 +177,7 @@ The node comes with several predefined colored section styles. Click each sectio
 ```

 ### Rendered Result:
-![Yellow Section Example](examples/yellow-section.png)
+![Yellow Section Example](Docs/examples/yellow-section.webp)

 </details>

@@ -168,7 +193,7 @@ The node comes with several predefined colored section styles. Click each sectio
 ```

 ### Rendered Result:
-![Blue Section Example](examples/blue-section.png)
+![Blue Section Example](Docs/examples/blue-section.webp)

 </details>

@@ -184,7 +209,7 @@ The node comes with several predefined colored section styles. Click each sectio
 ```

 ### Rendered Result:
-![Custom Section Example](examples/custom-section.png)
+![Custom Section Example](Docs/examples/custom-section.webp)

 </details>

@@ -233,7 +258,7 @@ Use these spacer classes to control vertical spacing between elements.
 ```

 ### Rendered Result:
-![Spacer Examples](examples/spacers.png)
+![Spacer Examples](Docs/examples/spacers.webp)

 ### Size Reference:
 - `af-spacer-top` → 2px
@@ -297,7 +322,7 @@ Create two-column layouts using the predefined column classes.
 ```

 ### Rendered Result:
-![Two Column Layout Example](examples/two-column-layout.png)
+![Two Column Layout Example](Docs/examples/two-column-layout.webp)

 **Note:** The `row` class ensures proper column wrapping, and each column is 49% width with 1% margin.

@@ -331,11 +356,13 @@ All links require **Ctrl+Click** to activate for safety and to prevent accidenta
 </div>
 ```

-### Rendered Result:
-![Link Examples](examples/links.png)
-
 **Remember:** Hold **Ctrl** while clicking any link to activate it!

+### Rendered Result:
+![Link Examples](Docs/examples/links.webp)
+
+</details>
+
 ### Supported Link Types:
 - ✅ **External URLs** (`https://`, `http://`) - Open in new tab
 - ✅ **Anchor links** (`#section`) - Page navigation  
@@ -347,7 +374,14 @@ All links require **Ctrl+Click** to activate for safety and to prevent accidenta
 - ❌ **JavaScript links** (`javascript:`) - Blocked for security
 - ❌ **onclick handlers** - Ignored for security

-</details>
+### Security Restrictions:
+- **No JavaScript execution** - All JavaScript is blocked for security
+- **No `<script>` tags** - Script tags are not executed
+- **No external scripts** - Cannot load external JavaScript files
+- **Ctrl+Click required** - All link interactions require Control key
+- **Safe HTML only** - Only styling and navigation features are supported
+- **No DOM manipulation** - JavaScript cannot modify the HTML content
+- **No browser storage** - `localStorage` and `sessionStorage` are blocked

 ---

@@ -367,52 +401,6 @@ The node supports **standard HTML** with **inline CSS styling**. You can write c

 ---

-## ⚠️ JavaScript Limitations
-
-JavaScript functionality is limited for security. It **only works on `<a>` (link) elements** and **only when Ctrl+Click is used**.
-
-### ✅ What Works (with Ctrl+Click on links):
-```html
-<!-- ✅ Alert dialogs -->
-<a href="#" onclick="alert('Hello!')">Alert on click</a>
-
-<!-- ✅ Console logging -->
-<a href="#" onclick="console.log('Debug info')">Log to console</a>
-
-<!-- ✅ Confirmation dialogs -->
-<a href="javascript:confirm('Are you sure?')">Confirmation dialog</a>
-
-<!-- ✅ Multiple statements -->
-<a href="#" onclick="alert('First'); console.log('Second')">Multiple actions</a>
-```
-
-### ❌ What Doesn't Work:
-```html
-<!-- ❌ JavaScript links are blocked -->
-<a href="javascript:alert('Hello')">JavaScript link</a>
-
-<!-- ❌ onclick handlers are ignored -->
-<a href="#" onclick="alert('This wont work')">Alert link</a>
-
-<!-- ❌ Script tags are ignored -->
-<script>console.log('Not executed')</script>
-
-<!-- ❌ Event handlers on other elements -->
-<button onclick="alert('No')">Won't work</button>
-<div onclick="alert('No')">Won't work</div>
-```
-
-### Security Restrictions:
- **No JavaScript execution** - All JavaScript is blocked for security
- **No `<script>` tags** - Script tags are not executed
- **No external scripts** - Cannot load external JavaScript files
- **Ctrl+Click required** - All link interactions require Control key
- **Safe HTML only** - Only styling and navigation features are supported
- **No DOM manipulation** - JavaScript cannot modify the HTML content
- **No browser storage** - `localStorage` and `sessionStorage` are blocked
-
---
-
 ## 🎨 Custom Styling Examples

 <details>
@@ -439,7 +427,7 @@ JavaScript functionality is limited for security. It **only works on `<a>` (link
 ```

 ### Rendered Result:
-![Custom Spacers](examples/custom-spacers.png)
+![Custom Spacers](Docs/examples/custom-spacers.webp)

 </details>

@@ -468,7 +456,7 @@ JavaScript functionality is limited for security. It **only works on `<a>` (link
 ```

 ### Rendered Result:
-![Custom Colors](examples/custom-colors.png)
+![Custom Colors](Docs/examples/custom-colors.webp)

 </details>

@@ -501,7 +489,7 @@ JavaScript functionality is limited for security. It **only works on `<a>` (link
 ```

 ### Rendered Result:
-![Custom Text Styles](examples/custom-text.png)
+![Custom Text Styles](Docs/examples/custom-text.webp)

 </details>

@@ -530,7 +518,7 @@ JavaScript functionality is limited for security. It **only works on `<a>` (link
 ```

 ### Rendered Result:
-![Custom Borders](examples/custom-borders.png)
+![Custom Borders](Docs/examples/custom-borders.webp)

 </details>

@@ -559,7 +547,7 @@ JavaScript functionality is limited for security. It **only works on `<a>` (link
 ```

 ### Rendered Result:
-![Custom Layouts](examples/custom-layouts.png)
+![Custom Layouts](Docs/examples/custom-layouts.webp)

 </details>

@@ -587,7 +575,7 @@ JavaScript functionality is limited for security. It **only works on `<a>` (link
 ```

 ### Rendered Result:
-![Custom Info Cards](examples/custom-cards.png)
+![Custom Info Cards](Docs/examples/custom-cards.webp)

 </details>

@@ -660,24 +648,12 @@ JavaScript functionality is limited for security. It **only works on `<a>` (link
 ```

 ### Rendered Result:
-![Complete Workflow Example](examples/complete-workflow.png)
+![Complete Workflow Example](Docs/examples/complete-workflow.webp)

 </details>

 ---

-## 🛠️ Installation
-
-1. Create folder: `ComfyUI/custom_nodes/ComfyUI-AF_Enhanced_HTML_Note/`
-2. Add the Python file: `AF_Enhanced_HTML_Note.py`
-3. Add the init file: `__init__.py`
-4. Create `web/` subfolder
-5. Add the JavaScript file: `web/AF_Enhanced_HTML_Note.js`
-6. Restart ComfyUI
-7. Find the node under **AF - Nodes > AF - Enhanced HTML Note**
-
---
-
 ## 🐛 Troubleshooting

 <details>
@@ -754,45 +730,26 @@ JavaScript functionality is limited for security. It **only works on `<a>` (link

 ---

-## 📞 Support & Credits
+## ⚠️ Disclaimer

- **Creator:** Alex Furer
- **Co-Creators:** Claude AI & DeepSeek
- **GitHub:** [ComfyUI_AF_FindNodeByID](https://github.com/alFrame/ComfyUI_AF_FindNodeByID)
- **License:** MIT License
- **Version:** 0.0.5
+This ComfyUI custom node is developed through AI-assisted coding. While carefully tested, it is provided **"as is" without warranty**. 
+
+**By using this node pack:**
+- You install and run at your own risk
+- The creator is not liable for damages or data loss
+- Compatibility with your setup is not guaranteed
+- Test in a safe environment before production use
+
+Report issues on GitHub - we appreciate your feedback!

 ---

-## 📸 Creating Example Screenshots
+## 📚 Additional Resources

-To create the example images referenced in this README:
+- **[Changelog](CHANGELOG.md)** - Version history and updates
+- [GitHub Issues](https://github.com/alFrame/ComfyUI-AF-Enhanced_HTML_Note) - Report bugs & request features
+- [License](LICENSE) - MIT License details

-1. Open ComfyUI and add the AF Enhanced HTML Note node
-2. Copy each example code from the collapsible sections above
-3. Paste into the node and exit edit mode
-4. Take a screenshot of the rendered result
-5. Save as PNG in the `examples/` folder with the corresponding filename
-6. Commit and push to your repository
+---

-**Required Screenshots:**
- `positive-section.png`
- `negative-section.png`
- `neutral-section.png`
- `info-section.png`
- `warning-section.png`
- `yellow-section.png`
- `blue-section.png`
- `custom-section.png`
- `spacers.png`
- `two-column-layout.png`
- `links.png`
- `custom-spacers.png`
- `custom-colors.png`
- `custom-text.png`
- `custom-borders.png`
- `custom-layouts.png`
- `custom-cards.png`
- `complete-workflow.png`
-
-Once you add the screenshots, the README will automatically display them!
+**Made with ❤️ by Alex Furer & Qwen3, Claude AI, DeepSeek**
@@ -19,6 +19,7 @@ __title__ = "AF - Enhanced HTML Note"
 __description__ = " ComfyUI custom node that allows you to create a note node with HTML support."
 __license__ = "MIT"
 __changelog__ = [
+    "v0.0.07 - Comsetics, making tis a version",
    "v0.0.06 - Removed all Java Script functionality for links and updated README",
    "v0.0.05 - Made edit mode less intrusive and keep ComfyUI canvas navigation (panning, zooming [space bar] and [H] now work to pan around the canvas)",
    "v0.0.04 - Fixed node selection and resizing by removing OUTPUT_NODE and using proper widget approach. Double clicking is now used to edit the html Mouse interaction is now persistent to ComfyUI behavior. Except middle mouse button for panning.",
@@ -184,24 +184,16 @@

 <h2>Clickable Links & Actions</h2>
 <div style="border: 1px solid #808080; padding: 8px; border-radius: 6px; margin: 8px 0;">
-    <div class="af-section af-info">
-        <h3>🔗 Interactive Links</h3>
-        
-        <!-- External link (opens in new tab with Ctrl+click) -->
-        <p><a href="https://github.com/comfyanonymous/ComfyUI">ComfyUI GitHub Repository</a></p>
-        
-        <!-- Alert action (triggers with Ctrl+click) -->
-        <p><a href="#" onclick="alert('Custom action triggered!')">Click for alert</a></p>
-        
-        <!-- Console log action -->
-        <p><a href="#" onclick="console.log('Debug message logged')">Log to console</a></p>
-        
-        <!-- Multiple actions -->
-        <p><a href="https://example.com" onclick="console.log('Link clicked')">Link with logging</a></p>
-        
-        <!-- JavaScript links -->
-        <p><a href="javascript:alert('Hello from JavaScript!')">JavaScript alert link</a></p>
-    </div>
+	<div class="af-section af-info">
+		<h3>🔗 Interactive Links</h3>
+		
+		<!-- External links (opens in new tab with Ctrl+click) -->
+		<h4>External link (opens in new tab with Ctrl+click)</h4>
+		<p><a href="https://www.fullframestudios.ch/">Full Frame Studios - Alex Furer</a></p>
+		
+		<h4>Anchor Links</h4>
+		<p><a href="https://www.fullframestudios.ch/#ThreeDee">Full Frame Studios - Alex Furer - 3D</a></p>
+	</div>
 </div>

 <h2>Custom Styling Examples</h2>
@@ -0,0 +1,12 @@
+{
+  "name": "af-enhanced-html-note",
+  "version": "0.0.08", 
+  "description": "A ComfyUI Note node with HTML capabilities. Create notes, UI's and ReadMe's directly inside the workflow using rich HTML formatting.",
+  "author": "Alex Furer",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/alFrame/ComfyUI-AF-Enhanced_HTML_Note"
+  },
+  "nodepath": "custom_nodes/ComfyUI-AF-Enhanced_HTML_Note"
+}
@@ -0,0 +1,14 @@
+[project]
+name = "af-enhanced-html-note"
+description = "A ComfyUI Note node with HTML capabilities. Create notes, UI's and ReadMe's directly inside the workflow using rich HTML formatting."
+version = "0.0.08"
+license = {file = "LICENSE"}
+dependencies = []
+
+[project.urls]
+Repository = "https://github.com/alFrame/ComfyUI-AF-Enhanced_HTML_Note"
+
+[tool.comfy]
+PublisherId = "alframe"
+DisplayName = "ComfyUI AF - Enhanced HTML Note"
+Icon = "https://raw.githubusercontent.com/alFrame/ComfyUI-AF-Enhanced_HTML_Note/main/Docs/icon.png"
@@ -0,0 +1,276 @@
+.af-html-note-container {
+	width: 100%;
+	height: 100%;
+	min-height: 100px;
+	background: var(--comfy-menu-bg, #2a2a2a);
+	/* border: 1px solid var(--border-color, #555); */
+	padding: 8px;
+	box-sizing: border-box;
+	overflow: hidden;
+	cursor: default;
+	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;
+	line-height: 1.6;
+	color: var(--input-text, #ffffff);
+	display: flex;
+	flex-direction: column;
+	position: relative;
+}
+
+.af-html-note-content {
+	width: 100%;
+	height: 100%;
+	overflow-y: auto;
+	flex: 1;
+	/* Prevent text selection */
+	user-select: none;
+	-webkit-user-select: none;
+	-moz-user-select: none;
+	-ms-user-select: none;
+	cursor: default;
+	/* Prevent keyboard focus */
+	outline: none;
+}
+
+/* Ensure content area can't be focused */
+.af-html-note-content:focus {
+	outline: none;
+}
+
+.af-html-note-editor {
+	width: 100%;
+	height: 100%;
+	background: var(--comfy-menu-bg, #2a2a2a);
+	border: 1px solid var(--border-color, #555);
+	padding: 8px;
+	font-family: 'Monaco', 'Consolas', 'Courier New', monospace;
+	line-height: 1.4;
+	color: var(--input-text, #ffffff);
+	box-sizing: border-box;
+	resize: none;
+	outline: none;
+	font-size: 14px;
+	display: none;
+	flex: 1;
+	/* Add text selection capabilities */
+	user-select: auto;
+	-webkit-user-select: auto;
+	-moz-user-select: auto;
+	-ms-user-select: auto;
+	cursor: text;
+}
+
+/* Floating edit button */
+.af-floating-edit-btn {
+	position: absolute;
+	top: 4px;
+	right: 4px;
+	background: rgba(0, 0, 0, 0.8);
+	border: 1px solid var(--border-color, #555);
+	color: var(--input-text, #ffffff);
+	border-radius: 3px;
+	width: 22px;
+	height: 22px;
+	cursor: pointer;
+	z-index: 1000;
+	font-size: 11px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	opacity: 0.7;
+	transition: opacity 0.2s ease;
+}
+
+.af-floating-edit-btn:hover {
+	opacity: 1;
+	background: rgba(0, 0, 0, 0.9);
+	border-color: #777;
+}
+
+/* Enable link interactions only when Ctrl is held */
+.af-html-note-content a {
+	color: #58a6ff;
+	text-decoration: none;
+	/* Links are never directly clickable - only via Ctrl */
+	pointer-events: none;
+	cursor: default;
+}
+
+body.af-ctrl-active .af-html-note-content a {
+	/* Only become clickable when Ctrl is held globally */
+	pointer-events: auto;
+	cursor: pointer;
+}
+
+body.af-ctrl-active .af-html-note-content a:hover {
+	color: #79c0ff;
+	text-decoration: underline;
+}
+
+.af-html-note-container.edit-mode .af-html-note-content {
+	display: none;
+}
+
+.af-html-note-container.edit-mode .af-html-note-editor {
+	display: block;
+}
+
+/* Hide edit button in edit mode */
+.af-html-note-container.edit-mode .af-floating-edit-btn {
+	display: none;
+}
+
+/* Rest of your CSS remains the same... */
+.af-html-note-content h1, .af-html-note-content h2, .af-html-note-content h3,
+.af-html-note-content h4, .af-html-note-content h5, .af-html-note-content h6 {
+	margin-top: 0;
+	margin-bottom: 12px;
+	font-weight: 600;
+}
+
+.af-html-note-content h1 { font-size: 1.5em; }
+.af-html-note-content h2 { font-size: 1.3em; }
+.af-html-note-content h3 { font-size: 1.1em; }
+
+.af-html-note-content .af-section {
+	padding: 8px 16px;
+	margin: 8px 0;
+	border-radius: 6px;
+	border-left: 4px solid;
+}
+
+.af-html-note-content .af-section.af-positive {
+	background: rgba(144, 238, 144, 0.1);
+	border-left-color: #90EE90;
+}
+
+.af-html-note-content .af-section.af-negative {
+	background: rgba(255, 107, 107, 0.1);
+	border-left-color: #FF6B6B;
+}
+
+.af-html-note-content .af-section.af-neutral {
+	background: rgba(224, 224, 224, 0.1);
+	border-left-color: #E0E0E0;
+}
+
+.af-html-note-content .af-section.af-info {
+	background: rgba(135, 206, 235, 0.1);
+	border-left-color: #87CEEB;
+}
+
+.af-html-note-content .af-section.af-warning {
+	background: rgba(255, 128, 0, 0.1);
+	border-left-color: #FFD700;
+}
+
+.af-html-note-content .af-section.af-yellow {
+	background: rgba(255, 128, 0, 0.1);
+	border-left-color: #FFD700;
+}
+
+.af-html-note-content .af-section.af-blue {
+	background: rgba(102, 105, 255, 0.1);
+	border-left-color: #000099;
+}
+
+.af-html-note-content .af-section.af-custom {
+	background: rgba(186, 85, 211, 0.1);
+	border-left-color: #BA55D3;
+}
+
+.af-html-note-content .af-spacer-top { height: 2px; margin: 4px 0; }
+.af-html-note-content .af-spacer-mini { height: 4px; margin: 4px 0; }
+.af-html-note-content .af-spacer-small { height: 8px; margin: 4px 0; }
+.af-html-note-content .af-spacer { height: 16px; margin: 8px 0; }
+.af-html-note-content .af-spacer-large { height: 32px; margin: 16px 0; }
+.af-html-note-content .af-spacer-xl { height: 48px; margin: 24px 0; }
+
+.af-html-note-content code {
+	background: rgba(0,0,0,0.3);
+	padding: 2px 6px;
+	border-radius: 4px;
+	font-family: 'Monaco', 'Consolas', 'Courier New', monospace;
+	font-size: 0.9em;
+	color: #f0f6fc;
+}
+
+.af-html-note-content pre {
+	background: rgba(0,0,0,0.4);
+	border: 1px solid #444;
+	border-radius: 6px;
+	padding: 12px;
+	margin: 16px 0;
+	overflow-x: auto;
+}
+
+.af-html-note-content pre code {
+	background: transparent;
+	padding: 0;
+}
+
+.af-html-note-content ul, .af-html-note-content ol {
+	padding-left: 20px;
+	margin: 12px 0;
+}
+
+.af-html-note-content li { margin: 4px 0; }
+.af-html-note-content p { margin: 8px 0; }
+
+.af-html-note-content table {
+	border-collapse: collapse;
+	width: 100%;
+	margin: 16px 0;
+}
+
+.af-html-note-content th, .af-html-note-content td {
+	border: 1px solid var(--border-color, #555);
+	padding: 8px 12px;
+	text-align: left;
+}
+
+.af-html-note-content th {
+	background: rgba(255,255,255,0.1);
+	font-weight: 600;
+}
+
+.af-html-note-content hr {
+	border: none;
+	border-top: 1px solid var(--border-color, #555);
+	margin: 16px 0;
+	opacity: 0.6;
+}
+
+.af-html-note-container::-webkit-scrollbar { width: 8px; }
+.af-html-note-container::-webkit-scrollbar-track { background: rgba(0,0,0,0.1); }
+.af-html-note-container::-webkit-scrollbar-thumb {
+	background: var(--border-color, #555);
+	border-radius: 4px;
+}
+.af-html-note-container::-webkit-scrollbar-thumb:hover { background: #777; }
+
+.af-html-note-editor::-webkit-scrollbar { width: 8px; }
+.af-html-note-editor::-webkit-scrollbar-track { background: rgba(0,0,0,0.1); }
+.af-html-note-editor::-webkit-scrollbar-thumb {
+	background: var(--border-color, #555);
+	border-radius: 4px;
+}
+.af-html-note-editor::-webkit-scrollbar-thumb:hover { background: #777; }
+
+/* ****** MY OWN STYLES ****** */
+.af-column-half-left {
+	box-sizing: border-box;
+	float: left;
+	width: 49%;
+	margin-right: 1% !important;
+}
+.af-column-half-right {
+	box-sizing: border-box;
+	float: left;
+	width: 49%;
+	margin-left: 1% !important;
+}
+.row:after {
+	content: "";
+	display: table;
+	clear: both;
+}
@@ -2,285 +2,17 @@

 import { app } from "../../scripts/app.js";

-// Define inline CSS styles
-const AF_HTML_NOTE_STYLES = `
-    .af-html-note-container {
-        width: 100%;
-        height: 100%;
-        min-height: 100px;
-        background: var(--comfy-menu-bg, #2a2a2a);
-        /* border: 1px solid var(--border-color, #555); */
-        padding: 8px;
-        box-sizing: border-box;
-        overflow: hidden;
-        cursor: default;
-        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;
-        line-height: 1.6;
-        color: var(--input-text, #ffffff);
-        display: flex;
-        flex-direction: column;
-        position: relative;
+// Inject styles from external CSS file
+function injectStyles() {
+    const styleId = 'af-html-note-styles';
+    if (!document.getElementById(styleId)) {
+        const link = document.createElement('link');
+        link.id = styleId;
+        link.rel = 'stylesheet';
+        link.href = './web/AF_Enhanced_HTML_Note.css';
+        document.head.appendChild(link);
    }
-
-    .af-html-note-content {
-        width: 100%;
-        height: 100%;
-        overflow-y: auto;
-        flex: 1;
-		/* Prevent text selection */
-		user-select: none;
-		-webkit-user-select: none;
-		-moz-user-select: none;
-		-ms-user-select: none;
-		cursor: default;
-		/* Prevent keyboard focus */
-		outline: none;
-    }
-
-	/* Ensure content area can't be focused */
-	.af-html-note-content:focus {
-		outline: none;
-	}
-
-	.af-html-note-editor {
-		width: 100%;
-		height: 100%;
-		background: var(--comfy-menu-bg, #2a2a2a);
-		border: 1px solid var(--border-color, #555);
-		padding: 8px;
-		font-family: 'Monaco', 'Consolas', 'Courier New', monospace;
-		line-height: 1.4;
-		color: var(--input-text, #ffffff);
-		box-sizing: border-box;
-		resize: none;
-		outline: none;
-		font-size: 14px;
-		display: none;
-		flex: 1;
-		/* Add text selection capabilities */
-		user-select: auto;
-		-webkit-user-select: auto;
-		-moz-user-select: auto;
-		-ms-user-select: auto;
-		cursor: text;
-	}
-
-    /* Floating edit button */
-    .af-floating-edit-btn {
-        position: absolute;
-        top: 4px;
-        right: 4px;
-        background: rgba(0, 0, 0, 0.8);
-        border: 1px solid var(--border-color, #555);
-        color: var(--input-text, #ffffff);
-        border-radius: 3px;
-        width: 22px;
-        height: 22px;
-        cursor: pointer;
-        z-index: 1000;
-        font-size: 11px;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        opacity: 0.7;
-        transition: opacity 0.2s ease;
-    }
-
-    .af-floating-edit-btn:hover {
-        opacity: 1;
-        background: rgba(0, 0, 0, 0.9);
-        border-color: #777;
-    }
-
-    /* Enable link interactions only when Ctrl is held */
-    .af-html-note-content a {
-        color: #58a6ff;
-        text-decoration: none;
-        /* Links are never directly clickable - only via Ctrl */
-        pointer-events: none;
-        cursor: default;
-    }
-
-    body.af-ctrl-active .af-html-note-content a {
-        /* Only become clickable when Ctrl is held globally */
-        pointer-events: auto;
-        cursor: pointer;
-    }
-
-    body.af-ctrl-active .af-html-note-content a:hover {
-        color: #79c0ff;
-        text-decoration: underline;
-    }
-
-    .af-html-note-container.edit-mode .af-html-note-content {
-        display: none;
-    }
-
-    .af-html-note-container.edit-mode .af-html-note-editor {
-        display: block;
-    }
-
-    /* Hide edit button in edit mode */
-    .af-html-note-container.edit-mode .af-floating-edit-btn {
-        display: none;
-    }
-
-    /* Rest of your CSS remains the same... */
-    .af-html-note-content h1, .af-html-note-content h2, .af-html-note-content h3, 
-    .af-html-note-content h4, .af-html-note-content h5, .af-html-note-content h6 {
-        margin-top: 0;
-        margin-bottom: 12px;
-        font-weight: 600;
-    }
-
-    .af-html-note-content h1 { font-size: 1.5em; }
-    .af-html-note-content h2 { font-size: 1.3em; }
-    .af-html-note-content h3 { font-size: 1.1em; }
-
-    .af-html-note-content .af-section {
-        padding: 8px 16px;
-        margin: 8px 0;
-        border-radius: 6px;
-        border-left: 4px solid;
-    }
-
-    .af-html-note-content .af-section.af-positive {
-        background: rgba(144, 238, 144, 0.1);
-        border-left-color: #90EE90;
-    }
-
-    .af-html-note-content .af-section.af-negative {
-        background: rgba(255, 107, 107, 0.1);
-        border-left-color: #FF6B6B;
-    }
-
-    .af-html-note-content .af-section.af-neutral {
-        background: rgba(224, 224, 224, 0.1);
-        border-left-color: #E0E0E0;
-    }
-
-    .af-html-note-content .af-section.af-info {
-        background: rgba(135, 206, 235, 0.1);
-        border-left-color: #87CEEB;
-    }
-
-    .af-html-note-content .af-section.af-warning {
-        background: rgba(255, 128, 0, 0.1);
-        border-left-color: #FFD700;
-    }
-
-    .af-html-note-content .af-section.af-yellow {
-        background: rgba(255, 128, 0, 0.1);
-        border-left-color: #FFD700;
-    }
-
-    .af-html-note-content .af-section.af-blue {
-        background: rgba(102, 105, 255, 0.1);
-        border-left-color: #000099;
-    }
-
-    .af-html-note-content .af-section.af-custom {
-        background: rgba(186, 85, 211, 0.1);
-        border-left-color: #BA55D3;
-    }
-
-    .af-html-note-content .af-spacer-top { height: 2px; margin: 4px 0; }
-    .af-html-note-content .af-spacer-mini { height: 4px; margin: 4px 0; }
-    .af-html-note-content .af-spacer-small { height: 8px; margin: 4px 0; }
-    .af-html-note-content .af-spacer { height: 16px; margin: 8px 0; }
-    .af-html-note-content .af-spacer-large { height: 32px; margin: 16px 0; }
-    .af-html-note-content .af-spacer-xl { height: 48px; margin: 24px 0; }
-
-    .af-html-note-content code {
-        background: rgba(0,0,0,0.3);
-        padding: 2px 6px;
-        border-radius: 4px;
-        font-family: 'Monaco', 'Consolas', 'Courier New', monospace;
-        font-size: 0.9em;
-        color: #f0f6fc;
-    }
-
-    .af-html-note-content pre {
-        background: rgba(0,0,0,0.4);
-        border: 1px solid #444;
-        border-radius: 6px;
-        padding: 12px;
-        margin: 16px 0;
-        overflow-x: auto;
-    }
-
-    .af-html-note-content pre code {
-        background: transparent;
-        padding: 0;
-    }
-
-    .af-html-note-content ul, .af-html-note-content ol {
-        padding-left: 20px;
-        margin: 12px 0;
-    }
-
-    .af-html-note-content li { margin: 4px 0; }
-    .af-html-note-content p { margin: 8px 0; }
-
-    .af-html-note-content table {
-        border-collapse: collapse;
-        width: 100%;
-        margin: 16px 0;
-    }
-
-    .af-html-note-content th, .af-html-note-content td {
-        border: 1px solid var(--border-color, #555);
-        padding: 8px 12px;
-        text-align: left;
-    }
-
-    .af-html-note-content th {
-        background: rgba(255,255,255,0.1);
-        font-weight: 600;
-    }
-
-    .af-html-note-content hr {
-        border: none;
-        border-top: 1px solid var(--border-color, #555);
-        margin: 16px 0;
-        opacity: 0.6;
-    }
-
-    .af-html-note-container::-webkit-scrollbar { width: 8px; }
-    .af-html-note-container::-webkit-scrollbar-track { background: rgba(0,0,0,0.1); }
-    .af-html-note-container::-webkit-scrollbar-thumb { 
-        background: var(--border-color, #555); 
-        border-radius: 4px; 
-    }
-    .af-html-note-container::-webkit-scrollbar-thumb:hover { background: #777; }
-
-    .af-html-note-editor::-webkit-scrollbar { width: 8px; }
-    .af-html-note-editor::-webkit-scrollbar-track { background: rgba(0,0,0,0.1); }
-    .af-html-note-editor::-webkit-scrollbar-thumb { 
-        background: var(--border-color, #555); 
-        border-radius: 4px; 
-    }
-    .af-html-note-editor::-webkit-scrollbar-thumb:hover { background: #777; }
-
-    /* ****** MY OWN STYLES ****** */
-    .af-column-half-left {
-        box-sizing: border-box;
-        float: left;
-        width: 49%;
-        margin-right: 1% !important;
-    }
-    .af-column-half-right {
-        box-sizing: border-box;
-        float: left;
-        width: 49%;
-        margin-left: 1% !important;
-    }
-    .row:after {
-        content: "";
-        display: table;
-        clear: both;
-    }
-`;
+}

 // Inject styles
 function injectStyles() {
Author	SHA1	Message	Date
Alex Furer	9fa5d1b3d9	v0.0.08 - Moved the CSS from the JS file to it's own file. - Added CHANGELOG.md - Added package.json for ComfyUI Manager compliance - Added pyproject.toml for registry compliance - Reworked the README - Added the "helpers" folder to the .gitignore - Added an icon to the pyproject.toml	2025-11-05 14:21:04 +01:00
Alex Furer	4b8d36c51c	Stop tracking PSD files	2025-10-12 21:39:32 +02:00
Alex Furer	106d1835fa	Added more file types to the .gitignore - Skipping .psd and .docx	2025-10-12 21:37:32 +02:00
Alex Furer	a1f8cfbeb7	v0.0.07 Cosmetics, making this a version	2025-10-12 00:13:34 +02:00
Alex Furer	3db929b1bd	Cosmetics	2025-10-12 00:11:32 +02:00
Alex Furer	7626bc6e99	Cosmetics Cleaned up the README some more	2025-10-11 23:40:48 +02:00
Alex Furer	c5869332ae	Cosmetics Moved installation description up and rewrote installation guide (ComfyUI Manager release !!)	2025-10-11 23:38:45 +02:00
Alex Furer	01f56bfe06	Rest of the images	2025-10-11 23:21:50 +02:00
Alex Furer	9b913eecb8	Switched to .webp for images	2025-10-11 23:12:32 +02:00
Alex Furer	e06bf54607	Testing images for README	2025-10-11 23:10:33 +02:00
Alex Furer	c9786121b1	Support Files Updated	2025-10-11 18:28:42 +02:00
Alex Furer	0bbc93a39f	Update README.md	2025-10-11 18:20:20 +02:00
Alex Furer	5dcd58934d	README again	2025-10-11 18:19:27 +02:00
Alex Furer	ff3b58c2e1	README Revision	2025-10-11 18:18:15 +02:00
Alex Furer	e53365fd2d	Fixed README	2025-10-11 18:15:51 +02:00