jiebi/CodeConvo huggingface dataset:
Code change:
[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

Related discussion:
text: ] ], "type": "hike", <del> "challengeType": 6 </del> <ins> "challengeType": 6, "nameEs": "Herramientas de desarrollo de Chrome: Elementos", "descriptionEs": [ "Esta es información básica y una mini-lección sobre la pestaña Elements en las herramientas de desarrollo de Chrome. Echa un vistazo a la documentación más detallada aquí: developers.google.com/web/tools/iterate/inspect-styles/basics ", "Vamos a utilizar la página web mckellen.com/ por sugerencia del usuario de FreeCodeCamp kmiasko.", "Si pulsas con el botón derecho y seleccionas 'Inspeccionar elemento', tendrás acceso a la pestaña elements. ¡Puedes cambiar el texto, el color de fondo, el color de texto y cualquier otra propiedad CSS o elemento HTML que desees!", "Estos cambios no se establecen de forma automática, por lo que no debes usar el inspector como un IDE o como un lugar para crear o editar cualquier cosa que desees guardar. Puedes configurar algo que se llama 'autoría persistente' para salvar.", "Las reglas de CSS como cascada, herencia y otras se aplican, así que tenlo en cuenta a medida que juegas. Además, los estilos anulados se muestran con un tachado sobre ellos. ", "También hay que señalar que todo el código que veas en ese 'árbol' es código HTML actual, no el original que había cuando se cargó la página. Si utilizas jQuery o JavaScript para cambiar algo, esté árbol se actualizará.", "El relleno, los bordes y los márgenes se inspeccionan fácilmente y puedes editarlos usando la caja con colores que encontrarás al lado derecho o en la parte de abajo.", "Por favor, echa un vistazo a la documentación de las herramientas de desarrollo de Chrome en developers.google.com/web/tools/chrome-devtools/" ] </ins> }, { "id": "56b15f15632298c12f315183",
Code change:
[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

Related discussion:
text: ] ], "type": "hike", <del> "challengeType": 6 </del> <ins> "challengeType": 6, "nameEs": "Herramientas de desarrollo de Chrome: red", "descriptionEs": [ "La pestaña network (red) ayuda a responder preguntas como '¿Qué elemento o parte de la página fue el más demorado?' o '¿Qué inició una petición?'", "El panel de red registra información detallada sobre cuánto tarda en cargar cada elemento de su página o aplicación.", "Cada solicitud se registra en la bitácora, que se puede encontrar en la parte inferior del panel de red.", "Si te fijas en la línea al lado derecho, te darás cuenta de un patrón de colores. Cada color representa un tipo diferente de contenido en la solicitud. ", "Cuanto más larga sea la línea de un color determinado, tanto más tiempo tomó ese tipo de contenido en la solicitud. En últimas quieres líneas cortas, y si cualquier solicitud tiene largas líneas, sabes que puede estar ralentizando la página web.", "Si pulsas sobre una solicitud en la bitácora, podrás obtener información más detallada.", "Consulta más documentación detallada aquí: developers.google.com/web/tools/profile-performance/network-performance/resource-loading" ] </ins> }, { "id": "56b15f15632298c12f315182",
Code change:
[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

Related discussion:
text: ] ], "type": "hike", <del> "challengeType": 6 </del> <ins> "challengeType": 6, "nameEs": "Herramientas de desarrollo de Chrome: Fuentes", "descriptionEs": [ "La pestaña 'fuentes' es más útil para la depuración de JavaScript. Cuanto más grande sea tu proyecto, tanto más difícil resulta encontrar exactamente dónde se produce un problema. ", "Puedes seleccionar diferentes partes del código para ser 'puntos de interrupción', puestos de control que detendrán la ejecución del código en ese preciso momento. ", "Hay diferentes puntos de interrupción que puedes establecer, por ejemplo una línea de código específica, un evento del DOM, una petición del servidor llamada solicitud XMLHTTP, o un evento de JavaScript.", "Cuando estableces un punto de interrupción, el navegador detiene todo cuando llega a interpretar esa línea de código o evento.", "Al reducir la velocidad de todo y darte la oportunidad de examinar lo que está sucediendo en cada punto que hayas configurado, podrás controlar exactamente lo que está sucediendo en la página o aplicación.", "Una vez has establecido todos los puntos de interrupción, puedes recorrer el código y examinar el estado de tu página o aplicación en cada punto de interrupción.", "Al igual que con los elementos, puedes editar en vivo mediante las herramientas de desarrollo, pero recuerda que debes guardar esos cambios para que no pierdas tu progreso.", "Revisa documentación más detallada aquí: developers.google.com/web/tools/javascript/breakpoints/" ] </ins> }, { "id": "56b15f15632298c12f315181",
Code change:
[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

Related discussion:
text: ] ], "type": "hike", <del> "challengeType": 6 </del> <ins> "challengeType": 6, "nameEs": "Herramientas de desarrollo de Chrome: Línea de tiempo", "descriptionEs": [ "El panel Línea de tiempo te permite grabar y analizar toda la actividad en tu aplicación mientras se ejecuta. Es el mejor lugar para comenzar a investigar los problemas de rendimiento que percibas en tu aplicación. ", "Al igual que usas el panel de red para averiguar cuánto tiempo toman las partes de la página para comunicarse con el Internet y utilizas fuentes para averiguar dónde algo se daña, puedes utilizar la línea de tiempo para averiguar con más detalle lo que está pasando y el tiempo que tarda.", "En el panel línea de tiempo grabas acontecimientos con el pequeño botón circular. Puedes grabar (o capturar) pilas, perfiles js, la memoria y la presentación (CSS). ", "Al grabarlos (capturalos), quedan en pequeños y detallados registros que puedes organizar de muchas maneras para que se adapten a tus necesidades.", "Todo esto te ayudará a entender mejor lo que está pasando en el navegador, en particular cuáles eventos requieren más memoria del navegador.", "Cuando uses la línea de tiempo, recuerda que debes utilizar el botón 'limpiar' (clear) para iniciar la grabación y antes de cargar la página, dependiendo de lo que desees capturar.", "Te darás cuenta de que cuando grabas eventos JS, al pulsar en el título o en una 'llamada a una función' al lado izquierdo, te llevará al documento y a la línea de esa función en el panel de recursos. ", "Revisa documentación más detallada aquí: developers.google.com/web/tools/profile-performance/evaluate-performance/timeline-tool" ] </ins> }, { "id": "56b15f15632298c12f315180",
Code change:
[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

Related discussion:
text: ] ], "type": "hike", <del> "challengeType": 6 </del> <ins> "challengeType": 6, "nameEs": "Herramientas de desarrollo de Chrome: Perfiles", "descriptionEs": [ "El panel Perfiles te permite perfilar el tiempo de ejecución y el uso de memoria de una aplicación web o de una página. Esto se aplica principalmente a la ejecución de JavaScript en su página o aplicación. ", "Hay tres tipos de perfiles que se pueden recolectar: el perfil de la CPU, instantáneas de la memoria con estructura montón (Heap), y el perfil de la memoria con estructura montón. Los perfiles de memoria en estructura montón tienen más que ver con el uso de memoria, mientras que un perfil de la CPU tiene más que ver con el rendimiento de JavaScript. ", "Un perfilador llamado V8 se usa mientras se ejecuta el código para identificar lo que en el JavaScript toma mucho tiempo, facilitándote de esta forma optimizar tu código.", "Cada uno de estos perfiles se puede ver a la izquierda, y se puede tomar múltiples perfiles de cada uno. En general, la pestaña de perfiles es muy útil cuando deseas optimizar tu código. ", "Revisa documentación más detallada aquí: developers.google.com/web/tools/profile-performance/rendering-tools/js-execution" ] </ins> }, { "id": "56b15f15632298c12f31517f",
Code change:
[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

Related discussion:
text: ] ], "type": "hike", <del> "challengeType": 6 </del> <ins> "challengeType": 6, "nameEs": "Herramientas de desarrollo de Chrome: Recursos", "descriptionEs": [ "El panel de Recursos te permite inspeccionar los recursos que se cargan en la página, incluyendo IndexedDB o bases de datos SQL Web, almacenamiento local y de sesión, las galletas (cookies), memoria caché de aplicaciones, imágenes, fuentes y hojas de estilo.", "Puedes ver y editar toda esta información dentro del navegador.", "A medida que vayas construyendo aplicaciones web más avanzadas, juega con el panel de recursos y verás cómo te ayudará a entender los requisitos de tu aplicación y de tu página en tiempo real.", "Revisa documentación más detallada aquí: developers.google.com/web/tools/iterate/manage-data/index" ] </ins> }, { "id": "56b15f15632298c12f31517e",
Code change:
[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

Related discussion:
text: ] ], "type": "hike", <del> "challengeType": 6 </del> <ins> "challengeType": 6, "nameEs": "Herramientas de desarrollo de Chrome: Las auditorías", "descriptionEs": [ "La herramienta de auditoría te guía para mejorar tu página paso a paso.", "En este vídeo, se utiliza esta herramienta con un generador de citas aleatorias desarrollado como uno de los proyectos de desarrollo de interfaces.", "Las sugerencias que se ven, se generan automáticamente con la función de auditoría.", "Es importante tenerlas en cuenta para contextualizarlos con el resto de conocimiento que tienes de tu sitio.", "A veces, puede ser que sea lo acertado, pero en ocasiones, por tu situación las sugerencias que da son equivocadas.", "Usa esta herramienta cuando desees mejorar tu sitio o aplicación, pero no sepas por dónde empezar." ] </ins> }, { "id": "56b15f15632298c12f31517d",
Code change:
[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

Related discussion:
text: ] ], "type": "hike", <del> "challengeType": 6 </del> <ins> "challengeType": 6, "nameEs": "Herramientas de desarrollo de Chrome: Consola", "descriptionEs": [ "El panel de la consola ofrece dos funciones principales: registro de datos de diagnóstico en el proceso de desarrollo y proporcionar un intérprete de órdenes que puedes utilizar para interactuar con el documento y las Herramientas de desarrollo", "Al utilizar la consola, puedes ver los datos en bruto o estructurados mediante instrucciones estándar JS y órdenes específicas para la consola.", "Un ejemplo de datos estructurados sería la información JSON que devuelva una API. Muy útil cuando se construyen las primeras aplicaciones de desarrollo de interfaces para FreeCodeCamp.", "Debes saber que los mensajes se apilan y que puedes limpiarlos escribiendo <code>clear()</code>. También puedes guardar la bitácora seleccionando 'Preserve Log'. ", "Hay diferentes órdenes que registrarán en bitácoras de manera diferente, como console.log() para registrar información básica, console.error() y console.warn() para registrar en bitácoras 'información llamativa'.", "La consola puede realizar un seguimiento de excepciones, que básicamente registra cuando algo sale mal. Puede incluso hacer una pausa en el código durante esas excepciones, función que posiblemente recuerdes de la pestaña 'Fuente'. ", "Revisa documentación más detallada aquí: developers.google.com/web/tools/javascript/console/" ] </ins> }, { "id": "56b15f15632298c12f31517c",
Code change:
[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

Related discussion:
text: ] ], "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> } ] }
Code change:
Challenge has an issue. User Agent is: <codeMozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.87 Safari/537.36</code. Please describe how to reproduce this issue, and include links to screenshots if possible. My code:
the instructions are correct. You'll need to return "Huge" whenever . If you get stuck with a challenge, please ask questions to the . Happy coding!

