Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat: main footer #44

Open
wants to merge 14 commits into
base: main
Choose a base branch
from
+251 −27
Open

feat: main footer #44

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
14 commits
Select commit Hold shift + click to select a range
06930a4
feat: complete for pc version
AfonsoMartins26 Oct 19, 2024
c9f7969
feat: changed structure to match design for mobile and desktop
RicoPleasure Nov 23, 2024
63f8d4d
feat: implement corrections to avoid repeated code
RicoPleasure Nov 23, 2024
7c49769
feat: add links for social media images
RicoPleasure Nov 24, 2024
c2dd6cd
correction: implement links properly
RicoPleasure Nov 24, 2024
4a953d0
feat: corrections to pass checks
RicoPleasure Nov 24, 2024
57b7a67
Merge branch 'main' into am/mainfooter
RicoPleasure Nov 26, 2024
e5f2a03
feat: add internationalization to footer
RicoPleasure Nov 26, 2024
4226234
fix: delete duplicated file
RicoPleasure Nov 26, 2024
3feb333
fix: social icons
RicoPleasure Nov 27, 2024
34a8554
fix: css classes
RicoPleasure Nov 28, 2024
aa2a3e5
chore: improvements
RicoPleasure Nov 28, 2024
2d61209
format
RicoPleasure Nov 28, 2024
33f4e3b
fix: pass checks
RicoPleasure Nov 28, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5,493 changes: 5,493 additions & 0 deletions package-lock.json
View file
Open in desktop
RicoPleasure marked this conversation as resolved.
Show resolved Hide resolved

Large diffs are not rendered by default.

3 changes: 3 additions & 0 deletions public/cesium.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions public/facebook.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions public/github.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions public/instagram.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions public/twitter.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions public/youtube.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
9 changes: 7 additions & 2 deletions src/app/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,15 +1,20 @@
import DepartmentCard from "@/components/department-card";
import Footer from "@/components/footer";

export default function Home() {
return (
<main className="h-screen w-screen flex-col items-center justify-center overflow-scroll p-5">
<div className="space-y-4">
<main className="h-screen w-screen flex-col items-center justify-center overflow-scroll">
<div className="space-y-4 p-5">
<DepartmentCard type="caos" />
<DepartmentCard type="dmc" />
<DepartmentCard type="drem" />
<DepartmentCard type="ped" />
<DepartmentCard type="rec" />
</div>
<div className="w-full">
<Footer />
</div>
</main>

);
}
112 changes: 112 additions & 0 deletions src/components/footer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,112 @@
import React from 'react';
RicoPleasure marked this conversation as resolved.
Show resolved Hide resolved

