Minor Changes

rcosta358 · rcosta358 · commit 81431224f1a8 · 2026-04-04T23:44:33.000+01:00
diff --git a/pages/vscode-extension/autocomplete.md b/pages/vscode-extension/autocomplete.md
@@ -11,4 +11,4 @@ The VS Code extension provides context-aware autocomplete for LiquidJava refinem
 
 Autocomplete suggestions only appear when the cursor is inside a string literal that belongs to a LiquidJava annotation. These suggestions include variable in scope, fields, ghosts, states, aliases, and keywords like `this`, `old`, and `return`. 
 
-![Autocomplete Demo]({{ 'assets/vscode-extension/autocomplete.gif' | relative_url }})
+![Autocomplete]({{ 'assets/vscode-extension/autocomplete.gif' | relative_url }})
diff --git a/pages/vscode-extension/commands.md b/pages/vscode-extension/commands.md
@@ -18,6 +18,6 @@ The extension provides commands to control the extension lifecycle, trigger veri
 | `Show Logs` | Opens the output channel with LiquidJava logs |
 | `Show View` | Opens the LiquidJava webview |
 
-![Commands Demo]({{ 'assets/vscode-extension/commands.gif' | relative_url }})
+![Commands]({{ 'assets/vscode-extension/commands.png' | relative_url }})
 
 The extension adds a command that opens a palette listing the available LiquidJava commands. This command is executed when the status bar indicator is clicked, giving users a quick way to access extension actions.
diff --git a/pages/vscode-extension/output-channel.md b/pages/vscode-extension/output-channel.md
@@ -9,3 +9,4 @@ permalink: /vscode-extension/output-channel/
 
 The extension provides an output channel for displaying LiquidJava logs from both the client and the language server.
 
+![Output Channel]({{ 'assets/vscode-extension/output-channel.png' | relative_url }})
diff --git a/pages/vscode-extension/real-time-diagnostic-feedback.md b/pages/vscode-extension/real-time-diagnostic-feedback.md
@@ -9,4 +9,4 @@ permalink: /vscode-extension/real-time-diagnostic-feedback/
 
 The LiquidJava VS Code extension runs verification from inside the editor and reports problems directly in VS Code, keeping the verification feedback close to the code as you edit. When a document is opened or modified, the language server performs the LiquidJava verification and publishes the diagnostics back to the client.
 
-![Diagnostic Feedback Demo]({{ 'assets/vscode-extension/diagnostic-feedback.gif' | relative_url }})
+![Diagnostic Feedback]({{ 'assets/vscode-extension/diagnostic-feedback.gif' | relative_url }})
diff --git a/pages/vscode-extension/status-bar-indicator.md b/pages/vscode-extension/status-bar-indicator.md
@@ -17,3 +17,5 @@ The extension displays an indicator in the status bar in the bottom-left of the
 | `stopped` | The extension was stopped, failed to connect, or lost connection with the language server |
 
 Clicking on this indicator shows the available LiquidJava commands, which is covered in the next section.
+
+![Status Bar Indicator]({{ 'assets/vscode-extension/status-bar-indicator.gif' | relative_url }})
diff --git a/pages/vscode-extension/syntax-highlighting.md b/pages/vscode-extension/syntax-highlighting.md
@@ -11,4 +11,4 @@ LiquidJava refinements are written inside Java string literals, which makes them
 
 The extension implements refinement syntax highlighting which tokenizes the refinement language inside LiquidJava annotations and allows VS Code color those tokens according to the active theme. To make refinements visually distinct from regular Java code, the highlighted refinement text is also rendered in italic.
 
-![Syntax Highlighting Demo]({{ 'assets/vscode-extension/syntax-highlighting.gif' | relative_url }})
+![Syntax Highlighting]({{ 'assets/vscode-extension/syntax-highlighting.gif' | relative_url }})
diff --git a/pages/vscode-extension/webview.md b/pages/vscode-extension/webview.md
@@ -15,7 +15,7 @@ The diagnostic explorer provides an interactive view over LiquidJava diagnostics
 
 Clicking a displayed value can expand it into its origin expression, and clicking a variable can jump to its location in the editor. This makes simplification traceable instead of showing only the final reduced expression.
 
