mirror of
https://github.com/freeCodeCamp/freeCodeCamp.git
synced 2026-05-28 18:26:54 +00:00
fix(curriculum): Updated field label for better readability (#65104)
Co-authored-by: Muhammad R <muhammad.rizwan@tryhackme.com>
This commit is contained in:
+3
-3
@@ -9,7 +9,7 @@ dashedName: step-9
|
||||
|
||||
Now it is time to add the form elements to collect the parent's information.
|
||||
|
||||
Start by adding a `label` element with the text `Parent/Guardian Information: ` and `for` attribute set to `"parent-name"`.
|
||||
Start by adding a `label` element with the text `Parent/Guardian Name: ` and `for` attribute set to `"parent-name"`.
|
||||
|
||||
Then, below your `label` element, add an `input` element with the `type` attribute set to `"text"`. The `name` and `id` attributes should be set to `"parent-name"`. The `placeholder` attribute should be set to `"E.g., Nancy Doe"`. Lastly, your `input` should be required.
|
||||
|
||||
@@ -21,10 +21,10 @@ You should have a total of three `label` elements on the page.
|
||||
assert.lengthOf(document.querySelectorAll("label"), 3);
|
||||
```
|
||||
|
||||
Your third `label` element should have the text `Parent/Guardian Information: `. Don't forget the space after the colon.
|
||||
Your third `label` element should have the text `Parent/Guardian Name: `. Don't forget the space after the colon.
|
||||
|
||||
```js
|
||||
assert.match(code, /Parent\/Guardian\s+Information:\s+<\/label>/);
|
||||
assert.match(code, /Parent\/Guardian\s+Name:\s+<\/label>/);
|
||||
```
|
||||
|
||||
Your third `label` element should have a `for` attribute.
|
||||
|
||||
+1
-1
@@ -76,7 +76,7 @@ assert.strictEqual(document.querySelector("fieldset:last-of-type legend")?.inner
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -136,7 +136,7 @@ assert.isTrue(input?.hasAttribute("checked"));
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -123,7 +123,7 @@ assert.exists(document.querySelector("fieldset:last-of-type input[id='phone'].co
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -87,7 +87,7 @@ assert.equal(legend?.innerText?.trim(), 'Additional Notes');
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -119,7 +119,7 @@ assert.strictEqual(textarea?.getAttribute("cols"), "50");
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -85,7 +85,7 @@ assert.strictEqual(button?.innerText, "Submit Form");
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -79,7 +79,7 @@ assert.equal(style?.color, 'whitesmoke');
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -78,7 +78,7 @@ assert.strictEqual(style?.backgroundColor, 'rgba(255, 255, 255, 0.1)')
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -89,7 +89,7 @@ assert.strictEqual(style?.margin, '20px auto')
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -68,7 +68,7 @@ assert.strictEqual(style?.padding, '10px 20px')
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -70,7 +70,7 @@ assert.strictEqual(style?.getPropVal('box-shadow'), 'black 0px 5px 15px');
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -70,7 +70,7 @@ assert.strictEqual(style?.textAlign, 'center')
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -68,7 +68,7 @@ assert.strictEqual(style?.fontSize, '1.2rem')
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -91,7 +91,7 @@ assert.strictEqual(style?.padding, '20px');
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -91,7 +91,7 @@ assert.strictEqual(style?.fontWeight, '600');
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -70,7 +70,7 @@ assert.strictEqual(style?.fontSize, '1.2rem');
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -80,7 +80,7 @@ assert.strictEqual(style?.margin, '10px 0px');
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -102,7 +102,7 @@ assert.strictEqual(style?.padding, '10px');
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -70,7 +70,7 @@ assert.strictEqual(style?.color, 'whitesmoke');
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -70,7 +70,7 @@ assert.strictEqual(style?.appearance, 'none');
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -91,7 +91,7 @@ assert.oneOf(style?.border, ['2px solid gray', '2px solid grey']);
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -72,7 +72,7 @@ assert.strictEqual(style?.verticalAlign, 'bottom');
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -100,7 +100,7 @@ assert.strictEqual(style?.borderRadius, '50%');
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -79,7 +79,7 @@ assert.oneOf(style?.transition, ['0.3s ease-in', 'all 0.3s ease-in 0s'])
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -81,7 +81,7 @@ assert.strictEqual(style?.backgroundColor, 'lightgreen');
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -105,7 +105,7 @@ assert.strictEqual(style?.padding, '12px 20px');
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+1
-1
@@ -82,7 +82,7 @@ assert.strictEqual(style?.margin, 'auto');
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
+2
-2
@@ -70,7 +70,7 @@ assert.strictEqual(style?.backgroundColor, 'midnightblue');
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
@@ -260,7 +260,7 @@ textarea {
|
||||
|
||||
<fieldset>
|
||||
<legend>Parent/Guardian Information</legend>
|
||||
<label for="parent-name">Parent/Guardian Information: </label>
|
||||
<label for="parent-name">Parent/Guardian Name: </label>
|
||||
<input
|
||||
type="text"
|
||||
name="parent-name"
|
||||
|
||||
Reference in New Issue
Block a user