Improve the formatting

README.md

@@ -10,30 +10,33 @@ Notes:
 
 ⚠️ **Watch for APIs that do not support client requests** (you'll get CORS issues with )
 Hints that the API does not support Client-side: No mention of JS/Client code samples.
-[Example](./API.Probably.not.Supporting.Client.Requests.jpg)
+[Example](./img/API.Probably.not.Supporting.Client.Requests.jpg)
 
 ## Packages
+- **Lists of packages**:
+  - [Open base](https://openbase.com/) amazing database of packages.
 
-- [Open base](https://openbase.com/) amazing database of packages.
-- [IDB](https://github.com/jakearchibald/idb) This is a tiny (~1.05k brotli'd) library that mostly mirrors the IndexedDB API, but with small improvements that make a big difference to usability. You can see a video about how to use it made by google [here!](https://www.youtube.com/watch?v=VNFDoawcmNc).
-- [Boring Avatars](https://www.npmjs.com/package/boring-avatars) Boring avatars is a tiny JavaScript React library that generates custom, SVG-based avatars from any username and color palette.
+- **Packages**:
+  - [IDB](https://github.com/jakearchibald/idb) This is a tiny (~1.05k brotli'd) library that mostly mirrors the IndexedDB API, but with small improvements that make a big difference to usability. You can see a video about how to use it made by google [here!](https://www.youtube.com/watch?v=VNFDoawcmNc).
+  - [Boring Avatars](https://www.npmjs.com/package/boring-avatars) Boring avatars is a tiny JavaScript React library that generates custom, SVG-based avatars from any username and color palette.
 
 ## Tools
-
- - [What we can do today](https://whatwebcando.today/) information of what your browser is capable of doing and how to do it with **code examples**.
- - [Can I use](https://caniuse.com/) information about which method and feature is supported by each browser. 
+- **Compatibility Tools**:
+  - [What we can do today](https://whatwebcando.today/) information of what your browser is capable of doing and how to do it with **code examples**.
+  - [Can I use](https://caniuse.com/) information about which method and feature is supported by each browser.
  - **Wireframing & Diagram Tools**:
    - [Figma](https://www.figma.com/)
    - [Excalidraw](https://excalidraw.com/)
    - [Sketch](https://www.sketch.com/)
    - [InVision](https://www.invisionapp.com/)
 
-See some wireframing examples from previous Solo projects [here](./img/Solo.Diagrams.01.jpg) and [here](./img/Solo.Diagrams.02.jpg). Made with `Excalidraw`.
+    See some wireframing examples from previous Solo projects [here](./img/Solo.Diagrams.01.jpg) and [here](./img/Solo.Diagrams.02.jpg). Made with `Excalidraw`.
+
 
 ## Storage and Databases
 
 - [How to Structure Your Data with Firebase (Cloud Firestore) 14 min](https://www.youtube.com/watch?v=haMOUb3KVSo) If you are considering using Firebase checkout this design video.
-        
+
 ## General Notes
 
 - ⚠️ When searching for YouTube videos or tutorials online, make sure to check the date of creation, as the software versions mentioned or used in the tutorial might be **outdated**. Things are changing fast in the web development world, and you might find yourselves following a tutorial that has been superseded by another version with breaking changes.