style added to pre and code tag

Author: kshyam

_posts/2024-11-10-integrating-ai-and-machine-learning-into-react-native-apps.md

@@ -47,10 +47,12 @@ Ensure your React Native project is properly configured with the latest version
 
 bash
 
+```
+npx react-native init MyApp
 
+cd MyApp
 
-`npx react-native init MyApp
-cd MyApp` 
+```
 
 ### 3. **Install Required Libraries**
 
@@ -60,27 +62,32 @@ Depending on your use case, install the necessary AI/ML libraries. For example:
 
     bash
 
+    ```
+    npm install @tensorflow/tfjs @tensorflow-models/mobilenet
     
-    `npm install @tensorflow/tfjs @tensorflow-models/mobilenet` 
-    
+    ```
 -   To integrate Google ML Kit:
     
     bash
     
  
+    ```
+    npm install 
     
-    `npm install react-native-ml-kit` 
+    react-native-ml-kit
     
+    ```
 
 4. **Load and Use AI Models**
 
 Here's a sample implementation of image recognition using TensorFlow.js:
 
 javascript
 
+```
 
 
-`import * as tf from '@tensorflow/tfjs';
+import * as tf from '@tensorflow/tfjs';
 
 import * as mobilenet from '@tensorflow-models/mobilenet';
 
@@ -127,7 +134,9 @@ classifyImage('image-uri-here')} />
   );
 };
 
-export default App;` 
+export default App;
+
+```
 
 ### 5. **Test the Integration**
 
@@ -137,9 +146,12 @@ bash
 
 
 
-`npx react-native run-android
- or
-npx react-native run-ios` 
+```
+  npx react-native run-android
+  or
+  npx react-native run-ios
+
+``` 
 
 Ensure the AI features work seamlessly across both platforms.
 

css/syntax.css

@@ -207,3 +207,22 @@
 .highlight {
   background-color: #f8f8f8;
 }
+
+
+pre, code {
+  background-color: #272822;
+  color: #f8f8f2;
+  padding: 10px;
+  border-radius: 5px;
+  font-family: 'Courier New', Courier, monospace;
+  overflow-x: auto;
+}
+
+code {
+  padding: 2px 4px;
+}
+
+pre code {
+  display: block;
+  padding: 0;
+}