Skip to content

Conversation

@Akshay4506
Copy link

Description

I found the previous UI to be functional, but it wasn’t visually appealing. When there is a product under implementation, we need to gather all the requirements in the analysis phase. GitHub is such a platform that people come forward to make contributions on their own. As GitHub was an open-source platform available for contributions to certain open-source projects, I have decided to make some contributions to the frontend of this chat app project so that I can design or enhance the existing UI to make sure that there will be a successful deployment of the chat app.

#Changes and the Reasons

  1. "Composer Box" is separated from the chat container and is given a 'transparent look' with a 'new position' at the bottom of the app(so that users can differentiate between the message composer and the chat display section).
  2. "Send Button" is 'enabled/disabled' dynamically based on user input(If there is no input in the composer box, then the send button will remain disabled/deactivated with zero glow, and it will get enabled or come into active state when there is atleast one character entered in the composer).
  3. "Scroll Bar" is now enhanced with 'colour', 'round edges', and made to match the dark mode UI of the chat app(the previous one was in white, which looks odd from the dark theme UI).
  4. "Composer Box" will now have a 'glowing border' if the cursor is focused in it(this is made to indicate to the user that the text he/she type in their keypad was being entered into the composer, even if their cursor was pointing in another part of their monitor/screen).
  5. "Footer" of the chat app, which contains the backend URL, has been fitted with a 'transparent box' with round edges(this is made to differentiate it from the other components of the chat app).

----------------------------------------------------- Hope this contribution is valid --------------------------------------------------

Type of change

  • Bug fix (non-breaking change which fixes an issue)
  • [✔️ ] New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to not work as expected)
  • This change requires a documentation update

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant