Skip to content
OverviewSolutions
24
Comments
5

James

@neenrevaVA/US390 points

I’m a mysterious individual who has yet to fill out my bio. One thing’s for certain: I love writing front-end code!

I’m currently learning...

HTML/CSS/JS

Latest solutions

View more solutions

Latest comments

  • James•390
    @neenreva

    Just had fun with ChartJS myself. The docs could probably be better but I found some things you might be looking for in particular :

       let myChart = new Chart("myChart", {
        type: "bar",
        data: { },
        options: {
            elements: {
                  bar: {
                       borderRadius: 'your value here',
                       borderSkipped: false,
                  } 
            }
        }

    Tooltips are a little trickier. I played with these in the console till I got what I wanted.

       let myChart = new Chart("myChart", {
        type: "bar",
        data: { },
        options: {
           plugins: {
            tooltip: {
              callbacks: {
                title: function (context) {
                  context = "$" + context[0].formattedValue;
                  return context;
                },
                label: function (context) {
                  context = "";
                  return context;
                },
              },
            }
        }

    My code here if you want some specific references to how I handled it. Hope this helps

  • James•390
    @neenreva

    Nice work as always. When you mentioned the formatting improvements for the future the toLocaleString() method comes to mind. I'll leave an MDN link and let you figure out if it's useful.

    https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString

    Marked as helpful
  • James•390
    @neenreva

    I think the report is mostly due to the live link needing to be fixed. In the Github repository hit the settings tab and find the 'pages' section. Select your main branch and save. Resubmit the new live link in the challenge and refresh the view.

    Marked as helpful
  • James•390
    @neenreva

    Overall this renders pretty well. The few things I see are the drop shadow on the payment button and the alignment of the card. The accessibility issues are something you'll have to add in the html. Semantic html is something I'm new to as well but you'll quickly see that it helps organize and ends up being more readable for others looking at your code. It will also help with SEO and users that may use screen readers. I'll leave a link that is a quick reference.

    https://www.w3schools.com/html/html5_semantic_elements.asp

  • James•390
    @neenreva

    Very good overall. Take this for what it's worth because I'm a noob myself. I noticed that some of your colors were off. Are you getting the values they give in the style-guide? If not those will bring this to almost perfect. Keep it up!

    Marked as helpful