feat: Added step 38 and updated 39 for calorie counter project (#56687)

Co-authored-by: Naomi <accounts+github@nhcarrigan.com>
This commit is contained in:
Kamal Singh
2024-10-17 15:52:04 +05:30
committed by GitHub
parent be6002f62e
commit 4524a11e57
61 changed files with 402 additions and 178 deletions

View File

@@ -157,240 +157,244 @@
"title": "Step 37"
},
{
"id": "63bf5cf03b50bf36cfbe94ea",
"id": "670ea2c4f42def724c77e3c7",
"title": "Step 38"
},
{
"id": "63c1dfbd56c71e278800010c",
"id": "63bf5cf03b50bf36cfbe94ea",
"title": "Step 39"
},
{
"id": "63c1e0af28078f2dfad9eb3e",
"id": "63c1dfbd56c71e278800010c",
"title": "Step 40"
},
{
"id": "63c1e1965a898d302e0af4e3",
"id": "63c1e0af28078f2dfad9eb3e",
"title": "Step 41"
},
{
"id": "63c1e5b4b3c8a031def3bd65",
"id": "63c1e1965a898d302e0af4e3",
"title": "Step 42"
},
{
"id": "63c1e704ee12703347625900",
"id": "63c1e5b4b3c8a031def3bd65",
"title": "Step 43"
},
{
"id": "63c2164c0df38a382062c4af",
"id": "63c1e704ee12703347625900",
"title": "Step 44"
},
{
"id": "63c216da562fbb3957b9cb2c",
"id": "63c2164c0df38a382062c4af",
"title": "Step 45"
},
{
"id": "63c2171c1e5b6e3aa51768d0",
"id": "63c216da562fbb3957b9cb2c",
"title": "Step 46"
},
{
"id": "63c21774193de43bbc6a769f",
"id": "63c2171c1e5b6e3aa51768d0",
"title": "Step 47"
},
{
"id": "63c217ccd939053ce4fa16d6",
"id": "63c21774193de43bbc6a769f",
"title": "Step 48"
},
{
"id": "63c21839f56eaf3ef4e027c4",
"id": "63c217ccd939053ce4fa16d6",
"title": "Step 49"
},
{
"id": "63c2187f55eb0f400269568f",
"id": "63c21839f56eaf3ef4e027c4",
"title": "Step 50"
},
{
"id": "63c218c028c56a411b2a379a",
"id": "63c2187f55eb0f400269568f",
"title": "Step 51"
},
{
"id": "63c21dea919c8e4adb0df8e8",
"id": "63c218c028c56a411b2a379a",
"title": "Step 52"
},
{
"id": "63c2194dce265f429300c8b1",
"id": "63c21dea919c8e4adb0df8e8",
"title": "Step 53"
},
{
"id": "63c21c17fa8fd6447ff0389d",
"id": "63c2194dce265f429300c8b1",
"title": "Step 54"
},
{
"id": "63c21cd2c34541469f5700a9",
"id": "63c21c17fa8fd6447ff0389d",
"title": "Step 55"
},
{
"id": "63c21d4f48267a47c2946788",
"id": "63c21cd2c34541469f5700a9",
"title": "Step 56"
},
{
"id": "63c8ab51214c8c1f1b9a49f7",
"id": "63c21d4f48267a47c2946788",
"title": "Step 57"
},
{
"id": "63c8ad0cd8f1e5201c4ef2e4",
"id": "63c8ab51214c8c1f1b9a49f7",
"title": "Step 58"
},
{
"id": "63c8b0187cceff21c8389543",
"id": "63c8ad0cd8f1e5201c4ef2e4",
"title": "Step 59"
},
{
"id": "63c8be904ffff922f3c6f8d0",
"id": "63c8b0187cceff21c8389543",
"title": "Step 60"
},
{
"id": "63c8c00bfb671b23f9de4159",
"id": "63c8be904ffff922f3c6f8d0",
"title": "Step 61"
},
{
"id": "63c8c15fd337ad24b9b68049",
"id": "63c8c00bfb671b23f9de4159",
"title": "Step 62"
},
{
"id": "63c9bc53735149084390e5d0",
"id": "63c8c15fd337ad24b9b68049",
"title": "Step 63"
},
{
"id": "63c9bcc26219e7090da0f549",
"id": "63c9bc53735149084390e5d0",
"title": "Step 64"
},
{
"id": "63c9bce376ca4f09c15a3768",
"id": "63c9bcc26219e7090da0f549",
"title": "Step 65"
},
{
"id": "63c9bdd916e0c10af01ed8d7",
"id": "63c9bce376ca4f09c15a3768",
"title": "Step 66"
},
{
"id": "63c9be334f4a050c0b94bc93",
"id": "63c9bdd916e0c10af01ed8d7",
"title": "Step 67"
},
{
"id": "63c9bef7fec05c0d38853828",
"id": "63c9be334f4a050c0b94bc93",
"title": "Step 68"
},
{
"id": "63c9bf80558d780e848b2987",
"id": "63c9bef7fec05c0d38853828",
"title": "Step 69"
},
{
"id": "63c9c09a7daa4f0ff92c4023",
"id": "63c9bf80558d780e848b2987",
"title": "Step 70"
},
{
"id": "63c9c0d0857f0a10a57af936",
"id": "63c9c09a7daa4f0ff92c4023",
"title": "Step 71"
},
{
"id": "63c9c11a0a090311dff55564",
"id": "63c9c0d0857f0a10a57af936",
"title": "Step 72"
},
{
"id": "63c9c16dd75dd212dc12363c",
"id": "63c9c11a0a090311dff55564",
"title": "Step 73"
},
{
"id": "63c9c1ef134f3513e751c975",
"id": "63c9c16dd75dd212dc12363c",
"title": "Step 74"
},
{
"id": "63c9e3a83bb3e61a80eea564",
"id": "63c9c1ef134f3513e751c975",
"title": "Step 75"
},
{
"id": "63c9e45519caf31b987fbb5f",
"id": "63c9e3a83bb3e61a80eea564",
"title": "Step 76"
},
{
"id": "63c9e4d2ff41811dd640504f",
"id": "63c9e45519caf31b987fbb5f",
"title": "Step 77"
},
{
"id": "63c9e51b3a007a1eba1cd0f6",
"id": "63c9e4d2ff41811dd640504f",
"title": "Step 78"
},
{
"id": "63c9e55b4b06c11fff555c64",
"id": "63c9e51b3a007a1eba1cd0f6",
"title": "Step 79"
},
{
"id": "63c9e5eea8261d22856ead1c",
"id": "63c9e55b4b06c11fff555c64",
"title": "Step 80"
},
{
"id": "63c9e63bb1e32d23b6adbe44",
"id": "63c9e5eea8261d22856ead1c",
"title": "Step 81"
},
{
"id": "63c9e6b7c0303524af2d0bc2",
"id": "63c9e63bb1e32d23b6adbe44",
"title": "Step 82"
},
{
"id": "63c9e769df38c92635c158ba",
"id": "63c9e6b7c0303524af2d0bc2",
"title": "Step 83"
},
{
"id": "63c9e7d5b21eee2776ecc226",
"id": "63c9e769df38c92635c158ba",
"title": "Step 84"
},
{
"id": "63c9e84c9fe8ca28c4101189",
"id": "63c9e7d5b21eee2776ecc226",
"title": "Step 85"
},
{
"id": "63c9e8fe3a6f022a05a04675",
"id": "63c9e84c9fe8ca28c4101189",
"title": "Step 86"
},
{
"id": "63c9e94e9df7d72aed1c24bd",
"id": "63c9e8fe3a6f022a05a04675",
"title": "Step 87"
},
{
"id": "63c9ea23dbadbf2c2764e3f5",
"id": "63c9e94e9df7d72aed1c24bd",
"title": "Step 88"
},
{
"id": "63c9ea9b16430f2d54522464",
"id": "63c9ea23dbadbf2c2764e3f5",
"title": "Step 89"
},
{
"id": "63c9eb09bcfaa72e3da820a1",
"id": "63c9ea9b16430f2d54522464",
"title": "Step 90"
},
{
"id": "63c9eb4a5d68f12f32d9b440",
"id": "63c9eb09bcfaa72e3da820a1",
"title": "Step 91"
},
{
"id": "63c9ebb7b12bca3025b0a935",
"id": "63c9eb4a5d68f12f32d9b440",
"title": "Step 92"
},
{
"id": "63c9ec044acedf312c4974ff",
"id": "63c9ebb7b12bca3025b0a935",
"title": "Step 93"
},
{
"id": "63c9f24afbc9cf324dcaa9a4",
"id": "63c9ec044acedf312c4974ff",
"title": "Step 94"
},
{
"id": "63c9f28bda3e3f336e21b6b4",
"id": "63c9f24afbc9cf324dcaa9a4",
"title": "Step 95"
},
{
"id": "63c9f2bff625af342023512c",
"id": "63c9f28bda3e3f336e21b6b4",
"title": "Step 96"
},
{
"id": "63c9f2bff625af342023512c",
"title": "Step 97"
}
]
}

