From 945af9e749d78b7b31c1f7b335e1f8d8b6c1ebd9 Mon Sep 17 00:00:00 2001 From: EmmaaBerg Date: Mon, 21 Feb 2022 18:28:56 +0100 Subject: [PATCH 01/12] fetch all my repos --- code/script.js | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/code/script.js b/code/script.js index e69de29b..a2be9e22 100644 --- a/code/script.js +++ b/code/script.js @@ -0,0 +1,8 @@ +const username = 'EmmaaBerg' +const API_URL_REPOS = `https://api.github.com/users/${username}/repos` + +fetch(API_URL_REPOS) +.then((resp) => resp.json()) +.then((allRepos) =>{ + console.log(allRepos) +}) From dda965468ffe6c9deb6339f94bce13123f1ee4da Mon Sep 17 00:00:00 2001 From: EmmaaBerg Date: Tue, 22 Feb 2022 20:00:08 +0100 Subject: [PATCH 02/12] Filtered the forked projects from Technigo --- code/script.js | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/code/script.js b/code/script.js index a2be9e22..5c383fb3 100644 --- a/code/script.js +++ b/code/script.js @@ -5,4 +5,14 @@ fetch(API_URL_REPOS) .then((resp) => resp.json()) .then((allRepos) =>{ console.log(allRepos) + + //A function for filtering out the forked projects from technigo. + //Repo is the "name for each object" in the array. Fork and name are two properties within + // the object + const forkedRepos = allRepos.filter((repo) => repo.fork && repo.name.startsWith('project-')) + console.log(forkedRepos); }) + + + + From d6107a37cd18c2b1d1bd8298fbb6138a79bf52df Mon Sep 17 00:00:00 2001 From: EmmaaBerg Date: Wed, 23 Feb 2022 15:46:56 +0100 Subject: [PATCH 03/12] fetched all the pullrequests from Technigo and filtered out the ones thats mine --- code/script.js | 35 ++++++++++++++++++++++++----------- 1 file changed, 24 insertions(+), 11 deletions(-) diff --git a/code/script.js b/code/script.js index 5c383fb3..50687a94 100644 --- a/code/script.js +++ b/code/script.js @@ -2,17 +2,30 @@ const username = 'EmmaaBerg' const API_URL_REPOS = `https://api.github.com/users/${username}/repos` fetch(API_URL_REPOS) -.then((resp) => resp.json()) -.then((allRepos) =>{ - console.log(allRepos) + .then((resp) => resp.json()) + .then((allRepos) => { + console.log(allRepos) - //A function for filtering out the forked projects from technigo. - //Repo is the "name for each object" in the array. Fork and name are two properties within - // the object - const forkedRepos = allRepos.filter((repo) => repo.fork && repo.name.startsWith('project-')) + //A function for filtering out the forked projects from technigo. + //Repo is the "name for each object" in the array. Fork and name are two properties within + // the object + const forkedRepos = allRepos.filter((repo) => repo.fork && repo.name.startsWith('project-')) console.log(forkedRepos); -}) - - - + pullRequests(forkedRepos); + }) +const pullRequests = (forkedRepos) => { + forkedRepos.forEach(repo => { + fetch('https://api.github.com/repos/Technigo/' + repo.name + '/pulls') + .then(res => res.json()) + .then(pullReqs => { + //console.log(pullReqs);// loop foeach data รคr en array + pullReqs.forEach(pull => { + if (pull.user.login === username){ + console.log(pull) + + } + }) + }) + }) +} \ No newline at end of file From b6a5b09d5aac95ad3406377935e1823413718fcc Mon Sep 17 00:00:00 2001 From: EmmaaBerg Date: Wed, 23 Feb 2022 18:39:39 +0100 Subject: [PATCH 04/12] fetched profile picture and username --- code/index.html | 12 +++++++++-- code/script.js | 57 +++++++++++++++++++++++++++++++++++++++++++------ 2 files changed, 60 insertions(+), 9 deletions(-) diff --git a/code/index.html b/code/index.html index 2fb5e0ae..6a06df59 100644 --- a/code/index.html +++ b/code/index.html @@ -8,9 +8,17 @@ -

GitHub Tracker

+
+

GitHub Tracker

Projects:

-
+ + +
+
+ +
+ +
diff --git a/code/script.js b/code/script.js index 50687a94..0654087e 100644 --- a/code/script.js +++ b/code/script.js @@ -1,6 +1,25 @@ +//DOM selectors +const profileInfo = document.getElementById('profile') + const username = 'EmmaaBerg' +const API_USER = `https://api.github.com/users/${username}` const API_URL_REPOS = `https://api.github.com/users/${username}/repos` +//Function to get the username and profilepicture +const userInfo = () => { + fetch(API_USER) + .then((res) => res.json()) + .then(profile => { + profileInfo.innerHTML = ` + +

${profile.name}

+ ` + }) +} + +//Invok the userInfo function +userInfo() + fetch(API_URL_REPOS) .then((resp) => resp.json()) .then((allRepos) => { @@ -14,18 +33,42 @@ fetch(API_URL_REPOS) pullRequests(forkedRepos); }) + + + + const pullRequests = (forkedRepos) => { - forkedRepos.forEach(repo => { + forkedRepos.forEach((repo) => { fetch('https://api.github.com/repos/Technigo/' + repo.name + '/pulls') - .then(res => res.json()) - .then(pullReqs => { + .then((res) => res.json()) + .then((pullReqs) => { //console.log(pullReqs);// loop foeach data รคr en array - pullReqs.forEach(pull => { - if (pull.user.login === username){ + pullReqs.forEach((pull) => { + if (pull.user.login === username) { console.log(pull) - + comments(pull); + commits(pull); } }) }) + }) -} \ No newline at end of file +} +//function to get review comments for each project +const comments = (pullReq) => { + //console.log(pullReq) + fetch(pullReq.review_comments_url) + .then((res) => res.json()) + .then((rewComment) => { + console.log(rewComment); + }) +} + +//function to get commit number for each project +const commits = (pullReq) => { + fetch(pullReq.commits_url) + .then((res) => res.json()) + .then((commitNumber) => { + console.log(commitNumber) + }) +} From d6bbe934e4d6aa9597d61b944699f5a60b4c9783 Mon Sep 17 00:00:00 2001 From: EmmaaBerg Date: Wed, 23 Feb 2022 21:54:07 +0100 Subject: [PATCH 05/12] added innerHTML to display the project names, latest push, default branch and a link to the GitHub repo --- code/index.html | 3 +-- code/script.js | 31 ++++++++++++++++++++++--------- 2 files changed, 23 insertions(+), 11 deletions(-) diff --git a/code/index.html b/code/index.html index 6a06df59..7be169f4 100644 --- a/code/index.html +++ b/code/index.html @@ -9,8 +9,7 @@
-

GitHub Tracker

-

Projects:

+
diff --git a/code/script.js b/code/script.js index 0654087e..82926d6c 100644 --- a/code/script.js +++ b/code/script.js @@ -1,5 +1,6 @@ //DOM selectors const profileInfo = document.getElementById('profile') +const allProjects = document.getElementById('projects') const username = 'EmmaaBerg' const API_USER = `https://api.github.com/users/${username}` @@ -11,6 +12,7 @@ const userInfo = () => { .then((res) => res.json()) .then(profile => { profileInfo.innerHTML = ` +

GitHub Tracker

${profile.name}

` @@ -23,20 +25,23 @@ userInfo() fetch(API_URL_REPOS) .then((resp) => resp.json()) .then((allRepos) => { - console.log(allRepos) - //A function for filtering out the forked projects from technigo. //Repo is the "name for each object" in the array. Fork and name are two properties within // the object const forkedRepos = allRepos.filter((repo) => repo.fork && repo.name.startsWith('project-')) - console.log(forkedRepos); + forkedRepos.forEach((repo) => { + allProjects.innerHTML += ` +
+
Project Name: ${repo.name}
+

Latest push: ${repo.pushed_at}

+

Main branch: ${repo.default_branch}

+ ${repo.name} +
+ ` + }) pullRequests(forkedRepos); }) - - - - const pullRequests = (forkedRepos) => { forkedRepos.forEach((repo) => { fetch('https://api.github.com/repos/Technigo/' + repo.name + '/pulls') @@ -45,10 +50,17 @@ const pullRequests = (forkedRepos) => { //console.log(pullReqs);// loop foeach data รคr en array pullReqs.forEach((pull) => { if (pull.user.login === username) { - console.log(pull) comments(pull); commits(pull); } + + + allProjects.innerHTML += ` +
+

Commit messages: ${pullReq.commits_url.length}

+ +
+ ` }) }) @@ -69,6 +81,7 @@ const commits = (pullReq) => { fetch(pullReq.commits_url) .then((res) => res.json()) .then((commitNumber) => { - console.log(commitNumber) + console.log(commitNumber[commitNumber.length]) }) } + From ac5905781d3f2b261d0900c5a51d7997e944283b Mon Sep 17 00:00:00 2001 From: EmmaaBerg Date: Fri, 25 Feb 2022 15:26:14 +0100 Subject: [PATCH 06/12] added commits number for each repo, and changed the structure of the fetches --- code/script.js | 127 ++++++++++++++++++++++++++++++------------------- 1 file changed, 79 insertions(+), 48 deletions(-) diff --git a/code/script.js b/code/script.js index 82926d6c..ea8eaf91 100644 --- a/code/script.js +++ b/code/script.js @@ -3,85 +3,116 @@ const profileInfo = document.getElementById('profile') const allProjects = document.getElementById('projects') const username = 'EmmaaBerg' -const API_USER = `https://api.github.com/users/${username}` +const API_PROFILE = `https://api.github.com/users/${username}` const API_URL_REPOS = `https://api.github.com/users/${username}/repos` //Function to get the username and profilepicture -const userInfo = () => { - fetch(API_USER) +const userProfile = () => { + fetch(API_PROFILE) .then((res) => res.json()) - .then(profile => { - profileInfo.innerHTML = ` + .then(profileData => { + profileInfo.innerHTML += `

GitHub Tracker

- -

${profile.name}

+ +

${profileData.name}

+

${profileData.login}

` }) } -//Invok the userInfo function -userInfo() - -fetch(API_URL_REPOS) - .then((resp) => resp.json()) - .then((allRepos) => { - //A function for filtering out the forked projects from technigo. - //Repo is the "name for each object" in the array. Fork and name are two properties within - // the object - const forkedRepos = allRepos.filter((repo) => repo.fork && repo.name.startsWith('project-')) - forkedRepos.forEach((repo) => { - allProjects.innerHTML += ` +// Repos +const repositories = () => { + fetch(API_URL_REPOS) + .then((resp) => resp.json()) + .then((allRepos) => { + //A function for filtering out the forked projects from technigo. + //Repo is the "name for each object" in the array. Fork and name are two properties within + // the object + const forkedRepos = allRepos.filter((repo) => repo.fork && repo.name.startsWith('project-')) + + forkedRepos.forEach((repo) => { + allProjects.innerHTML += ` ` + commits(repo.commits_url, repo.name) + }) + //Add newDate to make 'latest push' look more readable + //A dynamic id added to be able to use the data in the pullrequest-function + pullRequests(forkedRepos); + }) - pullRequests(forkedRepos); - }) +} const pullRequests = (forkedRepos) => { forkedRepos.forEach((repo) => { - fetch('https://api.github.com/repos/Technigo/' + repo.name + '/pulls') + const PULL_PR = `https://api.github.com/repos/Technigo/${repo.name}/pulls? + per_page=100` + + fetch(PULL_PR) .then((res) => res.json()) .then((pullReqs) => { - //console.log(pullReqs);// loop foeach data รคr en array + let groupProject = true pullReqs.forEach((pull) => { - if (pull.user.login === username) { - comments(pull); - commits(pull); - } + if (pull.user.login === username){ + groupProject = false + document.getElementById(`pull-${repo.name}`).innerHTML = ` + Go to pull request + ` + } - - allProjects.innerHTML += ` -
-

Commit messages: ${pullReq.commits_url.length}

- -
- ` }) - }) + if (groupProject === true){ + document.getElementById(`pull-${repo.name}`).innerHTML = ` +

No pull request, group project

+ ` + } + + /* const myPullRequests = pullReqs.find((pullReqs) => + pullReqs.user.login === repo.owner.login) + + if (myPullRequests) { + commits(myPullRequests.commits_url, repo.name) + } else { + document.getElementById(`commit-${repo.name}`).innerHTML = '' + } + + })*/ + }) }) } + +//function to get commit number for each project +const commits = (myCommits, repoName) => { + let commitUrl = myCommits.replace('{/sha}','') + fetch(commitUrl) + .then((res) => res.json()) + .then((commitNumber) => { + document.getElementById(`commit-${repoName}`).innerHTML += commitNumber.length; + }) +} + + //function to get review comments for each project -const comments = (pullReq) => { +/*const comments = (pullReq) => { //console.log(pullReq) fetch(pullReq.review_comments_url) .then((res) => res.json()) .then((rewComment) => { console.log(rewComment); }) -} +}*/ -//function to get commit number for each project -const commits = (pullReq) => { - fetch(pullReq.commits_url) - .then((res) => res.json()) - .then((commitNumber) => { - console.log(commitNumber[commitNumber.length]) - }) -} + + +//Invok the userProfile function and repositorie fetch +userProfile() +repositories() From 353ce946130b159082322a3b9445347d89c3b46c Mon Sep 17 00:00:00 2001 From: EmmaaBerg Date: Fri, 25 Feb 2022 17:53:55 +0100 Subject: [PATCH 07/12] added a chart to display my project progress --- code/chart.js | 24 ++++++++++++++++++++++++ code/index.html | 10 ++++++---- code/script.js | 1 + 3 files changed, 31 insertions(+), 4 deletions(-) diff --git a/code/chart.js b/code/chart.js index 92e85a30..725aab7d 100644 --- a/code/chart.js +++ b/code/chart.js @@ -2,3 +2,27 @@ const ctx = document.getElementById('chart').getContext('2d') //"Draw" the chart here ๐Ÿ‘‡ +const drawChart = (amount) => { + const data = { + labels: [ + 'Completed projects', + 'Remaining project' + ], + datasets: [ + { + backgroundColor: ['green', 'red'], + data: [amount, 19 - amount], + hoverOffSet: 4, + }, + ], + }; + + const config = { + type: 'doughnut', + data: data + }; + const myChart = new Chart(ctx, config); +} + + + diff --git a/code/index.html b/code/index.html index 7be169f4..2fa4a540 100644 --- a/code/index.html +++ b/code/index.html @@ -6,6 +6,7 @@ Project GitHub Tracker +
@@ -15,14 +16,15 @@
+ + + +
- - - - + \ No newline at end of file diff --git a/code/script.js b/code/script.js index ea8eaf91..3d70248d 100644 --- a/code/script.js +++ b/code/script.js @@ -46,6 +46,7 @@ const repositories = () => { //Add newDate to make 'latest push' look more readable //A dynamic id added to be able to use the data in the pullrequest-function pullRequests(forkedRepos); + drawChart(forkedRepos.length); }) } From e4acf5748bd7f615fda3e86db311460ab92fbcfa Mon Sep 17 00:00:00 2001 From: EmmaaBerg Date: Sun, 27 Feb 2022 20:47:44 +0100 Subject: [PATCH 08/12] added CSS and media queries --- code/chart.js | 7 +- code/index.html | 26 +++++--- code/script.js | 22 ++++--- code/style.css | 168 +++++++++++++++++++++++++++++++++++++++++++++++- 4 files changed, 201 insertions(+), 22 deletions(-) diff --git a/code/chart.js b/code/chart.js index 725aab7d..2deac33c 100644 --- a/code/chart.js +++ b/code/chart.js @@ -3,14 +3,15 @@ const ctx = document.getElementById('chart').getContext('2d') //"Draw" the chart here ๐Ÿ‘‡ const drawChart = (amount) => { + console.log("Draw chart with amount: " + amount) const data = { labels: [ - 'Completed projects', - 'Remaining project' + 'Completed', + 'Remaining' ], datasets: [ { - backgroundColor: ['green', 'red'], + backgroundColor: ['#A8DADC', '#457B9D'], data: [amount, 19 - amount], hoverOffSet: 4, }, diff --git a/code/index.html b/code/index.html index 2fa4a540..ce3db7d7 100644 --- a/code/index.html +++ b/code/index.html @@ -4,24 +4,32 @@ - Project GitHub Tracker + Project 7: GitHub Tracker + + + -
+
+

My GitHub Tracker

+
- +
+ +
+
+
+
+ + +
+
- - - - -
-
diff --git a/code/script.js b/code/script.js index 3d70248d..b13c0d4d 100644 --- a/code/script.js +++ b/code/script.js @@ -12,10 +12,11 @@ const userProfile = () => { .then((res) => res.json()) .then(profileData => { profileInfo.innerHTML += ` -

GitHub Tracker

- + profile image of Emma Berg +

${profileData.name}

${profileData.login}

+
` }) } @@ -32,13 +33,16 @@ const repositories = () => { forkedRepos.forEach((repo) => { allProjects.innerHTML += ` -
-

Project Name: ${repo.name}

-

Latest push: ${new Date(repo.pushed_at).toLocaleString('en-GB', {dateStyle:'short',})}

-

Default branch: ${repo.default_branch}

- ${repo.name} -

-

Commits:

+
+
+

${repo.name}

+
+
    +

  • Latest push: ${new Date(repo.pushed_at).toLocaleString('sv-SE', {dateStyle:'short',})}

    • +

  • Default branch: ${repo.default_branch}

    • +

    • +

  • Commits:

    • +
` commits(repo.commits_url, repo.name) diff --git a/code/style.css b/code/style.css index 7c8ad447..ad506e41 100644 --- a/code/style.css +++ b/code/style.css @@ -1,3 +1,169 @@ +/* Global CSS variables for colors */ +:root { + --primary: #F1FAEE; + --secondary: #A8DADC; + --tertiary:#1D3557; +} + +* { + box-sizing: border-box; + margin: 0; +} + body { - background: #FFECE9; + background: var(--primary); + color: var(--tertiary); + font-family: 'Roboto', sans-serif; +} + +/* Header styling */ +header { + background: var(--secondary); + color: var(--primary); + width: 100vw; + min-height: 25vh; + display: flex; + flex-direction: column; +} + +h1{ + font-size: 1.5rem; + text-transform: uppercase; + text-align: center; + margin-top: 2rem; + padding: 0.5rem; +} + +/* Main page */ +.container { + display: flex; + flex-direction: column; +} + +/* Profile section */ +.profile-container { + display: flex; + flex-direction: column; + align-items: center; + margin-top: 2rem; + margin-bottom: 1rem; + +} + +img { + border-radius: 50%; + max-width: 20vw; + border: 2px solid var(--secondary); +} + +.profile-name h3{ + font-size: 1rem; + text-align: center; + padding: 0.5rem; +} + +.profile-name h4 { + font-size: 0.8rem; + text-align: center; +} + +.profil-name h4, a { + text-decoration: none; + color: inherit; +} + +.chart-container { + max-width: 20vh; + max-height: 20vh; + margin-bottom: 1rem; +} + + +/* Styling of the project section */ +.projects { + display: flex; + flex-direction: column; + align-items: center; + margin: 2rem; +} +.card { + background-color: var(--primary); + width: 60vw; + border: 2px solid var(--tertiary); + padding: 1.2rem; + margin: 0.5rem; + box-shadow: 4px 6px 6px #36454F; +} + +.card h3 { +text-transform: uppercase; +text-align: center; +} + +.card:hover { + background-color: var(--tertiary); + color: var(--primary); + border: 5px solid var(--secondary); +} + +.card a:hover { + color: var(--secondary); +} + + +/* Media for tablet */ +@media screen and (min-width: 768px) { + + h1{ + font-size: 3rem; + } + + .profile-name h3{ + font-size: 1.5rem; + } + + .profile-name h4 { + font-size: 1rem; + } + + .profile-container { + display: flex; + flex-direction: row; + justify-content: space-evenly; + } + + .chart-container { + min-width: 20vw; + min-height: 20vh; +} + +.projects { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 0.5rem; + place-items: center; +} + +.card { + max-width: 40vw; +} + +} + +/* Media for desktop */ +@media screen and (min-width:1024px) { + .projects { + display: grid; + grid-template-columns: repeat(2, 1fr); + grid-template-rows: (auto, 1fr); + gap: 0.2rem; + align-items: center; + } + + .card { + max-width: 30vw; + + } + + } \ No newline at end of file From 6893f0d497cf630375ed272cb5f7e5706cc5b4d9 Mon Sep 17 00:00:00 2001 From: EmmaaBerg Date: Sun, 27 Feb 2022 20:50:39 +0100 Subject: [PATCH 09/12] changed width of heading to get rid off horizontal scrollbar --- code/style.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/code/style.css b/code/style.css index ad506e41..5314b6b7 100644 --- a/code/style.css +++ b/code/style.css @@ -20,7 +20,7 @@ body { header { background: var(--secondary); color: var(--primary); - width: 100vw; + width: 100%; min-height: 25vh; display: flex; flex-direction: column; From bce6d984eff01d01f6cfe009c026e5f45637564d Mon Sep 17 00:00:00 2001 From: EmmaaBerg Date: Sun, 27 Feb 2022 21:25:51 +0100 Subject: [PATCH 10/12] cleaned up the code and added some comments --- code/index.html | 4 +-- code/script.js | 69 +++++++++++++++---------------------------------- code/style.css | 11 +++----- 3 files changed, 27 insertions(+), 57 deletions(-) diff --git a/code/index.html b/code/index.html index ce3db7d7..77db8134 100644 --- a/code/index.html +++ b/code/index.html @@ -17,7 +17,7 @@

My GitHub Tracker

- +
@@ -27,9 +27,9 @@

My GitHub Tracker

+
-
diff --git a/code/script.js b/code/script.js index b13c0d4d..a4068c43 100644 --- a/code/script.js +++ b/code/script.js @@ -12,8 +12,8 @@ const userProfile = () => { .then((res) => res.json()) .then(profileData => { profileInfo.innerHTML += ` - profile image of Emma Berg -
+ profile image of Emma Berg +

${profileData.name}

${profileData.login}

@@ -33,25 +33,23 @@ const repositories = () => { forkedRepos.forEach((repo) => { allProjects.innerHTML += ` -
-
-

${repo.name}

-
-
    -

  • Latest push: ${new Date(repo.pushed_at).toLocaleString('sv-SE', {dateStyle:'short',})}

    • -

  • Default branch: ${repo.default_branch}

    • -

    • -

  • Commits:

    • -
-
- ` +
+
+

${repo.name}

+
+
    +

  • Latest push: ${new Date(repo.pushed_at).toLocaleString('sv-SE', { dateStyle: 'short', })}

    • +

  • Default branch: ${repo.default_branch}

    • +

    • +

  • Commits:

    • +
+
+ ` commits(repo.commits_url, repo.name) }) - //Add newDate to make 'latest push' look more readable - //A dynamic id added to be able to use the data in the pullrequest-function pullRequests(forkedRepos); drawChart(forkedRepos.length); - + }) } @@ -65,38 +63,26 @@ const pullRequests = (forkedRepos) => { .then((pullReqs) => { let groupProject = true pullReqs.forEach((pull) => { - if (pull.user.login === username){ + if (pull.user.login === username) { groupProject = false document.getElementById(`pull-${repo.name}`).innerHTML = ` - Go to pull request - ` - } - + Go to pull request + ` + } }) - if (groupProject === true){ + if (groupProject === true) { document.getElementById(`pull-${repo.name}`).innerHTML = `

No pull request, group project

` } - - /* const myPullRequests = pullReqs.find((pullReqs) => - pullReqs.user.login === repo.owner.login) - - if (myPullRequests) { - commits(myPullRequests.commits_url, repo.name) - } else { - document.getElementById(`commit-${repo.name}`).innerHTML = '' - } - - })*/ }) }) } //function to get commit number for each project const commits = (myCommits, repoName) => { - let commitUrl = myCommits.replace('{/sha}','') + let commitUrl = myCommits.replace('{/sha}', '') fetch(commitUrl) .then((res) => res.json()) .then((commitNumber) => { @@ -104,19 +90,6 @@ const commits = (myCommits, repoName) => { }) } - -//function to get review comments for each project -/*const comments = (pullReq) => { - //console.log(pullReq) - fetch(pullReq.review_comments_url) - .then((res) => res.json()) - .then((rewComment) => { - console.log(rewComment); - }) -}*/ - - - //Invok the userProfile function and repositorie fetch userProfile() repositories() diff --git a/code/style.css b/code/style.css index 5314b6b7..7978e3e5 100644 --- a/code/style.css +++ b/code/style.css @@ -47,7 +47,6 @@ h1{ align-items: center; margin-top: 2rem; margin-bottom: 1rem; - } img { @@ -86,6 +85,7 @@ img { align-items: center; margin: 2rem; } + .card { background-color: var(--primary); width: 60vw; @@ -111,7 +111,7 @@ text-align: center; } -/* Media for tablet */ +/* Media query for tablet */ @media screen and (min-width: 768px) { h1{ @@ -150,7 +150,7 @@ text-align: center; } -/* Media for desktop */ +/* Media query for desktop */ @media screen and (min-width:1024px) { .projects { display: grid; @@ -162,8 +162,5 @@ text-align: center; .card { max-width: 30vw; - - } - - + } } \ No newline at end of file From ca85a283ad4ad453a043ef063043204c20995ffc Mon Sep 17 00:00:00 2001 From: EmmaaBerg Date: Sun, 27 Feb 2022 21:42:07 +0100 Subject: [PATCH 11/12] updated the README --- README.md | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) diff --git a/README.md b/README.md index 1613a3b0..efe5c0f7 100644 --- a/README.md +++ b/README.md @@ -1,13 +1,9 @@ # 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. +This weeks project was to create a GitHub tracker using Javascript and the GitHub API. ## 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? +I started the project with doing a list of all the things I wanted to fetch from the API. I then started to fetch that data. My main struggle this week was Javascript, I find it hard to know how to create more complex structure of it. To solve my problems I googled, used StackOverflow and programmed togheter with classmates. If I had more time I would like to fetch some more data to display on my page to practice to use Javascript more. ## 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. From 037b6521e4a6d7f06a1098e658910845ada7df2b Mon Sep 17 00:00:00 2001 From: Emma Berg <91280510+EmmaaBerg@users.noreply.github.com> Date: Sun, 27 Feb 2022 21:57:04 +0100 Subject: [PATCH 12/12] Update README.md Added a link to Netlify --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index efe5c0f7..b2119f63 100644 --- a/README.md +++ b/README.md @@ -6,4 +6,4 @@ This weeks project was to create a GitHub tracker using Javascript and the GitHu I started the project with doing a list of all the things I wanted to fetch from the API. I then started to fetch that data. My main struggle this week was Javascript, I find it hard to know how to create more complex structure of it. To solve my problems I googled, used StackOverflow and programmed togheter with classmates. If I had more time I would like to fetch some more data to display on my page to practice to use Javascript more. ## View it live - +https://emmas-github-tracker.netlify.app/