diff --git a/.DS_Store b/.DS_Store
new file mode 100644
index 00000000..146c4eee
Binary files /dev/null and b/.DS_Store differ
diff --git a/.gitignore b/.gitignore
new file mode 100644
index 00000000..c80900c9
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1 @@
+code/secret.js
\ No newline at end of file
diff --git a/README.md b/README.md
index 1613a3b0..597bd84e 100644
--- a/README.md
+++ b/README.md
@@ -1,13 +1,10 @@
# GitHub Tracker
-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.
## 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?
## 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://dorotheas-tracker.netlify.app
\ No newline at end of file
diff --git a/code/.DS_Store b/code/.DS_Store
new file mode 100644
index 00000000..11b2e772
Binary files /dev/null and b/code/.DS_Store differ
diff --git a/code/assets/.DS_Store b/code/assets/.DS_Store
new file mode 100644
index 00000000..ded54e09
Binary files /dev/null and b/code/assets/.DS_Store differ
diff --git a/code/assets/GitHub-Mark-64px.png b/code/assets/GitHub-Mark-64px.png
new file mode 100644
index 00000000..182a1a3f
Binary files /dev/null and b/code/assets/GitHub-Mark-64px.png differ
diff --git a/code/assets/GitHub-Mark-Light-64px.png b/code/assets/GitHub-Mark-Light-64px.png
new file mode 100644
index 00000000..73db1f61
Binary files /dev/null and b/code/assets/GitHub-Mark-Light-64px.png differ
diff --git a/code/assets/bubble-1.png b/code/assets/bubble-1.png
new file mode 100644
index 00000000..031fb49a
Binary files /dev/null and b/code/assets/bubble-1.png differ
diff --git a/code/assets/bubble-2.png b/code/assets/bubble-2.png
new file mode 100644
index 00000000..68946f2a
Binary files /dev/null and b/code/assets/bubble-2.png differ
diff --git a/code/assets/bubble-3.svg b/code/assets/bubble-3.svg
new file mode 100644
index 00000000..8fedd1a1
--- /dev/null
+++ b/code/assets/bubble-3.svg
@@ -0,0 +1,11 @@
+
+
+
diff --git a/code/assets/bubble-4.svg b/code/assets/bubble-4.svg
new file mode 100644
index 00000000..b94f86a8
--- /dev/null
+++ b/code/assets/bubble-4.svg
@@ -0,0 +1,11 @@
+
+
+
diff --git a/code/assets/git_pull_request_icon_175163.svg b/code/assets/git_pull_request_icon_175163.svg
new file mode 100644
index 00000000..2345d094
--- /dev/null
+++ b/code/assets/git_pull_request_icon_175163.svg
@@ -0,0 +1,18 @@
+
+
+
diff --git a/code/assets/mulan.gif b/code/assets/mulan.gif
new file mode 100644
index 00000000..94c7ff47
Binary files /dev/null and b/code/assets/mulan.gif differ
diff --git a/code/assets/tvmask.png b/code/assets/tvmask.png
new file mode 100644
index 00000000..51cc3911
Binary files /dev/null and b/code/assets/tvmask.png differ
diff --git a/code/assets/tvmask.svg b/code/assets/tvmask.svg
new file mode 100644
index 00000000..85e0fb6f
--- /dev/null
+++ b/code/assets/tvmask.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/code/chart.js b/code/chart.js
index 92e85a30..41da61e5 100644
--- a/code/chart.js
+++ b/code/chart.js
@@ -1,4 +1,52 @@
+const counterDiv = document.querySelector('projectCounter');
+
+
+Chart.defaults.font.family = 'Miriam Libre, sans-serif';
+Chart.defaults.font.size = 12;
+
+const drawCounter = (finishedProjects) => {
+
+ counterDiv.innerHTML += `Finished projects: ${finishedProjects}
Projects to go: ${19-finishedProjects}`
+
+}
+
//DOM-selector for the canvas 👇
const ctx = document.getElementById('chart').getContext('2d')
//"Draw" the chart here 👇
+const drawChart = (finishedProjects) => {
+
+
+ const data = {
+ labels: ['Finished','Unfinished'],
+ datasets: [{
+ label: 'My First dataset',
+ backgroundColor: [
+ '#211d31d2',
+ '#FFFFFF',
+ ],
+
+ borderWidth: '0',
+ data: [finishedProjects, 19-finishedProjects],
+ }]
+ };
+
+ const config = {
+ type: 'pie',
+ data: data,
+ options: {
+ plugins: {
+
+ legend: {
+ display: false
+ },
+ },
+ responsive: true,
+
+ }
+
+ };
+
+ const myChart = new Chart( ctx, config );
+
+}
diff --git a/code/index.html b/code/index.html
index 2fb5e0ae..11bb5e5f 100644
--- a/code/index.html
+++ b/code/index.html
@@ -4,18 +4,84 @@
-