jiebi/CodeConvo huggingface dataset:
Change:
<ins> import * as ReactDOMServer from 'react-dom/server'; </ins> import Loadable from '@loadable/component'; // eslint-disable-next-line import/no-duplicates import type * as monacoEditor from 'monaco-editor/esm/vs/editor/editor.api';

Discussion:
I am learning from the RWD course, and I wanted to revise what I had done previously. I went to previous steps, but I found that the steps are shown incomplete when I open them. It tells you to do the step again. This doesn't make sense because you have a button at the top if you do want to do the step again. Completed code should be shown in completed challenge's code editor along with an indicator like ! !
It would be relatively easy to show the solution to a step, and the "Step completed" text, (rather than storing the user's code) if a user has already submitted that step. If other maintainers are in favour of this change, I'd be happy to open this up for PRs.
My concern with that approach would be it completely destroys the UX if someone wants to go through a practise project again.
I propose to add a button under the summary of each project for this issue.
I'm not keen on adding a button to do that, given the potential for frustration if someone triggers that accidentally.
I think I'd be in favour of the existing flow, presonally.
At a minimum, we could probably add the checkmark next to "Step 22" like we do for all the other challenges after it has been completed. That seems to be missing here. !
That's a good idea, IMO.
I think just adding that check mark is probably the way to go then. It keeps it consistent with everything else. I'm going to open it up for contributions. If anyone still has reservations, be sure to bring them up.
May I suggest in addition to indicating completed challenges in the challenge itself, to do that in the list of steps. Here is a crude representation of what I have in mind: <p align="center"<img src="https://user-" width=500 align="centre"/</p
I believe it already does that. Here's a screenshot of what the challenge looks like for me, after I've completed it (the steps are highlighted in blue instead of white). !
Also, I would like to work on this issue, and I agree that adding a checkmark next to the step would be a good fix, but I noticed that the RWD courses don't have a step number or title at the top like the other courses do.

For other courses, the checkmark for completion is displayed next to the name of the challenge, like you can see in the first screenshot (of the JS Algorithms & Data Structures courses). However, for the RWD course, there is nothing in this location, as you can see in the second screenshot. ! ! How should we go about adding a checkmark to the RWD course? Should we just put it next to where it says on the screenshot (inside the instructions block)? Or should we move the step number to the same place as where the challenge names are for the other courses and put the checkmark there, in order to be consistent with the other courses?
Thanks I could not log in since yesterday and this is probably the reason I don't see indication for completed challenges in the list of steps.
Change:
assert.include(new __helpers.CSSHelp(document).getStyle('.bb1a')?.background, 'linear-gradient'); ``` <del> You should give the `background` a `linear-gradient` starting from `--building-color1`. </del> <ins> You should give the `background` a `linear-gradient` starting from `var(--building-color1)`. </ins> ```js assert.include(new __helpers.CSSHelp(document).getStyle('.bb1a')?.getPropVal('background', true), 'linear-gradient(var(--building-color1'); ``` <del> You should give the `background` a `linear-gradient` ending at `--window-color1`. </del> <ins> You should give the `background` a `linear-gradient` ending at `var(--window-color1)`. </ins> ```js assert.include(new __helpers.CSSHelp(document).getStyle('.bb1a')?.getPropVal('background', true), 'linear-gradient(var(--building-color1),var(--window-color1))');

Discussion:
In the hint below it ask to add variable, but it's similar to how we ask colors to be , which cased confusion to a camper I propose, applying the same approach in ieahleen pull request to skyline variables name, . Although it feels like giving answers outright, variables are case-sensitive and require specific syntax, which I think we should give their steps some lay way in the hints. original issue:
For that you need to use . First argument of is the found value, and can be referenced with . Second argument of is the expected value, and can be referenced with in the hint text. The tests would need to be changed a bit for this to be possible. And I am not even sure how to apprach it, as it's complex values, and there is this annoying thing called spaces.
I thought will trim the spaces, but as showing in the image below it doesn't. That looks like a nightmare, so let's ignore my original suggestion ! the camper mentioned the lack of keyword, what about adding in the hints something like or
Change:
p You’ll continue to work on nonprofit projects until you’ve built a sufficiently impressive portfolio and references to start your job search. Your portfolio will ultimately have four nonprofit projects. We estimate that the 800 hours of nonprofit projects and 80 hours of interview prep you’re going to complete, in addition to the 1,200 hours of challenges you’ve already completed by this point, will be more than enough to qualify you for your first coding job. h3 Your first Nonprofit Project p We generally scope Nonprofit Projects to 200 hours, or about 10 weeks at 20 hours per week of development per camper. These are only rough estimates. You’ll only work on one project at a time. <del> p You will choose another camper to partner with on this projects. You should choose your them based on: </del> <ins> p You will choose another camper to partner with on this projects. You should choose them based on: </ins> ol li How many hours you can pledge (around 10, 20, or 40 hours per week) li Your time zones (Will you be able to pair program together?)

Discussion:
<!-- FreeCodeCamp Issue Template --<!-- Please provide as much detail as possible for us to fix your issue --<!-- Remove any heading sections you did not fill out -- There's a typo. "your them" 
I'm working on it.
Change:
padding-bottom: 10px; } <ins> .help-modal-heading { line-height: 1.5; font-weight: 400; word-spacing: -0.4ch; } </ins> @media screen and (max-width: 767px) { .help-modal .btn-lg { font-size: 16px;

Discussion:
I was looking at and I wonder if we should improve the legibility of that heading text as well. The default Bootstrap isn't great here. The font used with makes it harder to read in my opinion. Here is the Modal with and the default for the heading. ! And here is the original ! Any challenge with "Get Help" Open the Modal Better legibility of the heading text. No response Device: [e.g. iPhone 6, Laptop] OS: [e.g. iOS 14, Windows 10, Ubuntu 20.04] Browser: [e.g. Chrome, Safari] Version: [e.g. 22] No response
! Isn't it already correct?
I don't know what you mean by correct. I'm suggesting changing the and to make it easier to read. I'm talking about the with the Read-Search-Ask link in it to be clear. It is less of an issue in light mode than dark mode but I still think the legibility can be improved by the suggested changes.
I don't think it's hard to read, but it does feel a little condensed and I do think it looks better with a little more space. With the space, we may not need to make the adjustments to the link underlines.
If the text "looks better" chances are it "reads better". And yes, the line height should also help with the underline issue.
Change:
"Now, take a look at a <code>do...while</code> loop.", "<blockquote>var ourArray = []; <br>var i = 5;<br>do {<br>  ourArray.push(i);<br>  i++;<br>} while (i < 5);</blockquote>", "In this case, we initialize the value of <code>i</code> as 5, just like we did with the while loop. When we get to the next line, there is no check for the value of <code>i</code>, so we go to the code inside the curly braces and execute it. We will add one element to the array and increment <code>i</code> before we get to the condition check. Then, when we get to checking if <code>i < 5</code> see that <code>i</code> is now 6, which fails the conditional check. So we exit the loop and are done. At the end of the above example, the value of <code>ourArray</code> is <code>[5]</code>.", <del> "Essenially, a <code>do...while</code> loop ensures that the code inside the loop will run at least once.", </del> <ins> "Essentially, a <code>do...while</code> loop ensures that the code inside the loop will run at least once.", </ins> "Let's try getting a <code>do...while</code> loop to work by pushing values to an array.", "<hr>", "Change the <code>while</code> loop in the code to a <code>do...while</code> loop so that the loop will push the number 10 to <code>myArray</code>, and <code>i</code> will be equal to <code>11</code> when your code finishes running."

Discussion:
<!-- freeCodeCamp Issue Template --<!-- Please provide as much detail as possible for us to fix your issue --<!-- Remove any heading sections you did not fill out --<!-- NOTE: If your issue is CodePen Project / Test Suite related, please open it using the below URL instead --<!-- --<!-- Insert link to challenge below --Basic JavaScript: Iterate with JavaScript Do...While Loops <!-- Describe below when the issue happens and how to reproduce it --Typo in the pre-last paragraph of the description of the challenge - 'Essenially' written instead of 'Essential'.
I'd like to take this if it's possible, i found the typo and it seems that only a change in the seed file is required
sure please go ahead. if you need assistance then hit us in the , and follow our for setup.
Change:
"nameEs": "Elimina tus funciones jQuery", "descriptionEs": [ "Estas animaciones eran divertidas al principio, pero ahora se están volviendo una distracción.", <del> "Elimina esas tres funciones de jQuery de tu <code>función de documento listo</code>, pero deja intacta la declaración de la <code>función de documento listo</code>." </del> <ins> "Elimina esas tres funciones jQuery de tu <code>función de documento listo</code>, pero deja intacta la declaración de la <code>función de documento listo</code>." </ins> ] }, {

Discussion:
[x] Learn how Script Tags and Document Ready Work [x] Target HTML Elements with Selectors Using jQuery [x] Target Elements by Class Using jQuery [x] Target Elements by ID Using jQuery [x] Delete your jQuery Functions [x] Target the same element with multiple jQuery Selectors [x] Remove Classes from an element with jQuery [x] Change the CSS of an Element Using jQuery [x] Disable an Element Using jQuery [x] Change Text Inside an Element Using jQuery [x] Remove an Element Using jQuery [x] Use appendTo to Move Elements with jQuery [x] Clone an Element Using jQuery [x] Target the Parent of an Element Using jQuery [x] Target the Children of an Element Using jQuery [x] Target a Specific Child of an Element Using jQuery [x] Target Even Numbered Elements Using jQuery [x] Use jQuery to Modify the Entire Page
Checking
Change:
assert(img?.previousElementSibling === null); ``` <del> Your `img` element should have a `class` set to logo. </del> <ins> Your `img` element should have a `class` set to `logo`. </ins> ```js const img = document.querySelector('img');

Discussion:
in step 21 of building a piano project, the hint in line 30 is missing code blocks This should be changed to If you would like to fix this issue, please make sure you read , we prioritize contributors following the instructions in our guides. Join us in or if you need help contributing, our moderators will guide you through this. Sometimes we may get more than one pull requests. We typically accept the most quality contribution, followed by the one that is made first. Happy contributing.
I believe I did all this right. This is my first time contributing to open source. Very exciting :))
Change:
border-bottom-color: var(--gray-45) !important; } <ins> .fill-in-the-blank-input:focus { z-index: 2; } </ins> .code-tag code { font-size: 100%; z-index: 0;

Discussion:
When the blanks in a fill in a blank challenge overlap vertically, the top selection box gets cut off: <img width="767" alt="Screenshot 2024-06-17 at 5 39 59 PM" src=""^ See the two blanks in the sentence are above and below one another. When you click the first blank, the blue selection box is cut off - presumably because the input below is in front of the first input. to on the first blank in the sentence the blank get cut off The box to be visible We could adjust the spacing so the input doesn't get cut off, or move the z-index of the input to the front when it's selected.
I think changing the z-index on select makes sense.
We might also consider increasing the . The lines are pretty close together. Not sure why we are using for the unit, usually is set using unitless values, which would make the we have on the elements work much better. Also, the font-size is set using for whatever reason (unlike most if not all other font styles I have seen in our CSS). Not that changing it to does anything (currently at least).
Change:
"last-page": "Go to last page", "primary-nav": "primary", "breadcrumb-nav": "breadcrumb", <ins> "timeline-pagination-nav": "Timeline Pagination", </ins> "submit": "Use Ctrl + Enter to submit.", "running-tests": "Running tests", "hide-preview": "Hide the preview",

Discussion:
The is being hard-coded with an English string, we should change this to use a translation string instead. Additionally, the attribute is redundant as already has role implicitly. Replace the string with a translation string, something like (the string also needs to be to ) Remove
Change:
prevChallengePath, showPrevNextBtns }) { <del> let icon = null; if (isCompleted) { icon = ( // TODO Use SVG here <i className='ion-checkmark text-primary' title='Completed' /> ); } </del> return ( <div className='challenge-title-wrap'> {showPrevNextBtns ? (

Discussion:
In the new beta (currently at ), it would be great if a challenge page indicated somehow when the challenge has already been completed. Currently, since user inputed code is not saved, there is no indication on a challenge page that it has already been completed.
We need a check mark in the title or a badge or to indicate the same?
The most elegant thing I can think of to have something like the little circular check mark next to the title like how it is on the learn homepage - only if it's been solved, and don't show anything if it hasn't.
That would be a nice way to handle it. Please go forth if you are interested in this?
Change:
] ], "type": "hike", <del> "challengeType": 6 </del> <ins> "challengeType": 6, "nameEs": "Herramientas de desarrollo de Chrome: Resumen", "descriptionEs": [ ", Las herramientas de desarrollo de Chrome son impresionantes, y cuanto más te puedas sumergir y tratar de utilizarlas, más rápido aumentará tu nivel. ", ", Utiliza la documentación, incluso si nunca has leído documentación antes: developers.google.com/web/tools/chrome-devtools/ ", ", Una vez que comiences a sentirte cómodo en una pestaña, rétate aprendiendo a usar una diferente. Trabajar eficazmente con todas las pestañas te servirá exponencialmente más que pegarte en tu zona de confort." ] </ins> } ] }

