-
Notifications
You must be signed in to change notification settings - Fork 625
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
added task solution #790
base: master
Are you sure you want to change the base?
added task solution #790
Conversation
LabPetro
commented
May 17, 2023
- DEMO LINK
- TEST REPORT LINK
src/style.css
Outdated
@@ -1 +1,12 @@ | |||
/* styles go here */ | |||
.duo { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Use a more descriptive class name instead of 'duo'. For example, 'form-group'.
src/style.css
Outdated
margin-bottom: 20px; | ||
} | ||
|
||
.quads { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Use a more descriptive class name instead of 'quads'. For example, 'form-block'.
src/index.html
Outdated
id="review" | ||
name="rating" | ||
step="1" | ||
max="0" |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
src/index.html
Outdated
class="duo" | ||
type="text" | ||
id="surname" | ||
name="info" |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The name attribute should be more descriptive, e.g. 'surname' instead of 'info'.
src/index.html
Outdated
class="duo" | ||
type="text" | ||
id="name" | ||
name="information" |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The name attribute should be more descriptive, e.g. 'name' instead of 'information'.
src/index.html
Outdated
<input | ||
class="duo" | ||
type="text" | ||
id="surname" | ||
name="info" | ||
autocomplete="off" |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Check the code style everywhere
<input | |
class="duo" | |
type="text" | |
id="surname" | |
name="info" | |
autocomplete="off" | |
<input | |
class="duo" | |
type="text" | |
id="surname" | |
name="info" | |
autocomplete="off" |
src/index.html
Outdated
|
||
<div class="duo"> | ||
<label for="cat">Do you love cats?</label> | ||
<input |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Add a label to each radio button. It doesn't work correctly now
Screen.Recording.2023-05-17.at.13.49.21.mov
src/index.html
Outdated
</div> | ||
|
||
</fieldset> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
</div> | |
</fieldset> | |
</div> | |
</fieldset> |
src/index.html
Outdated
<button | ||
type="submit" | ||
> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
<button | |
type="submit" | |
> | |
<button type="submit"> |
src/style.css
Outdated
margin-bottom: 10px; | ||
} | ||
|
||
fieldset { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Use classes for styling
src/index.html
Outdated
<label for="yes">Yes</label> | ||
<input | ||
id="yes" | ||
type="radio" | ||
name="pet" | ||
value="yes" | ||
> | ||
<label for="no">No</label> | ||
<input | ||
id="no" | ||
type="radio" | ||
name="pet" | ||
value="No" | ||
> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
<label for="yes">Yes</label> | |
<input | |
id="yes" | |
type="radio" | |
name="pet" | |
value="yes" | |
> | |
<label for="no">No</label> | |
<input | |
id="no" | |
type="radio" | |
name="pet" | |
value="No" | |
> | |
<label> | |
<input | |
id="yes" | |
type="radio" | |
name="pet" | |
value="yes" | |
> | |
Yes | |
</label> | |
<label> | |
<input | |
id="no" | |
type="radio" | |
name="pet" | |
value="No" | |
> | |
No | |
</label> |
You can wrap it into label tag to fix previous comment
src/index.html
Outdated
<input type="range" | ||
id="review" | ||
name="rating" | ||
step="1" | ||
value="0" | ||
min="0" | ||
max="5" | ||
> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
<input type="range" | |
id="review" | |
name="rating" | |
step="1" | |
value="0" | |
min="0" | |
max="5" | |
> | |
<input | |
type="range" | |
id="review" | |
name="rating" | |
step="1" | |
value="0" | |
min="0" | |
max="5" | |
> |
src/index.html
Outdated
<textarea name="write" | ||
id="comments" | ||
autocomplete="off" | ||
required | ||
></textarea> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
<textarea name="write" | |
id="comments" | |
autocomplete="off" | |
required | |
></textarea> | |
<textarea | |
name="write" | |
id="comments" | |
autocomplete="off" | |
required | |
></textarea> |
src/index.html
Outdated
<option value="answer">Yes</option> | ||
<option value="answer">No</option> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
<option value="answer">Yes</option> | |
<option value="answer">No</option> | |
<option value="yes">Yes</option> | |
<option value="no">No</option> |
<form | ||
action="https://mate-academy-form-lesson.herokuapp.com/create-application" | ||
method="post"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
<form | |
action="https://mate-academy-form-lesson.herokuapp.com/create-application" | |
method="post"> | |
<form | |
action="https://mate-academy-form-lesson.herokuapp.com/create-application" | |
method="post" | |
> |
|
||
<fieldset class="container"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Don't add spaces between parent and child components