From e7b4e0389a916a80cc08112733efe6bd0af5f15e Mon Sep 17 00:00:00 2001 From: thanksalot123 <56212275+thanksalot123@users.noreply.github.com> Date: Tue, 6 Oct 2020 18:59:46 +0530 Subject: [PATCH 1/6] done --- participants.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/participants.js b/participants.js index fc0aa92..eafeca8 100644 --- a/participants.js +++ b/participants.js @@ -68,8 +68,9 @@ function loadParticipants() { participant.skills.forEach((skill)=>{ listed += `
  • ${skill}
    • `; }) + const pokemon = "card-container"; const card = `
    -
    +
    ${participant.title} Date: Tue, 6 Oct 2020 20:57:53 +0530 Subject: [PATCH 2/6] issue for different card colours solve --- participants.css | 303 ++++++++++++++++++++++++++++++++++++++++++++++- participants.js | 69 ++++++++--- 2 files changed, 350 insertions(+), 22 deletions(-) diff --git a/participants.css b/participants.css index a39f331..ad5022f 100644 --- a/participants.css +++ b/participants.css @@ -32,11 +32,12 @@ p { line-height: 21px; } +/*from here lies the containers in order 0*/ .card-container { - background-color: #231e39; + background-color: #34495e; border-radius: 5px; box-shadow: 0px 10px 20px -10px rgba(0, 0, 0, 0.75); - color: #b3b8cd; + color: #c9d1d0; position: relative; width: 100%; text-align: center; @@ -65,6 +66,79 @@ p { } button.primary { + background-color: #2f3542; + border: 1px solid #2f3542; + border-radius: 3px; + color: #c9d1d0; + font-family: Montserrat, sans-serif; + font-weight: 500; + padding: 10px 25px; +} + +button.primary.ghost { + background-color: transparent; + color: #c9d1d0; + border: 2px solid #2f3542; +} + +.skills { + background-color: #2f3542; + text-align: left; + padding: 15px; + margin-top: 30px; + border-radius: 0 0 5px 5px; +} +.skills ul { + + list-style-type: none; + margin: 0; + padding: 0; +} + +.skills ul li { + border: 1px solid #c1d9d0; + border-radius: 2px; + display: inline-block; + font-size: 12px; + margin: 0 7px 7px 0; + padding: 7px; +} + + +/*from here lies the containers in order 1*/ +.card-container-1 { + background-color: #7157e2; + border-radius: 5px; + box-shadow: 0px 10px 20px -10px rgba(0, 0, 0, 0.75); + color: #b3b8cd; + position: relative; + width: 100%; + text-align: center; + padding-top: 40px; +} + +.card-container-1 .pro { + border-radius: 3px; + font-size: 14px; + font-weight: bold; + padding: 3px 7px; + position: absolute; + top: 15px; + left: 15px; +} + +.card-container-1 .round { + border-radius: 50%; + padding: 7px; + margin-left:2%; +} + +.round { + height: 150px; + width: 150px; +} + +button.primary-1 { background-color: #03bfcb; border: 1px solid #03bfcb; border-radius: 3px; @@ -74,25 +148,97 @@ button.primary { padding: 10px 25px; } -button.primary.ghost { +button.primary.ghost.one { background-color: transparent; color: #02899c; } -.skills { +.skills-1 { background-color: #1f1a36; text-align: left; padding: 15px; margin-top: 30px; + border-radius: 0 0 5px 5px; } -.skills ul { +.skills-1 ul { list-style-type: none; margin: 0; padding: 0; } -.skills ul li { +.skills-1 ul li { + border: 1px solid #2d2747; + border-radius: 2px; + display: inline-block; + font-size: 12px; + margin: 0 7px 7px 0; + padding: 7px; +} + +/*from here lies the containers in order 2*/ +.card-container-2 { + background-color: #231e39; + border-radius: 5px; + box-shadow: 0px 10px 20px -10px rgba(0, 0, 0, 0.75); + color: #b3b8cd; + position: relative; + width: 100%; + text-align: center; + padding-top: 40px; +} + +.card-container-2 .pro { + border-radius: 3px; + font-size: 14px; + font-weight: bold; + padding: 3px 7px; + position: absolute; + top: 15px; + left: 15px; +} + +.card-container-2 .round { + border-radius: 50%; + padding: 7px; + margin-left:2%; +} + +.round { + height: 150px; + width: 150px; +} + +button.primary-2 { + background-color: #03bfcb; + border: 1px solid #03bfcb; + border-radius: 3px; + color: #231e39; + font-family: Montserrat, sans-serif; + font-weight: 500; + padding: 10px 25px; +} + +button.primary.ghost.two { + background-color: transparent; + color: #02899c; +} + +.skills-2 { + background-color: #1f1a36; + text-align: left; + padding: 15px; + margin-top: 30px; + border-radius: 0 0 5px 5px; +} +.skills-2 ul { + + list-style-type: none; + margin: 0; + padding: 0; +} + +.skills-2 ul li { border: 1px solid #2d2747; border-radius: 2px; display: inline-block; @@ -101,6 +247,151 @@ button.primary.ghost { padding: 7px; } +/*from here lies the containers in order 3*/ +.card-container-3 { + background-color: #6F1E51; + border-radius: 5px; + box-shadow: 0px 10px 20px -10px rgba(0, 0, 0, 0.75); + color: #b3b8cd; + position: relative; + width: 100%; + text-align: center; + padding-top: 40px; +} + +.card-container-3 .pro { + border-radius: 3px; + font-size: 14px; + font-weight: bold; + padding: 3px 7px; + position: absolute; + top: 15px; + left: 15px; +} + +.card-container-3 .round { + border-radius: 50%; + padding: 7px; + margin-left:2%; +} + +.round { + height: 150px; + width: 150px; +} + +button.primary-3 { + background-color: rgb(80, 9, 54); + border: 1px solid rgb(80, 9, 54); + border-radius: 3px; + color: #aba9b6; + font-family: Montserrat, sans-serif; + font-weight: 500; + padding: 10px 25px; +} + +button.primary.ghost.three { + background-color: transparent; + color: #c9d1d0; + border: 2px solid rgb(80, 9, 54); +} + +.skills-3 { + background-color: rgb(80, 9, 54); + text-align: left; + padding: 15px; + margin-top: 30px; + border-radius: 0 0 5px 5px; +} +.skills-3 ul { + + list-style-type: none; + margin: 0; + padding: 0; +} + +.skills-3 ul li { + border: 1px solid #6F1E51; + border-radius: 2px; + display: inline-block; + font-size: 12px; + margin: 0 7px 7px 0; + padding: 7px; +} + +/*from here lies the containers in order 4*/ +.card-container-4 { + background-color: #b33939; + border-radius: 5px; + box-shadow: 0px 10px 20px -10px rgba(0, 0, 0, 0.75); + color: #c9d1d0; + position: relative; + width: 100%; + text-align: center; + padding-top: 40px; +} + +.card-container-4 .pro { + border-radius: 3px; + font-size: 14px; + font-weight: bold; + padding: 3px 7px; + position: absolute; + top: 15px; + left: 15px; +} + +.card-container-4 .round { + border-radius: 50%; + padding: 7px; + margin-left:2%; +} + +.round { + height: 150px; + width: 150px; +} + +button.primary-4 { + background-color: #8a1e1e; + border: 1px solid #8a1e1e; + border-radius: 3px; + color: #c1d9d0; + font-family: Montserrat, sans-serif; + font-weight: 500; + padding: 10px 25px; +} + +button.primary.ghost.four { + background-color: transparent; + color: #c9d1d0; + border: 2px solid #8a1e1e; +} + +.skills-4 { + background-color: #8a1e1e; + text-align: left; + padding: 15px; + margin-top: 30px; + border-radius: 0 0 5px 5px; +} +.skills-4 ul { + + list-style-type: none; + margin: 0; + padding: 0; +} + +.skills-4 ul li { + border: 2px solid #b33939; + border-radius: 2px; + display: inline-block; + font-size: 12px; + margin: 0 7px 7px 0; + padding: 7px; +} + + .h1-title { text-align: center; color: white; diff --git a/participants.js b/participants.js index 818bb0c..4e07bd4 100644 --- a/participants.js +++ b/participants.js @@ -73,7 +73,7 @@ const participants = [ "name": "Ritik Bhatt", "img": "https://instagram.fdel25-1.fna.fbcdn.net/v/t51.2885-19/s150x150/92552607_253205502534768_3668440788531937280_n.jpg?_nc_ht=instagram.fdel25-1.fna.fbcdn.net&_nc_ohc=5mjq2sUkGIkAX9_qxw0&oh=d87d022a92e08aa0d0f4cbb63bd20438&oe=5FA4070F", "title": "Noobie", - "year": "SE 2020", + "year": "BE - 2023", "linkedIn": "https://www.linkedin.com/in/ritik-bhatt-681266194/", "github": "https://github.com/bhattritik21", "skills":['Python','html','css'] , @@ -83,7 +83,7 @@ const participants = [ "name": "Akash Saxena", "img": "https://avatars3.githubusercontent.com/u/54790554?s=60&v=4", "title": "OSS Jt Sec", - "year": "SE - 2023", + "year": "BE - 2023", "linkedIn": "https://www.linkedin.com/company/open-source-software-club/", "github": "https://github.com/aitoss", "skills": ['ReactJs','Bootstrap','JS','HTML','CS'], @@ -93,6 +93,13 @@ const participants = [ "name": "Mayank Kumar", "img": "https://drive.google.com/file/d/1PG2h6PB0G9mm4SYoiE2kwLBwNeKXOkk7/view?usp=sharing", "title": "Participant", + "year": "BE - 2023", + "linkedIn": "#", + "github": "https://github.com/nishu91020", + "skills": ['basic development','github','sneaking'], + "description": "A Student of AIT" + }, + { "name": "Nishu Rai", "img": "https://avatars3.githubusercontent.com/u/54761473?s=460&u=70ff584a841f0748305e405fe3db9eca5ddd2608&v=4", "title": "Participant", @@ -106,7 +113,7 @@ const participants = [ "name":"Yashaswi Mailaru", "img":"https://avatars2.githubusercontent.com/u/68941273?s=460&v=4", "title":"Participant", - "year":"BE-2023", + "year":"BE - 2023", "linkedIn":"https://www.linkedin.com/in/yashaswi-mailaru-7b9169190/", "github":"https://github.com/Nullcoder9", "skills":['C++' , 'Nodejs'], @@ -146,7 +153,7 @@ const participants = [ "name": "Amit Bhagat", "img": "https://images.unsplash.com/photo-1518933165971-611dbc9c412d?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=500&q=60", "title": "Lets start opensource", - "year": "BE-2023", + "year": "BE - 2023", "linkedIn": "https://www.linkedin.com/in/amit-bhagat-860341192/", "github": "https://github.com/AmitBhagat3301", "skills": ["a learner"], @@ -176,7 +183,7 @@ const participants = [ "name": "Harish Bajiya", "img": "https://avatars2.githubusercontent.com/u/58135353?s=460&u=9909c0f062441abaaa86bc060dc8be622d3ff405&v=4", "title": "Tech Enthusiast", - "year": "BE - 2024", + "year": "BE - 2023", "linkedIn": "https://www.linkedin.com/company/open-source-software-club/", "github": "https://github.com/aitoss", "skills": ['Flutter', 'Vue.js'], @@ -286,7 +293,7 @@ const participants = [ "name":"Sachin Choudhary", "img":"https://avatars2.githubusercontent.com/u/54989437?s=460&u=b0a939329e8daa072469b228349c1e9927a29a30&v=4", "title":"Noobie", - "year":"BE-2023", + "year":"BE - 2023", "linkedIn":"https://www.linkedin.com/in/sachin-choudhary-7037381a9/", "github":"https://github.com/sachin-611", "skills":['C++','python'], @@ -326,7 +333,7 @@ const participants = [ "name": "Ankit Kumar", "img": "https://avatars0.githubusercontent.com/u/56212417?s=460&u=95a0155aade927a25bdc8d516d54c872a21ce1a0&v=4", "title": "OSS club Member", - "year": "SE 2020", + "year": "BE - 2023", "linkedIn": "https://www.linkedin.com/in/ankit-kumar-706243125/", "github": "https://github.com/cnarte", "skills": ['Tensorflow' ,'GCP', 'Flask','IBM-Qiskit'], @@ -336,7 +343,7 @@ const participants = [ "name": "DeOxYs", "img": "https://avatars3.githubusercontent.com/u/47062438?s=400&u=ab4cb37695763efe4297b2da4b7f97cd8f6f888b&v=4", "title": "Rookie", - "year": "SE 2020", + "year": "BE - 2023", "linkedIn": "https://www.linkedin.com/in/saheel-kumar-47ba691b5/", "github": "https://github.com/DeOxYs24", "skills": ['Not afraid of learning new tech'], @@ -346,7 +353,7 @@ const participants = [ "name": "Meghaj Singh", "img": "https://avatars0.githubusercontent.com/u/49283403?s=400&u=228bd9e514d69021dcae34d3d929c7b87381dbff&v=4", "title": "Coping up with Tech!", - "year": "BE-2022", + "year": "BE - 2022", "linkedIn" : "https://www.linkedin.com/in/meghaj-singh-545846167/", 'github': "https://github.com/memeghaj10", "skills": ['C++','Python','NLP & NLTK','Web Development using MERN stack','Data Science'], @@ -356,7 +363,7 @@ const participants = [ "name":"Sachin Choudhary", "img":"https://avatars2.githubusercontent.com/u/54989437?s=460&u=b0a939329e8daa072469b228349c1e9927a29a30&v=4", "title":"Noobie", - "year":"BE-2023", + "year":"BE - 2023", "linkedIn":"https://www.linkedin.com/in/sachin-choudhary-7037381a9/", "github":"https://github.com/sachin-611", "skills":['C++','python'], @@ -366,7 +373,7 @@ const participants = [ "name":"Anuranjan Pandey", "img":"https://avatars0.githubusercontent.com/u/53137708?s=400&u=88f891101c0a4b62095e5b8733f7670ebd8ee73d&v=4", "title":"Participant", - "year":"BE-2023", + "year":"BE - 2023", "linkedIn":"https://www.linkedin.com/in/anuranjan-pandey-8b8623140/", "github":"https://github.com/anuranjanpandey", "skills":['C++', 'Python'], @@ -404,7 +411,7 @@ const participants = [ "name": "Saheel Kumar", "img": "", "title": "Participant", - "year": "SE - 2020", + "year": "BE - 2023", "github": "https://github.com/Saheelkumar2410", "skills": ['A noobie trying my best'], "description": "Noobie" @@ -437,8 +444,38 @@ function loadParticipants() { participant.skills.forEach((skill) => { listed += `
  • ${skill}
    • `; }) + var containerr = "card-container"; + var skill = "skills"; + var buttoncl = "primary"; + var ghost = "primary ghost"; + + if(participant.year == "BE - 2024"){ + containerr = "card-container-1"; + skill = "skills-1"; + buttoncl = "primary-1"; + ghost = "primary ghost one"; + } + else if(participant.year == "BE - 2023"){ + containerr = "card-container-2"; + skill = "skills-2"; + buttoncl = "primary-2"; + ghost = "primary ghost"; + } + else if(participant.year == "BE - 2022"){ + containerr = "card-container-3"; + skill = "skills-3"; + buttoncl = "primary-3"; + ghost = "primary ghost three"; + } + else if(participant.year == "BE - 2021"){ + containerr = "card-container-4"; + skill = "skills-4"; + buttoncl = "primary-4"; + ghost = "primary ghost four"; + } + const card = `
    -
    +
    ${participant.title}
    - -
    -
    +
    Skills
      ${listed} From fd69b91a7ba747a3fdb93bd15432be4d24bd8706 Mon Sep 17 00:00:00 2001 From: thanksalot123 <56212275+thanksalot123@users.noreply.github.com> Date: Tue, 6 Oct 2020 21:05:50 +0530 Subject: [PATCH 3/6] did some changes and added coloured cards on the basis of graduating year --- participants.css | 32 +++++++++++++++++--------------- 1 file changed, 17 insertions(+), 15 deletions(-) diff --git a/participants.css b/participants.css index ad5022f..0444392 100644 --- a/participants.css +++ b/participants.css @@ -176,9 +176,11 @@ button.primary.ghost.one { padding: 7px; } + + /*from here lies the containers in order 2*/ .card-container-2 { - background-color: #231e39; + background-color: #6F1E51; border-radius: 5px; box-shadow: 0px 10px 20px -10px rgba(0, 0, 0, 0.75); color: #b3b8cd; @@ -210,10 +212,10 @@ button.primary.ghost.one { } button.primary-2 { - background-color: #03bfcb; - border: 1px solid #03bfcb; + background-color: rgb(80, 9, 54); + border: 1px solid rgb(80, 9, 54); border-radius: 3px; - color: #231e39; + color: #aba9b6; font-family: Montserrat, sans-serif; font-weight: 500; padding: 10px 25px; @@ -221,11 +223,12 @@ button.primary-2 { button.primary.ghost.two { background-color: transparent; - color: #02899c; + color: #c9d1d0; + border: 2px solid rgb(80, 9, 54); } .skills-2 { - background-color: #1f1a36; + background-color: rgb(80, 9, 54); text-align: left; padding: 15px; margin-top: 30px; @@ -239,7 +242,7 @@ button.primary.ghost.two { } .skills-2 ul li { - border: 1px solid #2d2747; + border: 1px solid #6F1E51; border-radius: 2px; display: inline-block; font-size: 12px; @@ -249,7 +252,7 @@ button.primary.ghost.two { /*from here lies the containers in order 3*/ .card-container-3 { - background-color: #6F1E51; + background-color: #231e39; border-radius: 5px; box-shadow: 0px 10px 20px -10px rgba(0, 0, 0, 0.75); color: #b3b8cd; @@ -281,10 +284,10 @@ button.primary.ghost.two { } button.primary-3 { - background-color: rgb(80, 9, 54); - border: 1px solid rgb(80, 9, 54); + background-color: #03bfcb; + border: 1px solid #03bfcb; border-radius: 3px; - color: #aba9b6; + color: #231e39; font-family: Montserrat, sans-serif; font-weight: 500; padding: 10px 25px; @@ -292,12 +295,11 @@ button.primary-3 { button.primary.ghost.three { background-color: transparent; - color: #c9d1d0; - border: 2px solid rgb(80, 9, 54); + color: #02899c; } .skills-3 { - background-color: rgb(80, 9, 54); + background-color: #1f1a36; text-align: left; padding: 15px; margin-top: 30px; @@ -311,7 +313,7 @@ button.primary.ghost.three { } .skills-3 ul li { - border: 1px solid #6F1E51; + border: 1px solid #2d2747; border-radius: 2px; display: inline-block; font-size: 12px; From 470480e50b1ddb24a4624aeaad7b2f03d774c1c0 Mon Sep 17 00:00:00 2001 From: thanksalot123 <56212275+thanksalot123@users.noreply.github.com> Date: Wed, 7 Oct 2020 09:10:34 +0530 Subject: [PATCH 4/6] solved some errors and added coloured cards successfully --- participants.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/participants.js b/participants.js index 4e07bd4..421425a 100644 --- a/participants.js +++ b/participants.js @@ -459,7 +459,7 @@ function loadParticipants() { containerr = "card-container-2"; skill = "skills-2"; buttoncl = "primary-2"; - ghost = "primary ghost"; + ghost = "primary ghost two"; } else if(participant.year == "BE - 2022"){ containerr = "card-container-3"; From 0437120e3d18d8d670f58f73df6c88ed847ffd2c Mon Sep 17 00:00:00 2001 From: thanksalot123 <56212275+thanksalot123@users.noreply.github.com> Date: Wed, 7 Oct 2020 09:17:43 +0530 Subject: [PATCH 5/6] done some changes and cards with colors added --- participants.js | 1 + 1 file changed, 1 insertion(+) diff --git a/participants.js b/participants.js index 421425a..3b97b9e 100644 --- a/participants.js +++ b/participants.js @@ -444,6 +444,7 @@ function loadParticipants() { participant.skills.forEach((skill) => { listed += `
    • ${skill}
      • `; }) + // variable classes var containerr = "card-container"; var skill = "skills"; var buttoncl = "primary"; From 49350becd96a402907b88c4822abe0739c524773 Mon Sep 17 00:00:00 2001 From: thanksalot123 <56212275+thanksalot123@users.noreply.github.com> Date: Wed, 7 Oct 2020 09:23:29 +0530 Subject: [PATCH 6/6] corrected some errors --- participants.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/participants.js b/participants.js index 3b97b9e..2f9a463 100644 --- a/participants.js +++ b/participants.js @@ -91,7 +91,7 @@ const participants = [ }, { "name": "Mayank Kumar", - "img": "https://drive.google.com/file/d/1PG2h6PB0G9mm4SYoiE2kwLBwNeKXOkk7/view?usp=sharing", + "img": "https://avatars3.githubusercontent.com/u/47062438?s=400&u=ab4cb37695763efe4297b2da4b7f97cd8f6f888b&v=4", "title": "Participant", "year": "BE - 2023", "linkedIn": "#",