Use admonitions syntax for notes

Author: satya164

versioned_docs/version-7.x/header-buttons.md

@@ -69,7 +69,11 @@ function MyStack() {
 
 When we define our button this way, the `this` variable in `options` is _not_ the `HomeScreen` instance, so you can't call `setState` or any instance methods on it. This is pretty important because it's common to want the buttons in your header to interact with the screen that the header belongs to. So, we will look how to do this next.
 
-> 💡 Please note that a community-developed library for rendering buttons in the header with the correct styling is available: [react-navigation-header-buttons](https://github.com/vonovak/react-navigation-header-buttons).
+:::tip
+
+Note that a community-developed library for rendering buttons in the header with the correct styling is available: [react-navigation-header-buttons](https://github.com/vonovak/react-navigation-header-buttons).
+
+:::
 
 ## Header interaction with its screen component
 

versioned_docs/version-7.x/hello-react-navigation.md

@@ -21,7 +21,11 @@ The libraries we've installed so far are the building blocks and shared foundati
 npm install @react-navigation/native-stack@next
 ```
 
-> 💡 `@react-navigation/native-stack` depends on `react-native-screens` and the other libraries that we installed in [Getting started](getting-started.md). If you haven't installed those yet, head over to that page and follow the installation instructions.
+:::info
+
+`@react-navigation/native-stack` depends on `react-native-screens` and the other libraries that we installed in [Getting started](getting-started.md). If you haven't installed those yet, head over to that page and follow the installation instructions.
+
+:::
 
 ### Creating a native stack navigator
 

versioned_docs/version-7.x/native-stack-navigator.md

@@ -20,7 +20,11 @@ npm install @react-navigation/native-stack@next
 
 ## API Definition
 
-> 💡 If you encounter any bugs while using `createNativeStackNavigator`, please open issues on [`react-native-screens`](https://github.com/software-mansion/react-native-screens) rather than the `react-navigation` repository!
+:::info
+
+If you encounter any bugs while using `createNativeStackNavigator`, please open issues on [`react-native-screens`](https://github.com/software-mansion/react-native-screens) rather than the `react-navigation` repository!
+
+:::
 
 To use this navigator, import it from `@react-navigation/native-stack`:
 

versioned_docs/version-7.x/navigation-object.md

@@ -18,7 +18,11 @@ The `navigation` object contains various convenience functions that dispatch nav
 
 The `navigation` object can be accessed inside any screen component with the [`useNavigation`](use-navigation.md) hook. It's also passed as a prop only to screens components defined with the dynamic API.
 
-> `setParams`/`setOptions` etc. should only be called in event listeners or `useEffect`/`useLayoutEffect`/`componentDidMount`/`componentDidUpdate` etc. Not during render or in constructor.
+:::warning
+
+`setParams`/`setOptions` etc. should only be called in event listeners or `useEffect`/`useLayoutEffect`/`componentDidMount`/`componentDidUpdate` etc. Not during render or in constructor.
+
+:::
 
 ### Navigator-dependent functions