clueless-community / clueless-official-website Goto Github PK

Hey! I found your website quite interesting however as a web developer and designer, I think you should have a "Back to top" button or icon on home page.

Also, I found a small UI error in your website.
Take a look at the below screenshots

Before:

After:

I would like to do this changes. Assign this issue to me!

See the Figma file Link Link Figma

And Only build the Upcoming Events section now!

Build the admin dashboard in the Figma design.

Page Name : Dashboard

Figma Link

Tracking issue for:

• https://github.com/Clueless-Community/clueless-official-website/security/code-scanning/26

There should be a field named event mode with offline/online options

Icons are overlapping in the What is Clueless Section for 14-inch Laptop Screens

Just separate the icons so that it does look good for all screen sizes 👍️

the social icons are looking good with margin but for the small sized screen they are coming unaligned

I can change it to

please assign this to me.

Add (https://github.com/Clueless-Community/clueless-official-website/blob/main/CODE_OF_CONDUCT.md) href to the link tag in the Read More button also make sure that it opens in new Tab.

Implementation of sign in option using Github and Twitter

As you can see from the screenshot attached below, The uniformity in the layout needs to be maintained.

play with the width or padding to fix this issue 👍️

Before deleting a project from the Admin panel of a user. There should be a confirmation pop-up if he wants to delete it or not!

You can see pop-ups build by @Debajyoti14 in the components section. (Use the same code pass the id there and delete it.)

@Kingshuk3006

• What is Clueless? With some pictures.
• What is our aim?
• People working on it.
• Link to projects we are building under ClueLess
• A link to how to set up this project in the local System. (If Someone wants to contribute) . That readme will be built by @Debajyoti14 probably.

Just need to revamp the UI of the Project Admin card.

Need to implement this design.

Here is a link to the Figma File.
Figma File

Tracking issue for:

• https://github.com/Clueless-Community/clueless-official-website/security/code-scanning/25

I want to add a good looking scrollbar in the website, which would match with the theme of the website, incorporating linear gradient color pattern in the scrollbar.

We need to improve the modals as well in the Figma design.

Here is link to the Figma File. (Page name Popups in High Fidelity)

Figma File Link ◀️

Need some Spacing here. at different screen sizes.

And also here.

We need to get this event card perfect by today!

We need a loader for the edit event menu. @Kingshuk3006

Upcoming Events Card Responsive issue for Mobile View

• Make a different layout for UpcomingEvent below 1024px

• adjust speaker name size for mobile screen

• Right side of the mobile view padding needs to be adjusted

• All blue button checks only blue-btn class should be there

[event_id] page

• Instructor/speaker grid should be responsive properly

Footer

• Make properly Responsive

Events Page

• for screen between 600-1024px padding in X needed to be reduced

The Avatar and the hamburger menu should not be together in the Navbar in the mobile View!

Also we need to ass that section to the below of the Hamburger menu where all info of the User will be shown!

1. Top & Bottom spacing of Guidelines needed to fix appropriately.

2. The bottom padding needs to be fixed.

3. The space between Read More button & SVG needs to be increased.

Don't forget to remove all the imports of the dummy data files otherwise, deployment is going to crash.

At present, there is no issue template in the clueless-official-website as well as other repositories of Clueless-Community.
In order for beginners in the field of OpenSource to enjoy working together, we need an Issue template.
Adding an issue template would promote Contribution as well as will make the work easy for maintainers to read the issues.

If this issue sounds valid, I would love to work on this issue😊.

Admins can only view the pages under the admin route and can only add edits or see the admin panel.

When no event data is there, there should be an empty state stating "There are no Events currently" alongside an SVG.

Populate data of autocomplete in edit profile section

• Tech stacks
• Collage names

After successful registration the Register button should change to View Ticket.

And on Clicking that a modal should appear with all the ticket Info. And should we have the QR code there? @Debajyoti14 The QR code will contain only the ticket Reference.

Here is the Figma File Link

Fix that @Debajyoti14 and if possible clean the UI a bit.

🐞 Problem
I saw Your Website or I thought that we can improve navbar better and toggle button for day and night theme.🎗

🎯 Goal
And this change will be very helpful for you , by changing this thing, your website will start looking user friendly, whoever will visit your website , will going to feel that what a cool website.

💡 Possible solutions
we can change the navbar styling by adding day and night theme.👌
We can change the background color in linear gradient color.
we can make changes in fonts and the styling of text.

I will be really happy if you can make this changes in the website.

Thank you.😊

This page edits the data of the existing event.

This is a cool one to do because it has some cool front-end as well as some backend and logical things going on!

Ask @Debajyoti14 if you need help in this one.

And you can take a reference of the edit profile page to get how these types of things are done. We need to get this done before Tuesday!

@Kingshuk3006

Hey, I was visiting the website and one of the first things I noticed is that the 'Join Discord' button has no border radius as opposed to every other button on the website. So I would like to add some radius to the borders.

Also, the "Explore Events" button has no icon. So I would like to add an icon to maintain uniformity.

The screenshot is attached below.

I would like to work on these issues under Hacktoberfest 2022. Can I start working on this?

There should be two different cards AdminEvent card and a normal event card. @Kingshuk3006

Two routes also :

• /admin/events should show the AdminEvent Card where would be functionalities like Edit and Delete events
• /events route should have a normal event card with only a view option for normal users.

There should be a delete button also so that admins can delete the Event as well.

Add a modal also for confirming deletion and ask them to write DELETE before the delete button becomes enabled and he could delete the event.

The Header should be Clueless | Events for the all events page and for a particular Event page, this should be [The event name]. And when shared that page should also show the Logo of the event.\

Here is a reference for what you need to change!

Just need to revamp the UI of the Profile Section.

Need to implement this design.

Here is a link to the Figma File.
Figma File

Note : This will be done after the Project Admin card and Project Card UI is done.

The button present here doesn't redirect to any particular link. Need to add this as the link of that button.

Just need to revamp the UI of the Add project.

Need to implement this design.

Here is a link to the Figma File.
Figma File

You can check out the Figma file for checking.

Page name: Event Description.

Figma Link

@Roshaen

In the contact us form there is no check. Users can only contact when they are signed In and fill all the fields in the form.

Till then the button should be disabled.

I guess you can do it @Kingshuk3006

There is more spacing and the UI looks much more neat and clean in design. @Kingshuk3006

Just need to revamp the UI of the Project card.

Need to implement this design.

Here is a link to the Figma File.
Figma File

From 768px to 1024px, The Techstack icons needs to be center alligned

Issue: All the cards under the projects sections are overlapping over one another
Screenshot:

Recommended Solution:
Reduce the width of the cards at full screen to stop the overlapping

After adding the project snack bar is not dismissed!

The whole UI is build with Tailwind CSS and Material UI. All you need to do is write the main logic of dark mode in a .ts file and implement a button that changes the whole website mode to dark mode.

There will be three type of modes.

• Dark mode
• Light mode
• System Default

The actual conversion from light to dark mode will be done separately. You just need to make the button that changes the mode with a small example.

You can checkout this documents for help : Tailwind CSS Dark mode

See this @Debajyoti14 @Kingshuk3006

Find a better SVG that matches the theme of the website and replace it with the previous one so that it goes well with the dark background.

Write a proper note on how one can set up this project in his local machine.

We don't need to give the env there but we can ask them to drop a mail to the Official ClueLess email for the env and we will send the env after validation.

See the documentation of Booklee to know how to document the env part.