Move Color enum to index file

This commit is contained in:
Aarni Halinen
2019-06-03 19:19:21 +03:00
parent 84f2a64d38
commit 10485d650e
9 changed files with 56 additions and 64 deletions
@@ -1,21 +1,12 @@
import * as React from "react";
import "./HeroAsideSection.scss";
import { colors, ColorEnum } from "../../index";
export enum BackgroundColor {
DarkBlue,
LightTurquoise,
LightBlue,
}
export interface HeroAsideSectionProps {
backgroundColor?: BackgroundColor;
backgroundColor?: ColorEnum;
}
export interface HeroAsideSectionState {}
const colors = new Map<BackgroundColor, string>([
[BackgroundColor.DarkBlue, "dark-blue"],
[BackgroundColor.LightTurquoise, "light-turquoise"],
[BackgroundColor.LightBlue, "light-blue"],
]);
export interface HeroAsideSectionState { }
class HeroAsideSection extends React.Component<HeroAsideSectionProps, HeroAsideSectionState> {
render() {
+3 -18
View File
@@ -1,30 +1,15 @@
import * as React from "react";
import "./PageSection.scss";
export enum BackgroundColor {
DarkBlue,
White,
Orange,
LightTurquoise,
LightBlue,
}
import { colors, ColorEnum } from "../../index";
export interface PageSectionProps {
backgroundColor: BackgroundColor;
backgroundColor: ColorEnum;
center?: boolean;
bottomBorder?: boolean;
cardSection?: boolean; // does section contain a grid of cards
fullSize?: boolean;
}
export interface PageSectionState {}
const colors = new Map<BackgroundColor, string>([
[BackgroundColor.DarkBlue, "dark-blue"],
[BackgroundColor.White, "white"],
[BackgroundColor.Orange, "orange"],
[BackgroundColor.LightTurquoise, "light-turquoise"],
[BackgroundColor.LightBlue, "light-blue"],
]);
export interface PageSectionState { }
class PageSection extends React.Component<PageSectionProps, PageSectionState> {
render() {
@@ -3,7 +3,6 @@
.text-anchor {
text-decoration: underline;
font-weight: 600;
color: inherit;
&:hover {
color: $blue;
+7 -6
View File
@@ -20,19 +20,20 @@ export interface TextAnchorProps {
size?: TextSize;
to: string;
style?: any;
color?: string;
}
export interface TextAnchorState {}
export interface TextAnchorState { }
class TextAnchor extends React.Component<TextAnchorProps, TextAnchorState> {
render() {
const { children, size, to, style } = this.props;
const className = `text-anchor ${sizes.get(size ? size : TextSize.Small)}`;
if (to.startsWith("/")) {
return (
<Link style={style} to={to} className={className}>
{children}
</Link>
);
return (
<Link style={style} to={to} className={className}>
{children}
</Link>
);
} else {
return (
<a style={style} href={to} className={className}>
+18 -2
View File
@@ -1,7 +1,7 @@
import * as React from "react";
import {render} from "react-dom";
import { render } from "react-dom";
import { BrowserRouter } from "react-router-dom";
import {AppContainer} from "react-hot-loader";
import { AppContainer } from "react-hot-loader";
import Routes from "./routes";
import "./index.scss";
@@ -9,6 +9,22 @@ console.log("Using API URL: ", process.env.API_URL);
const rootEl = document.getElementById("root");
export enum ColorEnum {
DarkBlue,
White,
Orange,
LightTurquoise,
LightBlue,
}
export const colors = new Map<ColorEnum, string>([
[ColorEnum.DarkBlue, "dark-blue"],
[ColorEnum.White, "white"],
[ColorEnum.Orange, "orange"],
[ColorEnum.LightTurquoise, "light-turquoise"],
[ColorEnum.LightBlue, "light-blue"],
]);
render(
<AppContainer>
<BrowserRouter>
+12 -12
View File
@@ -5,7 +5,7 @@ import "./ContactsPage.scss";
import { StaticContext } from "../../server/StaticContext";
import PageLink from "../../components/PageLink/PageLink";
import Card from "../../components/Card";
import { BackgroundColor as PageSectionColor } from "../../components/PageSection/PageSection";
import { ColorEnum as PageSectionColor } from "../../index";
import PageSection from "../../components/PageSection";
import HeroMainSection from "../../components/HeroMainSection";
import ContactCard from "../../components/ContactCard";
@@ -68,21 +68,21 @@ class ContactsPage extends React.Component<ContactsPageProps, ContactsPageState>
</Helmet>
Contacts Page
<HeroMainSection>
<h1>Aalto-yliopiston Sähköinsinöörikilta</h1>
<p>
lorem ipsum dolor est
<h1>Aalto-yliopiston Sähköinsinöörikilta</h1>
<p>
lorem ipsum dolor est
</p>
</HeroMainSection>
<PageSection backgroundColor={PageSectionColor.White}>
{contacts.map(contact => (
<ContactCard
key = {contact.id}
first_name = {contact.first_name}
last_name = {contact.last_name}
phone = {contact.phone_number}
email = {contact.email}
{contacts.map(contact => (
<ContactCard
key={contact.id}
first_name={contact.first_name}
last_name={contact.last_name}
phone={contact.phone_number}
email={contact.email}
/>
))}
))}
</PageSection>
</div>
);
+2 -2
View File
@@ -9,8 +9,8 @@ import { StaticContext } from "../../server/StaticContext";
// @ts-ignore
import * as BeerImage from "../../assets/img/beer.jpeg";
import PageSection from "../../components/PageSection";
import { BackgroundColor as PageSectionColor } from "../../components/PageSection/PageSection";
import { BackgroundColor as HeroAsideColor } from "../../components/HeroAsideSection/HeroAsideSection";
import { ColorEnum as PageSectionColor } from "../../index";
import { ColorEnum as HeroAsideColor } from "../../index";
import PageLink from "../../components/PageLink/PageLink";
import HeroMainSection from "../../components/HeroMainSection";
+8 -8
View File
@@ -10,8 +10,8 @@ import HeroAsideSection from "../../components/HeroAsideSection";
import HeroAsideItem from "../../components/HeroAsideItem";
import Ribbon from "../../components/Ribbon";
import InfoBox from "../../components/InfoBox";
import { BackgroundColor as PageSectionColor } from "../../components/PageSection/PageSection";
import { BackgroundColor as HeroAsideColor } from "../../components/HeroAsideSection/HeroAsideSection";
import { ColorEnum as PageSectionColor } from "../../index";
import { ColorEnum as HeroAsideColor } from "../../index";
import Accordion from "../../components/Accordion";
import TextAnchor from "../../components/TextAnchor/index";
import { TextSize } from "../../components/TextAnchor/TextAnchor";
@@ -63,17 +63,17 @@ class GuildPage extends React.Component<GuildPageProps, GuildPageState> {
<p>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 <TextAnchor to="/kalenteri">tapahtumakalenterin</TextAnchor> aktiivisella seuraamisella
saattaa olla hyvinkin miellyttäviä seuraamuksia. Voit myös itse järjestää mieleisesi
saattaa olla hyvinkin miellyttäviä seuraamuksia. Voit myös itse järjestää mieleisesi
tapahtuman killan tukemana, tai ehdottaa sitä killan toimitsijoille.</p>
<p>Yhteistyössä korkeakoulun kanssa, kilta kehittää <TextAnchor to="/opinnot">opetusta</TextAnchor>. Kilta on mukana
kurssien kehittämisessä, valvoo kiltalaisten etua korkeakoulussa ja tuo korkeakoulun
henkilöstöä lähemmäs kiltalaisia.
Kilta avaa oven <TextAnchor to="/yritysyhteistyo">yritysmaailmaan</TextAnchor> järjestämällä yritysten kanssa excursioita,
saunailtoja ja yritystapahtumia. Lisäksi killan kautta kuulee ensimmäisten joukossa
uusista avoimista työpaikoista.
saunailtoja ja yritystapahtumia. Lisäksi killan kautta kuulee ensimmäisten joukossa
uusista avoimista työpaikoista.
Killalla on Otaniemen mukavin <TextAnchor to="/kiltahuone">kiltahuone</TextAnchor>, jossa voi käydä hengähtämässä
luentojen välillä, hakea apua vaikeisiin tehtäviin tai järjestää vaikka leffailtoja. Tämän
luentojen välillä, hakea apua vaikeisiin tehtäviin tai järjestää vaikka leffailtoja. Tämän
lisäksi killalla on myös haastavampaan elektroniikkaharrasteluun sopivat tilat.</p>
<h6>Takana lähes satavuotinen historia</h6>
@@ -100,8 +100,8 @@ class GuildPage extends React.Component<GuildPageProps, GuildPageState> {
Aalto-yliopistossa.
Teekkariutta on vaikkapa toimiminen killoissa tai jossain <TextAnchor to="https://ayy.fi/yhdistykset/yhdistyslistaus/">AYY:n lukuisista
yhdistyksistä</TextAnchor>. Teekkariutta on yhtä lailla SIK:n tapahtumien järjestäminen tai niihin
osallistuminen kuin vaikkapa laulaminen Polyteknikkojen Kuorossa tai sukeltaminen
Polyteknikkojen sukelluskerho Kuplassa. Kaikille varmasti löytyy jotain itseä
osallistuminen kuin vaikkapa laulaminen Polyteknikkojen Kuorossa tai sukeltaminen
Polyteknikkojen sukelluskerho Kuplassa. Kaikille varmasti löytyy jotain itseä
kiinnostavaa.</p>
<p>Teekkareilla, varsinkin otaniemeläisillä, on pitkä ja vahva historia. Siihen kannattaa
+2 -2
View File
@@ -3,7 +3,7 @@ import Helmet from "react-helmet";
import "./SignUpPage.scss";
import { getForm, SignupForm } from "../../models/SignupForm";
import PageSection from "../../components/PageSection";
import { BackgroundColor as PageSectionColor } from "../../components/PageSection/PageSection";
import { ColorEnum as PageSectionColor } from "../../index";
import { Question, optionTypes } from "../../components/SignupQuestionsWidget";
export interface SignUpPageProps {
@@ -50,7 +50,7 @@ class SignUpPage extends React.Component<SignUpPageProps, SignUpPageState> {
fetchSignUp = (): Promise<SignupForm> => {
const { match } = this.props;
const { id } = match.params;
const { id } = match.params;
const formPromise = getForm(id);
formPromise.then(signUpForm => {
this.setState({