Related discussion:
text: "video": "114591799", "challengeNumber": 13, "steps": [ <del> "Now that we've built a foundation in jQuery, let's go back to Dash and do it's last challenge.", </del> <ins> "Now that we've built a foundation in jQuery, let's go back to Dash and do its last challenge.", </ins> "If you aren't familiar with Mad Libs, they basically involve inserting random nouns, adjectives and verbs in to stories. The stories that result are often hilarious.", "Go to <a href='https://dash.generalassemb.ly/projects/mad-libs-1' target='_blank'>https://dash.generalassemb.ly/projects/mad-libs-1</a> and complete the fifth project." ]
Code change:
Challenge has an issue. User Agent is: <codeMozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.87 Safari/537.36</code. Please describe how to reproduce this issue, and include links to screenshots if possible. My code:
the instructions are correct. You'll need to return "Huge" whenever . If you get stuck with a challenge, please ask questions to the . Happy coding!

Related discussion:
text: transform: translateY(-50%); } <ins> .landing-skill-icon { color: #215f1e; font-size: 150px; } .black-text { color: #333; font-weight: 400; font-size: 40px; } .font-awesome-padding { margin-top: 45px; margin-bottom: 20px; } </ins> .background-svg { width: 220px; height: 220px;
Code change:
Challenge has an issue. User Agent is: <codeMozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.87 Safari/537.36</code. Please describe how to reproduce this issue, and include links to screenshots if possible. My code:
the instructions are correct. You'll need to return "Huge" whenever . If you get stuck with a challenge, please ask questions to the . Happy coding!

Related discussion:
text: background-position: center; } <ins> .testimonial-image { border-radius: 5px; height: 200px; width: 200px; } .testimonial-copy { font-size: 20px; text-align: center; @media (min-width: 991px) and (max-width: 1199px) { height: 120px; } @media (min-width: 1200px) { height: 90px; } } </ins> //uncomment this to see the dimensions of all elements outlined in red //* { //  border-color: red;
Code change:
Challenge has an issue. User Agent is: <codeMozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.87 Safari/537.36</code. Please describe how to reproduce this issue, and include links to screenshots if possible. My code:
the instructions are correct. You'll need to return "Huge" whenever . If you get stuck with a challenge, please ask questions to the . Happy coding!

