{header}
+ {text && ( +{text}
+ )} +Yhteistyössä:
+
+ 
+ {props.children}
-);
-
class Accordion extends React.Component
+
-
);
}
}
diff --git a/src/components/Accordion/AccordionIcon.tsx b/src/components/Accordion/AccordionIcon.tsx
new file mode 100644
index 0000000..25d5e4c
--- /dev/null
+++ b/src/components/Accordion/AccordionIcon.tsx
@@ -0,0 +1,36 @@
+import React from "react";
+import styled from "styled-components";
+import { colors } from "../../theme/colors";
+
+interface AccordionIconProps {
+ open: boolean;
+}
+
+const Icon = styled.div`
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ background-color: ${(p) => p.open ? colors.orange1 : colors.blue1};
+ color: ${colors.white};
+ min-width: 40px;
+ max-width: 40px;
+ min-height: 40px;
+ max-height: 40px;
+ margin: 0.2em;
+ font-size: 40px;
+
+ ${(p) => p.open && (`
+ span {
+ transform: rotate(45deg);
+ }
+ `)}
+
+`;
+
+const AccordionIcon: React.FC = ({ open } ) => (
+
+ +
+
+);
+
+export default AccordionIcon;
diff --git a/src/components/Accordion/index.ts b/src/components/Accordion/index.ts
deleted file mode 100644
index f653ec7..0000000
--- a/src/components/Accordion/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-import Accordion from "./Accordion";
-export default Accordion;
diff --git a/src/components/AccordionIcon/AccordionIcon.scss b/src/components/AccordionIcon/AccordionIcon.scss
deleted file mode 100644
index 7933042..0000000
--- a/src/components/AccordionIcon/AccordionIcon.scss
+++ /dev/null
@@ -1,29 +0,0 @@
-@import "../../assets/scss/globals";
-
-
-.accordion-icon {
- display: flex;
- background-color: color(blue1);
- color: color(white1);
- align-items: center;
- justify-content: center;
- min-width: 40px;
- max-width: 40px;
- min-height: 40px;
- max-height: 40px;
- margin: 0.2em;
- font-size: 40px;
-
- &.open {
- background-color: color(orange1);
- }
-}
-
-.accordion-text {
- &.open {
- -webkit-transform: rotate(45deg);
- -moz-transform: rotate(45deg);
- -o-transform: rotate(45deg);
- transform: rotate(45deg);
- }
-}
diff --git a/src/components/AccordionIcon/AccordionIcon.tsx b/src/components/AccordionIcon/AccordionIcon.tsx
deleted file mode 100644
index 753a7ad..0000000
--- a/src/components/AccordionIcon/AccordionIcon.tsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import React from "react";
-import "./AccordionIcon.scss";
-
-export interface AccordionIconProps {
- open: boolean;
-}
-export interface AccordionIconState {}
-
-class AccordionIcon extends React.Component {
- render() {
- const { open } = this.props;
- return (
- {
+ to: string;
+}
+
+const Anchor: React.FC = ({ to, ...props }) => {
+ if (to.startsWith("/")) {
+ return (
+
+ );
+ } else if (to.startsWith("#")) {
+ return (
+ {
- to: string;
-}
-
-class Anchor extends React.Component {
- render() {
- const { children, to, ...props } = this.props;
-
- if (to.startsWith("/")) {
- return (
- {children}
- );
- } else if (to.startsWith("#")) {
- return (
- {children}
- );
- }
- else {
- return (
- {children}
- );
- }
- }
-}
-export default Anchor;
diff --git a/src/components/Anchor/index.ts b/src/components/Anchor/index.ts
deleted file mode 100644
index dcc717e..0000000
--- a/src/components/Anchor/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-import Anchor from "./Anchor";
-export default Anchor;
diff --git a/src/components/AsideSection/AsideSection.scss b/src/components/AsideSection/AsideSection.scss
deleted file mode 100644
index 80f731a..0000000
--- a/src/components/AsideSection/AsideSection.scss
+++ /dev/null
@@ -1,10 +0,0 @@
-@import "../../assets/scss/globals";
-
-
-.aside-section {
- display: flex;
- flex: 1;
- flex-flow: column;
- justify-content: space-between;
- padding: 3rem 4rem;
-}
diff --git a/src/components/AsideSection/AsideSection.tsx b/src/components/AsideSection/AsideSection.tsx
deleted file mode 100644
index 9dce772..0000000
--- a/src/components/AsideSection/AsideSection.tsx
+++ /dev/null
@@ -1,25 +0,0 @@
-import React from "react";
-import "./AsideSection.scss";
-import ColorDiv, { ColorDivProps } from "../ColorDiv/ColorDiv";
-
-export interface AsideSectionProps {
- className?: string;
-}
-export interface AsideSectionState { }
-
-class AsideSection extends React.Component {
- render() {
- const { children, className, ...props } = this.props;
- const classNames = [
- "aside-section",
- ];
- if (className) classNames.push(className);
- return (
-
- {children}
-
- );
- }
-}
-
-export default AsideSection;
diff --git a/src/components/AsideSection/index.ts b/src/components/AsideSection/index.ts
deleted file mode 100644
index a8a5279..0000000
--- a/src/components/AsideSection/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-import AsideSection from "./AsideSection";
-export default AsideSection;
diff --git a/src/components/Card.tsx b/src/components/Card.tsx
new file mode 100644
index 0000000..7199742
--- /dev/null
+++ b/src/components/Card.tsx
@@ -0,0 +1,119 @@
+import React from "react";
+import styled from "styled-components";
+import { colors } from "@theme/colors";
+import Anchor from "@components/Anchor";
+
+interface WrappedCardProps {
+ title: string;
+ start_time: string;
+ text: string;
+ link: string;
+ image?: string;
+ imageAlt?: string;
+ buttonOnClick?: () => void;
+}
+
+interface CardProps {
+ title: string;
+ start_time: string;
+ text: string;
+ img: JSX.Element;
+ button: JSX.Element;
+}
+
+const StyledCard = styled.article`
+ color: ${colors.black};
+ margin: 1rem;
+ text-align: center;
+
+ img {
+ width: 100%;
+ max-height: 300px;
+ margin-bottom: 1rem;
+ }
+
+ p {
+ font-size: 16px;
+ text-overflow: ellipsis;
+ margin: 0 0 0.5rem;
+ font-weight: 200;
+ line-height: 22px;
+ }
+
+ p:first-of-type {
+ color: ${colors.orange1};
+ font-size: 0.9rem !important;
+ font-weight: 600 !important;
+
+ @media screen and (max-width: 1200px) {
+ margin: 0.5rem 0;
+ font-size: 16px;
+ }
+ }
+
+
+ h3 {
+ padding: 0.5rem;
+ font-size: 1.5rem;
+ font-weight: 300;
+ }
+
+ button {
+ cursor: pointer;
+
+ padding: 0.8rem 2rem;
+ margin: 0.5rem;
+ font-size: 13px;
+ background: none;
+ text-transform: uppercase;
+ background-color: ${colors.blue1};
+ color: ${colors.white};
+ font-weight: 800;
+ letter-spacing: 1.5px;
+ border: none;
+ }
+`;
+
+const Card: React.FC = ({ title, start_time, text, img, button }) => (
+
+ {img}
+
+);
+
+const WrappedCard: React.FC = ({ title, text, link, image, imageAlt, start_time, buttonOnClick }) => {
+ const options = {
+ day: "numeric",
+ month: "numeric",
+ year: "numeric",
+ hour: "numeric",
+ minute: "2-digit"
+ };
+ const datetime = new Date(start_time).toLocaleString("fi-FI", options);
+ const img = image ? (
+ 
+ ) : null;
+
+ const button = (
+
+
+
+ );
+
+ return (
+ {
- render() {
- const { title, text, link, image, button } = this.props;
- const options = {
- day: "numeric",
- month: "numeric",
- year: "numeric",
- hour: "numeric",
- minute: "2-digit"
- };
- const datetime = new Date(this.props.start_time).toLocaleString("fi-FI", options);
-
- const imageElem = image ? (
-
- ) : null;
- if (link) {
- return (
-
- {imageElem}
-
- );
- }
- return (
- {
- textColor?: Colors;
- backgroundColor?: Colors;
- hoverColor?: Colors;
- backgroundHoverColor?: Colors;
-}
-export interface ColorDivState { }
-
-
-class ColorDiv extends React.Component {
- render() {
- const { children, className, textColor, backgroundColor, hoverColor, backgroundHoverColor, ...props } = this.props;
- const classes = classNames(
- className,
- colorToClass(textColor),
- bgColorToClass(backgroundColor),
- hoverColorToClass(hoverColor),
- bgHoverColorToClass(backgroundHoverColor)
- );
-
- return (
- = ({ children, onMouseEnter, onMouseLeave, visible }) => (
+
+ {children}
+
+);
+
+export default DropDownBox;
diff --git a/src/components/DropDownBox/DropDownBox.scss b/src/components/DropDownBox/DropDownBox.scss
deleted file mode 100644
index fa14622..0000000
--- a/src/components/DropDownBox/DropDownBox.scss
+++ /dev/null
@@ -1,17 +0,0 @@
-@import "../../assets/scss/globals";
-
-
-.drop-down-box {
- background-color: color(white1);
- margin-top: 0.8rem;
- position: absolute;
- left: 0;
- top: 30px;
- z-index: 20;
-
- &,
- & a {
- color: color(dark-blue) !important;
- text-transform: uppercase;
- }
-}
diff --git a/src/components/DropDownBox/DropDownBox.tsx b/src/components/DropDownBox/DropDownBox.tsx
deleted file mode 100644
index 572b1f3..0000000
--- a/src/components/DropDownBox/DropDownBox.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import React from "react";
-import "./DropDownBox.scss";
-
-export interface DropDownBoxProps {
- onMouseEnter: () => void;
- onMouseLeave: () => void;
- visible: boolean;
-}
-export interface DropDownBoxState {}
-
-class DropDownBox extends React.Component {
- render() {
- const { children, onMouseEnter, onMouseLeave, visible } = this.props;
- return (
- {
- render() {
- return
- ;
+const CopyRight = styled.div`
+ display: flex;
+ flex-flow: row nowrap;
+ color: ${colors.white};
+ background-color: ${colors.black};
+ text-align: center;
+ justify-content: center;
+ font-size: 12px;
+ padding: 1rem 0;
+
+ p {
+ padding: 0.5rem 1rem;
+ margin: 0;
+ font-size: 14px;
}
-}
+
+ a {
+ display: block;
+ text-decoration: underline;
+ padding: 0.4rem 0;
+ font-size: 14px;
+
+ &:hover {
+ text-decoration: none;
+ }
+ }
+
+ @media screen and (max-width: 600px) {
+ flex-flow: column nowrap;
+ }
+`;
+
+const Footer: React.FC = () => (
+
+
+
+
+)
export default Footer;
diff --git a/src/components/Footer/FooterContent.tsx b/src/components/Footer/FooterContent.tsx
new file mode 100644
index 0000000..fdf11dc
--- /dev/null
+++ b/src/components/Footer/FooterContent.tsx
@@ -0,0 +1,104 @@
+import React from "react";
+import styled from "styled-components";
+import Anchor from "../Anchor";
+import { colors } from "@theme/colors";
+
+const Content = styled.div`
+ display: flex;
+
+ & > div:first-of-type {
+ padding: 48px 0;
+ flex: 2 1;
+
+ & > * {
+ padding: 0 24px;
+ }
+ }
+
+ h4 {
+ color: ${colors.lightBlue};
+ padding: 24px 0;
+ }
+
+ a {
+ color: ${colors.white};
+ display: block;
+ text-decoration: underline;
+ padding: 0.4rem 0;
+ font-size: 14px;
+
+ &:hover {
+ text-decoration: none;
+ }
+ }
+
+ p {
+ color: ${colors.white};
+ margin: 0;
+ padding: 0.4rem 0;
+ font-size: 14px;
+ }
+`;
+
+const MarginSpace = styled.div`
+ max-width: 600px;
+ margin: auto;
+`;
+
+const Columns = styled.div`
+ display: flex;
+ justify-content: space-between;
+ & > div > div {
+ margin-bottom: 1rem;
+ }
+`;
+
+const Map = styled.div`
+ flex: 1;
+ @media screen and (max-width: 800px) {
+ display: none;
+ }
+ iframe {
+ border: none;
+ }
+`;
+
+const FooterContent: React.FC = () => (
+
+
+)
+
+export default FooterContent;
diff --git a/src/components/Footer/index.ts b/src/components/Footer/index.ts
deleted file mode 100644
index ccb5e78..0000000
--- a/src/components/Footer/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-import Footer from "./Footer";
-export default Footer;
diff --git a/src/components/FooterMap/FooterMap.scss b/src/components/FooterMap/FooterMap.scss
deleted file mode 100644
index 09a3654..0000000
--- a/src/components/FooterMap/FooterMap.scss
+++ /dev/null
@@ -1,13 +0,0 @@
-@import "../../assets/scss/globals";
-
-.footer-map {
- display: flex;
-
- @media screen and (max-width: 1200px - 1px) {
- display: none;
- }
-
- iframe {
- border: none;
- }
-}
diff --git a/src/components/FooterMap/FooterMap.tsx b/src/components/FooterMap/FooterMap.tsx
deleted file mode 100644
index bddca1a..0000000
--- a/src/components/FooterMap/FooterMap.tsx
+++ /dev/null
@@ -1,26 +0,0 @@
-import React from "react";
-import "./FooterMap.scss";
-
-const AnyReactComponent = ({ text }) => {
- render() {
- return (
-
+ {children}
+
+)
+
+export default Hero;
\ No newline at end of file
diff --git a/src/components/Hero/HeroAside.tsx b/src/components/Hero/HeroAside.tsx
new file mode 100644
index 0000000..1944ce1
--- /dev/null
+++ b/src/components/Hero/HeroAside.tsx
@@ -0,0 +1,94 @@
+import React from "react";
+import styled from "styled-components";
+import { colors } from "@theme/colors";
+import Anchor from "@components/Anchor";
+
+interface HeroAsideItemProps {
+ header: string;
+ text?: string;
+ link: string;
+ linkText: string;
+}
+
+const Article = styled.article`
+ max-width: 350px;
+ margin-bottom: 1rem;
+`;
+
+export const HeroAsideItem: React.FC = ({ header, text, link, linkText }) => (
+
+
+
+
+)
+
+type Colors = "darkBlue" | "lightTurquoise";
+
+interface HeroAsideProps {
+ bgColor: Colors;
+}
+
+// TODO: Color combos
+const Aside = styled.aside<{ colors: string }>`
+ ${(p) => p.colors}
+ flex: 4;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+
+ h2 {
+ text-transform: uppercase;
+ letter-spacing: 3px;
+ line-height: 1.5rem;
+ }
+
+ p {
+ margin: 0;
+ line-height: 2rem;
+ }
+
+
+ & > p {
+ font-weight: 600;
+ margin-bottom: 2rem;
+ }
+
+ a {
+ line-height: 2rem;
+ font-weight: 600;
+ text-transform: uppercase;
+ text-decoration: none;
+ letter-spacing: 0.1rem;
+ }
+`;
+
+const textColors = (bgColor: Colors) => {
+ switch(bgColor) {
+ case "darkBlue":
+ return `
+background-color: ${colors[bgColor]};
+color: ${colors.lightBlue};
+`;
+ case "lightTurquoise":
+ return `
+background-color: ${colors[bgColor]};
+color: ${colors.darkBlue};
+ `;
+ default: return ""
+ }
+}
+
+const HeroAside: React.FC = ({ bgColor, children}) => (
+
+)
+
+export default HeroAside;
diff --git a/src/components/Hero/HeroAsideItem/HeroAsideItem.scss b/src/components/Hero/HeroAsideItem/HeroAsideItem.scss
deleted file mode 100644
index 4b4b047..0000000
--- a/src/components/Hero/HeroAsideItem/HeroAsideItem.scss
+++ /dev/null
@@ -1,36 +0,0 @@
-@import "../../../assets/scss/globals";
-
-
-.hero-aside-item {
- max-width: 300px;
- line-height: 16px;
- margin-bottom: 1rem;
-
- @media screen and (max-width: 600px - 1px) {
- p,
- a {
- font-size: 16px !important;
- line-height: 20px;
- }
- }
-
- h2 {
- text-transform: uppercase;
- letter-spacing: 3px;
- line-height: 20px;
- }
-
- p {
- font-size: 14px;
- line-height: 20px;
- }
-
- h6 {
- color: color(blue1);
- font-weight: 600;
- }
-
- h6:hover {
- color: color(white1);
- }
-}
diff --git a/src/components/Hero/HeroAsideItem/HeroAsideItem.tsx b/src/components/Hero/HeroAsideItem/HeroAsideItem.tsx
deleted file mode 100644
index a1143a9..0000000
--- a/src/components/Hero/HeroAsideItem/HeroAsideItem.tsx
+++ /dev/null
@@ -1,21 +0,0 @@
-import React from "react";
-import "./HeroAsideItem.scss";
-import Anchor from "../../Anchor";
-
-interface HeroAsideItemProps {
- title: string;
- linkText: string;
- linkHref: string;
-}
-
-const HeroAsideItem: React.FC = ({ title, linkText, linkHref, children }) => (
- {
- render() {
- const className = "hero-aside-section";
- return (
-
-
- );
- }
-}
-
-export default HeroAsideSection;
diff --git a/src/components/Hero/HeroMainSection/HeroMainSection.tsx b/src/components/Hero/HeroMainSection/HeroMainSection.tsx
deleted file mode 100644
index 2d413a3..0000000
--- a/src/components/Hero/HeroMainSection/HeroMainSection.tsx
+++ /dev/null
@@ -1,51 +0,0 @@
-import React from "react";
-import styled from "styled-components";
-
-const Container = styled.div`
- display: flex;
- flex-flow: column nowrap;
- align-items: center;
- margin-top: 15vh;
- flex: 6;
- text-align: center;
- font-weight: 100;
- line-height: 24px;
-
- & > div {
- padding: 2rem 1rem 2rem;
- }
-
- h1 {
- max-width: 600px;
- line-height: 40px;
-
- @media screen and (max-width: 500px) {
- font-size: 2rem;
- }
- }
-
- p {
- max-width: 400px;
- font-weight: 100;
- }
-
- .hero-button-container {
- display: flex;
- flex-direction: column;
- min-width: 20%;
-
- &-row {
- flex-direction: row;
- }
- }
-`;
-
-const HeroMainSection: React.FC = ({children}) => {
- return (
-
- {children}
-
- );
-}
-
-export default HeroMainSection;
diff --git a/src/components/Hero/HeroPrimaryButtons.tsx b/src/components/Hero/HeroPrimaryButtons.tsx
new file mode 100644
index 0000000..d05b9e7
--- /dev/null
+++ b/src/components/Hero/HeroPrimaryButtons.tsx
@@ -0,0 +1,39 @@
+import styled from "styled-components";
+import { colors } from "@theme/colors";
+
+const Buttons = styled.div<{row?: boolean}>`
+ min-width: 20%;
+ max-width: fit-content;
+ margin: auto;
+ display: flex;
+ flex-direction: ${(p) => p.row ? "row" : "column"};
+
+ a {
+ display: contents;
+ text-decoration: none;
+ }
+
+ button {
+ color: ${colors.blue1};
+ background-color: transparent;
+ padding: 0.8rem 2rem;
+ margin: 0.5rem;
+ font-size: 0.8rem;
+ font-weight: 800;
+ letter-spacing: .1em;
+ text-transform: uppercase;
+ border: 1px solid ${colors.lightTurquoise};
+
+ &:hover {
+ cursor: pointer;
+ color: ${colors.white};
+ }
+
+ &:active,
+ &:focus {
+ outline: none;
+ }
+ }
+`;
+
+export default Buttons;
\ No newline at end of file
diff --git a/src/components/Hero/HeroPrimarySection.tsx b/src/components/Hero/HeroPrimarySection.tsx
new file mode 100644
index 0000000..b729c85
--- /dev/null
+++ b/src/components/Hero/HeroPrimarySection.tsx
@@ -0,0 +1,51 @@
+import React from "react";
+import styled from "styled-components";
+import { colors } from "@theme/colors";
+
+interface HeroPrimarySectionProps {
+ header: string;
+ text?: string;
+}
+
+const Section = styled.section`
+ margin: 10vh auto 0;
+ max-width: 800px;
+ text-align: center;
+ line-height: 1.5rem;
+
+ h1 {
+ line-height: 40px;
+ @media screen and (max-width: 500px) {
+ font-size: 2rem;
+ }
+ }
+
+ p {
+ max-width: 400px;
+ margin: 1em auto;
+ font-weight: 200;
+ }
+
+ a {
+ color: ${colors.blue1};
+ font-weight: 600;
+ text-decoration: underline;
+
+ &:hover {
+ color: ${colors.white};
+ text-decoration: none
+ }
+ }
+`;
+
+const HeroPrimarySection: React.FC = ({ header, text, children }) => (
+
+
+)
+
+export default HeroPrimarySection;
\ No newline at end of file
diff --git a/src/components/Hero/HeroSecondarySection/HeroSecondarySection.tsx b/src/components/Hero/HeroSecondarySection.tsx
similarity index 70%
rename from src/components/Hero/HeroSecondarySection/HeroSecondarySection.tsx
rename to src/components/Hero/HeroSecondarySection.tsx
index a7234ee..16dfab9 100644
--- a/src/components/Hero/HeroSecondarySection/HeroSecondarySection.tsx
+++ b/src/components/Hero/HeroSecondarySection.tsx
@@ -1,10 +1,6 @@
import React from "react";
import styled from "styled-components";
-import ColorDiv from "../../ColorDiv/ColorDiv";
-
-interface HeroSecondarySectionItemProps {
- note?: string;
-}
+import { colors } from "@theme/colors";
const Note = styled.span`
color: white;
@@ -25,6 +21,10 @@ const Item = styled.div`
margin: 1rem 2rem 1rem;
`;
+interface HeroSecondarySectionItemProps {
+ note?: string;
+}
+
export const HeroSecondarySectionItem: React.FC = ({note, children}) => (
-
@@ -34,14 +34,13 @@ export const HeroSecondarySectionItem: React.FC =
)
-const Container = styled(ColorDiv)`
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
+const Section = styled.section`
+ background-color: ${colors.green1};
+ color: ${colors.darkBlue};
h1 {
- padding: 1em 0;
+ padding: 1rem 0;
+ text-align: center;
}
`;
@@ -51,16 +50,16 @@ const Items = styled.div`
`;
interface HeroSecondarySectionProps {
- title: string;
+ heading: string;
}
-const HeroSecondarySection: React.FC = ({title, children}) => (
-
- = ({ heading, children }) => (
+
+
{children}
-
+
)
-export default HeroSecondarySection;
+export default HeroSecondarySection;
\ No newline at end of file
diff --git a/src/components/Hero/index.tsx b/src/components/Hero/index.tsx
new file mode 100644
index 0000000..f380770
--- /dev/null
+++ b/src/components/Hero/index.tsx
@@ -0,0 +1,7 @@
+export { default as Hero } from "./Hero";
+export { default as HeroPrimarySection } from "./HeroPrimarySection";
+export { default as HeroSecondarySection } from "./HeroSecondarySection";
+export { HeroSecondarySectionItem } from "./HeroSecondarySection";
+export { default as HeroAside } from "./HeroAside";
+export { HeroAsideItem as HeroAsideItem } from "./HeroAside";
+export { default as HeroPrimaryButtons } from "./HeroPrimaryButtons";
\ No newline at end of file
diff --git a/src/components/InfoBox.tsx b/src/components/InfoBox.tsx
new file mode 100644
index 0000000..2126318
--- /dev/null
+++ b/src/components/InfoBox.tsx
@@ -0,0 +1,15 @@
+import React from "react";
+import styled from "styled-components";
+
+const Box = styled.div`
+ justify-content: flex-end;
+ text-align: center;
+`;
+
+const InfoBox: React.FC = ({ children }) => (
+
+ {children}
+
+)
+
+export default InfoBox;
diff --git a/src/components/InfoBox/InfoBox.scss b/src/components/InfoBox/InfoBox.scss
deleted file mode 100644
index 63d25b6..0000000
--- a/src/components/InfoBox/InfoBox.scss
+++ /dev/null
@@ -1,6 +0,0 @@
-@import "../../assets/scss/globals";
-
-.info-box {
- justify-content: flex-end;
- text-align: center;
-}
diff --git a/src/components/InfoBox/InfoBox.tsx b/src/components/InfoBox/InfoBox.tsx
deleted file mode 100644
index 7f9f844..0000000
--- a/src/components/InfoBox/InfoBox.tsx
+++ /dev/null
@@ -1,22 +0,0 @@
-import React from "react";
-import "./InfoBox.scss";
-
-export interface InfoBoxProps {}
-export interface InfoBoxState {}
-
-class InfoBox extends React.Component {
- constructor(props: InfoBoxProps) {
- super(props);
- }
-
- render() {
- const { children } = this.props;
- return (
- {
- render() {
- const { children, className, ...props } = this.props;
- const classes = classNames(
- "main-section",
- className
- );
-
- return (
-
- {children}
-
- );
- }
-}
-
-export default MainSection;
diff --git a/src/components/MainSection/index.ts b/src/components/MainSection/index.ts
deleted file mode 100644
index 50928f2..0000000
--- a/src/components/MainSection/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-import MainSection from "./MainSection";
-export default MainSection;
diff --git a/src/components/NavbarDropdownLink/NavbarDropdownLink.tsx b/src/components/NavbarDropdownLink/NavbarDropdownLink.tsx
index c29df71..c374185 100644
--- a/src/components/NavbarDropdownLink/NavbarDropdownLink.tsx
+++ b/src/components/NavbarDropdownLink/NavbarDropdownLink.tsx
@@ -1,6 +1,6 @@
import React from "react";
import "./NavbarDropdownLink.scss";
-import DropDownBox from "../DropDownBox/DropDownBox";
+import DropDownBox from "../DropDownBox";
import Anchor from "../Anchor";
export interface NavbarDropdownLinkProps {
diff --git a/src/components/Navigation/Navigation.scss b/src/components/Navigation/Navigation.scss
index f9b7cc9..134e6da 100644
--- a/src/components/Navigation/Navigation.scss
+++ b/src/components/Navigation/Navigation.scss
@@ -7,6 +7,7 @@ $border-width: 2px;
.navigation-mobile-menu {
a,
a:-webkit-any-link {
+ text-decoration: none;
fill: color(light-blue);
color: color(light-blue);
}
diff --git a/src/components/PageLink.tsx b/src/components/PageLink.tsx
new file mode 100644
index 0000000..306d0f1
--- /dev/null
+++ b/src/components/PageLink.tsx
@@ -0,0 +1,50 @@
+import React from "react";
+import styled from "styled-components";
+import TextAnchor from "./TextAnchor";
+import { colors } from "@theme/colors";
+
+interface PageLinkProps {
+ to: string;
+ desc: string;
+}
+
+const StyledPageLink = styled.div`
+ border-left-color: ${colors.blue1};
+ border-left-width: 0.8rem;
+ border-left-style: solid;
+ margin: 0 1rem 1rem 0;
+
+ p {
+ margin-block-start: 0;
+ margin-block-end: 0;
+ color: ${colors.darkBlue};
+ font-size: 1rem;
+ text-transform: uppercase;
+ letter-spacing: 1px;
+ font-weight: 800;
+ margin-left: 1rem;
+ margin-bottom: 0.5rem;
+ padding: 0;
+ }
+
+ a {
+ display: block;
+ margin-left: 1rem;
+ text-decoration: none;
+ font-weight: normal;
+
+ color: ${colors.blue1};
+ &:hover {
+ color: ${colors.darkBlue};
+ }
+ }
+`;
+
+const PageLink: React.FC = ({ to, desc, children }) => (
+
+ {desc}
+
+);
+
+export default PageLink;
diff --git a/src/components/PageLink/PageLink.scss b/src/components/PageLink/PageLink.scss
deleted file mode 100644
index f8f1ba5..0000000
--- a/src/components/PageLink/PageLink.scss
+++ /dev/null
@@ -1,31 +0,0 @@
-@import "../../assets/scss/globals";
-
-
-.page-link {
- border-left-color: color(blue1);
- border-left-width: 0.8rem;
- border-left-style: solid;
- margin: 0 1rem 1rem 0;
-
- & p {
- display: flex;
- margin-block-start: 0;
- margin-block-end: 0;
- color: color(dark-blue);
- font-size: 1rem;
- text-transform: uppercase;
- letter-spacing: 1px;
- font-weight: 800;
- margin-left: 1rem;
- margin-bottom: 0.5rem;
- padding: 0;
- }
-
- & a {
- color: color(dark-blue);
- margin-left: 1rem;
- display: flex;
- text-decoration: none;
- font-weight: normal;
- }
-}
diff --git a/src/components/PageLink/PageLink.tsx b/src/components/PageLink/PageLink.tsx
deleted file mode 100644
index 5562210..0000000
--- a/src/components/PageLink/PageLink.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import React from "react";
-import "./PageLink.scss";
-import TextAnchor from "../TextAnchor";
-
-export interface PageLinkProps {
- to: string;
- desc: string;
-}
-export interface PageLinkState { }
-
-class PageLink extends React.Component {
- render() {
- const { to, desc } = this.props;
- return (
- {
- render() {
- const { children, className, center, bottomBorder, cardSection, fullSize, ...props } = this.props;
- const centerClass = center ? "center" : "";
- const borderClass = bottomBorder ? "bottom-border" : "";
- const cardsClass = cardSection ? "card-section" : "";
- const nonPaddedClass = fullSize ? "" : "padded";
- const classNames = [
- "page-section",
- centerClass,
- borderClass,
- cardsClass,
- nonPaddedClass
- ];
- if (className) classNames.push(className);
- return (
-
- {children}
-
- );
- }
-}
-
-export default PageSection;
diff --git a/src/components/PageSection/index.ts b/src/components/PageSection/index.ts
deleted file mode 100644
index f3fe81c..0000000
--- a/src/components/PageSection/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-import PageSection from "./PageSection";
-export default PageSection;
diff --git a/src/components/Ribbon/Ribbon.scss b/src/components/Ribbon/Ribbon.scss
deleted file mode 100644
index f85144f..0000000
--- a/src/components/Ribbon/Ribbon.scss
+++ /dev/null
@@ -1,24 +0,0 @@
-@import "../../assets/scss/globals";
-
-
-.ribbon {
- display: flex;
- flex-flow: row nowrap;
- align-items: flex-end;
- text-align: center;
- justify-content: center;
- margin: auto;
-
- p {
- font-size: 2rem;
- font-weight: 100;
- line-height: 30px;
- margin-block-start: 0;
- margin-block-end: 0;
- }
-
- @media screen and (max-width: 600px - 1px) {
- flex-flow: column nowrap;
- align-items: center;
- }
-}
diff --git a/src/components/Ribbon/Ribbon.tsx b/src/components/Ribbon/Ribbon.tsx
deleted file mode 100644
index 240bb27..0000000
--- a/src/components/Ribbon/Ribbon.tsx
+++ /dev/null
@@ -1,17 +0,0 @@
-import React from "react";
-import "./Ribbon.scss";
-
-export interface RibbonProps {}
-export interface RibbonState {}
-
-class Ribbon extends React.Component {
- render() {
- return (
- = ({ bgColor = "orange1", link, linkText, children }) => (
+
+
+
+ )}
+
+);
+
+export default CTASection;
\ No newline at end of file
diff --git a/src/components/Sections/CardSection.tsx b/src/components/Sections/CardSection.tsx
new file mode 100644
index 0000000..ac32fc7
--- /dev/null
+++ b/src/components/Sections/CardSection.tsx
@@ -0,0 +1,37 @@
+import styled from "styled-components";
+import { colors } from "@theme/colors";
+
+const CardSection = styled.section`
+
+ h6 {
+ color: ${colors.orange1};
+ }
+
+ display: flex;
+ flex-flow: row wrap;
+ padding: 2rem 1rem;
+
+ @media screen and (max-width: 800px) {
+ flex-flow: column nowrap;
+ }
+
+ & > aside {
+ margin-left: auto;
+ }
+
+ & > * {
+ width: calc(25% - 2rem);
+
+ @media screen and (min-width: 800px) and (max-width: 1200px) {
+ width: calc(50% - 2rem);
+ margin-bottom: 2rem;
+ }
+
+ @media screen and (max-width: 800px) {
+ width: 100%;
+ margin: 0 0 3rem 0;
+ }
+ }
+`;
+
+export default CardSection;
diff --git a/src/components/Sections/FullWidthSection.tsx b/src/components/Sections/FullWidthSection.tsx
new file mode 100644
index 0000000..effd10a
--- /dev/null
+++ b/src/components/Sections/FullWidthSection.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+import styled from "styled-components";
+
+const StyledSection = styled.section`
+ display: grid;
+ padding: 24px;
+
+ grid-template-columns: 1fr auto;
+ grid-template-areas:
+ "title"
+ "content";
+
+ * {
+ grid-area: content;
+ }
+
+ & > h1,
+ & > h2,
+ & > h3,
+ & > h4,
+ & > h5,
+ & > h6 {
+ text-align: center;
+ grid-area: title;
+ }
+`;
+
+const FullWidthSection: React.FC = (props) => (
+ {
- render() {
- return (
- = ({ children, to, textColor, hoverColor }) => {
+ const classes = classNames(
+ colorToClass(textColor),
+ hoverColorToClass(hoverColor),
+ )
+ return (
+
+ {children}
+
+ );
+}
+
+export default TextAnchor;
diff --git a/src/components/TextAnchor/TextAnchor.scss b/src/components/TextAnchor/TextAnchor.scss
deleted file mode 100644
index ad1d68d..0000000
--- a/src/components/TextAnchor/TextAnchor.scss
+++ /dev/null
@@ -1,18 +0,0 @@
-@import "../../assets/scss/globals";
-
-.text-anchor {
- text-decoration: underline;
- font-weight: 600;
-
- &__no-weight {
- font-weight: 100;
- }
-
- &__small {
- text-decoration: none;
- margin: 0 1rem;
- font-size: 0.8rem;
- text-transform: uppercase;
- margin-top: 10px;
- }
-}
diff --git a/src/components/TextAnchor/TextAnchor.tsx b/src/components/TextAnchor/TextAnchor.tsx
deleted file mode 100644
index 193fab5..0000000
--- a/src/components/TextAnchor/TextAnchor.tsx
+++ /dev/null
@@ -1,49 +0,0 @@
-import React from "react";
-import "./TextAnchor.scss";
-import { Colors, colorToClass, hoverColorToClass } from "@theme/colors";
-import Anchor from "../Anchor";
-import classNames from "classnames";
-
-
-export type TextSize =
- "normal" |
- "small" |
- "large" |
- "ribbon" |
- "small-ribbon";
-
-
-const textSizeToClassName = new Map([
- ["normal", ""],
- ["small", "text-anchor__small"],
- ["large", "text-anchor__large"],
- ["small-ribbon", "text-anchor__no-weight text-anchor__small"],
- ["ribbon", "text-anchor__no-weight"],
-]);
-
-export interface TextAnchorProps {
- size?: TextSize;
- to: string;
- textColor?: Colors;
- hoverColor?: Colors;
-}
-export interface TextAnchorState { }
-
-class TextAnchor extends React.Component {
- render() {
- const { children, size, to, textColor, hoverColor } = this.props;
- const classes = classNames(
- "text-anchor",
- colorToClass(textColor),
- hoverColorToClass(hoverColor),
- textSizeToClassName.get(size)
- )
- return (
-
- {children}
-
- );
- }
-}
-
-export default TextAnchor;
diff --git a/src/components/TextAnchor/index.ts b/src/components/TextAnchor/index.ts
deleted file mode 100644
index cf2f85a..0000000
--- a/src/components/TextAnchor/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-import TextAnchor from "./TextAnchor";
-export default TextAnchor;
diff --git a/src/components/Checkbox/Checkbox.tsx b/src/components/Widgets/Checkbox/Checkbox.tsx
similarity index 91%
rename from src/components/Checkbox/Checkbox.tsx
rename to src/components/Widgets/Checkbox/Checkbox.tsx
index 451e962..d19589c 100644
--- a/src/components/Checkbox/Checkbox.tsx
+++ b/src/components/Widgets/Checkbox/Checkbox.tsx
@@ -1,5 +1,6 @@
import React from "react";
import styled from "styled-components";
+import { colors } from "@theme/colors";
const Container = styled.label`
display: block;
@@ -31,7 +32,7 @@ const CustomCBoxElement = styled.span<{checked?: boolean}>`
left: 0;
height: 1em;
width: 1em;
- background-color: ${(props) => props.checked ? "#57b2df" : "#efece4"}; /* blue1 or grey2 */
+ background-color: ${(props) => props.checked ? colors.blue1 : colors.grey2};
&:focus &:before {
transition: box-shadow 150ms ease;
@@ -43,7 +44,7 @@ const CustomCBoxElement = styled.span<{checked?: boolean}>`
left: -4px;
right: -4px;
border-radius: 6px;
- border: 2px solid color(blue);
+ border: 2px solid ${colors.blue1};
}
`;
diff --git a/src/components/Checkbox/Checkboxes.tsx b/src/components/Widgets/Checkbox/Checkboxes.tsx
similarity index 100%
rename from src/components/Checkbox/Checkboxes.tsx
rename to src/components/Widgets/Checkbox/Checkboxes.tsx
diff --git a/src/components/DatetimeWidget/DatetimeWidget.scss b/src/components/Widgets/DatetimeWidget/DatetimeWidget.scss
similarity index 100%
rename from src/components/DatetimeWidget/DatetimeWidget.scss
rename to src/components/Widgets/DatetimeWidget/DatetimeWidget.scss
diff --git a/src/components/DatetimeWidget/DatetimeWidget.tsx b/src/components/Widgets/DatetimeWidget/DatetimeWidget.tsx
similarity index 100%
rename from src/components/DatetimeWidget/DatetimeWidget.tsx
rename to src/components/Widgets/DatetimeWidget/DatetimeWidget.tsx
diff --git a/src/components/MarkdownEditorWidget.scss b/src/components/Widgets/MarkdownEditorWidget.scss
similarity index 100%
rename from src/components/MarkdownEditorWidget.scss
rename to src/components/Widgets/MarkdownEditorWidget.scss
diff --git a/src/components/MarkdownEditorWidget.tsx b/src/components/Widgets/MarkdownEditorWidget.tsx
similarity index 100%
rename from src/components/MarkdownEditorWidget.tsx
rename to src/components/Widgets/MarkdownEditorWidget.tsx
diff --git a/src/components/RadioButton/RadioButton.tsx b/src/components/Widgets/RadioButton/RadioButton.tsx
similarity index 100%
rename from src/components/RadioButton/RadioButton.tsx
rename to src/components/Widgets/RadioButton/RadioButton.tsx
diff --git a/src/components/RadioButton/RadioButtonWidget.tsx b/src/components/Widgets/RadioButton/RadioButtonWidget.tsx
similarity index 100%
rename from src/components/RadioButton/RadioButtonWidget.tsx
rename to src/components/Widgets/RadioButton/RadioButtonWidget.tsx
diff --git a/src/components/SectionDividerWidget/SectionDividerWidget.scss b/src/components/Widgets/SectionDividerWidget/SectionDividerWidget.scss
similarity index 100%
rename from src/components/SectionDividerWidget/SectionDividerWidget.scss
rename to src/components/Widgets/SectionDividerWidget/SectionDividerWidget.scss
diff --git a/src/components/SectionDividerWidget/SectionDividerWidget.tsx b/src/components/Widgets/SectionDividerWidget/SectionDividerWidget.tsx
similarity index 91%
rename from src/components/SectionDividerWidget/SectionDividerWidget.tsx
rename to src/components/Widgets/SectionDividerWidget/SectionDividerWidget.tsx
index 46e9c3e..9662e9d 100644
--- a/src/components/SectionDividerWidget/SectionDividerWidget.tsx
+++ b/src/components/Widgets/SectionDividerWidget/SectionDividerWidget.tsx
@@ -1,7 +1,7 @@
import React from "react";
import "./SectionDividerWidget.scss";
-import Icon from "../Icon";
-import { IconType } from "../Icon/Icon";
+import Icon from "../../Icon";
+import { IconType } from "../../Icon/Icon";
export interface SectionDividerWidgetProps {
label: string;
diff --git a/src/components/SignupQuestionsWidget/OptionsWidget.tsx b/src/components/Widgets/SignupQuestionsWidget/OptionsWidget.tsx
similarity index 98%
rename from src/components/SignupQuestionsWidget/OptionsWidget.tsx
rename to src/components/Widgets/SignupQuestionsWidget/OptionsWidget.tsx
index 966757a..623311a 100644
--- a/src/components/SignupQuestionsWidget/OptionsWidget.tsx
+++ b/src/components/Widgets/SignupQuestionsWidget/OptionsWidget.tsx
@@ -1,6 +1,6 @@
import React from "react";
import { Question, InputProps, optionTypes, SignupQuestionError } from "./index";
-import Checkbox from "@components/Checkbox/Checkbox";
+import Checkbox from "@components/Widgets/Checkbox/Checkbox";
export interface OptionsWidgetProps {
inputProps: InputProps;
diff --git a/src/components/SignupQuestionsWidget/Question.tsx b/src/components/Widgets/SignupQuestionsWidget/Question.tsx
similarity index 100%
rename from src/components/SignupQuestionsWidget/Question.tsx
rename to src/components/Widgets/SignupQuestionsWidget/Question.tsx
diff --git a/src/components/SignupQuestionsWidget/QuestionList.tsx b/src/components/Widgets/SignupQuestionsWidget/QuestionList.tsx
similarity index 100%
rename from src/components/SignupQuestionsWidget/QuestionList.tsx
rename to src/components/Widgets/SignupQuestionsWidget/QuestionList.tsx
diff --git a/src/components/SignupQuestionsWidget/SignupQuestionsWidget.scss b/src/components/Widgets/SignupQuestionsWidget/SignupQuestionsWidget.scss
similarity index 91%
rename from src/components/SignupQuestionsWidget/SignupQuestionsWidget.scss
rename to src/components/Widgets/SignupQuestionsWidget/SignupQuestionsWidget.scss
index a239ce4..e82f054 100644
--- a/src/components/SignupQuestionsWidget/SignupQuestionsWidget.scss
+++ b/src/components/Widgets/SignupQuestionsWidget/SignupQuestionsWidget.scss
@@ -1,4 +1,4 @@
-@import "../../assets/scss/globals";
+@import "../../../assets/scss/globals";
.signup-questions-widget {
diff --git a/src/components/SignupQuestionsWidget/SignupQuestionsWidget.tsx b/src/components/Widgets/SignupQuestionsWidget/SignupQuestionsWidget.tsx
similarity index 100%
rename from src/components/SignupQuestionsWidget/SignupQuestionsWidget.tsx
rename to src/components/Widgets/SignupQuestionsWidget/SignupQuestionsWidget.tsx
diff --git a/src/components/SignupQuestionsWidget/TypeWidget.tsx b/src/components/Widgets/SignupQuestionsWidget/TypeWidget.tsx
similarity index 100%
rename from src/components/SignupQuestionsWidget/TypeWidget.tsx
rename to src/components/Widgets/SignupQuestionsWidget/TypeWidget.tsx
diff --git a/src/components/SignupQuestionsWidget/index.ts b/src/components/Widgets/SignupQuestionsWidget/index.ts
similarity index 100%
rename from src/components/SignupQuestionsWidget/index.ts
rename to src/components/Widgets/SignupQuestionsWidget/index.ts
diff --git a/src/components/index.tsx b/src/components/index.tsx
new file mode 100644
index 0000000..3538c91
--- /dev/null
+++ b/src/components/index.tsx
@@ -0,0 +1,11 @@
+export { default as Card } from "./Card";
+export { default as PageLink } from "./PageLink";
+export { default as Button } from "./Button";
+export { default as TextAnchor } from "./TextAnchor";
+export { default as Divider } from "./Divider";
+export { default as CardSection } from "./Sections/CardSection";
+export { default as CTASection } from "./Sections/CTASection";
+export { default as TextSection } from "./Sections/TextSection";
+export { default as FullWidthSection } from "./Sections/FullWidthSection";
+export { default as InfoBox } from "./InfoBox";
+export { default as Accordion } from "./Accordion/Accordion";
diff --git a/src/index.scss b/src/index.scss
index 0820280..a05f45d 100644
--- a/src/index.scss
+++ b/src/index.scss
@@ -7,11 +7,15 @@
html,
body {
- font-size: 100%;
+ font-size: 12pt;
background-color: color(dark-blue);
height: 100%;
font-family: $font;
- color: color(white1);
+}
+
+body {
+ padding: 0;
+ margin: auto !important;
}
#root {
@@ -19,11 +23,17 @@ body {
min-height: 100vh;
display: flex;
flex-flow: column nowrap;
+ color: color(black1);
+ background-color: color(white1);
}
-body {
- padding: 0;
- margin: auto !important;
+p {
+ font-size: 1.2rem;
+ font-weight: 300;
+
+ &.large {
+ font-size: 2rem;
+ }
}
h1 {
@@ -32,20 +42,20 @@ h1 {
margin-block-start: 0;
margin-block-end: 0;
- .lg {
+ &.large {
font-size: 2.75rem;
}
}
h2 {
- font-size: 1rem;
+ font-size: 1.2rem;
font-weight: 700;
letter-spacing: 0.1em;
margin-block-start: 0;
margin-block-end: 0;
text-transform: uppercase;
- .lg {
+ &.large {
font-size: 2rem;
}
}
@@ -56,32 +66,32 @@ h3 {
margin-block-start: 0;
margin-block-end: 0;
- .lg {
- font-size: 2.3rem;
+ &.large {
+ font-size: 2rem;
}
}
h4 {
font-size: 1rem;
font-weight: 700;
- letter-spacing: 0.1rem;
+ letter-spacing: 0.1em;
margin-block-start: 0;
margin-block-end: 0;
text-transform: uppercase;
- .lg {
+ &.large {
font-size: 2rem;
}
}
h5 {
- font-size: 1.2rem;
+ font-size: 1.125rem;
font-weight: 600;
margin-block-start: 0;
margin-block-end: 0;
- .lg {
- font-size: 2rem;
+ &.large {
+ font-size: 2.3rem;
}
}
@@ -93,22 +103,27 @@ h6 {
margin-block-end: 0;
text-transform: uppercase;
- .lg {
+ &.large {
font-size: 2rem;
}
}
-p {
- font-size: 16px;
- font-weight: 300;
+// TODO: List item style »
+li {
+ font-size: 1.2rem;
+ font-weight: 600;
- .lg {
+ &.large {
font-size: 2rem;
}
}
-a,
+
+a {
+ text-decoration: underline;
+ color: color(blue1);
+}
+
a:hover {
text-decoration: none;
- color: color(white1);
}
diff --git a/src/models/SignupForm.ts b/src/models/SignupForm.ts
index 47667a2..923ee86 100644
--- a/src/models/SignupForm.ts
+++ b/src/models/SignupForm.ts
@@ -1,7 +1,7 @@
import axios from "axios";
import { getAuthHeader } from "@utils/auth";
const url = `${process.env.API_URL}/signupForm/`;
-import { Question } from "@components/SignupQuestionsWidget";
+import { Question } from "@components/Widgets/SignupQuestionsWidget";
export interface SignupForm {
id?: number;
diff --git a/src/pages/CommonPage.tsx b/src/pages/CommonPage.tsx
index fe83558..0cfbe76 100644
--- a/src/pages/CommonPage.tsx
+++ b/src/pages/CommonPage.tsx
@@ -1,6 +1,6 @@
import React from "react";
import Header from "@components/Header";
-import Footer from "@components/Footer";
+import Footer from "@components/Footer/Footer";
export interface CommonPageProps {
page: any;
@@ -11,11 +11,11 @@ class CommonPage extends React.Component {
render() {
const Page = this.props.page;
return (
-
+ <>
+
);
}
}
diff --git a/src/pages/FrontPage.tsx b/src/pages/FrontPage.tsx
index 9f1917b..b32225d 100644
--- a/src/pages/FrontPage.tsx
+++ b/src/pages/FrontPage.tsx
@@ -78,8 +78,7 @@ class FrontPage extends React.Component {
const { events, feed } = this.state;
return (
<>
-
-
+ ([
+ ["dark-blue", "#002d3a"],
+ ["light-blue", "#bfdbd9"],
+ ["white1", "#fff"],
+ ["black1", "#000"],
+ ["grey1", "#d4d0c7"],
+ ["grey2", "#efece4"],
+ ["orange1", "#d57a2d"],
+ ["orange2", "#dd934e"],
+ ["blue1", "#57b2df"],
+ ["light-turquoise", "#beddeb"],
+ ["green1", "#c0dcd9"],
+ ["sand", "#fdf9d7"],
+ ["transparent", "transparent"],
+ ["inherit", "inherit"]
+]);
export const colors = {
darkBlue: "#002d3a",
@@ -32,5 +43,14 @@ export const colors = {
blue1: "#57b2df",
lightTurquoise: "#beddeb",
green1: "#c0dcd9",
- sand: "#fdf9d7"
-}
\ No newline at end of file
+ sand: "#fdf9d7",
+ transparent: "transparent",
+ inherit: "inherit"
+}
+
+export type Colors2 = keyof typeof colors;
+
+export const colorToClass = (color: Colors): string => color ? `color-div__${color}` : undefined;
+export const bgColorToClass = (color: Colors): string => color ? `color-div__background_${color}` : undefined;
+export const hoverColorToClass = (color: Colors): string => color ? `color-div__${color}Hoverable` : undefined;
+export const bgHoverColorToClass = (color: Colors): string => color ? `color-div__background_${color}Hoverable` : undefined;
diff --git a/src/views/ActualPage/ActualPage.scss b/src/views/ActualPage/ActualPage.scss
deleted file mode 100644
index 582d405..0000000
--- a/src/views/ActualPage/ActualPage.scss
+++ /dev/null
@@ -1,16 +0,0 @@
-.actual-page {
- display: flex;
- flex-flow: column wrap;
- justify-content: flex-start;
-
- .actual-page-images {
- display: flex;
- flex-flow: row nowrap;
-
- & > img {
- max-width: calc(100% / 3);
- flex: 1 0;
- object-fit: cover;
- }
- }
-}
diff --git a/src/views/ActualPage/ActualPageHero.tsx b/src/views/ActualPage/ActualPageHero.tsx
new file mode 100644
index 0000000..14b3612
--- /dev/null
+++ b/src/views/ActualPage/ActualPageHero.tsx
@@ -0,0 +1,70 @@
+import React from "react";
+import { Hero, HeroPrimarySection, HeroSecondarySection, HeroSecondarySectionItem, HeroAside, HeroAsideItem, HeroPrimaryButtons } from "@components/Hero";
+import Anchor from "@components/Anchor";
+
+const ActualPageHero: React.FC = () => (
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+)
+
+export default ActualPageHero;
\ No newline at end of file
diff --git a/src/views/ActualPage/ActualPageView.tsx b/src/views/ActualPage/ActualPageView.tsx
index a44f3b2..8e59127 100644
--- a/src/views/ActualPage/ActualPageView.tsx
+++ b/src/views/ActualPage/ActualPageView.tsx
@@ -1,142 +1,89 @@
import React from "react";
-import "./ActualPage.scss";
-import PageSection from "@components/PageSection";
-import HeroMainSection from "@components/Hero/HeroMainSection/HeroMainSection";
-import HeroAsideSection from "@components/Hero/HeroAsideSection/HeroAsideSection";
-import HeroAsideItem from "@components/Hero/HeroAsideItem/HeroAsideItem";
-import AsideSection from "@components/AsideSection";
-import MainSection from "@components/MainSection/index";
-import Ribbon from "@components/Ribbon/index";
-import TextAnchor from "@components/TextAnchor/index";
-import Button from "@components/Button/index";
-import Accordion from "@components/Accordion";
-import HeroSecondarySection, { HeroSecondarySectionItem } from "@components/Hero/HeroSecondarySection/HeroSecondarySection";
+import styled from "styled-components";
import { Event } from "@models/Event";
import { Post } from "@models/Feed";
+
+import { Divider, CTASection, TextSection, Accordion } from "@components/index";
+import ActualPageHero from "./ActualPageHero";
import EventCalendar from "./EventCalendar";
import News from "./News";
+
interface ActualPageViewProps {
events: Event[];
feed: Post[];
}
+const Gallery = styled.div`
+ display: flex;
+ flex-flow: row nowrap;
+
+ img {
+ max-width: calc(100% / 3);
+ flex: 1 0;
+ object-fit: cover;
+ }
+`;
+
const ActualPageView: React.FC = ({events, feed}) => {
return (
- = ({events}) => {
const [numberShown, setNumberShown] = useState(8);
const filteredEvents = events.slice(0, numberShown);
return (
- <>
- {/*
-
+
+
+
+
{filteredEvents.map(e => (
= ({events}) => {
start_time={e.start_time}
text={e.description_fi}
link={`/events/${e.id}`}
- button={
-
- }
+ buttonOnClick={() => {}}
>
))}
-
+
{ numberShown < events.length && (
)}
-
+
)
}
diff --git a/src/views/ActualPage/News.tsx b/src/views/ActualPage/News.tsx
index 550eae1..2f73e44 100644
--- a/src/views/ActualPage/News.tsx
+++ b/src/views/ActualPage/News.tsx
@@ -1,10 +1,9 @@
import React, { useState } from "react";
import { Post } from "@models/Feed";
-import Card from "@components/Card";
import Button from "@components/Button";
-import PageSection from "@components/PageSection";
import FilterContainer from "./FilterContainer";
+import { CardSection, Card, FullWidthSection } from "@components/index";
interface NewsProps {
feed: Post[];
@@ -15,19 +14,22 @@ const News: React.FC = ({feed}) => {
const [numberShown, setNumberShown] = useState(8);
const filteredFeed = feed.slice(0, numberShown);
return (
- <>
- {/*
-
+
+
+
{filteredFeed.map(post => (
= ({feed}) => {
start_time={post.publish_time}
text={post.description_fi}
link={`/feed/${post.id}`}
- button={
-
- }
+ buttonOnClick={() => {}}
>
))}
-
+
{ numberShown < feed.length && (
)}
-
+
)
}
diff --git a/src/views/ContactsPage/ContactsPage.scss b/src/views/ContactsPage/ContactsPage.scss
deleted file mode 100644
index 3c8525d..0000000
--- a/src/views/ContactsPage/ContactsPage.scss
+++ /dev/null
@@ -1,7 +0,0 @@
-@import "../../assets/scss/globals";
-
-.contacts-page {
- display: flex;
- flex-flow: column wrap;
- justify-content: flex-start;
-}
diff --git a/src/views/ContactsPage/ContactsPageView.tsx b/src/views/ContactsPage/ContactsPageView.tsx
index daf1e3d..c076f7a 100644
--- a/src/views/ContactsPage/ContactsPageView.tsx
+++ b/src/views/ContactsPage/ContactsPageView.tsx
@@ -1,28 +1,30 @@
import React from "react";
-import "./ContactsPage.scss";
-import PageSection from "@components/PageSection";
import { Occupation, Committee } from "@models/Contacts";
import CommitteeContainer from "@components/CommitteeContainer";
-import TextAnchor from "@components/TextAnchor/index";
+import TextAnchor from "@components/TextAnchor";
+import { Divider, TextSection } from "@components/index";
interface ContactsPageViewProps {
contacts: Occupation[];
committees: Committee[];
}
+
+
class ContactsPageView extends React.Component {
render() {
const { contacts, committees } = this.props;
const board = contacts.filter(x => x.role.is_board);
return (
-
+
+
+
+);
+
+export default CorporatePageHero;
diff --git a/src/views/CorporatePage/CorporatePageView.tsx b/src/views/CorporatePage/CorporatePageView.tsx
index cc55c92..797bca7 100644
--- a/src/views/CorporatePage/CorporatePageView.tsx
+++ b/src/views/CorporatePage/CorporatePageView.tsx
@@ -1,49 +1,28 @@
import React from "react";
-import "./CorporatePage.scss";
-import PageSection from "@components/PageSection";
-import HeroMainSection from "@components/Hero/HeroMainSection/HeroMainSection";
-import HeroAsideSection from "@components/Hero/HeroAsideSection/HeroAsideSection";
-import HeroAsideItem from "@components/Hero/HeroAsideItem/HeroAsideItem";
-import AsideSection from "@components/AsideSection";
-import MainSection from "@components/MainSection/index";
-import PageLink from "@components/PageLink/index";
-import Ribbon from "@components/Ribbon/index";
-import TextAnchor from "@components/TextAnchor/index";
-
+import CorporatePageHero from "./CorporatePageHero";
+import { CTASection, TextSection, PageLink } from "@components/index";
const CorporatePageView: React.FC = () => (
- = ({ event }) => {
if (!event) return
-
-
+
-
-
- {/* We may have multiple signup forms. Generate own Button for each one */}
-
+
+
+ {/* We may have multiple signup forms. Generate own Button for each one */}
+
+ {event.signupForm.map(sf => (
+
+
+
+ )
+ )}
+
+
);
}
export default EventPageView;
diff --git a/src/views/FreshmenPage/FreshmenPage.scss b/src/views/FreshmenPage/FreshmenPage.scss
deleted file mode 100644
index b189a40..0000000
--- a/src/views/FreshmenPage/FreshmenPage.scss
+++ /dev/null
@@ -1,5 +0,0 @@
-.freshmen-page {
- display: flex;
- flex-flow: column wrap;
- justify-content: flex-start;
-}
diff --git a/src/views/FreshmenPage/FreshmenPageHero.tsx b/src/views/FreshmenPage/FreshmenPageHero.tsx
new file mode 100644
index 0000000..902a666
--- /dev/null
+++ b/src/views/FreshmenPage/FreshmenPageHero.tsx
@@ -0,0 +1,34 @@
+import React from "react";
+import { Hero, HeroPrimarySection, HeroAside, HeroAsideItem } from "@components/Hero";
+
+const FreshmenPageHero: React.FC = () => (
+
+
+
+
+);
+
+export default FreshmenPageHero;
diff --git a/src/views/FreshmenPage/FreshmenPageView.tsx b/src/views/FreshmenPage/FreshmenPageView.tsx
index ea01504..9795e05 100644
--- a/src/views/FreshmenPage/FreshmenPageView.tsx
+++ b/src/views/FreshmenPage/FreshmenPageView.tsx
@@ -1,60 +1,22 @@
import React from "react";
-import "./FreshmenPage.scss";
-import PageSection from "@components/PageSection/index";
-import HeroMainSection from "@components/Hero/HeroMainSection/HeroMainSection";
-import HeroAsideSection from "@components/Hero/HeroAsideSection/HeroAsideSection";
-import HeroAsideItem from "@components/Hero/HeroAsideItem/HeroAsideItem";
-import AsideSection from "@components/AsideSection/index";
-import MainSection from "@components/MainSection/index";
-import PageLink from "@components/PageLink/index";
-import Ribbon from "@components/Ribbon/index";
-import TextAnchor from "@components/TextAnchor/index";
-import InfoBox from "@components/InfoBox/index";
import styled from "styled-components";
+import FreshmenPageHero from "./FreshmenPageHero";
+import Anchor from "@components/Anchor";
+import { CTASection, TextSection, InfoBox, PageLink } from "@components/index";
const KippariImage = styled.img`
-max-width:100%;
-
+ max-width:100%;
`
const FreshmenPageView: React.FC = () => (
-
+
+
+
+);
+
+export default FrontPageHero;
\ No newline at end of file
diff --git a/src/views/FrontPage/FrontPageView.tsx b/src/views/FrontPage/FrontPageView.tsx
index 5ef7f0d..f0cab20 100644
--- a/src/views/FrontPage/FrontPageView.tsx
+++ b/src/views/FrontPage/FrontPageView.tsx
@@ -1,131 +1,113 @@
import React from "react";
-import "./FrontPage.scss";
-import Card from "@components/Card";
+import styled from "styled-components";
+import { Card, PageLink, Divider, CardSection, CTASection } from "@components/index";
+import FrontPageHero from "./FrontPageHero";
import { Event } from "@models/Event";
import { Post } from "@models/Feed";
-
-import PageSection from "@components/PageSection";
-
-import PageLink from "@components/PageLink/PageLink";
-import HeroMainSection from "@components/Hero/HeroMainSection/HeroMainSection";
-import HeroAsideSection from "@components/Hero/HeroAsideSection/HeroAsideSection";
-import Button from "@components/Button";
-import Ribbon from "@components/Ribbon";
-import SponsorReel from "@components/SponsorReel";
-import HeroAsideItem from "@components/Hero/HeroAsideItem/HeroAsideItem";
-import TextAnchor from "@components/TextAnchor";
+import { colors } from "@theme/colors";
+import Anchor from "@components/Anchor";
+import FullWidthSection from "@components/Sections/FullWidthSection";
interface FrontPageViewProps {
events: Event[];
feed: Post[];
}
+const SponsorReel = styled.div`
+ text-align: center;
+ & > div {
+ display: flex;
+ flex-flow: row wrap;
+ justify-content: center;
+ margin-top: 1rem;
+ margin-bottom: 4rem;
+
+ & > * {
+ margin: 0 1rem;
+ }
+ }
+
+ a {
+ color: ${colors.blue1};
+ text-decoration: underline;
+
+ &:hover {
+ text-decoration: none;
+ }
+ }
+`;
+
+
const FrontPageView: React.FC = ({ events, feed }) => (
-
+
+ {events.map(event => (
+ {}}
+ />
+ ))}
+
+
+
+
+
+ Sössöä vuodesta 1969.
+
+
+
+ {feed.map(inst => (
+ {}}
+ />
+ ))}
+
+
+
+
+
+ Haluatko kuulla lisää yhteistyöstä kanssamme?
+
+
+
+
)
export default FrontPageView;
diff --git a/src/views/GuildPage/GuildPage.scss b/src/views/GuildPage/GuildPage.scss
deleted file mode 100644
index ca644f9..0000000
--- a/src/views/GuildPage/GuildPage.scss
+++ /dev/null
@@ -1,3 +0,0 @@
-.guild-page {
- width: inherit;
-}
diff --git a/src/views/GuildPage/GuildPageHero.tsx b/src/views/GuildPage/GuildPageHero.tsx
new file mode 100644
index 0000000..fb7f79a
--- /dev/null
+++ b/src/views/GuildPage/GuildPageHero.tsx
@@ -0,0 +1,41 @@
+import React from "react";
+import Anchor from "@components/Anchor";
+import { Hero, HeroPrimarySection, HeroAside, HeroAsideItem } from "@components/Hero";
+
+const GuildPageHero: React.FC = () => (
+
+
+
+
+
+
+
+
+
+
+
+
+);
+
+export default GuildPageHero;
diff --git a/src/views/GuildPage/GuildPageView.tsx b/src/views/GuildPage/GuildPageView.tsx
index bc64479..99129c6 100644
--- a/src/views/GuildPage/GuildPageView.tsx
+++ b/src/views/GuildPage/GuildPageView.tsx
@@ -1,229 +1,193 @@
import React from "react";
-import "./GuildPage.scss";
-import PageSection from "@components/PageSection";
-import MainSection from "@components/MainSection";
-import AsideSection from "@components/AsideSection";
-import PageLink from "@components/PageLink";
-import HeroMainSection from "@components/Hero/HeroMainSection/HeroMainSection";
-import HeroAsideSection from "@components/Hero/HeroAsideSection/HeroAsideSection";
-import HeroAsideItem from "@components/Hero/HeroAsideItem/HeroAsideItem";
-import Ribbon from "@components/Ribbon";
-import InfoBox from "@components/InfoBox";
-import Accordion from "@components/Accordion";
+import styled from "styled-components";
import TextAnchor from "@components/TextAnchor";
+import Anchor from "@components/Anchor";
+import { CTASection, TextSection, InfoBox, Accordion, PageLink } from "@components/index";
+import GuildPageHero from "./GuildPageHero";
+import FullWidthSection from "@components/Sections/FullWidthSection";
+import { colors } from "@theme/colors";
+
+const Column = styled.div`
+ display: flex;
+ flex-direction: row;
+
+ a {
+ color: inherit;
+ }
+
+ section:first-of-type {
+ background-color: ${colors.lightTurquoise};
+ }
+
+ section:last-of-type {
+ background-color: ${colors.lightBlue};
+ p {
+ a {
+ font-weight: normal;
+ }
+ }
+ }
+ ul {
+ list-style: none;
+ }
+`;
const GuildPageView: React.FC = () => (
-
- {this.props.children}
+
+
+
+ {this.props.children}
+
-
-
- );
- }
-}
-
-export default AccordionIcon;
diff --git a/src/components/AccordionIcon/index.ts b/src/components/AccordionIcon/index.ts
deleted file mode 100644
index bc97054..0000000
--- a/src/components/AccordionIcon/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-import AccordionIcon from "./AccordionIcon";
-export default AccordionIcon;
diff --git a/src/components/Anchor.tsx b/src/components/Anchor.tsx
new file mode 100644
index 0000000..e9ef6b4
--- /dev/null
+++ b/src/components/Anchor.tsx
@@ -0,0 +1,25 @@
+import React from "react";
+import { Link } from "react-router-dom";
+import { HashLink } from "react-router-hash-link";
+
+interface AnchorProps extends React.HTMLAttributes+
- {start_time}
+{title}
+{text}
+ {button} +{datetime}
- {title}
- {text}
- {button}
-
- {imageElem}
-
- );
- }
-}
-
-export default Card;
diff --git a/src/components/Card/index.ts b/src/components/Card/index.ts
deleted file mode 100644
index af0084f..0000000
--- a/src/components/Card/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-import Card from "./Card";
-export default Card;
diff --git a/src/components/ColorDiv/ColorDiv.scss b/src/components/ColorDiv/ColorDiv.scss
deleted file mode 100644
index 4b4ee2d..0000000
--- a/src/components/ColorDiv/ColorDiv.scss
+++ /dev/null
@@ -1,66 +0,0 @@
-@import "../../assets/scss/globals";
-
-.color-div {
- @mixin hoverableColor($colorName) {
- &__#{$colorName} {
- color: color($colorName);
- }
-
- &__#{$colorName}Hoverable {
- &:hover,
- &:active {
- color: hover($colorName);
- }
- }
- }
-
- @mixin backgroundColor($colorName) {
- &__background_#{$colorName} {
- background-color: color($colorName);
- }
-
- &__background_#{$colorName}Hoverable {
- &:hover,
- &:active {
- background-color: hover($colorName);
- }
- }
- }
-
- @mixin backgroundAndHoverableColor($colorName) {
- @include hoverableColor($colorName);
- @include backgroundColor($colorName);
- }
-
- @include backgroundAndHoverableColor(dark-blue);
- @include backgroundAndHoverableColor(light-blue);
- @include backgroundAndHoverableColor(white1);
- @include backgroundAndHoverableColor(black1);
- @include backgroundAndHoverableColor(grey1);
- @include backgroundAndHoverableColor(grey2);
- @include backgroundAndHoverableColor(orange1);
- @include backgroundAndHoverableColor(orange2);
- @include backgroundAndHoverableColor(blue1);
- @include backgroundAndHoverableColor(light-turquoise);
- @include backgroundAndHoverableColor(green1);
- @include backgroundAndHoverableColor(sand);
-
- &__inherit {
- color: inherit;
- }
-
- &__transparent {
- color: transparent;
- }
-
- &__inheritHoverable {
- &:hover,
- &:active {
- color: inherit;
- }
- }
-
- &__background_transparent {
- background-color: transparent;
- }
-}
\ No newline at end of file
diff --git a/src/components/ColorDiv/ColorDiv.tsx b/src/components/ColorDiv/ColorDiv.tsx
deleted file mode 100644
index 05a9b1c..0000000
--- a/src/components/ColorDiv/ColorDiv.tsx
+++ /dev/null
@@ -1,34 +0,0 @@
-import React from "react";
-import "./ColorDiv.scss";
-import { Colors, colorToClass, bgColorToClass, hoverColorToClass, bgHoverColorToClass } from "@theme/colors";
-import classNames from "classnames";
-
-export interface ColorDivProps extends React.HTMLAttributes{datetime}
- {title}
- {text}
- {button}
-
- {children}
-
- );
- }
-}
-
-export default ColorDiv;
diff --git a/src/components/DatetimeWidget/index.ts b/src/components/DatetimeWidget/index.ts
deleted file mode 100644
index 396b80b..0000000
--- a/src/components/DatetimeWidget/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-import DatetimeWidget from "./DatetimeWidget";
-export default DatetimeWidget;
diff --git a/src/components/Divider.tsx b/src/components/Divider.tsx
new file mode 100644
index 0000000..1093cdd
--- /dev/null
+++ b/src/components/Divider.tsx
@@ -0,0 +1,11 @@
+import styled from "styled-components";
+import { colors } from "@theme/colors";
+
+const Divider = styled.hr`
+ width: 98%;
+ border: 0;
+ border-bottom: 2px solid ${colors.blue1};
+ margin: 0 auto;
+`;
+
+export default Divider;
diff --git a/src/components/DropDownBox.tsx b/src/components/DropDownBox.tsx
new file mode 100644
index 0000000..f27eb1b
--- /dev/null
+++ b/src/components/DropDownBox.tsx
@@ -0,0 +1,36 @@
+import React from "react";
+import styled from "styled-components";
+import { colors } from "@theme/colors";
+
+interface DropDownBoxProps {
+ onMouseEnter: () => void;
+ onMouseLeave: () => void;
+ visible: boolean;
+}
+
+const Box = styled.div`
+ background-color: ${colors.white};
+ margin-top: 0.8rem;
+ position: absolute;
+ left: 0;
+ top: 30px;
+ z-index: 20;
+
+ a {
+ text-decoration: underline;
+ color: ${colors.darkBlue} !important;
+ text-transform: uppercase;
+ }
+`;
+
+const DropDownBox: React.FC
- {children}
-
- );
- }
-}
-
-export default DropDownBox;
diff --git a/src/components/DropDownBox/index.ts b/src/components/DropDownBox/index.ts
deleted file mode 100644
index 64e87ea..0000000
--- a/src/components/DropDownBox/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-import DropDownBox from "./DropDownBox";
-export default DropDownBox;
diff --git a/src/components/Footer/Footer.scss b/src/components/Footer/Footer.scss
deleted file mode 100644
index 2def50a..0000000
--- a/src/components/Footer/Footer.scss
+++ /dev/null
@@ -1,90 +0,0 @@
-@import "../../assets/scss/globals";
-
-
-.footer {
- display: flex;
- flex-direction: column;
-
- &__content {
- display: flex;
- padding: 16px;
- }
-
- h4 {
- color: color(light-blue);
- padding: 1.5rem 0;
- }
-
- & a {
- color: color(white1);
- text-decoration: underline;
- padding: 0.4rem 0;
- font-size: 14px;
- }
-
- & p {
- color: color(white1);
- margin: 0;
- padding: 0.4rem 0;
- font-size: 14px;
- }
-
- &__info {
- display: flex;
- flex-direction: column;
- flex-basis: 100%;
- align-items: center;
-
- &__block {
- padding: 1rem 0;
- }
- }
-
- &__contacts {
- display: flex;
- justify-content: space-between;
- flex-flow: row nowrap;
- font-weight: 200;
-
- @media screen and (max-width: 600px - 1px) {
- flex-flow: column nowrap;
- }
- }
-
- &__text {
- display: flex;
- flex-flow: column;
- min-width: 180px;
-
- @media screen and (min-width: 600px) {
- padding-right: 3rem;
- }
- }
-
- &__links {
- display: flex;
- flex-flow: column;
-
- @media screen and (max-width: 600px - 1px) {
- margin-top: 2rem;
- }
- }
-
- &__copyright {
- display: flex;
- flex-flow: row nowrap;
- background-color: color(black1);
- text-align: center;
- justify-content: center;
- font-size: 12px;
- padding: 1rem 0;
-
- p {
- padding: 0.5rem 1rem;
- }
-
- @media screen and (max-width: 600px - 1px) {
- flex-flow: column nowrap;
- }
- }
-}
diff --git a/src/components/Footer/Footer.tsx b/src/components/Footer/Footer.tsx
index c816204..04cfabf 100644
--- a/src/components/Footer/Footer.tsx
+++ b/src/components/Footer/Footer.tsx
@@ -1,48 +1,54 @@
import React from "react";
-import FooterMap from "../FooterMap";
-import Anchor from "../Anchor";
-import "./Footer.scss";
+import styled from "styled-components";
+import { colors } from "@theme/colors";
+import FooterContent from "./FooterContent";
-export interface FooterProps { }
-export interface FooterState { }
+const StyledFooter = styled.footer`
+ display: flex;
+ flex-direction: column;
+ background-color: ${colors.darkBlue};
+`;
-class Footer extends React.Component
-
-
-
-
-
-
-
- Aalto-yliopiston Sähköinsinöörikilta ry
-
-
-
-
-
-Yhteystiedot
-
- TUAS-Talo
-Maarintie 8
-PL 15500, 00076 Aalto
--
-
Y-tunnus: 1627010-1
-sik-hallitus@list.ayy.fi
-
- Jäseneksi
- Palaute
- Arkisto
- Materiaalipankki
-
-
-
- © Aalto-yliopiston Sähköinsinöörikilta ry
-webmaster: sik-vtmk@list.ayy.fi
-© Aalto-yliopiston Sähköinsinöörikilta ry
+ webmaster: sik-vtmk@list.ayy.fi +
+
+
+
+
+
+
+
+ Aalto-yliopiston Sähköinsinöörikilta ry
+
+
+
+
+ TUAS-Talo
+Maarintie 8
+PL 15500, 00076 Aalto
+
+ Yhteystiedot
+
+ Y-tunnus: 1627010-1
+sik-hallitus@list.ayy.fi
+
+ Jäseneksi
+ Palaute
+ Arkisto
+ Materiaalipankki
+
+ {text}
;
-
-export interface FooterMapProps {}
-
-export interface FooterMapState {}
-
-class FooterMap extends React.Component
-
-
-
- );
- }
-}
-
-export default FooterMap;
diff --git a/src/components/FooterMap/index.ts b/src/components/FooterMap/index.ts
deleted file mode 100644
index dc2e662..0000000
--- a/src/components/FooterMap/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-import FooterMap from "./FooterMap";
-export default FooterMap;
diff --git a/src/components/Hero/Hero.tsx b/src/components/Hero/Hero.tsx
new file mode 100644
index 0000000..8ab2dc9
--- /dev/null
+++ b/src/components/Hero/Hero.tsx
@@ -0,0 +1,49 @@
+import React from "react";
+import styled from "styled-components";
+import { colors } from "@theme/colors";
+
+const Container = styled.div`
+ display: flex;
+ flex-flow: row wrap;
+ justify-content: space-between;
+ position: relative;
+ padding: 0;
+
+ min-height: 75vh;
+
+ section {
+ padding: 2rem 6rem;
+ @media screen and (max-width: 800px) {
+ padding: 1rem;
+ }
+ }
+
+ aside {
+ padding: 0 6rem;
+ @media screen and (max-width: 800px) {
+ padding: 2rem 1rem;
+ }
+ }
+
+ & > div {
+ flex: 8;
+ }
+
+ @media screen and (max-width: 800px) {
+ flex-direction: column;
+ }
+
+ color: ${colors.white};
+ background-color: ${colors.darkBlue};
+ a:hover {
+ color: ${colors.white};
+ }
+`;
+
+const Hero: React.FC = ({ children }) => (
+
-
-
-
-)
-
-export default HeroAsideItem;
diff --git a/src/components/Hero/HeroAsideSection/HeroAsideSection.scss b/src/components/Hero/HeroAsideSection/HeroAsideSection.scss
deleted file mode 100644
index c632179..0000000
--- a/src/components/Hero/HeroAsideSection/HeroAsideSection.scss
+++ /dev/null
@@ -1,43 +0,0 @@
-@import "../../../assets/scss/globals";
-
-
-.hero-aside-section {
- display: flex;
- flex-flow: column nowrap;
- align-items: flex-start;
- justify-content: center;
- flex: 4;
-
- @media screen and (max-width: 800px - 1px) {
- align-items: center;
- }
-
- text-align: left;
- padding: 3rem 1rem 2rem;
-
- &.dark-blue {
- background-color: color(dark-blue);
-
- h2 {
- color: color(light-blue);
- }
-
- p {
- font-weight: 100;
- color: color(white1);
- }
- }
-
- &.light-turquoise {
- background-color: color(light-turquoise);
-
- h2,
- p {
- color: color(dark-blue);
- }
- }
-
- &.light-blue {
- background-color: color(light-blue);
- }
-}
diff --git a/src/components/Hero/HeroAsideSection/HeroAsideSection.tsx b/src/components/Hero/HeroAsideSection/HeroAsideSection.tsx
deleted file mode 100644
index 505a0db..0000000
--- a/src/components/Hero/HeroAsideSection/HeroAsideSection.tsx
+++ /dev/null
@@ -1,22 +0,0 @@
-import React from "react";
-import "./HeroAsideSection.scss";
-import ColorDiv, { ColorDivProps } from "../../ColorDiv/ColorDiv";
-
-
-export interface HeroAsideSectionProps { }
-export interface HeroAsideSectionState { }
-
-class HeroAsideSection extends React.Component{title}
-{children}
-{linkText} ›
-
- {this.props.children}
-
- {header}
+ {text && ( +{text}
+ )} + {children} +{title}
+const HeroSecondarySection: React.FC{heading}
- {children}
-
- );
- }
-}
-
-export default InfoBox;
diff --git a/src/components/InfoBox/index.ts b/src/components/InfoBox/index.ts
deleted file mode 100644
index df5a48f..0000000
--- a/src/components/InfoBox/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-import InfoBox from "./InfoBox";
-export default InfoBox;
diff --git a/src/components/JsonLD/JsonLD.tsx b/src/components/JsonLD.tsx
similarity index 100%
rename from src/components/JsonLD/JsonLD.tsx
rename to src/components/JsonLD.tsx
diff --git a/src/components/JsonLD/index.ts b/src/components/JsonLD/index.ts
deleted file mode 100644
index e9b2e76..0000000
--- a/src/components/JsonLD/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-import JsonLD from "./JsonLD";
-export default JsonLD;
diff --git a/src/components/MainSection/MainSection.scss b/src/components/MainSection/MainSection.scss
deleted file mode 100644
index ed09469..0000000
--- a/src/components/MainSection/MainSection.scss
+++ /dev/null
@@ -1,21 +0,0 @@
-@import "../../assets/scss/globals";
-
-.main-section {
- display: flex;
- flex: 2;
- flex-flow: column;
- padding: 0 3rem;
-
- & > h3 {
- margin: auto;
- }
-
- & > h6 {
- color: color(orange1);
- }
-
- & > p {
- margin-block-start: 0.5rem;
- margin-block-end: 1rem;
- }
-}
diff --git a/src/components/MainSection/MainSection.tsx b/src/components/MainSection/MainSection.tsx
deleted file mode 100644
index a96a12a..0000000
--- a/src/components/MainSection/MainSection.tsx
+++ /dev/null
@@ -1,25 +0,0 @@
-import React from "react";
-import "./MainSection.scss";
-import ColorDiv, { ColorDivProps } from "../ColorDiv/ColorDiv";
-import classNames from "classnames";
-
-export interface MainSectionProps { }
-export interface MainSectionState { }
-
-class MainSection extends React.Component{children}
+
- {desc}
-
- );
- }
-}
-
-export default PageLink;
diff --git a/src/components/PageLink/index.ts b/src/components/PageLink/index.ts
deleted file mode 100644
index 118b0a5..0000000
--- a/src/components/PageLink/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-import PageLink from "./PageLink";
-export default PageLink;
diff --git a/src/components/PageSection/PageSection.scss b/src/components/PageSection/PageSection.scss
deleted file mode 100644
index 99752d3..0000000
--- a/src/components/PageSection/PageSection.scss
+++ /dev/null
@@ -1,40 +0,0 @@
-@import "../../assets/scss/globals";
-
-
-.page-section {
- display: flex;
- flex-flow: row wrap;
- justify-content: space-between;
- position: relative;
-
- &.lander-hero {
- @media screen and (min-width: 800px) {
- min-height: 85vh;
- }
- }
-
- &.padded {
- padding: 2rem 1rem 2rem;
- }
-
- &:not(.card-section) {
- @media screen and (max-width: 800px - 1px) {
- flex-flow: column nowrap;
- }
- }
-
- &.center {
- justify-content: center;
- }
-
- &.bottom-border {
- &::after {
- content: "";
- position: absolute;
- bottom: 0;
- width: 98%;
- left: 1%;
- border-bottom: 1px solid rgba(color(blue1), 0.4);
- }
- }
-}
diff --git a/src/components/PageSection/PageSection.tsx b/src/components/PageSection/PageSection.tsx
deleted file mode 100644
index e6e7c0b..0000000
--- a/src/components/PageSection/PageSection.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-import React from "react";
-import "./PageSection.scss";
-import ColorDiv, { ColorDivProps } from "../ColorDiv/ColorDiv";
-
-export interface PageSectionProps {
- center?: boolean;
- bottomBorder?: boolean;
- cardSection?: boolean; // does section contain a grid of cards
- fullSize?: boolean;
-}
-export interface PageSectionState { }
-
-class PageSection extends React.Component{this.props.children}
-
- {this.props.children}
-
- );
- }
-}
-
-export default Ribbon;
diff --git a/src/components/Ribbon/index.ts b/src/components/Ribbon/index.ts
deleted file mode 100644
index 896a201..0000000
--- a/src/components/Ribbon/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-import Ribbon from "./Ribbon";
-export default Ribbon;
diff --git a/src/components/SectionDividerWidget/index.ts b/src/components/SectionDividerWidget/index.ts
deleted file mode 100644
index 27d7f9c..0000000
--- a/src/components/SectionDividerWidget/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-import SectionDividerWidget from "./SectionDividerWidget";
-export default SectionDividerWidget;
diff --git a/src/components/Sections/CTASection.tsx b/src/components/Sections/CTASection.tsx
new file mode 100644
index 0000000..5ba27c0
--- /dev/null
+++ b/src/components/Sections/CTASection.tsx
@@ -0,0 +1,104 @@
+
+import React from "react";
+import styled from "styled-components";
+import { colors } from "@theme/colors";
+import Anchor from "@components/Anchor";
+
+const Section = styled.section<{ colors: string }>`
+ ${(p) => p.colors}
+
+ display: flex;
+ justify-content: center;
+ text-align: center;
+ align-items: baseline;
+ padding: 2rem 0;
+
+ flex-direction: row;
+ @media screen and (max-width: 600px) {
+ flex-direction: column;
+ }
+
+ a {
+ color: inherit;
+ }
+
+ & > a {
+ font-weight: 700;
+ text-decoration: none;
+ margin: 0.5rem 1rem 0;
+ font-size: 1rem;
+ text-transform: uppercase;
+ letter-spacing: 0.1rem;
+ }
+
+ & > h1 {
+ a {
+ text-decoration: underline;
+ }
+ a:hover {
+ text-decoration: none;
+ }
+ }
+`;
+
+type Colors = "orange1" | "lightBlue" | "darkBlue" | "blue1" | "lightTurquoise";
+
+interface CTASectionProps {
+ bgColor?: Colors;
+ link?: string;
+ linkText?: string;
+}
+
+const textColors = (bgColor: Colors) => {
+ switch(bgColor) {
+ case "orange1": return `
+color: ${colors.white};
+background-color: ${colors[bgColor]};
+a:hover {
+ color: ${colors.darkBlue};
+}
+`;
+
+ case "darkBlue": return `
+background-color: ${colors[bgColor]};
+color: ${colors.white};
+ `;
+
+ case "lightBlue": return `
+background-color: ${colors[bgColor]};
+color: ${colors.darkBlue};
+a:hover {
+ color: ${colors.white};
+}
+ `;
+
+ case "lightTurquoise": return `
+background-color: ${colors[bgColor]};
+color: ${colors.darkBlue};
+a:hover {
+ color: ${colors.white};
+}
+ `;
+ case "blue1": return `
+background-color: ${colors[bgColor]};
+color: ${colors.white};
+a:hover {
+ color: ${colors.darkBlue};
+}
+ `;
+ default: return ""
+ }
+}
+
+const CTASection: React.FC{children}
+ {link && ( +{linkText}
+
- Haluatko kuulla lisää yhteistyöstä kanssamme?
-
- );
- }
-}
-
-export default SponsorReel;
diff --git a/src/components/SponsorReel/index.ts b/src/components/SponsorReel/index.ts
deleted file mode 100644
index 3a66715..0000000
--- a/src/components/SponsorReel/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-import SponsorReel from "./SponsorReel";
-export default SponsorReel;
diff --git a/src/components/TextAnchor.tsx b/src/components/TextAnchor.tsx
new file mode 100644
index 0000000..99e608b
--- /dev/null
+++ b/src/components/TextAnchor.tsx
@@ -0,0 +1,30 @@
+import React from "react";
+import styled from "styled-components";
+import { Colors, colorToClass, hoverColorToClass } from "@theme/colors";
+import Anchor from "./Anchor";
+import classNames from "classnames";
+
+const A = styled(Anchor)`
+ text-decoration: underline;
+ font-weight: 600;
+`;
+
+interface TextAnchorProps {
+ to: string;
+ textColor?: Colors;
+ hoverColor?: Colors;
+}
+
+const TextAnchor: React.FCYhteistyössä
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Killan hallitus päivystää kiltahuoneella maanantaisin klo 12.15–13.15. Tuolloin voit ostaa kiltatuotteita, kuten esim. haalarimerkkejä tai laulukirjoja.
+
+
+ Kiltapäiväkerho Kiltis kokoontuu torstaisin klo XX.XX kiltahuoneella. Lorem ipsum dolor sit amet. Lämpimästi tervetuloa kaikki SIKkiläiset ja SIK-mieliset!
+
+
+
+ + Kilta järjestää jäsenilleen jos jonkinlaista projektia ja toimintaa, muun muassa: +
+
-
-
-
-
- Killan hallitus päivystää kiltahuoneella maanantaisin klo 12.15–13.15. Tuolloin voit ostaa kiltatuotteita, kuten esim. haalarimerkkejä tai laulukirjoja.
-
-
- Kiltapäiväkerho Kiltis kokoontuu torstaisin klo XX.XX kiltahuoneella. Lorem ipsum dolor sit amet. Lämpimästi tervetuloa kaikki SIKkiläiset ja SIK-mieliset!
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+ Sinustako kilta-aktiivi?
+
+
+
+
- Jotain elepajasta
-
-
- Jotain elepajasta
-
-
- Jotain elepajasta
-
-
- Jotain elepajasta
-
-
- Jotain elepajasta
-
-
-
+
+
);
}
diff --git a/src/views/ActualPage/EventCalendar.tsx b/src/views/ActualPage/EventCalendar.tsx
index 436c437..b6da06c 100644
--- a/src/views/ActualPage/EventCalendar.tsx
+++ b/src/views/ActualPage/EventCalendar.tsx
@@ -1,10 +1,9 @@
import React, { useState } from "react";
import { Event } from "@models/Event";
-import Card from "@components/Card";
import Button from "@components/Button";
-import PageSection from "@components/PageSection";
import FilterContainer from "./FilterContainer";
+import { CardSection, Card, FullWidthSection } from "@components/index";
interface EventCalendarProps {
events: Event[];
@@ -15,19 +14,23 @@ const EventCalendar: React.FCYritystapahtumia ja vastapainoa opiskelulle
-- Teekkarielämä ei ole pelkkää saunomista, juhlimista ja muita huvituksia—tai no, on se sitäkin. -
-
-
-
-
- - Kilta järjestää jäsenilleen jos jonkinlaista projektia ja toimintaa, muun muassa: -
-Tapahtumat
-Uutiset
-Kuvia tapahtumista.
-Kuvagalleria ›
-
+ <>
+
+ Kuvia tapahtumista.
+
+
+
-
- Sinustako kilta-aktiivi?
-Tule mukaan kiltatoimintaan ›
-Yritystapahtumia ja vastapainoa opiskelulle
+ + +Yritystapahtumia ja vastapainoa opiskelulle
+Toimintaa ylläpitää ja järjestää jaokset ja toimikunnat.
-
+
+ Jotain elepajasta
+
+
+ Jotain elepajasta
+
+
+ Jotain elepajasta
+
+
+ Jotain elepajasta
+
+
+ Jotain elepajasta
+
+
+
-
+ <>
+
-
+
+
+
+
+
- x.role.committee.name_fi === committee.name_fi)} />
-
+ <>
+
+ x.role.committee.name_fi === committee.name_fi)} />
+
+
+
);
}
}
diff --git a/src/views/CorporatePage/CorporatePage.scss b/src/views/CorporatePage/CorporatePage.scss
deleted file mode 100644
index 84ee338..0000000
--- a/src/views/CorporatePage/CorporatePage.scss
+++ /dev/null
@@ -1,5 +0,0 @@
-.corporate-page {
- display: flex;
- flex-flow: column wrap;
- justify-content: flex-start;
-}
diff --git a/src/views/CorporatePage/CorporatePageHero.tsx b/src/views/CorporatePage/CorporatePageHero.tsx
new file mode 100644
index 0000000..9ece37f
--- /dev/null
+++ b/src/views/CorporatePage/CorporatePageHero.tsx
@@ -0,0 +1,30 @@
+import React from "react";
+import { Hero, HeroPrimarySection, HeroAside, HeroAsideItem } from "@components/Hero";
+
+const CorporatePageHero: React.FC = () => (
+
Asiaa olisi, mutta kehen ottaa yhteyttä?
Tämä sivu yrittää valottaa sen oikean ihmisen puhelinnumeroa ja sähköpostiosoitetta.
@@ -35,16 +37,20 @@ class ContactsPageView extends React.Component
+
+
+
-
-
-
-
-
-
-
-
-
+
+
+
-
+
+
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+ Mainos Sössöön?
+
+
+
+
+
+
+
);
export default CorporatePageView;
diff --git a/src/views/EventPage/EventPageView.tsx b/src/views/EventPage/EventPageView.tsx
index 0c7b439..4f3640f 100644
--- a/src/views/EventPage/EventPageView.tsx
+++ b/src/views/EventPage/EventPageView.tsx
@@ -5,39 +5,39 @@ import { colors } from "@theme/colors";
import { Event } from "@models/Event";
import Button from "@components/Button";
import Anchor from "@components/Anchor";
-import PageSection from "@components/PageSection";
-import MainSection from "@components/MainSection";
interface EventPageViewProps {
event?: Event;
}
-const StyledSection = styled(MainSection)`
+const StyledSection = styled.section`
margin: auto;
max-width: 1000px;
align-items: center;
- h1 {
+ & > h1 {
color: ${colors.darkBlue};
}
- img {
+ & > div > img {
+ height: auto;
width: 100%;
- min-height: 100px;
}
- .event-desc {
+ & > p {
color: ${colors.orange1};
}
-
- .event-signup-buttons {
- display: flex;
- flex-flow: row wrap;
- justify-content: center;
- }
+`;
+
+const SignupButtons = styled.div`
+ display: flex;
+ flex-flow: row wrap;
+ justify-content: center;
`;
const Content = styled.div`
+ margin-top: 24px;
+
p {
color: ${colors.black};
}
@@ -74,31 +74,31 @@ const Content = styled.div`
const EventPageView: React.FCTee yhteistyötä tulevaisuuden huippuosaajien kanssa!
-- Aalto-yliopiston Sähköinsinöörikilta on loistava ja hyvinvoiva opiskelijayhteisö, joka vie sähkötekniikan avulla maailmaa eteenpäin. Kilta pitää jäsenistään huolta ja työelämän taitojen oppiminen onkin yksi killan tärkeistä arvoista. Siksi myös yritysyhteistyö on killalle hyvin arvokasta. Kilta järjestää paljon yhteistyötapahtumia, joissa kiltalaiset pääsevät tutustumaan yhteistyöyrityksiin ja killan tärkeänä tehtävänä on jakaa esimerkiksi työpaikkailmoituksia jäsenistölle. -
-Lyhyesti killasta ja sen toiminnasta
- -Aalto-yliopiston Sähköinsinöörikillan jäsenistöstä valmistuvat maan parhaimmat matematiikkaa ja fysiikkaa soveltavat huippuosaajat. Killan tehtävänä on pitää jäsenistään huolta ja edistää aktiivisesti jäsenten ja toimijoiden jaksamista. Killassa opitaan myös tärkeitä työelämätaitoja ammattimaisen killan johtamisen kautta.
- -Yhteistyömahdollisuudet
+ <> +Lyhyesti killasta ja sen toiminnasta
+Aalto-yliopiston Sähköinsinöörikillan jäsenistöstä valmistuvat maan parhaimmat matematiikkaa ja fysiikkaa soveltavat huippuosaajat. Killan tehtävänä on pitää jäsenistään huolta ja edistää aktiivisesti jäsenten ja toimijoiden jaksamista. Killassa opitaan myös tärkeitä työelämätaitoja ammattimaisen killan johtamisen kautta.
+ +Yhteistyömahdollisuudet
+Yhteistyömahdollisuuksista voi tiedustella lisää killan yrityssuhdemestarilta.
Yritysbrunssi
@@ -63,42 +42,35 @@ const CorporatePageView: React.FC = () => (Sössö
Sössö on Sähköinsinöörikillan hauska ja rakas opiskelijalehti. Sössö on kerännyt suosiota ja kartuttanut lukijamäärää jo vuodesta 1969 asti. Sössö ilmestyy perinteisesti paperisena, mutta myös Netti-Sössössä julkaistaan jatkuvasti uusia artikkeleja. Sössö tavoittaa noin tuhat elektroniikan, sähkötekniikan ja tietoliikennetekniikan opiskelijaa sekä koko tiedekunnan henkilökunnan. Lisäksi lehti lähetetään muille opiskelijajärjestöille. Yritysten on mahdollista saada mainostilaa Sössön sivuilta.
+Olethan yhteydessä!
+Olethan yhteydessä!
+Yllämainituista mahdollisuuksista, sekä muista ideoista kiinnostuneena, voit olla yhteydessä Yrityssuhdemestariimme Jarnoon.
Yrityssuhdemestari
Jarno Mustonen
050 123 4567
Jarno.mustonen (ät) aalto.fi
-
- Excursiosäännöt
-
-
- Liity jäseneksi
-
-
- Mainos Sössöön?
-Killan lehden mediakortin löydät täältä›
-Työpaikkailmoitukset
-TODO: Miten listataan yritykset?
- {/* TODO: Fix links */} +Työpaikkailmoitukset
+Voit saada yrityksesi työpaikkailmoituksen listalle lähettämällä sen osoitteeseen sik-yritys@list.ayy.fi
- -Loading
return (
- - {event.title_fi} -
-- {event.description_fi} -
++ {event.title_fi} +
++ {event.description_fi} +
+
- {event.signupForm.map(sf => (
-
-
-
- )
- )}
-
-
-
+
+
+
+
-
-
-
-
-
-
-
-
-
+
+
+
-
-
-
-
-
-
-
-
-
+ Killassa tapahtuu kaikenlaista!
+
+
+
+
+
+
);
export default FreshmenPageView;
diff --git a/src/views/FrontPage/FrontPage.scss b/src/views/FrontPage/FrontPage.scss
deleted file mode 100644
index bbedfd6..0000000
--- a/src/views/FrontPage/FrontPage.scss
+++ /dev/null
@@ -1,7 +0,0 @@
-@import "../../assets/scss/globals";
-
-.front-page {
- display: flex;
- flex-flow: column wrap;
- justify-content: flex-start;
-}
diff --git a/src/views/FrontPage/FrontPageHero.tsx b/src/views/FrontPage/FrontPageHero.tsx
new file mode 100644
index 0000000..2ce877d
--- /dev/null
+++ b/src/views/FrontPage/FrontPageHero.tsx
@@ -0,0 +1,50 @@
+import React from "react";
+import Anchor from "@components/Anchor";
+import { Hero, HeroPrimarySection, HeroAside, HeroAsideItem, HeroPrimaryButtons } from "@components/Hero";
+
+const FrontPageHero: React.FC = () => (
+ Tervetuloa opiskelemaan Otaniemeen!
-- Me olemme Emmaleena ja Jonna, sinun Fuksikapteenisi. Päätehtävämme on huolehtia fuksivuodestasi Aalto-yliopiston Sähköinsinöörikillassa. -
-Tämä on fuksien oma etusivu ja olemmekin keränneet tänne kaikki tärkeimmät tiedot, joita fuksivuotenasi tarvitset. Tietysti kannattaa katsoa myös yleisiä sivuja, sillä tänne ei mahdu kaikki, mitä killassa tapahtuu. -
-Onnittelut hyvästä opiskeluvalinnasta
- + <> +Onnittelut hyvästä opiskeluvalinnasta
+Olet tehnyt upean valinnan ottamalla askeleen matkalla, jossa sinusta ensin kehkeytyy teekkari ja myöhemmin diplomi-insinööri. Sinusta on juuri tullut tekniikan ylioppilas ja fuksi. Hieno saavutus, jota tietysti on syytä juhlia, ja tähän juhlaan paras sijainti on ehdottomasti Otaniemi. Tervetuloa!
-Ensi askeleina suosittelen, että liityt teille fukseille tehdyille Telegram-kanaville. Tästä pääset tiedotuskanavalle ja
Ensi askeleina suosittelen, että liityt teille fukseille tehdyille Telegram-kanaville. Tästä pääset tiedotuskanavalle ja
Matka nimeltä Teekkarius
Teekkarin matka on jokaiselle oman näköisensä. Kilta, ylioppilaskunta ja Otaniemen muut järjestöt tarjoavat varmasti jokaiselle omanlaista tekemistä ja harrastusta. Olet nyt osa Aalto-yliopiston Sähköinsinöörikiltaa ja me tulemme tukemaan sinua teekkariuden matkalla, jotta löydät juuri sinulle sopivat paikat, joissa vaikuttaa ja harrastaa. Jotta tämä onnistuisi, olemme esimerkiksi sijoittaneet sinut fuksiryhmään, johon tulet Orientaatioviikolla tutustumaan ja josta saat oman tukiryhmän uusiin seikkailuihin. Fuksiryhmääsi kuuluu myös muutama ISO. Heistä löydät lisää tietoa alempaa.
@@ -70,59 +32,47 @@ const FreshmenPageView: React.FC = () => (Jonna
0504327695
jonna.tammikivi (ät) aalto.fi
Killassa tapahtuu kaikenlaista!
-Seuraa killan tapahtumia
-Isoryhmät
+ + +Isoryhmät
+SIK:n fuksit nauttivat hurmaavien ISOhenkilöidensä opastuksesta ja hellästä huolenpidosta somissa ja omissa fuksiryhmissään.
-ISOt ovat hiukan vanhempia opiskelijoita ja kiltalaisia, joiden tehtävänä on olla tukenasi fuksivuoden ajan. Ensimmäisenä päivänä teidät jaetaan noin kymmenen hengen fuksiryhmiin ja jokaiseen ryhmään kuuluu kolmesta viiteen ISOa, joista yksi toimii opintoISOna. ISOilta voit kysyä mitä vain opiskeluun ja opiskelijaelämään liittyen. Vaikka he eivät tietäisi vastausta, he luultavimmin osaavat auttaa sinua vastausten löytämisessä.
-Kuten sanottu ISOt tukevat sinua koko fuksivuoden ajan, mutta eniten tulet näkemään heitä Orientaatioviikolla, jolloin he kulkevat fuksiryhmäsi kanssa ympäri Otaniemeä ja avaavat ovia teekkariuden saloihin. He auttavat sinua myös löytämään opintojen aloittamiseen tarvittavat asiat ja tukevat esimerkiksi lukujärjestyksen tekemisessä ja kirjastokortin, sekä matkakortin ja opiskelijakortin hankkimisessa.
-ISOT ovat myös kutsuttuna fuksivuotesi ensimmäiseen tapahtumaan, eli Varaslähtöön. Tule tutustumaan heihin sinne!
- - -
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
-
-
-
- Fuksikasvatusta, ISO-toimintaa, lorem ipsum dolor sit ja amet.
-
-
- Oletko abi, vaihtamassa uraa tai valmistumassa?
-
-
- Avoimet työpaikat ja excursiot. Infoa yritysten edustajille ja
- sponsseille.
-
-
-
-
- {events.map(event => (
- { }}>
-
-
-
-
-
-
-
-
- {feed.map(inst => (
- { }}>
-
-
-
-
+ <>
+ Aalto-yliopiston Sähköinsinöörikilta
-- on elektroniikan ja sähkötekniikan opiskelijoiden järjestö. Kilta - kasaa yhteen yli 600 alansa huippua, jotka ovat avainasemassa - vauhdilla sähköistyvän maailmamme kehityksessä. -
-
-
-
-
- Lue lisää ›
- - } - /> - ))} -
-
- Kaikki tapahtumat
-
-
- Sössöä vuodesta 1969.
-Lue opiskelijalehden viimeisin numero ›
-Lue lisää ›
- - } - /> - ))} -
-
- Lue tuoreimmat uutiset
-
-
- Kuvia tapahtumista
-
-
-
+
+
+
+
+ Vapaa-ajan
Arvot estrumquias doluptatur aut quam fugiti cus debit landisciis eatemperes eumquibus di blat que sim etus idis dolut labor ad magnat.
+
-
+
+
+ Jäsenedut vuonna 2019
+
+
+
+
);
export default GuildPageView;
diff --git a/src/views/InEnglishPage/InEnglishPage.scss b/src/views/InEnglishPage/InEnglishPage.scss
deleted file mode 100644
index 78efa16..0000000
--- a/src/views/InEnglishPage/InEnglishPage.scss
+++ /dev/null
@@ -1,5 +0,0 @@
-.in-english-page {
- display: flex;
- flex-flow: column wrap;
- justify-content: flex-start;
-}
diff --git a/src/views/InEnglishPage/InEnglishPageHero.tsx b/src/views/InEnglishPage/InEnglishPageHero.tsx
new file mode 100644
index 0000000..976d122
--- /dev/null
+++ b/src/views/InEnglishPage/InEnglishPageHero.tsx
@@ -0,0 +1,36 @@
+import React from "react";
+import { Hero, HeroPrimarySection, HeroAside, HeroAsideItem } from "@components/Hero";
+
+const InEnglishPageHero: React.FC = () => (
+
+
+
+
+);
+
+export default InEnglishPageHero;
diff --git a/src/views/InEnglishPage/InEnglishPageView.tsx b/src/views/InEnglishPage/InEnglishPageView.tsx
index 66a93a3..6d06695 100644
--- a/src/views/InEnglishPage/InEnglishPageView.tsx
+++ b/src/views/InEnglishPage/InEnglishPageView.tsx
@@ -1,10 +1,21 @@
import React from "react";
-import "./InEnglishPage.scss";
+import { TextSection } from "@components/index";
+import InEnglishPageHero from "./InEnglishPageHero";
const InEnglishPageView: React.FC = () => (
-
+
+
);
export default InEnglishPageView;
diff --git a/src/views/SignUpPage/FormUtils.tsx b/src/views/SignUpPage/FormUtils.tsx
index e555ed2..5e42529 100644
--- a/src/views/SignUpPage/FormUtils.tsx
+++ b/src/views/SignUpPage/FormUtils.tsx
@@ -1,5 +1,5 @@
-import { Question } from "@components/SignupQuestionsWidget";
+import { Question } from "@components/Widgets/SignupQuestionsWidget";
import { SignupForm } from "@models/SignupForm";
import { EMAIL_REGEX } from "@utils/regexes";
import escapeRegExp from "lodash/escapeRegExp";
diff --git a/src/views/SignUpPage/SignUpPage.scss b/src/views/SignUpPage/SignUpPage.scss
deleted file mode 100644
index 402bd34..0000000
--- a/src/views/SignUpPage/SignUpPage.scss
+++ /dev/null
@@ -1,61 +0,0 @@
-@import "../../assets/scss/globals";
-@import "../../components//Button/Button.scss";
-
-.sign-up-page {
- flex: 1 0 auto;
-
- .sign-up-statusmessage {
- color: color(orange1);
- }
-
- .sign-up-list {
- justify-content: start;
- li {
- padding-bottom: 0.3rem;
- }
-
- .reserved {
- color: color(blue1);
- }
- }
-
- .sign-up-form {
- legend {
- display: none;
- }
-
- & > div:last-child {
- display: flex;
- justify-content: center;
-
- button[type="submit"] {
- @extend .button;
- @extend .filled;
- }
- }
-
- fieldset {
- border: none;
- padding: 0;
- margin: 1rem 0;
-
- .form-group {
- padding-bottom: 0.5rem;
-
- & > label {
- margin: 0.5rem 0;
- font-weight: 600;
- display: block;
- }
- }
-
- input[type="text"], input[type="email"], input[type="number"] {
- display: block;
- height: 48px;
- width: 100%;
- font-size: 1.5rem;
- padding: 0 16px;
- }
- }
- }
-}
diff --git a/src/views/SignUpPage/SignUpPageView.tsx b/src/views/SignUpPage/SignUpPageView.tsx
index e6055bc..530a79d 100644
--- a/src/views/SignUpPage/SignUpPageView.tsx
+++ b/src/views/SignUpPage/SignUpPageView.tsx
@@ -1,13 +1,12 @@
import React from "react";
+import styled from "styled-components";
import Form, { IChangeEvent, ISubmitEvent, ErrorSchema } from "react-jsonschema-form";
-import "./SignUpPage.scss";
-import PageSection from "@components/PageSection";
import { SignupForm } from "@models/SignupForm";
import { buildFormSchema, buildUISchema } from "./FormUtils";
-import AsideSection from "@components/AsideSection";
-import MainSection from "@components/MainSection";
-import Checkboxes from "@components/Checkbox/Checkboxes";
-import RadioButtonWidget from "@components/RadioButton/RadioButtonWidget";
+import Checkboxes from "@components/Widgets/Checkbox/Checkboxes";
+import RadioButtonWidget from "@components/Widgets/RadioButton/RadioButtonWidget";
+import { TextSection } from "@components/index";
+import { colors } from "@theme/colors";
const customWidgets = {
"radio": RadioButtonWidget,
@@ -37,6 +36,65 @@ const renderList = (signUpForm: SignupForm) => {
)
}
+const StyledSection = styled(TextSection)`
+
+ & > div {
+ & > span {
+ color: ${colors.orange1};
+ }
+ }
+
+ & > aside {
+ justify-content: start;
+ li {
+ padding-bottom: 0.3rem;
+ }
+
+ .reserved {
+ color: color(blue1);
+ }
+ }
+
+ form {
+ legend {
+ display: none;
+ }
+
+ & > div:last-child {
+ display: flex;
+ justify-content: center;
+
+ button[type="submit"] {
+ color: blue;
+ }
+ }
+ }
+
+ fieldset {
+ border: none;
+ padding: 0;
+ margin: 1rem 0;
+
+ .form-group {
+ padding-bottom: 0.5rem;
+
+ & > label {
+ margin: 0.5rem 0;
+ font-weight: 600;
+ display: block;
+ }
+ }
+
+ input[type="text"], input[type="email"], input[type="number"] {
+ display: block;
+ height: 48px;
+ width: 100%;
+ font-size: 1.5rem;
+ padding: 0 16px;
+ }
+ }
+`;
+
const SignUpPageView: React.FC = ({
signUpForm,
formData,
@@ -51,9 +109,6 @@ const SignUpPageView: React.FC = ({
return (
<>
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+ Kilta koostuu sähkötekniikan ja elektroniikan (ELEC) tutkinto-ohjelmissa opiskelevista opiskelijoista
-Vapaa-ajan
Arvot estrumquias doluptatur aut quam fugiti cus debit landisciis eatemperes eumquibus di blat que sim etus idis dolut labor ad magnat.
-Killan tehtävät ja tarina
-Kilta tukee jäsentensä hyvinvointia ja tarjoaa vastapainoa opiskelulle. Kilta järjestää esimerkiksi urheilutapahtumia, kulttuurielämyksiä ja näiden lisäksi sitsejä ja saunailtoja. Valinnanvaraa on, joten
Yhteistyössä korkeakoulun kanssa, kilta kehittää
Killan tehtävät ja tarina
+
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+ Kilta tukee jäsentensä hyvinvointia ja tarjoaa vastapainoa opiskelulle. Kilta järjestää esimerkiksi urheilutapahtumia, kulttuurielämyksiä ja näiden lisäksi sitsejä ja saunailtoja. Valinnanvaraa on, joten
Takana lähes satavuotinen historia
+Yhteistyössä korkeakoulun kanssa, kilta kehittää
Vaikka kilta onkin ajan hermolla, on sillä takana lähes satavuotinen historia. - Sähköinsinööriklubin tuore puheenjohtaja lausahti klubin ensimmäisessä - varsinaisessa kokouksessa 16. helmikuuta 1921: “Koska klubi nyt ensi kerran - kokoontuu, niin pyydän lausua toivomuksena, että klubin jäsenillä aina tulisi - olemaan hauskaa, että toverielämä kukoistaisi ja että myös sähkötekniikkaa - klubissa harrastettaisiin.”.
+Takana lähes satavuotinen historia
-Vaikka ajat ovat muuttuneet, klubi on muuttunut killaksi ja jäsenmäärä kasvanut - alkuajoista valtavasti, ohjaavat nämä kolme asiaa edelleen killan toimintaa. Vaikka - pitkästä historiasta kannattaa olla ylpeä, ei sitä tarvitse kokea taakkana. Uutta - historiaa luodaan koko ajan ja tässä on meillä kaikilla mahdollista olla mukana. Ole - aktiivinen, ota asioista selvää ja osallistu kaikkeen mahdolliseen. Tulet varmasti - yllättymään kaikesta siitä mitä täältä keskuudestamme löytyy.
+Vaikka kilta onkin ajan hermolla, on sillä takana lähes satavuotinen historia. + Sähköinsinööriklubin tuore puheenjohtaja lausahti klubin ensimmäisessä + varsinaisessa kokouksessa 16. helmikuuta 1921: “Koska klubi nyt ensi kerran + kokoontuu, niin pyydän lausua toivomuksena, että klubin jäsenillä aina tulisi + olemaan hauskaa, että toverielämä kukoistaisi ja että myös sähkötekniikkaa + klubissa harrastettaisiin.”.
-Meitä teekkareita on todella moneen lähtöön
+Vaikka ajat ovat muuttuneet, klubi on muuttunut killaksi ja jäsenmäärä kasvanut + alkuajoista valtavasti, ohjaavat nämä kolme asiaa edelleen killan toimintaa. Vaikka + pitkästä historiasta kannattaa olla ylpeä, ei sitä tarvitse kokea taakkana. Uutta + historiaa luodaan koko ajan ja tässä on meillä kaikilla mahdollista olla mukana. Ole + aktiivinen, ota asioista selvää ja osallistu kaikkeen mahdolliseen. Tulet varmasti + yllättymään kaikesta siitä mitä täältä keskuudestamme löytyy.
-Minkäänlaista perus- tai ihanneteekkaria ei ole olemassa, vaan paras teekkariuden
- määritelmä kuuluukin: “teekkarius on kaikkea sitä, mitä teekkarit tekevät”. Yksi asia
- meitä kaikkia kuitenkin yhdistää. Opiskelemme jotain tekniikkaan liittyvää täällä
- Aalto-yliopistossa.
- Teekkariutta on vaikkapa toimiminen killoissa tai jossain
Meitä teekkareita on todella moneen lähtöön
-Teekkareilla, varsinkin otaniemeläisillä, on pitkä ja vahva historia. Siihen kannattaa - tutustua, jotta saa jonkinlaisen kuvan siitä vahvasta teekkarihengestä, joka - meillä täällä opinahjossamme vallitsee ja on vallinnut koko sen historian ajan. - Teekkariuteen kuuluu olennaisena osana mukautuminen ajan vaatimuksiin. Jos asiat - tehtäisiin aina vanhaa toistaen, ei voitaisi enää edes puhua teekkariudesta.
- -
-
- Yliopiston jäsenedut
-
-
- Liity jäseneksi
-
-
-
-
- Herrasmies- tai herrasnaisuus kuuluu olennaisena osana teekkariuteen. Hyvät käytöstavat on syytä aina pitää mielessä, liikuttiin sitten puku päällä excuilla tai sitseillä tai haalarit päällä Tukholman illassa.
-
-
- Killan hallinto koostuu XXX henkilöstä.
-Organisaatio
+Minkäänlaista perus- tai ihanneteekkaria ei ole olemassa, vaan paras teekkariuden
+ määritelmä kuuluukin: “teekkarius on kaikkea sitä, mitä teekkarit tekevät”. Yksi asia
+ meitä kaikkia kuitenkin yhdistää. Opiskelemme jotain tekniikkaan liittyvää täällä
+ Aalto-yliopistossa.
+ Teekkariutta on vaikkapa toimiminen killoissa tai jossain
Sähköinsinöörikillassa toimeenpanovaltaa käyttää 3–13 kiltalaisen muodostama
Valtuuston toimintaa
- -Killan valtuusto valitaan marraskuussa pidettävillä vaaleilla yhdeksi vuodeksi kerrallaan. Vaaleissa ovat vaalikelpoisia ja äänioikeutettuja kaikki SIK:n varsinaiset jäsenet. Uuden valtuuston toiminta alkaa varsin pian valitsemisen jälkeen vaalikokouksessa, jossa todetaan uusi kokoonpano, valitaan puhemiehistö, killan hallituksen puheenjohtaja ja muut hallituksen jäsenet, toimihenkilöt, toimikuntien puheenjohtajat sekä tilintarkastajat. Toinen sääntömääräinen valtuuston kokous on helmikuinen vuosikokous, jossa käsitellään mm. edellisen vuoden toimintakertomus ja tilinpäätös, sekä kuluvan vuoden toimintasuunnitelma ja budjetti. Lisäksi valtuusto pitää tarpeelliseksi katsomanssa määrän kokouksia pitkin vuotta.
Hallituksen toimintaa
-Jokaisella hallituksen jäsenellä on oma vastuualueensa, jota hän hoitaa yhdessä mahdollisen
-
- Vuoden 2019 hallinto
-
-
- Dolor sit amet
-
-
- Kiltatoimintaa järjestää ja ylläpitää kilta-aktiivit,
-
-
-
-
+
- Miksi alkaa kilta-aktiiviksi?
-- Näitä töitä tehdessä saa väkisinkin paljon uusia kavereita ja oppii monia palkallisessa työelämässä tarpeellisia taitoja. Eikä laajasta tuttavapiiristä ja monista kontakteista varmasti haittaa ole tulevaa työuraakaan ajatellen. Rahallista tai materiaalista hyötyä kiltatoiminnasta ei saa, eikä kukaan killan toimintaan mukaan tuleva sitä pyrikään tavoittelemaan. Mikä tärkeintä, kiltatoiminta on kivaa! -
-- » Uusia ystäviä, samanhenkistä seuraa -
-- » Loistava mahdollisuus kokeilla omia kykyjään -
-- » Voit kokeilla ja oppia jotain sellaista, mitä et ikinä aikaisemmin ole tehnyt -
-Runsaasti erilaisia tehtäviä
-
- Killassa on todella monenlaisia tehtäviä. Olitpa koodaaja, urheilija tai ammattimainen juhlija, killasta löytyy tekemistä juuri sinulle.
- » Haluatko
- »
- » Lorem ipsum -
-Teekkareilla, varsinkin otaniemeläisillä, on pitkä ja vahva historia. Siihen kannattaa + tutustua, jotta saa jonkinlaisen kuvan siitä vahvasta teekkarihengestä, joka + meillä täällä opinahjossamme vallitsee ja on vallinnut koko sen historian ajan. + Teekkariuteen kuuluu olennaisena osana mukautuminen ajan vaatimuksiin. Jos asiat + tehtäisiin aina vanhaa toistaen, ei voitaisi enää edes puhua teekkariudesta.
-
- Sähkötekniikan korkeakoulun toimikunnat
-- Ylioppilaskunnalla on edustus suuressa osassa Aalto-yliopiston tiedekuntia. Elektroniikan, tietoliikenteen ja automaation tiedekunnan toimikuntiin eli hallopedeihin opiskelijavalinna EST- ja TLT-tutkinto-ohjelmien osalta tehdään osin ylioppilaskunnan edustajistossa Sähköinsinöörikillan esityksestä ja osin Sähköinsinöörikillassa. -
-
-
+
+
+
+
+ Killan hallinto koostuu XXX henkilöstä.
+
+
+
+
+
+
+ Kiltatoimintaa järjestää ja ylläpitää kilta-aktiivit, toimikunnat ja jaokset .
+
+
+
+
+
+
+
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
- Jäseneksi liittyminen on helppoa, hauskaa ja hyödyllistä 8 € jäsenmaksulla pääset nauttimaan kaikista jäseneduista.
-
-
-
-
- Organisaatio
+
+
+
+
+ Sähköinsinöörikillassa toimeenpanovaltaa käyttää 3–13 kiltalaisen muodostama
Valtuuston toimintaa
+ +Killan valtuusto valitaan marraskuussa pidettävillä vaaleilla yhdeksi vuodeksi kerrallaan. Vaaleissa ovat vaalikelpoisia ja äänioikeutettuja kaikki SIK:n varsinaiset jäsenet. Uuden valtuuston toiminta alkaa varsin pian valitsemisen jälkeen vaalikokouksessa, jossa todetaan uusi kokoonpano, valitaan puhemiehistö, killan hallituksen puheenjohtaja ja muut hallituksen jäsenet, toimihenkilöt, toimikuntien puheenjohtajat sekä tilintarkastajat. Toinen sääntömääräinen valtuuston kokous on helmikuinen vuosikokous, jossa käsitellään mm. edellisen vuoden toimintakertomus ja tilinpäätös, sekä kuluvan vuoden toimintasuunnitelma ja budjetti. Lisäksi valtuusto pitää tarpeelliseksi katsomanssa määrän kokouksia pitkin vuotta.
Hallituksen toimintaa
+Jokaisella hallituksen jäsenellä on oma vastuualueensa, jota hän hoitaa yhdessä mahdollisen
+
+ Miksi alkaa kilta-aktiiviksi?
+Näitä töitä tehdessä saa väkisinkin paljon uusia kavereita ja oppii monia palkallisessa työelämässä tarpeellisia taitoja. Eikä laajasta tuttavapiiristä ja monista kontakteista varmasti haittaa ole tulevaa työuraakaan ajatellen. Rahallista tai materiaalista hyötyä kiltatoiminnasta ei saa, eikä kukaan killan toimintaan mukaan tuleva sitä pyrikään tavoittelemaan. Mikä tärkeintä, kiltatoiminta on kivaa!
+-
+
- » Uusia ystäviä, samanhenkistä seuraa +
- » Loistava mahdollisuus kokeilla omia kykyjään +
- » Voit kokeilla ja oppia jotain sellaista, mitä et ikinä aikaisemmin ole tehnyt +
+
+ Runsaasti erilaisia tehtäviä
+Killassa on todella monenlaisia tehtäviä. Olitpa koodaaja, urheilija tai ammattimainen juhlija, killasta löytyy tekemistä juuri sinulle.
-
+
- » Haluatko
valtuustoon ,hallitukseen taitoimariksi ?
+ - »
Toimihenkilönä pääset edistämään opintoja
+ - » Lorem ipsum +
Sähkötekniikan korkeakoulun toimikunnat
+
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed rhoncus feugiat ante. Nam eget venenatis dui. Morbi purus dui, cursus at velit id, placerat scelerisque turpis. Nulla a mauris odio. Nulla at tempor mi. Maecenas et sapien eu lorem interdum luctus. Proin interdum, tortor eget tempor tristique, massa arcu suscipit ipsum, sit amet lacinia erat lorem sit amet ipsum. Praesent dictum odio auctor odio sodales pharetra. Quisque accumsan iaculis diam, a laoreet odio aliquet eu. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. In hac habitasse platea dictumst. Pellentesque at hendrerit mi. Morbi at lacus finibus, pharetra urna sed, molestie tellus. Duis fermentum sodales leo. Nullam varius, massa in convallis sagittis, mi felis lacinia ipsum, viverra rhoncus nibh ipsum vel mi. Pellentesque ornare hendrerit malesuada.
Suspendisse porta diam in massa suscipit congue. Nulla facilisi. Nulla egestas tempus arcu, vitae ultrices risus rhoncus ac. Ut porta orci neque, vel fermentum turpis fermentum in. Curabitur condimentum, mi in tristique pulvinar, mauris nibh bibendum neque, quis tincidunt purus eros quis dolor. Aliquam imperdiet nibh ac quam iaculis, at ullamcorper diam ultricies. Vestibulum egestas consequat justo non vehicula. Nam non egestas tellus.
Praesent vel auctor ligula. Phasellus faucibus vulputate erat, non fringilla sem ultrices non. In vitae elit sit amet nisl interdum ultrices nec in ligula. Ut et turpis risus. Sed mattis varius nisl, in euismod diam fringilla ac. Nunc sed eros augue. Donec sit amet quam ex. Integer luctus nulla at est rutrum, a commodo est dapibus. Maecenas sagittis scelerisque blandit. Morbi congue tortor eros, sit amet vestibulum dolor tempor vitae. In pretium tellus at velit porttitor, vitae rutrum lacus suscipit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam bibendum ultricies metus, nec placerat urna efficitur auctor. Morbi non purus magna. Ut at ex nec nunc dictum ultricies.
Mauris volutpat nec sem sed malesuada. Sed eu scelerisque libero. Phasellus at mauris in ligula congue interdum et sit amet ante. Sed vestibulum, sem non congue molestie, quam massa euismod sem, non porta sem mauris vitae justo. Donec et fringilla tortor. Cras sed purus eget ante elementum mattis. Nunc elit nunc, volutpat sed congue ac, varius a ligula. Aenean sit amet laoreet dolor. Aenean finibus iaculis diam, quis lacinia nisi semper id. Phasellus eu nulla sed risus accumsan finibus. Nulla vel ante id mi vulputate ultrices. Cras finibus elementum tortor, at fringilla arcu facilisis ut. Cras vitae lectus pretium, posuere risus venenatis, congue metus. Phasellus vel dapibus felis.
Maecenas tincidunt orci nulla. Sed maximus tellus nec lorem dignissim aliquet. Maecenas tincidunt dolor sed est laoreet, nec suscipit augue dictum. Vivamus venenatis rutrum molestie. Vestibulum in maximus leo. Duis a euismod nulla. Aenean luctus sodales quam, ut fringilla elit bibendum in. Ut in purus sit amet libero hendrerit hendrerit ac eget nisl. In ac mauris at felis suscipit scelerisque eu eget erat. Fusce accumsan tempus mauris, porta sagittis odio venenatis ac. Integer mollis nulla in velit dignissim imperdiet. Nunc ac magna ullamcorper, pretium mauris et, semper enim. Morbi aliquet accumsan turpis id rutrum. Donec purus tellus, pellentesque non nunc ac, ornare scelerisque ex.
-
-
-
- + Ylioppilaskunnalla on edustus suuressa osassa Aalto-yliopiston tiedekuntia. Elektroniikan, tietoliikenteen ja automaation tiedekunnan toimikuntiin eli hallopedeihin opiskelijavalinna EST- ja TLT-tutkinto-ohjelmien osalta tehdään osin ylioppilaskunnan edustajistossa Sähköinsinöörikillan esityksestä ja osin Sähköinsinöörikillassa. +
+
-
- Jaokset—kokeile kiltatoimintaa vapaammin
-- Kiinnostaako kiltatoiminta, mutta vuoden kestävä sitoutuminen pelottaa? Jaokset mahdollistavat kiltatoiminnan kokeilemisen pienemmässä mittakaavassa. Jaokset toimivat varsin vapaamuotoisesti, mutta siltikin hyvässä hengessä. Mikäli Sinulla olisi hyvä idea, mitä kilta voisi jaosmaisesti toteuttaa, voit myös perustaa oman jaoksen. -
-Jäsenedut vuonna 2019
-Aalto-yliopiston tarjoamat monenlaiset edut
-- Sen lisäksi että kilta tarjoaa jäsenilleen palveluja ja aktiviteetteja, Aalto-yliopisto tarjoaa lorem ipsum dolor sit amet. -
-
- »
Jaokset—kokeile kiltatoimintaa vapaammin
++ Kiinnostaako kiltatoiminta, mutta vuoden kestävä sitoutuminen pelottaa? Jaokset mahdollistavat kiltatoiminnan kokeilemisen pienemmässä mittakaavassa. Jaokset toimivat varsin vapaamuotoisesti, mutta siltikin hyvässä hengessä. Mikäli Sinulla olisi hyvä idea, mitä kilta voisi jaosmaisesti toteuttaa, voit myös perustaa oman jaoksen. +
+Aalto-yliopiston tarjoamat monenlaiset edut
+
+
+
+ Sen lisäksi että kilta tarjoaa jäsenilleen palveluja ja aktiviteetteja, Aalto-yliopisto tarjoaa lorem ipsum dolor sit amet.
+»
+
+
+
- In English Page
-
+ <>
+ + Hey hey heyy +
+
+
+ + In English Page +
+