update readme and add screenshots

Signed-off-by: GRBurst <[email protected]>

add screenshots to readme

Signed-off-by: GRBurst <[email protected]>

readme.md

@@ -2,6 +2,33 @@
 
 Online at https://grburst.github.io/hnjobs
 
+## Desktop Screenshots
+
+<p float="left">
+<img src="https://github.com/grburst/hnjobs/blob/main/doc/assets/screenshots/HackerNews_Jobs-grburst.github.io-startpage_dm.png?raw=true" alt="startpage dark mode" width="150px" />
+ <img src="https://github.com/grburst/hnjobs/blob/main/doc/assets/screenshots/HackerNews_Jobs-grburst.github.io-startpage_lm.png?raw=true" alt="startpage light mode" width="150px" />
+ <img src="https://github.com/grburst/hnjobs/blob/main/doc/assets/screenshots/HackerNews_Jobs-grburst.github.io-3_active_filters_dm.png?raw=true" alt="3 active filters in dark mode" width="150px" />
+ <img src="https://github.com/grburst/hnjobs/blob/main/doc/assets/screenshots/HackerNews_Jobs-grburst.github.io-3_active_filters_lm.png?raw=true" alt="3 active filters in light mode" width="150px" />
+ <img src="https://github.com/grburst/hnjobs/blob/main/doc/assets/screenshots/HackerNews_Jobs-grburst.github.io-custom_filters_dm.png?raw=true" alt="custom filters in dark mode" width="150px" />
+ <img src="https://github.com/grburst/hnjobs/blob/main/doc/assets/screenshots/HackerNews_Jobs-grburst.github.io-custom_filters_lm.png?raw=true" alt="custom filters in light mode" width="150px" />
+ <img src="https://github.com/grburst/hnjobs/blob/main/doc/assets/screenshots/HackerNews_Jobs-grburst.github.io-single_filter_dm.png?raw=true" alt="single filter active in dark mode" width="150px" />
+ <img src="https://github.com/grburst/hnjobs/blob/main/doc/assets/screenshots/HackerNews_Jobs-grburst.github.io-single_filter_lm.png?raw=true" alt="single filter active in light mode" width="150px" />
+ <img src="https://github.com/grburst/hnjobs/blob/main/doc/assets/screenshots/HackerNews_Jobs-grburst.github.io-3_active_filters_startpage_dm.png?raw=true" alt="3 active filters startpage view in dark mode" width="150px" />
+ <img src="https://github.com/grburst/hnjobs/blob/main/doc/assets/screenshots/HackerNews_Jobs-grburst.github.io-3_active_filters_startpage_lm.png?raw=true" alt="3 active filters startpage view in light mode" width="150px" />
+</p>
+
+## Mobile Screenshots
+
+<p float="left">
+ <img src="https://github.com/grburst/hnjobs/blob/main/doc/assets/screenshots/mobile_3filters_dm.png?raw=true" alt="mobile 3 filters active in dark mode" width="150px" />
+ <img src="https://github.com/grburst/hnjobs/blob/main/doc/assets/screenshots/mobile_3filters_lm.png?raw=true" alt="mobile 3 filters active in light mode" width="150px" />
+ <img src="https://github.com/grburst/hnjobs/blob/main/doc/assets/screenshots/mobile_3filters-startpage_dm.png?raw=true" alt="mobile 3 filters startpage view in dark mode" width="150px" />
+ <img src="https://github.com/grburst/hnjobs/blob/main/doc/assets/screenshots/mobile_3filters-startpage_lm.png?raw=true" alt="mobile 3 filters startpage view in light mode" width="150px" />
+ <img src="https://github.com/grburst/hnjobs/blob/main/doc/assets/screenshots/mobile_startpage_dm.png?raw=true" alt="mobile startpage dark mode" width="150px" />
+ <img src="https://github.com/grburst/hnjobs/blob/main/doc/assets/screenshots/mobile_startpage_lm.png?raw=true" alt="mobile startpage light mode" width="150px" />
+</p>
+
+
 ## Technologies + Frameworks
 
 - [React](https://react.dev/) TypeScript Frontend
@@ -11,7 +38,8 @@ Online at https://grburst.github.io/hnjobs
 - [Effect-TS/effect](https://github.com/Effect-TS/effect) for async calls and effect management
 - [Reactfire](https://github.com/FirebaseExtended/reactfire/blob/main/docs/quickstart.md) for Realtime Database connection to Hackernews Firabase
 - [sqlite-wasm-http](https://github.com/mmomtchev/sqlite-wasm-http#readme) for partial requests to static served sqlite3 db (not online yet)
-- [ant design](https://github.com/ant-design/ant-design) and [tailwindcss](https://github.com/tailwindlabs/tailwindcss) for components and CSS frameworks.
+- [ant design](https://github.com/ant-design/ant-design) as components framework.
+- [Reaviz](https://github.com/reaviz/reaviz) for Venn Diagrams.
 
 ## Setup
 
@@ -38,4 +66,3 @@ For the frontend, `cd` to `frontend` folder and run `yarn dev` or run `yarn` as
 ```bash
 yarn --cwd ./frontend dev
 ```
-