Related discussion:
text: extends layout block content <del> .hidden-xs a(href='https://github.com/freecodecamp/freecodecamp') img(style='position: absolute; top: 40; right: 0; border: 0; margin-top: -30px;', src='https://camo.githubusercontent.com/e7bbb0521b397edbd5fe43e7f760759336b5e05f/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f677265656e5f3030373230302e706e67', alt='Fork me on GitHub', data-canonical-src='https://s3.amazonaws.com/github/ribbons/forkme_right_green_007200.png') </del> .jumbotron .text-center h1.hug-top Code with Us
Code change:
Challenge has an issue. User Agent is: <codeMozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.87 Safari/537.36</code. Please describe how to reproduce this issue, and include links to screenshots if possible. My code:
the instructions are correct. You'll need to return "Huge" whenever . If you get stuck with a challenge, please ask questions to the . Happy coding!

Related discussion:
text: br br a.btn.nonprofit-cta.btn-success(href="/nonprofits") I'm with a nonprofit and want help coding something <del> include partials/about include partials/faq </del>  No newline at end of file <ins> .big-break h2 Campers you'll hang out with: .row .col-xs-12.col-sm-12.col-md-4 img.img-responsive.testimonial-image.img-center(src="https://s3.amazonaws.com/freecodecamp/testimonial-jen.jpg", alt="@jenthebest's testimonial image") .testimonial-copy Getting back on track with Free Code Camp and committing to a new career in 2015! h3 - @jenthebest .col-xs-12.col-sm-12.col-md-4 img.img-responsive.testimonial-image.img-center(src="https://s3.amazonaws.com/freecodecamp/testimonial-tate.jpg", alt="@TateThurston's testimonial image") .testimonial-copy Just built my company's website with skills I've learned from Free Code Camp! h3 - @TateThurston .col-xs-12.col-sm-12.col-md-4 img.img-responsive.testimonial-image.img-center(src="https://s3.amazonaws.com/freecodecamp/testimonial-cynthia.jpg", alt="@cynthialanel's testimonial image") .testimonial-copy  I'm currently working through Free Code Camp to improve my JavaScript. The community is very welcoming! h3 - @cynthialanel .big-break h2 Skills you'll learn: .text-center .col-xs-12.col-sm-12.col-md-3 .landing-skill-icon.ion-social-html5 .black-text HTML5 .col-xs-12.col-sm-12.col-md-3 .landing-skill-icon.ion-social-css3 .black-text CSS3 .col-xs-12.col-sm-12.col-md-3 .landing-skill-icon.ion-social-javascript .black-text JavaScript .col-xs-12.col-sm-12.col-md-3 .landing-skill-icon.fa.fa-database.font-awesome-padding .black-text Databases .col-xs-12.col-sm-12.col-md-3 .landing-skill-icon.ion-social-chrome .black-text DevTools .col-xs-12.col-sm-12.col-md-3 .landing-skill-icon.ion-social-nodejs .black-text Node.js .col-xs-12.col-sm-12.col-md-3 .landing-skill-icon.ion-social-angular .black-text Angular.js .col-xs-12.col-sm-12.col-md-3 .landing-skill-icon.ion-ios-loop-strong .black-text Agile .big-break h2 &nbsp; h2 Fast facts about our community: h3.col-xs-offset-0.col-sm-offset-1.col-md-offset-2 ul.text-left li.ion-code &nbsp; We're 100% free and open source li.ion-code &nbsp; We're thousands of professionals who are learning to code li.ion-code &nbsp; We're building projects for dozens of nonprofits li.ion-code &nbsp; We share one goal: to boost our careers with code .big-break a.btn.btn-cta.signup-btn(href="/login") Start learning to code (it's free) </ins>  No newline at end of file
Code change:
Challenge has an issue. User Agent is: <codeMozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.87 Safari/537.36</code. Please describe how to reproduce this issue, and include links to screenshots if possible. My code:
the instructions are correct. You'll need to return "Huge" whenever . If you get stuck with a challenge, please ask questions to the . Happy coding!

