docs: use gfm alerts in readme (#333)

### Describe the changes you've made

use GitHub markdown alerts for warning and note

## Checklist


- [x] I have performed a self-review of my own code.
- [ ] I have commented on my code, particularly wherever it was hard to
understand.
- [ ] I have made corresponding changes to the documentation.
- [ ] I have followed the code style of the project
- [ ] I have tested my code, and it works without errors


## Code of Conduct

- [x] I agree to follow this project's [Code of
Conduct](https://github.com/krshoss/gardevoir/blob/main/CODE_OF_CONDUCT.md)


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

- **Documentation**
- Enhanced alert formatting for warnings and notes in the documentation
to improve clarity and visibility for users.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

Author: Roshanjossey

README.md

@@ -101,13 +101,14 @@ Gardevoir as said, is a zero-dependency project and excels in integrating with a
 </head>
 ```
 
-> **Warning!**
+> [!Warning]
 >
 > Make Sure To Link Your Custom Stylesheet After Gardevoir Else Your Custom Styles Might Not Be Implemented
 
 ## 🚅 Optimize
 
-> **Note** all of these guidelines are for static websites, frameworks like react have their own guide (please refer them)
+> [!Note]
+> All of these guidelines are for static websites, frameworks like react have their own guide (please refer them)
 
 - Never import Gardevoir via css, though this a option, it is not recommended for website loading, rather use html link tags