From a14b80b5c1bd3e59065416e443b28a1aaab757b1 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 | 166 ++++++++++++++++++++++++++++++++++++++++++++++-------- 1 file changed, 141 insertions(+), 25 deletions(-) diff --git a/README.md b/README.md index 58e7f73..73c1de9 100644 --- a/README.md +++ b/README.md @@ -40,34 +40,150 @@ 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🔒 Login Screen🔧 Base URL Change
+ API Unreachable + + Login Screen + + Base URL Change +
Error screen, shown whenever the API becomes unreachable.Login screen for user authentication, first screen you will face when you start the app for the first time.Screen to change the API base URL, available from login, register & API unreachable pages (doesn't require being signed in).
📝 Register Screen📆 Month View📅 Day View
+ Register Screen + + Month View + + Day View +
User registration screen.Monthly calendar view to browse events, the screen shown immediately after login.Daily event view, listing the events for that day.
⏳ Edit Duration Event⚡ Edit Instant Event📨 Invite User to Event
+ Edit Duration Event + + Edit Instant Event + + Invite User to Event +
Edit screen for duration-based events.Edit screen for instant events.Interface for inviting users to an event.
⏱️ Duration Event Details🔍 Instant Event Details📂 Categories Overview
+ Duration Event Details + + Instant Event Details + + Categories Overview +
Detailed view of a duration-based event.Detailed view of an instant event.List of event categories of the user.
➕ Create New Category🆕 Updated Categories Overview⚙️ Settings Screen
+ Create New Category + + Updated Categories + + Settings Screen +
Form to create a new category or edit an existing one.Updated list with a newly added category.Settings menu for configuring user details & the base url. This screen is only available to logged in users.
🔔 Notification: Invite👀 Invite Preview✅ Notification: Accepted
+ Notification: Invite + + Invite Preview + + Notification: Accepted +
Notification about an incoming event invite.Preview of the event from the invite (after clicking the eye button).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.