RicoPleasure marked this conversation as resolved.
Show resolved Hide resolved
const Footer = () => {
const sections = [
{
title: 'CeSIUM',
items: ['Notícias', 'Sobre Nós', 'Equipa', 'Departamentos']
},
{
title: 'Atividades',
items: ['Projetos', 'Eventos', 'Parcerias']
},
{
title: 'Estudantes',
items: ['Torna-te sócio', 'Torna-te colaborador', 'Anuário']
},
{
title: 'Links Úteis',
items: ['Calendarium', 'Blackboard', 'Portal do Aluno', 'Página de LEI']
}
];

RicoPleasure marked this conversation as resolved.
Show resolved Hide resolved
return (
<footer className="flex flex-col place-items-center sm:place-items-end sm:flex-row mt-8 pt-[40px] pb-[80px] px-[20px] sm:px-[30px] md:px-[80px] bg-[#EBEBEB]">
<div className="flex flex-col space-y-[22px] sm:flex sm:flex-col-reverse sm:w-1/2 max-w-[500px] sm:max-w-max w-full justify-center">
<div className="space-y-6 sm:w-80 sm:mt-[50px] w-full">
<img src="cesium.svg" alt="" className="text-sm w-[32.13px] h-[36.81]" />
<p className="text-gray text-[14px] leading-[16.9px]">CeSIUM - Centro de Estudantes de Engenharia Informática da Universidade do Minho</p>
<div className="flex justify-left space-x-[18px] h-[30px]">
<img src="facebook.svg" alt="Facebook" className="w-[25px] h-[25px]"/>
<img src="instagram.svg" alt="instagram" className="w-[25px] h-[25px]"/>
<img src="twitter.svg" alt="twitter" className="w-[25px] h-[25px]"/>
<img src="github.svg" alt="github" className="w-[25px] h-[25px]"/>
<img src="youtube.svg" alt="youtube" className="w-[25px] h-[25px]"/>
RicoPleasure marked this conversation as resolved.
Show resolved Hide resolved
</div>
</div>
<div className="flex space-x-[25px] sm:space-x-0 sm:min-w-[600px]">
{/* Left */}
<div className="flex flex-col space-y-[32px] sm:flex-row sm:space-y-0 sm:space-x-[50px] w-full sm:w-[300px]">
<div className="space-y-[15px]">
<h3 className="mb-4 text-black">{sections[0]?.title}</h3>
<ul className="space-y-[14px]">
<li className=""><a className="text-[14px] text-gray">{sections[0]?.items[0]}</a></li>
<li className=""><a className="text-[14px] text-gray">{sections[0]?.items[1]}</a></li>
<li className=""><a className="text-[14px] text-gray">{sections[0]?.items[2]}</a></li>
<li className=""><a className="text-[14px] text-gray">{sections[0]?.items[3]}</a></li>
</ul>
</div>
<div className="space-y-[15px] sm:hidden">
<h3 className="mb-4 text-black">{sections[2]?.title}</h3>
<ul className="space-y-[15px]">
<li className=""><a className="text-[14px] text-gray">{sections[2]?.items[0]}</a></li>
<li className=""><a className="text-[14px] text-gray">{sections[2]?.items[1]}</a></li>
<li className=""><a className="text-[14px] text-gray">{sections[2]?.items[2]}</a></li>
<li className=""><a className="text-[14px] text-gray">{sections[2]?.items[3]}</a></li>
</ul>
</div>
<div className="space-y-[15px] hidden sm:block">
<h3 className="mb-4 text-black">{sections[1]?.title}</h3>
<ul className="space-y-[15px]">
<li className=""><a className="text-[14px] text-gray">{sections[1]?.items[0]}</a></li>
<li className=""><a className="text-[14px] text-gray">{sections[1]?.items[1]}</a></li>
<li className=""><a className="text-[14px] text-gray">{sections[1]?.items[2]}</a></li>
<li className=""><a className="text-[14px] text-gray">{sections[1]?.items[3]}</a></li>
</ul>
</div>
</div>
{/* Right */}
<div className="flex flex-col space-y-[32px] sm:flex-row sm:space-y-0 w-full sm:w-[300px]">
<div className="space-y-[15px] sm:hidden">
<h3 className="mb-4 text-black">{sections[1]?.title}</h3>
<ul className="space-y-[15px]">
<li className=""><a className="text-[14px] text-gray">{sections[1]?.items[0]}</a></li>
<li className=""><a className="text-[14px] text-gray">{sections[1]?.items[1]}</a></li>
<li className=""><a className="text-[14px] text-gray">{sections[1]?.items[2]}</a></li>
<li className=""><a className="text-[14px] text-gray">{sections[1]?.items[3]}</a></li>
</ul>
</div>
<div className="space-y-[15px] hidden sm:block mr-[50px]">
<h3 className="mb-4 text-black">{sections[2]?.title}</h3>
<ul className="space-y-[15px]">
<li className=""><a className="text-[14px] text-gray">{sections[2]?.items[0]}</a></li>
<li className=""><a className="text-[14px] text-gray">{sections[2]?.items[1]}</a></li>
<li className=""><a className="text-[14px] text-gray">{sections[2]?.items[2]}</a></li>
<li className=""><a className="text-[14px] text-gray">{sections[2]?.items[3]}</a></li>
</ul>
</div>
<div className="space-y-[15px]">
<h3 className="mb-4 text-black">{sections[3]?.title}</h3>
<ul className="space-y-[15px]">
<li className=""><a className="text-[14px] text-gray">{sections[3]?.items[0]}</a></li>
<li className=""><a className="text-[14px] text-gray">{sections[3]?.items[1]}</a></li>
<li className=""><a className="text-[14px] text-gray">{sections[3]?.items[2]}</a></li>
<li className=""><a className="text-[14px] text-gray">{sections[3]?.items[3]}</a></li>
</ul>
</div>
RicoPleasure marked this conversation as resolved.
Show resolved Hide resolved
</div>
</div>
</div>
<div className="flex flex-col sm:place-items-end sm:place-content-end w-full">
<div className="border h-0 my-[32px] border-stroke sm:hidden"></div>
<div className="flex flex-col sm:place-items-end">
<span className="text-gray text-[14px]">Braga, Portugal</span>
<span className="text-gray text-[14px]">Telefone: +351 253 604 448</span>
<span className="text-gray text-[14px]">Email: [email protected]</span>
RicoPleasure marked this conversation as resolved.
Show resolved Hide resolved
</div>
</div>
</footer>
);
};

export default Footer;