Discussion:
[x] Chrome Dev Tools: Elements [x] Chrome Dev Tools: Network [x] Chrome Dev Tools: Sources [x] Chrome Dev Tools: Timeline [x] Chrome Dev Tools: Profiles [x] Chrome Dev Tools: Resources [x] Chrome Dev Tools: Audits [x] Chrome Dev Tools: Console [x] Chrome Dev Tools: Summary
Working on it
Change:
Fulfill the user stories and pass all the tests below to complete this project. Give it your own personal style. Happy Coding! <ins> **Note:** Be sure to add `<link rel="stylesheet" href="styles.css">` in your HTML to link your stylesheet and apply your CSS </ins> # --hints-- You should have a `header` element with an `id` of `header`

Discussion:
With the new format, a lot of people are not linking their css files to the HTML document. It is coming up a lot on the forum. Especially for those that are going through the Legacy curriculum. I think we should add a message underneath the sample projects, to remember to link the CSS file. Proposed change: Remember to link your CSS file in the HTML document. <img width="460" alt="Screen Shot 2022-05-14 at 8 57 10 AM" src="https://user-"
I had trouble fixing , because I didn't link To I hope this will be implemented
I think we should do this.
Change:
Use Font Awesome to add an `info-circle` icon to your info button and a `trash` icon to your delete button. <del> **Note:** The `span` element is an acceptable alternative to the `i` element for the directions below. </del> <ins> **Note:** You can use either `i` or `span` elements to complete this challenge. </ins> # --hints--

