My Name is Jesus, I am from Venezuela, I am a systems engineering graduate, and a few months ago I began to inquire about web development and the truth is that I totally fell in love. I have the basic knowledge to start my path in the Front End that is why I want to perfect my skills
Latest solutions
Todo App with React+Sass+Material UI
#accessibility#bem#material-ui#sass/scss#emotionSubmitted over 1 year ago
Latest comments
- @NappS5Submitted over 1 year ago@jesusleonel10Posted over 1 year ago
Hello
You can add a hover effect to the submit button
It is recommended that the labels for the number buttons be made with radio-type input, this implies that it has its respective form label and its submit button, with this the browser understands your code better and is more accessible to everyone, including easier to take the value of the button in javascript
🤓✌
Marked as helpful0 - @NaimurRahman00Submitted over 1 year ago@jesusleonel10Posted over 1 year ago
Hello
I like the effect when first loading the component.
Although the hover effect is not bad, moving the entire component makes it less readable (but this is my personal opinion)
I can comment that it would be good that the labels for the buttons are radio type input with their respective form labels and submit button, this will make it more accessible.
🤓✌
0 - @barbare999Submitted over 1 year ago@jesusleonel10Posted over 1 year ago
Here are some suggestions for you to consider:
▪ To make it as accessible as possible use input radio for the numbers.
Here you can read about how to hide them:
https://www.sarasoueidan.com/blog/inclusively-hiding-and-styling-checkboxes-and-radio-buttons/
▪ Likewise make the button submit type and both the button and the inputs are inside a form ▪ Make sure that only one score can be checked at a time ▪ Make sure that the hover effect only applies to the element that is being pointed ▪ Finally make sure to keep the proportion of the size of the buttons in smaller resolutions, for this you can assign a relative or absolute value of width and height.
🤓✌
Marked as helpful0 - @ThatDevDiazSubmitted over 1 year ago@jesusleonel10Posted over 1 year ago
Hello
Check the functions that are in charge of displaying the text of the inputs, in the cards.
One way to do it would be:
- Select each input (array)
- Select each element of the card (array)
- With the event 'input' (which is executed every time there is a change) you show the same value of the input, in the previously selected card.
This is how you display the input text on the cards in real time.
Information on how the input event works 🔽🔽🔽🔽 https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event
0 - @Yakobus-MardiSubmitted over 1 year ago@jesusleonel10Posted over 1 year ago
Hello!
- You can have only one score selected (only one number) - And to make it more accessible, you can use input radios for each number.
- In this post you can read about how to hide the inputs but keeping the accessibility
▶ https://www.sarasoueidan.com/blog/inclusively-hiding-and-styling-checkboxes-and-radio-buttons/
- Also make the main button type submit
🤓✌
Marked as helpful1 - @DanielheppenstielSubmitted over 1 year ago@jesusleonel10Posted over 1 year ago
Greetings I can suggest you some things:
- When marking the task as completed it would be better not to delete it
- It is a good idea to place a button in a text field to add the new task
- The button (circle) of each task to make it more accessible would be better if it was a checkbox, as well as the active, all and completed buttons should be input radios.
I hope I have helped you 🤓✌
0