From 958799dc2d8c8ba98d3f29b79725853a2751a8ce Mon Sep 17 00:00:00 2001 From: Peter Vacho Date: Sun, 5 Jan 2025 17:21:30 +0100 Subject: [PATCH] chore: Improve readme UI, use raw HTML for the table --- README.md | 233 ++++++++++++++++++++++++++++++++++++++++++++++++------ 1 file changed, 208 insertions(+), 25 deletions(-) diff --git a/README.md b/README.md index 58e7f73..05f6c41 100644 --- a/README.md +++ b/README.md @@ -40,34 +40,217 @@ Repository](https://git.itsdrike.com/ap7pd/event-management-backend). Below is a showcase of key features and screens in the application: -| ![API Unreachable](showcase/01_api_unreachable.png) | ![Login Screen](showcase/02_login.png) | ![Base URL Change](showcase/02_login_base_url_change.png) | -| --------------------------------------------------------- | -------------------------------------- | ---------------------------------------------------------------------------------------------- | -| Error screen, shown whenever the API becomes unreachable. | Login screen for user authentication. | Screen to update the API base URL, available from the login, register & API unreachable pages. | + + + + + + + + + + + + -| ![Register Screen](showcase/03_register.png) | ![Month View](showcase/04_month_view.png) | ![Day View](showcase/05_day_view.png) | -| -------------------------------------------- | ----------------------------------------- | ------------------------------------------------- | -| User registration screen. | Monthly calendar view to browse events. | Daily event view with event details for that day. | + + + + + + + + + + + -| ![Edit Duration Event](showcase/06_duration_event_edit.png) | ![Edit Instant Event](showcase/07_instant_event_edit.png) | ![Invite User to Event](showcase/08_invite_user_to_event.png) | -| ----------------------------------------------------------- | --------------------------------------------------------- | ------------------------------------------------------------- | -| Edit screen for duration-based events. | Edit screen for instant events. | Interface for inviting users to an event. | + + + + + + + + + + + -| ![Duration Event Details](showcase/09_duration_event_details.png) | ![Instant Event Details](showcase/10_instant_event_details.png) | ![Categories Overview](showcase/11_categories.png) | -| ----------------------------------------------------------------- | --------------------------------------------------------------- | -------------------------------------------------- | -| Detailed view of a duration-based event. | Detailed view of an instant event. | List of event categories of the user. | + + + + + + + + + + + -| ![Create New Category](showcase/12_new_category.png) | ![Updated Categories](showcase/13_categories_with_new.png) | ![Settings Screen](showcase/14_settings.png) | -| ---------------------------------------------------- | ---------------------------------------------------------- | ------------------------------------------------------------------- | -| Form to create a new category. | Updated list with a newly added category. | Settings menu for app configuration. Only available when logged in. | + + + + + + + + + + + -| ![Notification: Invite](showcase/15_notification_invite_bob.png) | ![Invite Preview](showcase/16_invite_event_details_preview.png) | ![Notification: Invite Accepted](showcase/17_notification_invite_accepted_bob.png) | -| ---------------------------------------------------------------- | --------------------------------------------------------------- | ---------------------------------------------------------------------------------- | -| Notification about an (incomming) event invite. | Preview of the event from the invite. | Notification for the (incomming) invite after accepting (already marked read). | + + + + + + + + + + + -| ![Day View with Invite](showcase/18_day_view_invited_event_bob.png) | ![Invited Event Details](showcase/19_invited_event_details_bob.png) | ![Notification Accepted John](showcase/20_notification_invite_accepted_john.png) | -| ------------------------------------------------------------------- | ------------------------------------------------------------------- | ---------------------------------------------------------------------------------------- | -| Day view showing the invited event. | Details of an event the user was invited to. | Notification about user having accepted an outgoing invite (from the invitor's account). | - -| ![Notifications Cleared](showcase/21_notifications_cleared.png) | -| --------------------------------------------------------------- | -| Screen showing cleared notifications. | + + + + + + + +
+
+ 📶 API Unreachable + Error screen, shown whenever the API becomes unreachable. +
+ 		+
+ 🔒 Login Screen + Login screen for user authentication, first screen you will face when you start the app for the first time. +
+ 		+
+ 🔧 Base URL Change + Screen to change the API base URL, available from login, register & API unreachable pages (doesn't require being signed in). +
+
+ API Unreachable + + Login Screen + + Base URL Change +
+
+ 📝 Register Screen + User registration screen. +
+ 		+
+ 📆 Month View + Monthly calendar view to browse events, the screen shown immediately after login. +
+ 		+
+ 📅 Day View + Daily event view, listing the events for that day. +
+
+ Register Screen + + Month View + + Day View +
+
+ ⏳ Edit Duration Event + Edit screen for duration-based events. +
+ 		+
+ ⚡ Edit Instant Event + Edit screen for instant events. +
+ 		+
+ 📨 Invite User to Event + Interface for inviting users to an event. +
+
+ Edit Duration Event + + Edit Instant Event + + Invite User to Event +
+
+ ⏱️ Duration Event Details + Detailed view of a duration-based event. +
+ 		+
+ 🔍 Instant Event Details + Detailed view of an instant event. +
+ 		+
+ 📂 Categories Overview + List of event categories of the user. +
+
+ Duration Event Details + + Instant Event Details + + Categories Overview +
+
+ ➕ Create New Category + Form to create a new category or edit an existing one. +
+ 		+
+ 🆕 Updated Categories Overview + Updated list with a newly added category. +
+ 		+
+ ⚙️ Settings Screen + Settings menu for configuring user details & the base url. This screen is only available to logged in users. +
+
+ Create New Category + + Updated Categories + + Settings Screen +
+
+ 🔔 Notification: Invite + Notification about an incoming event invite. +
+ 		+
+ 👀 Invite Preview + Preview of the event from the invite (after clicking the eye button). +
+ 		+
+ ✅ Notification: Accepted + That same notification for the invite, after acceptance. This notification also doesn't have the orange bar on the left, meaning it's marked as read. +
+
+ Notification: Invite + + Invite Preview + + Notification: Accepted +
+
+ 🗑️ Notifications Cleared + Screen showing cleared notifications, after the user has swiped all the notifications to the right, deleting them. +
+
+ Notifications Cleared +