diff --git a/README.md b/README.md index 1613a3b0..d109fd10 100644 --- a/README.md +++ b/README.md @@ -2,12 +2,14 @@ Replace this readme with your own information about your project. -Start by briefly describing the assignment in a sentence or two. Keep it short and to the point. +Create a website where I can track my GitHub status that updates when something has been added or pushed. And also show how many commits and pull requests have been made by me. ## The problem -Describe how you approached to problem, and what tools and techniques you used to solve it. How did you plan? What technologies did you use? If you had more time, what would be next? +This was very hard and I still need to figure out how to use the dynamic ID to make everything work. As for now, my commits and pull requests does not show as I couldnt get them into the correct place in he innerHTML. Will continue to look into that and solve it. + + ## View it live -Every project should be deployed somewhere. Be sure to include the link to the deployed project so that the viewer can click around and see what it's all about. +https://competent-austin-d90803.netlify.app/ diff --git a/code/.gitignore b/code/.gitignore new file mode 100644 index 00000000..1c453411 --- /dev/null +++ b/code/.gitignore @@ -0,0 +1 @@ +token.js \ No newline at end of file diff --git a/code/chart.js b/code/chart.js index 92e85a30..bd873e21 100644 --- a/code/chart.js +++ b/code/chart.js @@ -1,4 +1,67 @@ + +Chart.defaults.font.size = 18 +Chart.defaults.font.family = 'Raleway, sans-serif'; +// Chart.defaults.font.family = 'monospace'; + //DOM-selector for the canvas 👇 const ctx = document.getElementById('chart').getContext('2d') //"Draw" the chart here 👇 + +const drawChart = (amount) => { +const labels = [ + 'Projects done', + 'Projects to be done', + + ]; + + const data = { + labels: labels, + datasets: [ { + label: 'My First dataset', + backgroundColor: ['rgb(131, 28, 147)', 'rgba(19, 115, 199, 0.776)' ], + borderColor: 'none', + data: [amount, 19-amount], + }] + }; + + const config = { + type: 'doughnut', + data: data, + options: { + responsive: true, + // maintainAspectRatio: false, + } +}; + +const myChart = new Chart( +document.getElementById('chart'), +config + +); + +}; + + + + + + + + + + + + + + +// const myChart = () => { +// const config = { +// type: 'doughnut', +// backgroundColor: [ +// '#1400D1', +// '#CEE6FF' +// ] + +// } +// } diff --git a/code/index.html b/code/index.html index 2fb5e0ae..4ac3fbee 100644 --- a/code/index.html +++ b/code/index.html @@ -4,18 +4,46 @@ -