View File

@@ -1,16 +1,24 @@
---
id: 63bf5cf03b50bf36cfbe94ea
title: Step 38
title: Step 39
challengeType: 0
dashedName: step-38
dashedName: step-39
---
# --description--
Now that you have finished testing the value of `entryDropdown.value`, you can remove the `console.log` statement.
Your next step is to allow users to add entries to the calorie counter. Declare an empty function `addEntry`. This function should not take any parameters.
# --hints--
You should remove the `console.log` statement.
```js
assert.notMatch(code, /console\.log\s*\(.*\)/)
```
You should declare an `addEntry` function.
```js
@@ -207,6 +215,6 @@ function isInvalidInput(str) {
}
--fcc-editable-region--
console.log(entryDropdown.value)
--fcc-editable-region--
```

View File

@@ -1,8 +1,8 @@
---
id: 63c1dfbd56c71e278800010c
title: Step 39
title: Step 40
challengeType: 0
dashedName: step-39
dashedName: step-40
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c1e0af28078f2dfad9eb3e
title: Step 40
title: Step 41
challengeType: 0
dashedName: step-40
dashedName: step-41
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c1e1965a898d302e0af4e3
title: Step 41
title: Step 42
challengeType: 0
dashedName: step-41
dashedName: step-42
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c1e5b4b3c8a031def3bd65
title: Step 42
title: Step 43
challengeType: 0
dashedName: step-42
dashedName: step-43
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c1e704ee12703347625900
title: Step 43
title: Step 44
challengeType: 0
dashedName: step-43
dashedName: step-44
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c2164c0df38a382062c4af
title: Step 44
title: Step 45
challengeType: 0
dashedName: step-44
dashedName: step-45
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c216da562fbb3957b9cb2c
title: Step 45
title: Step 46
challengeType: 0
dashedName: step-45
dashedName: step-46
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c2171c1e5b6e3aa51768d0
title: Step 46
title: Step 47
challengeType: 0
dashedName: step-46
dashedName: step-47
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c21774193de43bbc6a769f
title: Step 47
title: Step 48
challengeType: 0
dashedName: step-47
dashedName: step-48
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c217ccd939053ce4fa16d6
title: Step 48
title: Step 49
challengeType: 0
dashedName: step-48
dashedName: step-49
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c21839f56eaf3ef4e027c4
title: Step 49
title: Step 50
challengeType: 0
dashedName: step-49
dashedName: step-50
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c2187f55eb0f400269568f
title: Step 50
title: Step 51
challengeType: 0
dashedName: step-50
dashedName: step-51
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c218c028c56a411b2a379a
title: Step 51
title: Step 52
challengeType: 0
dashedName: step-51
dashedName: step-52
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c2194dce265f429300c8b1
title: Step 53
title: Step 54
challengeType: 0
dashedName: step-53
dashedName: step-54
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c21c17fa8fd6447ff0389d
title: Step 54
title: Step 55
challengeType: 0
dashedName: step-54
dashedName: step-55
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c21cd2c34541469f5700a9
title: Step 55
title: Step 56
challengeType: 0
dashedName: step-55
dashedName: step-56
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c21d4f48267a47c2946788
title: Step 56
title: Step 57
challengeType: 0
dashedName: step-56
dashedName: step-57
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c21dea919c8e4adb0df8e8
title: Step 52
title: Step 53
challengeType: 0
dashedName: step-52
dashedName: step-53
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c8ab51214c8c1f1b9a49f7
title: Step 57
title: Step 58
challengeType: 0
dashedName: step-57
dashedName: step-58
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c8ad0cd8f1e5201c4ef2e4
title: Step 58
title: Step 59
challengeType: 0
dashedName: step-58
dashedName: step-59
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c8b0187cceff21c8389543
title: Step 59
title: Step 60
challengeType: 0
dashedName: step-59
dashedName: step-60
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c8be904ffff922f3c6f8d0
title: Step 60
title: Step 61
challengeType: 0
dashedName: step-60
dashedName: step-61
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c8c00bfb671b23f9de4159
title: Step 61
title: Step 62
challengeType: 0
dashedName: step-61
dashedName: step-62
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c8c15fd337ad24b9b68049
title: Step 62
title: Step 63
challengeType: 0
dashedName: step-62
dashedName: step-63
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9bc53735149084390e5d0
title: Step 63
title: Step 64
challengeType: 0
dashedName: step-63
dashedName: step-64
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9bcc26219e7090da0f549
title: Step 64
title: Step 65
challengeType: 0
dashedName: step-64
dashedName: step-65
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9bce376ca4f09c15a3768
title: Step 65
title: Step 66
challengeType: 0
dashedName: step-65
dashedName: step-66
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9bdd916e0c10af01ed8d7
title: Step 66
title: Step 67
challengeType: 0
dashedName: step-66
dashedName: step-67
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9be334f4a050c0b94bc93
title: Step 67
title: Step 68
challengeType: 0
dashedName: step-67
dashedName: step-68
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9bef7fec05c0d38853828
title: Step 68
title: Step 69
challengeType: 0
dashedName: step-68
dashedName: step-69
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9bf80558d780e848b2987
title: Step 69
title: Step 70
challengeType: 0
dashedName: step-69
dashedName: step-70
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9c09a7daa4f0ff92c4023
title: Step 70
title: Step 71
challengeType: 0
dashedName: step-70
dashedName: step-71
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9c0d0857f0a10a57af936
title: Step 71
title: Step 72
challengeType: 0
dashedName: step-71
dashedName: step-72
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9c11a0a090311dff55564
title: Step 72
title: Step 73
challengeType: 0
dashedName: step-72
dashedName: step-73
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9c16dd75dd212dc12363c
title: Step 73
title: Step 74
challengeType: 0
dashedName: step-73
dashedName: step-74
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9c1ef134f3513e751c975
title: Step 74
title: Step 75
challengeType: 0
dashedName: step-74
dashedName: step-75
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9e3a83bb3e61a80eea564
title: Step 75
title: Step 76
challengeType: 0
dashedName: step-75
dashedName: step-76
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9e45519caf31b987fbb5f
title: Step 76
title: Step 77
challengeType: 0
dashedName: step-76
dashedName: step-77
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9e4d2ff41811dd640504f
title: Step 77
title: Step 78
challengeType: 0
dashedName: step-77
dashedName: step-78
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9e51b3a007a1eba1cd0f6
title: Step 78
title: Step 79
challengeType: 0
dashedName: step-78
dashedName: step-79
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9e55b4b06c11fff555c64
title: Step 79
title: Step 80
challengeType: 0
dashedName: step-79
dashedName: step-80
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9e5eea8261d22856ead1c
title: Step 80
title: Step 81
challengeType: 0
dashedName: step-80
dashedName: step-81
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9e63bb1e32d23b6adbe44
title: Step 81
title: Step 82
challengeType: 0
dashedName: step-81
dashedName: step-82
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9e6b7c0303524af2d0bc2
title: Step 82
title: Step 83
challengeType: 0
dashedName: step-82
dashedName: step-83
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9e769df38c92635c158ba
title: Step 83
title: Step 84
challengeType: 0
dashedName: step-83
dashedName: step-84
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9e7d5b21eee2776ecc226
title: Step 84
title: Step 85
challengeType: 0
dashedName: step-84
dashedName: step-85
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9e84c9fe8ca28c4101189
title: Step 85
title: Step 86
challengeType: 0
dashedName: step-85
dashedName: step-86
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9e8fe3a6f022a05a04675
title: Step 86
title: Step 87
challengeType: 0
dashedName: step-86
dashedName: step-87
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9e94e9df7d72aed1c24bd
title: Step 87
title: Step 88
challengeType: 0
dashedName: step-87
dashedName: step-88
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9ea23dbadbf2c2764e3f5
title: Step 88
title: Step 89
challengeType: 0
dashedName: step-88
dashedName: step-89
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9ea9b16430f2d54522464
title: Step 89
title: Step 90
challengeType: 0
dashedName: step-89
dashedName: step-90
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9eb09bcfaa72e3da820a1
title: Step 90
title: Step 91
challengeType: 0
dashedName: step-90
dashedName: step-91
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9eb4a5d68f12f32d9b440
title: Step 91
title: Step 92
challengeType: 0
dashedName: step-91
dashedName: step-92
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9ebb7b12bca3025b0a935
title: Step 92
title: Step 93
challengeType: 0
dashedName: step-92
dashedName: step-93
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9ec044acedf312c4974ff
title: Step 93
title: Step 94
challengeType: 0
dashedName: step-93
dashedName: step-94
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9f24afbc9cf324dcaa9a4
title: Step 94
title: Step 95
challengeType: 0
dashedName: step-94
dashedName: step-95
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9f28bda3e3f336e21b6b4
title: Step 95
title: Step 96
challengeType: 0
dashedName: step-95
dashedName: step-96
---
# --description--

