Skip to content
This repository has been archived by the owner on Mar 19, 2024. It is now read-only.

Commit

Permalink
Refactor page structure
Browse files Browse the repository at this point in the history
  • Loading branch information
JedHazaymeh committed Nov 21, 2023
1 parent af04817 commit f0e1fed
Show file tree
Hide file tree
Showing 10 changed files with 12,872 additions and 324 deletions.
11 changes: 0 additions & 11 deletions src/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,6 @@ import {
import Services from './components/pages/services/Services'
import Contact from './components/pages/contact/Contact'
import About from './components/pages/about/About'
import Events from './components/pages/events/Events'
import Join from './components/pages/join/Join'
import Footer from './components/footer/Footer'
import Gallery from './components/pages/gallery/Gallery'
Expand Down Expand Up @@ -43,7 +42,6 @@ function App() {
<Route path='/' exact component={Home} />
<Route path='/about' component={About} />
<Route path='/gallery' component={Gallery} />
<Route path='/events' component={Events} />
<Route path='/services' component={Services} />
<Route path='/contact' component={Contact} />
<Route path='/emergency' component={Emergency} />
Expand All @@ -56,12 +54,3 @@ function App() {
}

export default App

{
/* References
https://www.youtube.com/watch?v=cDwa_JwuC-w
https://www.youtube.com/watch?v=I2UBjN5ER4s&t=2562s
https://www.youtube.com/watch?v=IGzhnFDcSsw
*/
}
38 changes: 0 additions & 38 deletions src/components/Cards.js

This file was deleted.

53 changes: 53 additions & 0 deletions src/components/Events.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
import React from 'react'
import './Cards.css'
import CardItem from './CardItem'

function Events() {
return (
<div className='cards'>
<p class='content-title'>EVENTS</p>
<hr class='full'></hr>
<br />
<div className='cards__container'>
<div className='cards__wrapper'>
<ul className='cards__items'>
<CardItem
src='images/mail.jpg'
text='We offer mail events for all members of the society.'
label='Mail'
/>
<CardItem
src='images/hosting.jpg'
text='Host your own website on a subdomain of Redbrick, or bring your own!'
label='Hosting'
/>
<CardItem
src='images/learning.jpg'
text='Our servers have all the compilers and interpreters you need to learn new languages.'
label='Learning'
/>
</ul>
<ul className='cards__items'>
<CardItem
src='images/mail.jpg'
text='We offer mail events for all members of the society.'
label='Mail'
/>
<CardItem
src='images/hosting.jpg'
text='Host your own website on a subdomain of Redbrick, or bring your own!'
label='Hosting'
/>
<CardItem
src='images/learning.jpg'
text='Our servers have all the compilers and interpreters you need to learn new languages.'
label='Learning'
/>
</ul>
</div>
</div>
</div>
)
}

export default Events
39 changes: 39 additions & 0 deletions src/components/Services.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
import React from 'react'
import './Cards.css'
import CardItem from './CardItem'

function Services() {
return (
<div className='cards'>
<p class='content-title'>SERVICES</p>
<hr class='full'></hr>
<br />
<div className='cards__container'>
<div className='cards__wrapper'>
<ul className='cards__items'>
<CardItem
src='images/mail.jpg'
text='We offer mail services for all members of the society.'
label='Mail'
path='/services'
/>
<CardItem
src='images/hosting.jpg'
text='Host your own website on a subdomain of Redbrick, or bring your own!'
label='Hosting'
path='/services'
/>
<CardItem
src='images/learning.jpg'
text='Our servers have all the compilers and interpreters you need to learn new languages.'
label='Learning'
path='/services'
/>
</ul>
</div>
</div>
</div>
)
}

export default Services
13 changes: 0 additions & 13 deletions src/components/navbar/Navbar.js
Original file line number Diff line number Diff line change
Expand Up @@ -73,16 +73,6 @@ function Navbar() {
Gallery
</Link>
</li>
<li className='nav-item'>
<Link
to='/events'
className='nav-links'
onClick={closeMobileMenu}
>
Events
</Link>
</li>

<li className='nav-item'>
<Link
to='/services'
Expand All @@ -92,7 +82,6 @@ function Navbar() {
Services
</Link>
</li>

<li className='nav-item'>
<Link
to='/contact'
Expand All @@ -102,7 +91,6 @@ function Navbar() {
Contact
</Link>
</li>

<li className='nav-item'>
<Link
to='/emergency'
Expand All @@ -112,7 +100,6 @@ function Navbar() {
Emergency
</Link>
</li>

<li>
<a
href='https://dcuclubsandsocs.ie/society/redbrick'
Expand Down
144 changes: 86 additions & 58 deletions src/components/pages/about/About.js
Original file line number Diff line number Diff line change
@@ -1,63 +1,91 @@
import React from 'react';
import './About.css';
import '../../Cards.css';
import CardItem from '../../CardItem';
import { Link } from 'react-router-dom';
import CommitteeCards from '../../committee/CommitteeCards';
import React from 'react'
import './About.css'
import '../../Cards.css'
import CardItem from '../../CardItem'
import { Link } from 'react-router-dom'
import CommitteeCards from '../../committee/CommitteeCards'

export default function About() {
return (
<>
<div class='header'>
<img
src='images/about.jpg'
alt='Flying Kites'
className='header-image'
/>
<div class='header-text'>
<h1>About Us</h1>
</div>
</div>
<div id='about-redbrick'>
<p class='content-title'>About Redbrick</p>
<hr class='full'></hr>
<br />
<br />
<p class='content-text'>
Redbrick is{' '}
<a href='https://www.dcu.ie/' className='redirect-link'>
DCU's
</a>{' '}
Computer Networking society. We host events for everything
computing related this ranges from; how to setup your own
website and storing your photos online to System
Administration and Computer Programming Tutorials. We also
host a number of{' '}
<Link to='/services' className='redirect-link'>
services
</Link>{' '}
for our membership.
</p>
</div>

return (
<>
<div class="header">
<img src="images/about.jpg" alt="Flying Kites" className="header-image" />
<div class="header-text">
<h1>About Us</h1>
</div>
</div>
<div id="about-redbrick">
<p class="content-title">About Redbrick</p>
<hr class="full"></hr><br /><br />
<p class="content-text">Redbrick is <a href="https://www.dcu.ie/" className="redirect-link">DCU's</a> Computer Networking society. We host events for everything computing related this ranges from;
how to setup your own website and storing your photos online to System Administration and Computer Programming Tutorials.
We also host a number of <Link
to='/services'
className='redirect-link'
>
services
</Link> for our membership.</p>
</div>

<div id="history">

<p class="content-title">Brief History</p>
<hr class="full"></hr><br /><br />
<p class="content-text">In October of 1995 a group of friends started the ball rolling on the idea of a computer network in DCU,
run by students for the students. Starting out with a battered 386 PC (dubbed Nurse), bits of borrowed memory, their own cash,
and a lot of luck, they went about organising the DCU Networking Society. Once recognised as a society,
they were allowed to setup a temporary home for our server in the Computer Applications faculty. With the approval of John Boland,
the then head of Computer Services in DCU, the society received its own subnet, dubbed Redbrick, along with a physical area in which to store Nurse,
our one and only machine. Since April 9th 1996, when the machine went officially online, the society itself has grown rapidly. So rapidly in fact,
that we are one of the largest societies on/off campus!<br /><br />

Redbrick's social side has grown a lot also, with the society celebrating its 20th Anniversary back in April 2016.
The society continues to run their annual Freshers Ball, Halloween Party, Christmas Party and Tech Week throughout the year.<br /><br />

As one of the biggest societies in DCU, we're always looking for new membership. The membership fee itself is a paltry €4.00 until Clubs & Socs Day 2
(generally mid February) when the membership cost drops to €2.00! However outside of Clubs & Socs days it becomes a little awkward to sign up,
but it is more than doable - check here for details on how to pay. Our current main server is Azazel, with Pygmalion also providing login services to users.
See the Redbrick Hardware Inventory for descriptions of our servers and other equipment.</p>
</div>

<div id="committee">

<p class="content-title">Committee</p>
<hr class="full"></hr><br /><br />
<CommitteeCards />
</div>

</ >

);
<div id='history'>
<p class='content-title'>Brief History</p>
<hr class='full'></hr>
<br />
<br />
<p class='content-text'>
In October of 1995 a group of friends started the ball
rolling on the idea of a computer network in DCU, run by
students for the students. Starting out with a battered 386
PC (dubbed Nurse), bits of borrowed memory, their own cash,
and a lot of luck, they went about organising the DCU
Networking Society. Once recognised as a society, they were
allowed to setup a temporary home for our server in the
Computer Applications faculty. With the approval of John
Boland, the then head of Computer Services in DCU, the
society received its own subnet, dubbed Redbrick, along with
a physical area in which to store Nurse, our one and only
machine. Since April 9th 1996, when the machine went
officially online, the society itself has grown rapidly. So
rapidly in fact, that we are one of the largest societies
on/off campus!
<br />
<br />
Redbrick's social side has grown a lot also, with the
society celebrating its 20th Anniversary back in April 2016.
The society continues to run their annual Freshers Ball,
Halloween Party, Christmas Party and Tech Week throughout
the year.
<br />
<br />
As one of the biggest societies in DCU, we're always looking
for new membership. The membership fee itself is a paltry
€4.00 until Clubs & Socs Day 2 (generally mid February) when
the membership cost drops to €2.00! However outside of Clubs
& Socs days it becomes a little awkward to sign up, but it
is more than doable - check here for details on how to pay.
Our current main server is Azazel, with Pygmalion also
providing login services to users. See the Redbrick Hardware
Inventory for descriptions of our servers and other
equipment.
</p>
</div>

<div id='committee'>
<CommitteeCards />
</div>
</>
)
}
Loading

0 comments on commit f0e1fed

Please sign in to comment.