-![Diagnostic Explorer Demo]({{ 'assets/vscode-extension/diagnostic-explorer.gif' | relative_url }})
+![Diagnostic Explorer]({{ 'assets/vscode-extension/diagnostic-explorer.gif' | relative_url }})
 
 ## Context Debugger
 
@@ -26,7 +26,7 @@ The context debugger displays:
 - Ghosts and states (by file)
 - Variables (by file and scope)
 
-![Context Debugger Demo]({{ 'assets/vscode-extension/context-debugger.gif' | relative_url }})
+![Context Debugger]({{ 'assets/vscode-extension/context-debugger.gif' | relative_url }})
 
 ### Cursor-Aware Behavior
 
@@ -49,4 +49,4 @@ When a refinement or state refinement fails, the context debugger also shows the
 
 State refinements encode object protocols, but those protocols can be difficult to understand when read only as annotations spread across methods. The state machine visualizer turns this information into a visual state machine, making it easier to understand the protocol with a DFA representation. The diagram updates in real time and is rendered using [Mermaid](https://mermaid.ai).
 
-![State Machine Visualizer Demo]({{ 'assets/vscode-extension/state-machine-visualizer.gif' | relative_url }})
+![State Machine Visualizer]({{ 'assets/vscode-extension/state-machine-visualizer.png' | relative_url }})

Original file line number	Diff line number	Diff line change
`@@ -11,4 +11,4 @@ The VS Code extension provides context-aware autocomplete for LiquidJava refinem`
`11`	`11`
`12`	`12`	Autocomplete suggestions only appear when the cursor is inside a string literal that belongs to a LiquidJava annotation. These suggestions include variable in scope, fields, ghosts, states, aliases, and keywords like `this`, `old`, and `return`.
`13`	`13`
`14`		`-![Autocomplete Demo]({{ 'assets/vscode-extension/autocomplete.gif' \| relative_url }})`
	`14`	`+![Autocomplete]({{ 'assets/vscode-extension/autocomplete.gif' \| relative_url }})`
Original file line number	Diff line number	Diff line change
`@@ -9,3 +9,4 @@ permalink: /vscode-extension/output-channel/`
`9`	`9`
`10`	`10`	`The extension provides an output channel for displaying LiquidJava logs from both the client and the language server.`
`11`	`11`
	`12`	`+![Output Channel]({{ 'assets/vscode-extension/output-channel.png' \| relative_url }})`
Original file line number	Diff line number	Diff line change
`@@ -9,4 +9,4 @@ permalink: /vscode-extension/real-time-diagnostic-feedback/`
`9`	`9`
`10`	`10`	`The LiquidJava VS Code extension runs verification from inside the editor and reports problems directly in VS Code, keeping the verification feedback close to the code as you edit. When a document is opened or modified, the language server performs the LiquidJava verification and publishes the diagnostics back to the client.`
`11`	`11`
`12`		`-![Diagnostic Feedback Demo]({{ 'assets/vscode-extension/diagnostic-feedback.gif' \| relative_url }})`
	`12`	`+![Diagnostic Feedback]({{ 'assets/vscode-extension/diagnostic-feedback.gif' \| relative_url }})`
Original file line number	Diff line number	Diff line change
`@@ -11,4 +11,4 @@ LiquidJava refinements are written inside Java string literals, which makes them`
`11`	`11`
`12`	`12`	`The extension implements refinement syntax highlighting which tokenizes the refinement language inside LiquidJava annotations and allows VS Code color those tokens according to the active theme. To make refinements visually distinct from regular Java code, the highlighted refinement text is also rendered in italic.`
`13`	`13`
`14`		`-![Syntax Highlighting Demo]({{ 'assets/vscode-extension/syntax-highlighting.gif' \| relative_url }})`
	`14`	`+![Syntax Highlighting]({{ 'assets/vscode-extension/syntax-highlighting.gif' \| relative_url }})`