View File

@@ -1,8 +1,8 @@
---
id: 63c9f2bff625af342023512c
title: Step 96
title: Step 97
challengeType: 0
dashedName: step-96
dashedName: step-97
---
# --description--

View File

@@ -0,0 +1,212 @@
---
id: 670ea2c4f42def724c77e3c7
title: Step 38
challengeType: 0
dashedName: step-38
---
# --description--
Now you need to retrieve the value of `entryDropdown.value` to get the currently selected option from the dropdown.
Print `entryDropdown.value` to the console to see its value.
Since `entryDropdown.value` is in a static context (outside of an event listener), it only shows the value at the moment the code runs. This means it won't automatically update as the user interacts with the dropdown.
It will capture the initial value (in this case, `"breakfast"`) and won't reflect any changes the user makes afterward.
# --hints--
You should use `console.log(entryDropdown.value)` to get the value of `entryDropdown`
```js
assert.match(code, /console\.log\([^\)]*entryDropdown\.value[^\)]*\)/);
```
# --seed--
## --seed-contents--
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="styles.css" />
<title>Calorie Counter</title>
</head>
<body>
<main>
<h1>Calorie Counter</h1>
<div class="container">
<form id="calorie-counter">
<label for="budget">Budget</label>
<input
type="number"
min="0"
id="budget"
placeholder="Daily calorie budget"
required
/>
<fieldset id="breakfast">
<legend>Breakfast</legend>
<div class="input-container"></div>
</fieldset>
<fieldset id="lunch">
<legend>Lunch</legend>
<div class="input-container"></div>
</fieldset>
<fieldset id="dinner">
<legend>Dinner</legend>
<div class="input-container"></div>
</fieldset>
<fieldset id="snacks">
<legend>Snacks</legend>
<div class="input-container"></div>
</fieldset>
<fieldset id="exercise">
<legend>Exercise</legend>
<div class="input-container"></div>
</fieldset>
<div class="controls">
<span>
<label for="entry-dropdown">Add food or exercise:</label>
<select id="entry-dropdown" name="options">
<option value="breakfast" selected>Breakfast</option>
<option value="lunch">Lunch</option>
<option value="dinner">Dinner</option>
<option value="snacks">Snacks</option>
<option value="exercise">Exercise</option>
</select>
<button type="button" id="add-entry">Add Entry</button>
</span>
</div>
<div>
<button type="submit">
Calculate Remaining Calories
</button>
<button type="button" id="clear">Clear</button>
</div>
</form>
<div id="output" class="output hide"></div>
</div>
</main>
<script src="./script.js"></script>
</body>
</html>
```
```css
:root {
--light-grey: #f5f6f7;
--dark-blue: #0a0a23;
--fcc-blue: #1b1b32;
--light-yellow: #fecc4c;
--dark-yellow: #feac32;
--light-pink: #ffadad;
--dark-red: #850000;
--light-green: #acd157;
}
body {
font-family: "Lato", Helvetica, Arial, sans-serif;
font-size: 18px;
background-color: var(--fcc-blue);
color: var(--light-grey);
}
h1 {
text-align: center;
}
.container {
width: 90%;
max-width: 680px;
}
h1,
.container,
.output {
margin: 20px auto;
}
label,
legend {
font-weight: bold;
}
.input-container {
display: flex;
flex-direction: column;
}
button {
cursor: pointer;
text-decoration: none;
background-color: var(--light-yellow);
border: 2px solid var(--dark-yellow);
}
button,
input,
select {
min-height: 24px;
color: var(--dark-blue);
}
fieldset,
label,
button,
input,
select {
margin-bottom: 10px;
}
.output {
border: 2px solid var(--light-grey);
padding: 10px;
text-align: center;
}
.hide {
display: none;
}
.output span {
font-weight: bold;
font-size: 1.2em;
}
.surplus {
color: var(--light-pink);
}
.deficit {
color: var(--light-green);
}
```
```js
const calorieCounter = document.getElementById('calorie-counter');
const budgetNumberInput = document.getElementById('budget');
const entryDropdown = document.getElementById('entry-dropdown');
const addEntryButton = document.getElementById('add-entry');
const clearButton = document.getElementById('clear');
const output = document.getElementById('output');
let isError = false;
function cleanInputString(str) {
const regex = /[+-\s]/g;
return str.replace(regex, '');
}
function isInvalidInput(str) {
const regex = /\d+e\d+/i;
return str.match(regex);
}
--fcc-editable-region--
--fcc-editable-region--
```