Discussion:
Course: Front End Development Libraries Certification Section: Bootstrap Lesson: Add Font Awesome Icons to all of our Buttons The wording is as follows: "Note: The span element is an acceptable alternative to the i element for the directions below." The word "below" is wrong. The instructions are above, not below. Switch word "below" with "above". None/ not applicable to issue. N/A, not applicable to issue Issue is found within the text of the instructions N/a, not applicable This is only a grammatical error found in the instructions for the challenge.
I think the directions mentioned here is the tests.
Yes, this is referring to the instructions in the test text, which is where the element is requested.
Maybe something like this would be clearer
The challenge will accept span elements.
Ahh. So we should probably say something more like
That one works for me. Thanks for opening this issue. This looks like something that can be fixed by "first-time" code contributors to this repository. Here are the files that you should be looking at to work on a fix: List of files: You should update the instruction text to replace: With: Please make sure you read our , we prioritize contributors following the instructions in our guides. Join us in our or our if you need help contributing; our moderators will guide you through this. Sometimes we may get more than one pull request. We typically accept the most quality contribution followed by the one that is made first. Happy contributing.
I would like to work on this issue could you please assign it to me
We don't assign issues. We accept the first complete pull request that fully addresses the issue
Very excited
Change:
"assert($("a").text().match(/catsphotos/gi), 'Your <code>a</code> element should have the anchor text of "cat photos"')", "assert($("p") && $("p").length > 2, 'Create a new <code>p</code> element around your <code>a</code> element.')", "assert($("a[href="http://www.freecatphotoapp.com"]").parent().is("p"), 'Your <code>a</code> element should be nested within your new <code>p</code> element.')", <del> "assert($("p").text().match(/^Viewsmores/gi), 'Your <code>p</code> element should have the text "View more " (with a space after it).')", </del> <ins> "assert($("p").text().match(/^s*Viewsmores/gi), 'Your <code>p</code> element should have the text "View more " (with a space after it).')", </ins> "assert(!$("a").text().match(/Viewsmore/gi), 'Your <code>a</code> element should <em>not</em> have the text "View more".')", "assert(editor.match(/</p>/g) && editor.match(/<p/g) && editor.match(/</p>/g).length === editor.match(/<p/g).length, 'Make sure each of your <code>p</code> elements has a closing tag.')", "assert(editor.match(/</a>/g) && editor.match(/<a/g) && editor.match(/</a>/g).length === editor.match(/<a/g).length, 'Make sure each of your <code>a</code> elements has a closing tag.')"

