feat: add the phoenix pro pricing link to the pro features docs

Author: devvaannsh

docs/07-Pro Features/01-live-preview-edit.md

@@ -5,6 +5,10 @@ title: Live Preview Edit Mode
 import React from 'react';
 import VideoPlayer from '@site/src/components/Video/player';
 
+:::info Pro Feature
+[Upgrade to Phoenix Code Pro](https://phcode.io/pricing) to access this feature.
+:::
+
 **Edit Mode** turns the Live Preview interface into a full-fledged editing environment. It lets you modify elements directly in the preview.
 You can edit text, drag and drop elements, change images and links, inspect elements with precise measurements, and a lot more, right in the Live Preview.   
 **Phoenix Code** automatically updates the source code.

docs/07-Pro Features/02-image-gallery.md

@@ -5,6 +5,10 @@ title: Image Gallery
 import React from 'react';
 import VideoPlayer from '@site/src/components/Video/player';
 
+:::info Pro Feature
+[Upgrade to Phoenix Code Pro](https://phcode.io/pricing) to access this feature.
+:::
+
 The **Image Gallery** is a panel that appears at the bottom of the Live Preview. It lets you browse images from Unsplash or select images from your device.
 
 > The Image Gallery is available only for `<img>` elements.

docs/07-Pro Features/03-measurements.md

@@ -2,6 +2,10 @@
 title: Measurements
 ---
 
+:::info Pro Feature
+[Upgrade to Phoenix Code Pro](https://phcode.io/pricing) to access this feature.
+:::
+
 The **Measurements** feature displays ruler lines extending from the edges of a selected element to the edges of the Live Preview document, with labels showing exact pixel positions. This helps you position elements more accurately.
 
 <!-- TODO: add image showing measurements feature -->