Ucalgary_Baja/BajaUofCWebsite
4
0
Fork 0
mirror of https://github.com/UofCBaja/BajaUofCWebsite.git synced 2025-06-16 05:44:17 -06:00
Code Issues Packages Projects Releases Wiki Activity

OurSponsor page done need more css

Browse Source
This commit is contained in:
darkicewolf50 2023-11-25 16:12:02 -07:00
parent 8fc923ffd4
commit fd5fec73a9
4 changed files with 118 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
package-lock.json generated
View File

@ -15,7 +15,7 @@
"react": "^18.2.0", "react": "^18.2.0",
"react-dom": "^18.2.0", "react-dom": "^18.2.0",
"react-native": "^0.72.6", "react-native": "^0.72.6",
"react-router-dom": "^6.17.0", "react-router-dom": "^6.20.0",
"react-scripts": "5.0.1", "react-scripts": "5.0.1",
"web-vitals": "^2.1.4" "web-vitals": "^2.1.4"
} }
@ -4540,9 +4540,9 @@
} }
}, },
"node_modules/@remix-run/router": { "node_modules/@remix-run/router": {
"version": "1.10.0", "version": "1.13.0",
"resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.10.0.tgz", "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.13.0.tgz",
"integrity": "sha512-Lm+fYpMfZoEucJ7cMxgt4dYt8jLfbpwRCzAjm9UgSLOkmlqo9gupxt6YX3DY0Fk155NT9l17d/ydi+964uS9Lw==", "integrity": "sha512-5dMOnVnefRsl4uRnAdoWjtVTdh8e6aZqgM4puy9nmEADH72ck+uXwzpJLEKE9Q6F8ZljNewLgmTfkxUrBdv4WA==",
"engines": { "engines": {
"node": ">=14.0.0" "node": ">=14.0.0"
} }
@ -18253,11 +18253,11 @@
} }
}, },
"node_modules/react-router": { "node_modules/react-router": {
"version": "6.17.0", "version": "6.20.0",
"resolved": "https://registry.npmjs.org/react-router/-/react-router-6.17.0.tgz", "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.20.0.tgz",
"integrity": "sha512-YJR3OTJzi3zhqeJYADHANCGPUu9J+6fT5GLv82UWRGSxu6oJYCKVmxUcaBQuGm9udpWmPsvpme/CdHumqgsoaA==", "integrity": "sha512-pVvzsSsgUxxtuNfTHC4IxjATs10UaAtvLGVSA1tbUE4GDaOSU1Esu2xF5nWLz7KPiMuW8BJWuPFdlGYJ7/rW0w==",
"dependencies": { "dependencies": {
"@remix-run/router": "1.10.0" "@remix-run/router": "1.13.0"
}, },
"engines": { "engines": {
"node": ">=14.0.0" "node": ">=14.0.0"
@ -18267,12 +18267,12 @@
} }
}, },
"node_modules/react-router-dom": { "node_modules/react-router-dom": {
"version": "6.17.0", "version": "6.20.0",
"resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.17.0.tgz", "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.20.0.tgz",
"integrity": "sha512-qWHkkbXQX+6li0COUUPKAUkxjNNqPJuiBd27dVwQGDNsuFBdMbrS6UZ0CLYc4CsbdLYTckn4oB4tGDuPZpPhaQ==", "integrity": "sha512-CbcKjEyiSVpA6UtCHOIYLUYn/UJfwzp55va4yEfpk7JBN3GPqWfHrdLkAvNCcpXr8QoihcDMuk0dzWZxtlB/mQ==",
"dependencies": { "dependencies": {
"@remix-run/router": "1.10.0", "@remix-run/router": "1.13.0",
"react-router": "6.17.0" "react-router": "6.20.0"
}, },
"engines": { "engines": {
"node": ">=14.0.0" "node": ">=14.0.0"

2
package.json
View File

@ -10,7 +10,7 @@
"react": "^18.2.0", "react": "^18.2.0",
"react-dom": "^18.2.0", "react-dom": "^18.2.0",
"react-native": "^0.72.6", "react-native": "^0.72.6",
"react-router-dom": "^6.17.0", "react-router-dom": "^6.20.0",
"react-scripts": "5.0.1", "react-scripts": "5.0.1",
"web-vitals": "^2.1.4" "web-vitals": "^2.1.4"
}, },

48
src/OurSponsors/OurSponsors.css Normal file
View File

@ -0,0 +1,48 @@
#OurSponsors {
display: flex;
flex-direction: column;
justify-content: center;
}
#OurSponsors div div {
display: flex;
flex-direction: column;
justify-content: center;
width: 80%;
padding-left: 10%;
}
#OurSponsors div div div div img {
display: flex;
justify-content: left;
}
#OurSponsors div div p {
display: flex;
justify-content: left;
}
#OurSponsors div div div div {
padding: 0%;
display: flex;
flex-direction: column;
justify-content: left;
}
#OurSponsors div div div {
display: flex;
flex-direction: row;
justify-content: end;
padding: 0%;
width: 100%;
}
#OurSponsors h2 {
background-color: aquamarine;
text-align: center;
}
#OurSponsors h3 {
text-align: left;
}