Related discussion:
text: "challengeSeed": "function sumPrimes(num) {n  return num;rn}", "tests": [ "expect(sumPrimes(10)).to.be.a('number');", <del> "expect(sumPrimes(10)).to.equal(27);", </del> <ins> "expect(sumPrimes(10)).to.equal(17);", </ins> "expect(sumPrimes(977)).to.equal(73156);" ] },
Code change:
<!-- 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 --<!-- Insert link to challenge below -- <!-- Describe below when the issue happens and how to reproduce it --This challenge would be a lot more informative if a description of what adding the form-control class to the input field actually does. Something along the lines of: All textual [input], [textarea], and [select] elements with class [.form-control] have a width of 100%.
This challenge is currently quite short and it's defiantly worth adding an explanation here. To First Timer: You will need to add the sentence under line. Please, check our and if you need any assistance reach out to the .
The code you'll need to add specifically is It should render as
Hey there. I'm a first-timer interested in getting started with contributing to Free Code Camp. I will submit a PR for this issue. Thanks!
Hey What about tests ?? Tests should be for each input.
having issue in style-text-inputs-as-form-controls just give a class="form-control" to before your checkbox's 1st div and finally add here 3)

Related discussion:
text: ], "description": [ "You can add the <code>fa-paper-plane</code> Font Awesome icon by adding <code>&#60;i class="fa fa-paper-plane"&#62;&#60;/i&#62;</code> within your submit <code>button</code> element.", <del> "Give your form's text input field a class of <code>form-control</code>. Give your form's submit button the classes <code>btn btn-primary</code>. Also give this button the Font Awesome icon of <code>fa-paper-plane</code>." </del> <ins> "Give your form's text input field a class of <code>form-control</code>. Give your form's submit button the classes <code>btn btn-primary</code>. Also give this button the Font Awesome icon of <code>fa-paper-plane</code>.", "All textual <code>&lt;input&gt;</code>, <code>&lt;textarea&gt;</code>, and <code>&lt;select&gt;</code> elements with the class <code>.form-control</code> have a width of 100%." </ins> ], "challengeSeed": [ "<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">",