Adding hovering effect in buttons and CAFE photos

assign me with this , i wanna work in this >>

We can align the social media icons to the coffee-bean logo so they will look good and more attractive to users

A slight hovering effect on menu section will beautify the website.
A slight animation effect on the same section will also do the same. etc

I think the buttons of carousel is lil bit close to the frame, we can make them more interesting and beautiful.

Hi, this website looks cool but the footer can be improved. I want to work on it. Please assign me this issue.

As we can see navbar is not looking good on screen with smaller width (small than 1000px). So we can make navbar and other things more responsive. I am ready to work on it. please assign me (under hacktober fest).
Thank You.

Issue Summary:

I'd like to propose two design improvements to enhance the project's visual appeal and user experience.

1. Alignment of .nav-item:

• Currently, the .nav-item elements in the navigation bar are not aligned with the .navbar-brand. This misalignment affects the overall aesthetics. Aligning them could create a more polished appearance.

2. Setting Title Height:

• To make the project's title more prominent and visually appealing, we could consider adjusting the title's height. This change may give it a significant presence on the page and provide a more visually engaging introduction.

These design enhancements are meant to enhance the project's overall look and feel.

Request:

I kindly request to review these proposed design improvements and consider assigning the task to me for implementation.

Thank you!!

We can make the login page more suitable to our website

Hey the website is cool, but DOUBLE ESPRESSO's image is not available. Please assing me this issue I can change it and make it more appealing.

i think the two buttons cancel and send are not user friendly so i will make it user friendly and more interactive by changing the positions and add will hover effect in it

The data interval of the dynamically changing testimonial caraousel is less than 2 second which makes it hard to read .

So we need to modify the data interval so that it would be more easier to read and also increases the user-friendliness.

I would like to work on this issue , So please assign me.

I would like to add login and sign up pages in website.
please assign me with this.

Thankyou.

To change the twitter icon from the "Twitter bird " to "X"

A small bug as you can clearly see in the image shown above, between the width of 1000px to 1300px overflow of heading is happening.
I am working on this please assign it to me under hactober fest label (2023).
Thank You

Hi 😀,
I've noticed the testimonial session could be better centered and have its padding properties adjusted. Could I go ahead and collaborate with such improvements?

In large screen, the card-image is not well centered like this:

We can make this section even more attractive by using some animations or some other CSS styling.

in the order section
The Total Order price needs to be a little larger

I think it will add more clarity to the user

I think the image alignment in the menu card items is a bit wrong. I think it will be centre-aligned or cover the entire width properly like standard menu items.

You can assign it to me in accordance with Hacktoberfest ! I'll find a fix.

Before filling the essential credentials of the payment gateway, it pops the Success Payment in the credit card option alongwith the popup of "Please fill out this field" . The screenshot of the problem has been attached below :

Bugs to be fixed in the code so that it only shows the "Please fill out this field" when anything is blank.

Please assign to fix the bugs

I want to add a better alert system which looks much more beautiful than the old default javascript when we click the buttons. Please assign me this issue.

In the project, the navbar links are not working
Like : If I click on the Contact button, I should go to the Contact page, similarly for other buttons also
I have implemented it, If u assign the project to me I will be able to go for the PR

@maitri-vv

The color combination of the text in the navigation bar is very dull. The text is not visible. As a graphic designer I suggest to change the color that will suit the background and easily readable

There is an error in the console

Description

• The feature is about to improve the accessibility of Coffee Bean Website's Footer section

• I'm going to add important attributes like aria-label for social anchors (links like Github) which are placed on Social media section.

• it is important to note that we want to add the title attribute also. This is because the title attribute is intended to provide additional information to screen reader users.

• The aria-label attribute is a way more important for providing accessibility information to screen reader users. The aria-label attribute is an Accessible Rich Internet Applications (ARIA) attribute that can be used to provide a label for an element. This label is then read aloud by screen readers, providing additional information about the element to the user.

• In general, the aria-label & title attributes are preferred for providing accessibility information to screen reader users.

• You can consider to assign this issue to me to make the site accessible for screen readers

Screenshots (Changes are going to made for these elements)

Additional context

• I'm a Hacktoberfest23 Contributor

As we can see, the navbar is not matched with our theme. We can enhance the NavBar

Hi

I noticed that the coffee website currently lacks a favicon. A favicon is a small but essential element for a website, as it helps with branding and improves user experience. @yash19sinha

ASSIGN ME THIS ISSUE UNDER HACTOBERFEST TAG.

I want to work on these:-

1. Create hovering effect in menu section div
2. maintain the width of typewriter animation effect etc

Description

• Transition is not properly applied for Navigational links during Hover.

Screenshots 📸

CURRENT STATE
DESIRED STATE

This will make it easy for users to search for products.

I noticed the number size that is infront of total is much less. As the value written their is total of all so it should be bigger in size

we have some non using Scroll JavaScript

in AMERICANO

A dynamically changing carousel will make section of Testimonial even more eye-catching, also the heading will lead people reading it even more carefully

Description:

Issue 1: Small Gap between Title and Feature Sections

There is a minor gap between the title section and the feature section on different screen heights due to not defining a heights.

Issue 2: Poor Text-Background Color Contrast:

The contrast ratio between text and background colors seems to be inadequate, with a score of 2.11 on coolors.com.

Issue 3: Semantic Errors and Deprecated Elements

• The following semantic and markup issues have been identified:

• The h3 element should not be placed inside a span.

• The lang attribute is missing, which is important for language specification.

• Some sections lack proper headings for improved accessibility.

• Incorrect values for width and height have been used in img tags.

• The center element is deprecated and should not be used.

• Meta tags for responsive web design and specifying compatibility with the latest Internet Explorer version are missing.

• anchor element in the footer should be enclosed within a ul for better structure.

• Media queries are not properly defined, affecting responsiveness.

Issue 4: JavaScript Variable Declaration

The JavaScript code is using the var keyword for variable declaration, which can lead to scope-related issues and is considered outdated. Consider using let and const for variable declarations to enhance code quality and avoid potential bugs.

##You can assign me the issues under Hactoberfest Tag.

The navbar can be improved for Mobile View
I can work on that, kindly assign me this issue under hacktoberfest label.

Hey there I would like to work on your repo to change and enhance the color and fonts and even add more content. Please assign this issue under hacktoberfest

Thank You :)

To make this static website more engaging, we can have a random coffee quote every time a user loads up the page. I can work on it if given the chance! 😄

I think there is an alignment issue on the payments page >>>

A simple color animation in headings is needed to beautify the page more. (Maintaining the theme of the website).
Hovering effect on buttons is also needed.(Maintaining the responsiveness of the website).

Footer section need to enhancement.

Issue

The Starbucks logo is not proper; it has lesser width and the logo looks too compressed from the sides. It is also not the original Starbucks logo (there is no black colour).
Additionally, while all the other three logos have a white background, the Costa-coffee logo does not, which makes it look non-uniform.

Logos originally:

Fix

Updated the photos to make them look uniform.

I've noticed the website doesn't have a scroll to top type of button on the bottom and it's scrolling is static, not smoother. I can fix it.

The yellow and green dots are aligned properly, but the red dot is not.