@@ -39,25 +39,25 @@ A powerful, feature-rich JSON viewer component for Blazor applications with VS C
3939Install via NuGet Package Manager:
4040``` bash
4141dotnet add package JsonViewer.Blazor
42-
42+ ```
4343Or via Package Manager Console:
4444
45- powershell
45+ ``` powershell
4646Install-Package JsonViewer.Blazor
47-
47+ ```
4848---
4949
5050## 🚀 Quick Start
5151
5252### 1️⃣ Add namespace to ` _Imports.razor ` :
5353
54- razor
54+ ``` razor
5555@using JsonViewerComponent
5656@using JsonViewerComponent.Components
57-
57+ ```
5858### 2️⃣ Use in your component:
5959
60- razor
60+ ``` razor
6161@page "/json-demo"
6262
6363<JsonViewer JsonData="@jsonString" IsEditable="true" />
@@ -70,28 +70,28 @@ private string jsonString = @"{
7070""hobbies"": [""reading"", ""gaming"", ""coding""]
7171}";
7272}
73-
73+ ```
7474---
7575
7676## 📖 Usage Examples
7777
7878### Read-Only Mode
7979
80- razor
80+ ``` razor
8181<JsonViewer JsonData="@jsonData" IsEditable="false" />
82-
82+ ```
8383### Editable Mode with Two-Way Binding
8484
85- razor
85+ ``` razor
8686<JsonViewer @bind-JsonData="jsonData" IsEditable="true" />
8787
8888@code {
8989private string jsonData = "{}";
9090}
91-
91+ ```
9292### Dynamic JSON Loading
9393
94- razor
94+ ``` razor
9595<button @onclick="LoadSampleData">Load Sample</button>
9696<JsonViewer JsonData="@jsonData" IsEditable="true" />
9797
@@ -103,7 +103,7 @@ private void LoadSampleData()
103103jsonData = @"{""userId"": 1, ""userName"": ""Alice""}";
104104}
105105}
106-
106+ ```
107107---
108108
109109## ⌨️ Keyboard Shortcuts
@@ -120,10 +120,10 @@ jsonData = @"{""userId"": 1, ""userName"": ""Alice""}";
120120
121121The component automatically saves your theme preference to localStorage:
122122
123- razor
123+ ``` razor
124124@* Theme persists across page refreshes *@
125125<JsonViewer JsonData="@jsonData" IsEditable="true" />
126-
126+ ```
127127---
128128
129129## 📊 JSON Statistics
@@ -225,31 +225,3 @@ Made with ❤️ by [JsonViewer Component](https://github.com/JsonViewer-Compone
225225
226226
227227---
228-
229- ## 📂 **3. ساختار فایلها**
230-
231- فایلها رو اینجوری سازماندهی کن:
232-
233- Blazor/
234- ├── .github/
235- │ └── workflows/
236- ├── src/
237- │ ├── JsonViewerComponent/
238- │ │ ├── Components/
239- │ │ ├── JsonViewerComponent.csproj ← فایل جدید
240- │ │ └── ...
241- │ └── JsonViewerComponent.sln
242- ├── logo.png ← لوگوی تو
243- ├── README.md ← فایل README جدید
244- └── LICENSE
245-
246-
247- ---
248-
249- ## 🔧 **4. دستورات Build و Test**
250-
251- ### **مرحله 1: کپی لوگو**
252-
253- ```bash
254- # اگه لوگو در پوشه دیگهای هست، کپیش کن به root
255- cp path/to/logo.png ./logo.png
0 commit comments