mum-open-source / eureka-web-app Goto Github PK

(This task can have multiple contributors)
The homepage needs to champion the platform and give users a better idea of what the platform does and perhaps how to use it. It can also include any other important information that is relevant to visitors.

Your task is to identify some sentences or paragraphs that can be improved or rephrased and make the change. You can also add or remove sentences if you feel it would have a positive impact. If you're looking for inspiration. look for any sentence(s) that doesn't seem clear or maybe you would've wished something was explained better on the home page. You can rectify that!

Steps to accomplish the task:

1. Identify the change you want to make.
2. Create a new issue stating on GitHub and state what enhancement you're making.
3. Open your code editor.
4. Create a new branch that you'll make your changes on.
5. Modify the relevant section of the file src/views/Home.vue
6. Commit your changes and follow the steps to submit a PR.

Knowledge of conditional rendering is required.

On the event page, when you enter multiple filters and there is no event to display, we want to show some text instead of leaving the screen blank. This improves the UX of the platform.

Steps to accomplish the task:

1. If you haven't done already, create a new branch that you'll make your changes on.
2. Navigate to the file, src/views/BrowseEvents.vue
3. The array variable filteredEvents is used to display the events. If the length of this array is 0, display some placegolder text instead. You can decide on what to display.
4. Follow the steps to submit your PR.

On the talent and mentor pages, when we want to wave at someone, hovering over the wave icon should change the cursor to a pointer.

Steps to accomplish the task:

1. If you haven't done already, create a new branch that you'll make your changes on.
2. Navigate to the file, src/modules/main/ProfileCard.vue
3. Find the div that has the class "profile-card__wave".
4. Add "cursor__pointer" to the class.
5. Follow the steps to submit your PR.

There is an arrow icon that appears on some devices and displays as a crossed box on others. Let's either remove it or replace it with a proper icon using Google Material Icons.

Documentation for Google Material Icons - https://google.github.io/material-design-icons/
Note that all the necessary setup and imports are done. You would just need to add the line of code that displays the icon.

Steps to accomplish the task:

1. If you haven't done already, create a new branch that you'll make your changes on.
2. Navigate to the file, src/views/Login.vue
3. Find the line that says "Create a new account ⮞".
4. "⮞" is what is used to display the arrow this needs to be dealt with.
5. Repeat th same for src/views/Signup.vue.
6. Follow the steps to submit your PR.

As per the screenshot, there are two links in the footer of the home page that has an underline. We need to remove this.

Steps to accomplish the task:

1. If you haven't done already, create a new branch that you'll make your changes on.
2. Navigate to the file src/views/Home.vue
3. Find the lines that display the "Privacy" & "Terms & Conditions".
4. You will notice they both have the <u>...</u> tag. You need to remove these tags.
5. Follow the steps to submit your PR.

(Multiple contributors can take up this task)

On the User Profile page, there is an option to select interests. These are hard-coded values. Do you think there are any interests missing and you would like to add? Your task would be to add relevant tech interests. Things like 'Open Source', 'Kafka', 'Hadoop', etc. can be added.

Steps to accomplish the task:

