About Us page #70
|
@ -1,11 +1,14 @@
|
||||||
.bubble {
|
.bubble {
|
||||||
padding: calc(36rem / 16) 0;
|
padding: calc(36rem / 16) 0;
|
||||||
margin: calc(64rem / 16) 0;
|
margin: calc(64rem / 16) 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bubble:nth-child(odd) {
|
||||||
background-color: var(--blue-1-20);
|
background-color: var(--blue-1-20);
|
||||||
max-width: 5000px !important;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.bubble > * {
|
.bubble > * {
|
||||||
margin: 2rem auto;
|
margin: 2rem auto;
|
||||||
max-width: calc(800rem / 16);
|
max-width: calc(800rem / 16);
|
||||||
|
padding: 0 calc(24rem / 16);
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,10 +1,11 @@
|
||||||
import React, { ReactNode } from "react";
|
import React from "react";
|
||||||
|
import { DefaultLayout } from "./DefaultLayout";
|
||||||
import styles from "./Bubble.module.css";
|
import styles from "./Bubble.module.css";
|
||||||
|
|
||||||
export default function Bubble(props: { children: React.ReactNode }) {
|
export default function Bubble(props: { children: React.ReactNode }) {
|
||||||
return <DefaultLayout> {props.children} </DefaultLayout>;
|
return (
|
||||||
}
|
<div className={styles.bubble}>
|
||||||
|
<DefaultLayout>{props.children}</DefaultLayout>
|
||||||
function DefaultLayout(props: { children: React.ReactNode }) {
|
</div>
|
||||||
return <div className={styles.bubble}>{props.children}</div>;
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1,6 @@
|
||||||
|
.defaultLayout {
|
||||||
|
margin: 0 auto;
|
||||||
|
max-width: calc(800rem / 16);
|
||||||
|
padding: 0 calc(20rem / 16);
|
||||||
|
padding-bottom: calc(20rem / 16);
|
||||||
|
}
|
|
@ -0,0 +1,6 @@
|
||||||
|
import React from "react";
|
||||||
|
import styles from "./DefaultLayout.module.css";
|
||||||
|
|
||||||
|
export function DefaultLayout(props: { children: React.ReactNode }) {
|
||||||
|
return <div className={styles.defaultLayout}>{props.children}</div>;
|
||||||
|
}
|
|
@ -6,7 +6,7 @@ CS Club is working towards bridging the gap between each and every CS student, t
|
||||||
|
|
||||||
</Bubble>
|
</Bubble>
|
||||||
|
|
||||||
<div>
|
<Bubble>
|
||||||
|
|
||||||
## Our Vision
|
## Our Vision
|
||||||
|
|
||||||
|
@ -16,7 +16,7 @@ CS Club is working towards bridging the gap between each and every CS student, t
|
||||||
|
|
||||||
3. Community: Encouraging interpersonal relationships through community building and social events for all computing students.
|
3. Community: Encouraging interpersonal relationships through community building and social events for all computing students.
|
||||||
|
|
||||||
</div>
|
</Bubble>
|
||||||
|
|
||||||
<Bubble>
|
<Bubble>
|
||||||
|
|
||||||
|
@ -28,13 +28,13 @@ By recreating what CS Club means for our community, we're passionate about helpi
|
||||||
|
|
||||||
</Bubble>
|
</Bubble>
|
||||||
|
|
||||||
<div>
|
<Bubble>
|
||||||
|
|
||||||
## Our Mission
|
## Our Mission
|
||||||
|
|
||||||
The CS Club team is devoted to providing you with all the resources you could need as a student. We want to create a community that members can call home, to make it a place where you can reach out for career advice, for academic help, or even just to socialize. To fulfil this mission, we'll be running events and initiatives throughout the term, so please check out our Events page to stay updated!
|
The CS Club team is devoted to providing you with all the resources you could need as a student. We want to create a community that members can call home, to make it a place where you can reach out for career advice, for academic help, or even just to socialize. To fulfil this mission, we'll be running events and initiatives throughout the term, so please check out our Events page to stay updated!
|
||||||
|
|
||||||
</div>
|
</Bubble>
|
||||||
|
|
||||||
<Bubble>
|
<Bubble>
|
||||||
|
|
||||||
|
|
|
@ -10,10 +10,3 @@
|
||||||
.contentContainer {
|
.contentContainer {
|
||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
.defaultLayout {
|
|
||||||
margin: 0 auto;
|
|
||||||
max-width: calc(800rem / 16);
|
|
||||||
padding: 0 calc(20rem / 16);
|
|
||||||
padding-bottom: calc(20rem / 16);
|
|
||||||
}
|
|
||||||
|
|
|
@ -6,6 +6,7 @@ import { ThemeProvider } from "../components/theme";
|
||||||
import { Navbar } from "../components/Navbar";
|
import { Navbar } from "../components/Navbar";
|
||||||
import { Footer } from "../components/Footer";
|
import { Footer } from "../components/Footer";
|
||||||
import { Link } from "../components/Link";
|
import { Link } from "../components/Link";
|
||||||
|
import { DefaultLayout } from "../components/DefaultLayout";
|
||||||
import styles from "./_app.module.css";
|
import styles from "./_app.module.css";
|
||||||
|
|
||||||
import "./_app.css";
|
import "./_app.css";
|
||||||
|
@ -32,10 +33,6 @@ export default function App({ Component, pageProps }: AppProps): JSX.Element {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
function DefaultLayout(props: { children: React.ReactNode }) {
|
|
||||||
return <div className={styles.defaultLayout}>{props.children}</div>;
|
|
||||||
}
|
|
||||||
|
|
||||||
type PageComponent = NextComponentType<
|
type PageComponent = NextComponentType<
|
||||||
NextPageContext,
|
NextPageContext,
|
||||||
unknown,
|
unknown,
|
||||||
|
|
|
@ -20,11 +20,6 @@
|
||||||
color: black;
|
color: black;
|
||||||
}
|
}
|
||||||
|
|
||||||
.text > * {
|
|
||||||
margin: 2rem auto;
|
|
||||||
max-width: calc(806rem / 16);
|
|
||||||
}
|
|
||||||
|
|
||||||
.flexBox {
|
.flexBox {
|
||||||
margin: 2rem auto;
|
margin: 2rem auto;
|
||||||
max-width: calc(806rem / 16);
|
max-width: calc(806rem / 16);
|
||||||
|
@ -74,6 +69,7 @@
|
||||||
color: var(--blue-2);
|
color: var(--blue-2);
|
||||||
font-size: 24px;
|
font-size: 24px;
|
||||||
}
|
}
|
||||||
|
/*for temp mailing list components*/
|
||||||
|
|
||||||
@media only screen and (max-width: calc(768rem / 16)) {
|
@media only screen and (max-width: calc(768rem / 16)) {
|
||||||
.bubble:nth-child(odd) {
|
.bubble:nth-child(odd) {
|
||||||
|
|
Loading…
Reference in New Issue