From c7a86114767e403d4abbb882053def5c9950d4e3 Mon Sep 17 00:00:00 2001
From: xxDeveloper <77380166+Murtatrxx@users.noreply.github.com>
Date: Fri, 4 Aug 2023 19:44:22 +0300
Subject: [PATCH] =?UTF-8?q?docs:=20=E2=9C=A8=20Add=20some=20magic?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 docs/guide/walkthrough/services.md | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/docs/guide/walkthrough/services.md b/docs/guide/walkthrough/services.md
index cdd610ee2..fd3e931fe 100644
--- a/docs/guide/walkthrough/services.md
+++ b/docs/guide/walkthrough/services.md
@@ -51,9 +51,13 @@ export default commandModule({
 ## Safety
 - Services cannot be called in other services while makeDependencies is forming.
 - You will need to wire dependencies together.
-  
+
+import Tabs from '@theme/Tabs';import TabItem from '@theme/TabItem';
+
+<Tabs>
+    <TabItem>     
 ✅ A good example;
-```ts
+```ts title="index.ts" showLineNumbers
 // index.ts
 await makeDependencies(...pass you options here)
 ```
@@ -63,16 +67,18 @@ await makeDependencies(...pass you options here)
 import { Service } from '@sern/handler';
 const client = Service('@sern/client');
 ```
+    </TabItem>
 
+<TabItem>
 ❌ Don't do this
-```ts
-// index.ts
+```ts title="commands/ping.ts" showLineNumbers
 import { Service, makeDependencies } from '@sern/handler';
 /* DON'T USE SERVICES BEFORE CALLING makeDependencies */
 const logger = Service('@sern/logger');
 
 await makeDependencies()
 ```
+</TabItem>
 
 - Services can only be used after sern has made dependencies. 
     - Calling a service before will crash your application.