1. If you haven't done already, create a new branch that you'll make your changes on.
2. Navigate to the file, `src/views/UserProfile.vue
3. Find the array variable interestMenu.
4. Modify it and add the new options.
5. Follow the steps to submit your PR.

Knowledge of conditional rendering is required.

On the talent page, when you enter multiple filters and there is no talent to display, we want to show some text instead of leaving the screen blank. This improves the UX of the platform.

Steps to accomplish the task:
1, If you haven't done already, create a new branch that you'll make your changes on.
2. Navigate to the file, src/views/FindTalent.vue
3. The array variable filteredTalent is used to display the talent. If the length of this array is 0, display some placeholder text instead. You can decide on what to display.
4. Follow the steps to submit your PR.

When you go to the User Profile and try to update your bio, there is no limit on how many characters you can type. Your task would be to set a reasonable limit (say about 200 characters).

Steps to accomplish the task:

1. If you haven't done already, create a new branch that you'll make your changes on.
2. Navigate to the file, src/views/UserProfile.vue
3. Find the input tag that has the id bio.
4. Manipulate the Javascript to limit the character count.
5. Follow the steps to submit your PR.

Your task is very simple - just increase the padding for the Button component.

Steps to accomplish the task:

1. If you haven't done already, create a new branch that you'll make your changes on.
2. Navigate to the file, src/common/styles/_variables.scss
3. Find the line that says $btn-padding: 5px 40px;
4. Change the padding to 8px 45px or something better.
5. Follow the steps to submit your PR.

When you go to the User Profile and try to update your bio, there is an input tag used. But a bio is descriptive so it would make more sense to use a textarea. We already have a textarea implemented for the feedback form. Your task would be to change the input field to a textarea.

Steps to accomplish the task:

1. If you haven't done already, create a new branch that you'll make your changes on.
2. Navigate to the file, src/views/UserProfile.vue
3. Find the input tag that has the id bio. This is what needs to be replaced.
4. Navigate to the file, src/views/Feedback.vue
5. Find the textarea tag that has the id feedback__message. This is what you need to replicate. Don't forget to include the styles.
6. Follow the steps to submit your PR.

On the home page, you will see a footer. This footer, in order to be reused on other pages, must be made a separate component.

Steps to accomplish the task:

1. If you haven't done already, create a new branch that you'll make your changes on.
2. Navigate to the file, src/views/Home.vue
3. You will see a div with the class "home__footer". This div and it's corresponding styles must be moved to a new file so it be a stand-alone component.
4. Create a new file called 'Footer.vue' in rc/modules/navigation and transfer the footer code from Home into this. Don't forget to transfer the styling too.
5. Import the footer in the Home.vue file and make sure everything works.
6. Follow the steps to submit your PR.

There is currently no margin and the profile cards sometimes touch edge to edge without any space in between. Refer to the screenshot to see the issue.

Steps to accomplish the task:

1. If you haven't done already, create a new branch that you'll make your changes on.
2. Navigate to the file src/modules/main/ProfileCard.vue
3. We need to modify the css so scroll down still you see the <style> tag around line 110.
4. Under the profile-card class, we need to add the following lines:

margin-left: 5px;
margin-right: 5px;

5. Follow the steps to submit your PR.

Knowledge of conditional rendering is required.

On the mentor page, when you enter multiple filters and there is no mentor to display, we want to show some text instead of leaving the screen blank. This improves the UX of the platform.

Steps to accomplish the task:
1, If you haven't done already, create a new branch that you'll make your changes on.
2. Navigate to the file, src/views/FindMentor.vue
3. The array variable filteredMentors is used to display the mentors. If the length of this array is 0, display some placeholder text instead. You can decide on what to display.
4. Follow the steps to submit your PR.

On the event page, when we want to like an event, hovering over the heart icon should change the cursor to a pointer.

Steps to accomplish the task:

1. If you haven't done already, create a new branch that you'll make your changes on.
2. Navigate to the file, src/modules/main/EventCard.vue
3. Find the div that has the class "event-card__heart".
4. Add "cursor__pointer" to the class.
5. Follow the steps to submit your PR.

Knowledge of HTML & CSS is required. Your task is to design and develop a page to use when the site is under maintainence. You can duplicate the 404 page to use as a template.

Steps to accomplish the task:

1. If you haven't done already, create a new branch that you'll make your changes on.
2. Duplicate the file, src/views/NotFound.vue
3. Rename the file & modify the code
4. Follow the steps to submit your PR.

Global state in a Vue project is managed by Vuex. This is used to store certain information like the authenticated user and more while the platform is being used. On logout, the state of the web app must be reset.

Steps to accomplish the task:

1. If you haven't done already, create a new branch that you'll make your changes on.
2. Navigate to the file, src/store/index.js
3. Near the top, you will see the initial state of the app. This is the variable that is updated when the state is updated.
4. The logout is handled in the same file under the function SIGNOUT_USER. When a user successfully signs out, reset the state to the initial state.
5. Follow the steps to submit your PR.

(This task can be handled by multiple contributors)

We are using a plugin called sweetalert2 to handle the pop-up error messages that are displayed when something goes wrong. You can try to submit feedback form with a body but no subject to see how the popup works. Your task is to update the text displayed in the error messages. There is nothing wrong with them now but here's your chance to get creative and use more flowery language or have a play with words.

Steps to accomplish the task:

1. If you haven't done already, create a new branch that you'll make your changes on.
2. Use global search to find "Swal.fire({" and that will point to all the places where the alert was called.
3. Navigate to the files, understand what the error is and improve the error message.
4. Follow the steps to submit your PR.

There is a menu that is displayed when you click on your name in the top-right corner of the platform. The first option says "User Info" (refer to the screenshot) and can be improved.

Steps to accomplish the task:

1. If you haven't done already, create a new branch that you'll make your changes on.
2. Navigate to the file, src/modules/navigation/UserMenu.vue
3. Find the line that contains "User Info" and replace it with "User Profile".
4. Follow the steps to submit your PR.

(This task can have multiple contributors)

There are many icons used on the platform in the side navigation, top navigation, user menu, event card, profile card, etc. These are currently stored locally in the project folder under src/assets. Let's replace them all with Font Awesome Icons.

Refer to https://github.com/FortAwesome/vue-fontawesome/blob/2.x/README.md for documentation. Note that the relevant setup and installations have already been done. You would just need to replace the icons with the relevant line of code.

Steps to accomplish the task:

1. If you haven't done already, create a new branch that you'll make your changes on.
2. Go through src/assets/ and find where each icon is being used. This can be done through a global search (Ctrl+Shift+F on VSCode).
3. Find a replacement from Font Awesome Icons and replace the line of code after importing the icon in src/main.ts.
4. Follow the steps to submit your PR.

The tagline text on the Browse events page currently says "Competition and others" (refer to screenshot) and can be improved.

Steps to accomplish the task:

1. If you haven't done already, create a new branch that you'll make your changes on.
2. Navigate to the file, src/views/BrowseEvents.vue
3. Find the line that says "Competition and others" .
4. Replace it with "Competitions and more" or something better.
5. Follow the steps to submit your PR.

If you enter some random address on the Eureka site, it displays the 404 page as in the screenshot. Do you have any ideas to make this page better? Get creative - you can update the illustration and/or the text.

Steps to accomplish the task:

1. If you haven't done already, create a new branch that you'll make your changes on.
2. Navigate to the file, src/views/NotFound.vue
3. Edit the relevant content.
4. Follow the steps to submit your PR.

sdfawefawerf

When you go to the feedback page and select a subject, there are 3 default options. These need to be renamed.

Steps to accomplish the task:

1. If you haven't done already, create a new branch that you'll make your changes on.
2. Navigate to the file, src/views/Feedback.vue
3. On line 13, there will be a list of options which you need to modify. Change it to:

 :options="{
        suggestion: 'Suggestion', 
        bug: 'Something's not quite right', 
        compliment: 'Compliment'
    }"

4. Follow the steps to submit your PR.