110
src/OurSponsors/OurSponsors.js
View File

@ -1,4 +1,4 @@
import './OurSponsors.css'
const OurSponsors = () => { const OurSponsors = () => {
/* /*
OurSponsors Page OurSponsors Page
@ -21,18 +21,20 @@ const OurSponsors = () => {
*/ */
const tempListOfSponsors = { const tempListOfSponsors = {
"Main Tier": { "Main Tier": {
"Name":"", 1:{
"LogoUrl":"", "Name":"Hello",
"Url":"", "LogoUrl":"",
"DescriptionAboutSponsor":"this has text i dont care", "Url":"",
"DecriptionOnHelp":"this has text i dont care" "DescriptionAboutSponsor":"this has text i dont care",
"DecriptionOnHelp":"this has text i dont care"
}
}, },
"Platnum Tier": { "Platnum Tier": {
1:{ 1:{
"Name":"Schulich School of Engineering", "Name":"Schulich School of Engineering",
"LogoUrl":"https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQj9L3ZGK6WtOmJbzxmCzRxwLXYKGC5SDcAKHb0ScfbUmbtG0IujQt6eQDaI_Pm9g4DZvc&usqp=CAU", "LogoUrl":"https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQj9L3ZGK6WtOmJbzxmCzRxwLXYKGC5SDcAKHb0ScfbUmbtG0IujQt6eQDaI_Pm9g4DZvc&usqp=CAU",
"Url":"https://schulich.ucalgary.ca/", "Url":"https://schulich.ucalgary.ca/",
"DescriptionAboutSponsor":"this has text i dont care", "DescriptionAboutSponsor":"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce eu magna in diam consectetur rhoncus vel nec turpis. Sed finibus mi eu sem varius faucibus. Donec semper erat et bibendum pharetra. Suspendisse cursus lorem sed nisi semper, a rutrum nunc luctus. Nunc ullamcorper enim id orci interdum ultrices. Donec vestibulum nunc vel nisl pretium tempus. Morbi quis ante et ligula eleifend eleifend. Proin bibendum maximus elit vitae congue. Vivamus egestas, ex in tempor posuere, ligula nunc iaculis massa, in imperdiet dui justo eu dolor. Nullam placerat velit quis sem mattis, laoreet pharetra elit tempor. ",
"DecriptionOnHelp":"this has text i dont care" "DecriptionOnHelp":"this has text i dont care"
}, },
2:{ 2:{
@ -48,79 +50,79 @@ const OurSponsors = () => {
"Name":"", "Name":"",
"LogoUrl":"", "LogoUrl":"",
"Url":"", "Url":"",
"DescriptionAboutSponsor":"this has text i dont care" "DescriptionAboutSponsor":"this has text i dont care",
"DecriptionOnHelp":"this has text i dont care"
}, },
2:{ 2:{
"Name":"", "Name":"",
"LogoUrl":"", "LogoUrl":"data:image/png;base64,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",
"Url":"", "Url":"",
"DescriptionAboutSponsorAboutSponsor":"this has text i dont care", "DescriptionAboutSponsor":"1this has text i dont care",
"DecriptionOnHelp":"this has text i dont care" "DecriptionOnHelp":"2this has text i dont care"
} }
}, },
"Silver Tier": { "Silver Tier": {
1:{ 1:{
"Name":"", "Name":"Father",
"LogoUrl":"", "LogoUrl":"",
"Url":"", "Url":""
"DescriptionAboutSponsorAboutSponsor":"Dont get this", //"DescriptionAboutSponsor":"", //Dont get this
"DecriptionOnHelp":"Dont get this" //"DecriptionOnHelp":"" //Dont get this
}, },
2:{ 2:{
"Name":"", "Name":"Help",
"LogoUrl":"", "LogoUrl":"",
"Url":"", "Url":""
"DescriptionAboutSponsorAboutSponsor":"Dont get this", //"DescriptionAboutSponsor":"", //Dont get this
"DecriptionOnHelp":"Dont get this" //"DecriptionOnHelp":"" //Dont get this
} }
}, },
"Bronze Tier":{ "Bronze Tier":{
1:{ 1:{
"Name":"", "Name":"I'm",
"LogoUrl":"Dont get this", //"LogoUrl":"", //Dont get this
"Url":"", "Url":""
"DescriptionAboutSponsorAboutSponsor":"Dont get this", //"DescriptionAboutSponsor":"", //Dont get this
"DecriptionOnHelp":"Dont get this" //"DecriptionOnHelp":"" //Dont get this
}, },
2:{ 2:{
"Name":"", "Name":"Stuck to a cactus",
"LogoUrl":"Dont get this", //"LogoUrl":"", //Dont get this
"Url":"", "Url":""
"DescriptionAboutSponsorAboutSponsor":"Dont get this", //"DescriptionAboutSponsor":"", //Dont get this
"DecriptionOnHelp":"Dont get this" //"DecriptionOnHelp":"" //Dont get this
} }
} }
}; };
console.log("It ran");
return tempListOfSponsors; return tempListOfSponsors;
} }
const dictOfSponsors = getSponsors(); const dictOfSponsors = getSponsors();
//to fix make each of these a function and return the proper //to fix make each of these a function and return the proper
return <> return (<div id='OurSponsors'>
{if (dictOfSponsors["Main Tier"] != null) { {Object.keys(dictOfSponsors).map((sponsorTier) => (
<> <div key={sponsorTier} className={sponsorTier}>
<h2>Main Tier</h2> <h2>{sponsorTier}</h2>
<a href={dictOfSponsors["Main Tier"]["Url"]}><img src={dictOfSponsors["Main Tier"]["LogoUrl"]}></img></a> {Object.keys(dictOfSponsors[sponsorTier]).map((sponsorKey) => {
<h3>{dictOfSponsors["Main Tier"]["Name"]}</h3> const sponsor = dictOfSponsors[sponsorTier][sponsorKey];
<p>{dictOfSponsors["Main Tier"]["DescriptionAboutSponsor"]}</p> return (
<p>{dictOfSponsors["Main Tier"]["DecriptionOnHelp"]}</p> <div key={sponsorKey}>
</> <div>
} <div>
} {sponsor.Name && <h3>{sponsor.Name}</h3>}
{for(let i = 0; i < Object.keys(dictOfSponsors).length; i++) { {sponsor.LogoUrl && <a href={sponsor.Url}><img src={sponsor.LogoUrl} alt="Sponsor Logo" /></a>}
<> </div>
<h2>{Object.keys(dictOfSponsors)[i]}</h2> {(sponsor.DescriptionAboutSponsor !== undefined && sponsor.DecriptionOnHelp !== undefined) && <p>Another Element</p>}
</> </div>
{for(let j = 0; j < Object.keys(dictOfSponsors[i]).length): j++){ {sponsor.DescriptionAboutSponsor !== undefined && <p>{sponsor.DescriptionAboutSponsor}</p>}
<> {sponsor.DecriptionOnHelp !== undefined && <p>{sponsor.DecriptionOnHelp}</p>}
<a href={dictOfSponsors[i][j]["Url"]}><img src={dictOfSponsors[i][j]["LogoUrl"]}></img></a> </div>
<h3>{dictOfSponsors[i][j]["Name"]}</h3> );
<p>{dictOfSponsors[i][j]["DescriptionAboutSponsor"]}</p> })}
<p>{dictOfSponsors[i][j]["DecriptionOnHelp"]}</p> </div>
</> ))}
}} </div>);
}}
</>;
}; };