Discussion:
<img width="1298" alt="screen shot 2015-10-09 at 11 07 27 am" src=""Challenge has an issue. User Agent is: <codeMozilla/5.0 (Macintosh; Intel Mac OS X ) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.101 Safari/537.36</code. Please describe how to reproduce this issue, and include links to screenshots if possible. My code:
Change:
assert.equal(locations[5].name, 'lose'); ``` <del> Your sixth `locations` value should have a `button text` property with the value an array with three `REPLAY?` strings. </del> <ins> Your sixth `locations` value should have a `button text` array with three `REPLAY?` strings. </ins> ```js assert.deepEqual(locations[5]["button text"], ['REPLAY?', 'REPLAY?', 'REPLAY?']); ``` <del> Your sixth `locations` value should have a `button functions` property with the value an array with three `restart` variables. </del> <ins> Your sixth `locations` value should have a `button functions` array with three `restart` variables. </ins> ```js assert.deepEqual(locations[5]["button functions"], [restart, restart, restart]);

Discussion:
reported sentence that looks weird, and I agree. it is used in 4 files here is the sentence I noticed in the last file, we are using deepEquel, should we mention that array's variables' respective position matter?
Can I be assigned to this? We can simply improve it as "property with the value of an array".
contribution isn't open for issues with label , you are more than welcome to discuss how to improve it
I would shorten them to just use ... e.g. "Your fifth value should have a array with three strings."
there is no one has provided a better option yet, so I am opening this for contribution, and when the JS is published, we can come back to this when campers are taking the course. You should follow Tom comment here because no one has answered this, I think it doesn't matter If you would like to fix this issue, please make sure you read , we prioritize contributors following the instructions in our guides. Join us in or if you need help contributing, our moderators will guide you through this.
Hello Sir, can you assign me this issue? hacktoberfest
how does this sounds? "Your fifth locations value should have a with the value being an array consisting of three strings." I for one think we don't need to over explain this, as the values are described in order most people will put them in that exact order.
Although, we are trying to include everyone, you are right this is me trying to overtune something simple. It's good, but we should keep Tom suggestion. In HTML/CSS projects steps, we are using the same sentence structure that Tom mentioned, so there will be comfort, and subtle hints that is an object that carry variables.
you can open a PR, after reading our guideline. more info in this comment
Your fifth locations value should have a property and an array value with three strings. kept most of the original wordings.
Opened a PR for this issue!
Change:
terms = [] for n, coefficient in self.coefficients.items(): if not coefficient: <del> coefficient </del> <ins> continue </ins> if n == 0: terms.append(f'{coefficient:+}') elif n == 1:

Discussion:
I have completed this, but noticed there is an error in the code which doesn't seem to cause any problems during the lessons. In lesson 20 we use an if statement (seen in the first code block below) and the action is . This stays the same in steps 21 through 25. However from steps 26 onwards has been replaced by as highlighted in the second code block below. (Please note that I did not change the code and have pressed Reset a number of times but the code stays the same) Please advise First code block: Second code block: I expect code that passed to stay the same and be correct - is the code in the second code block above correct? No response Device: HP Laptop OS: Windows 10 Browser: Firefox Version: 128.0.2 No response
Thanks for reporting this. The answer is no, that snippet of code is not correct and it should be fixed. Each occurrence of should be replaced with