diff --git a/src/components/AddLink.tsx b/src/components/AddLink.tsx index 47471fd..bf998ab 100644 --- a/src/components/AddLink.tsx +++ b/src/components/AddLink.tsx @@ -1,10 +1,10 @@ import React, { ComponentProps } from "react"; import styled from "styled-components"; import { colors }from "@theme/colors"; -import Anchor from "@components/Anchor"; +import { Link } from "@components/index"; import AddIcon from "@assets/img/add-icon.png"; -const Link = styled(Anchor)` +const StyledLink = styled(Link)` display: flex; flex-flow: row nowrap; align-items: center; @@ -21,15 +21,15 @@ const Link = styled(Anchor)` } `; -type AddLinkProps = ComponentProps & { +type AddLinkProps = ComponentProps & { text: string; } const AddLink: React.FC = ({ text, ...props }) => ( - + {text} - + ) export default AddLink; \ No newline at end of file diff --git a/src/components/AdminSidebar.tsx b/src/components/AdminSidebar.tsx index ff4c5eb..0f41615 100644 --- a/src/components/AdminSidebar.tsx +++ b/src/components/AdminSidebar.tsx @@ -1,6 +1,6 @@ import React from "react"; import styled from "styled-components"; -import Anchor from "@components/Anchor"; +import { Link } from "@components/index"; import colors from "@theme/colors"; import breakpoints from "@theme/breakpoints"; @@ -20,7 +20,7 @@ const SideBar = styled.nav` } `; -const StyledLink = styled(Anchor)<{path: string}>` +const StyledLink = styled(Link)<{path: string}>` padding: 1rem 3rem 1rem 1rem; letter-spacing: 3px; text-transform: uppercase; diff --git a/src/components/Anchor.tsx b/src/components/Anchor.tsx deleted file mode 100644 index e9ef6b4..0000000 --- a/src/components/Anchor.tsx +++ /dev/null @@ -1,25 +0,0 @@ -import React from "react"; -import { Link } from "react-router-dom"; -import { HashLink } from "react-router-hash-link"; - -interface AnchorProps extends React.HTMLAttributes { - to: string; -} - -const Anchor: React.FC = ({ to, ...props }) => { - if (to.startsWith("/")) { - return ( - - ); - } else if (to.startsWith("#")) { - return ( - - ); - } - else { - return ( - - ); - } -} -export default Anchor; diff --git a/src/components/Card.tsx b/src/components/Card.tsx index f609c39..733a870 100644 --- a/src/components/Card.tsx +++ b/src/components/Card.tsx @@ -1,7 +1,7 @@ import React from "react"; import styled from "styled-components"; import { colors } from "@theme/colors"; -import Anchor from "@components/Anchor"; +import { Link } from "@components/index"; import breakpoints from "@theme/breakpoints"; interface WrappedCardProps { @@ -97,11 +97,11 @@ const WrappedCard: React.FC = ({ title, text, link, image, ima ) : null; const button = ( - + - + ); return ( diff --git a/src/components/Footer/FooterContent.tsx b/src/components/Footer/FooterContent.tsx index 038d1f2..3188682 100644 --- a/src/components/Footer/FooterContent.tsx +++ b/src/components/Footer/FooterContent.tsx @@ -1,6 +1,6 @@ import React from "react"; import styled from "styled-components"; -import Anchor from "../Anchor"; +import { Link } from "@components/index"; import colors from "@theme/colors"; import breakpoints from "@theme/breakpoints"; @@ -79,14 +79,14 @@ const FooterContent: React.FC = () => (

Y-tunnus: 1627010-1

sik-hallitus@list.ayy.fi

- Yhteystiedot + Yhteystiedot
- Jäseneksi - Palaute - Arkisto - Materiaalipankki + Jäseneksi + Palaute + Arkisto + Materiaalipankki
diff --git a/src/components/HeaderLogo.tsx b/src/components/HeaderLogo.tsx index b833e61..b09496f 100644 --- a/src/components/HeaderLogo.tsx +++ b/src/components/HeaderLogo.tsx @@ -1,6 +1,6 @@ import React from "react"; import styled from "styled-components"; -import { Link } from "react-router-dom"; +import { Link } from "@components/index"; import TitleImage from "@assets/img/SIK_RGB_W_side.png"; import breakpoints from "@theme/breakpoints"; diff --git a/src/components/Hero/HeroAside.tsx b/src/components/Hero/HeroAside.tsx index c2afe04..241e0a7 100644 --- a/src/components/Hero/HeroAside.tsx +++ b/src/components/Hero/HeroAside.tsx @@ -1,7 +1,7 @@ import React from "react"; import styled from "styled-components"; import { colors } from "@theme/colors"; -import Anchor from "@components/Anchor"; +import { Link } from "@components/index"; interface HeroAsideItemProps { header: string; @@ -20,11 +20,11 @@ export const HeroAsideItem: React.FC = ({ header, text, link {text && (

{text}

)} - +
{linkText}
-
+ ) diff --git a/src/components/Link.tsx b/src/components/Link.tsx new file mode 100644 index 0000000..b802ed0 --- /dev/null +++ b/src/components/Link.tsx @@ -0,0 +1,48 @@ +import React from "react"; +// import NextJSLink, { LinkProps } from "next/link"; +import { Link as RouterLink } from "react-router-dom"; +import { HashLink } from "react-router-hash-link"; + +// interface Props extends Omit { +// template?: string; +// to: string; +// } + +interface Props extends React.HTMLAttributes { + to: string; +} + +const Link: React.FC = ({ to, ...props }) => { +// const Link: React.FC = ({ to, template, ...props }) => { +// if (template) { +// return ( +// +// ) +// } +// if (to.startsWith("/") || to.startsWith("#")) { +// return ( +// +// ); +// } +// else { +// return ( +//
+// ); +// } + if (to.startsWith("/")) { + return ( + + ); + } else if (to.startsWith("#")) { + return ( + + ); + } + else { + return ( + + ); + } +} + +export default Link; diff --git a/src/components/NavbarChildLink.tsx b/src/components/NavbarChildLink.tsx index bc745bf..b665126 100644 --- a/src/components/NavbarChildLink.tsx +++ b/src/components/NavbarChildLink.tsx @@ -2,13 +2,13 @@ import React from "react"; import styled from "styled-components"; import colors from "@theme/colors"; import breakpoints from "@theme/breakpoints"; -import Anchor from "./Anchor"; +import { Link } from "@components/index"; interface NavbarChildLinkProps { to: string; } -const StyledLink = styled(Anchor)` +const StyledLink = styled(Link)` display: block; padding: 1rem; letter-spacing: 1.5px; diff --git a/src/components/NavbarDropdownLink.tsx b/src/components/NavbarDropdownLink.tsx index 0f2053a..84aaae0 100644 --- a/src/components/NavbarDropdownLink.tsx +++ b/src/components/NavbarDropdownLink.tsx @@ -1,7 +1,7 @@ import React, { useState } from "react"; import styled from "styled-components"; import DropDownBox from "./DropDownBox"; -import Anchor from "./Anchor"; +import { Link } from "@components/index"; import colors from "@theme/colors"; import breakpoints from "@theme/breakpoints"; @@ -20,7 +20,7 @@ const Container = styled.div` } `; -const StyledLink = styled(Anchor)` +const StyledLink = styled(Link)` display: flex; flex-flow: row nowrap; justify-content: flex-start; diff --git a/src/components/PageLink.tsx b/src/components/PageLink.tsx index e768f3d..93941a4 100644 --- a/src/components/PageLink.tsx +++ b/src/components/PageLink.tsx @@ -1,7 +1,7 @@ import React from "react"; import styled from "styled-components"; import { colors } from "@theme/colors"; -import Anchor from "@components/Anchor"; +import { Link } from "@components/index"; interface PageLinkProps { to: string; @@ -43,7 +43,7 @@ const StyledPageLink = styled.div` const PageLink: React.FC = ({ to, desc, children }) => (

{children}

- {desc} + {desc}
); diff --git a/src/components/Sections/CTASection.tsx b/src/components/Sections/CTASection.tsx index eebedfe..e596ad0 100644 --- a/src/components/Sections/CTASection.tsx +++ b/src/components/Sections/CTASection.tsx @@ -2,7 +2,7 @@ import React from "react"; import styled from "styled-components"; import { colors } from "@theme/colors"; -import Anchor from "@components/Anchor"; +import { Link } from "@components/index"; const Section = styled.section<{ colors: string }>` ${(p) => p.colors} @@ -91,9 +91,9 @@ const CTASection: React.FC = ({ bgColor = "orange1", link, link

{children}

{link && ( - +

{linkText}

-
+ )}
); diff --git a/src/components/index.tsx b/src/components/index.tsx index befd1d7..66782fa 100644 --- a/src/components/index.tsx +++ b/src/components/index.tsx @@ -8,3 +8,4 @@ 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"; +export { default as Link } from "./Link"; diff --git a/src/pages/admin/AdminEventPage.tsx b/src/pages/admin/AdminEventPage.tsx index 34e448d..583de74 100644 --- a/src/pages/admin/AdminEventPage.tsx +++ b/src/pages/admin/AdminEventPage.tsx @@ -2,7 +2,7 @@ import React, { useEffect, useState } from "react"; import { Helmet } from "react-helmet"; import { formatRelative } from "date-fns"; import AdminListCommon from "@views/admin/AdminListCommon"; -import Anchor from "@components/Anchor"; +import { Link } from "@components/index"; import AddLink from "@components/AddLink"; import { Event, getEvents } from "@models/Event"; @@ -25,7 +25,7 @@ const renderData = (events: Event[]) => { {events.map(event => ( - {event.title_fi} + {event.title_fi} {formatRelative(new Date(event.start_time), new Date())} {formatRelative(new Date(event.end_time), new Date())} diff --git a/src/pages/admin/AdminFeedPage.tsx b/src/pages/admin/AdminFeedPage.tsx index 8a6d601..473280a 100644 --- a/src/pages/admin/AdminFeedPage.tsx +++ b/src/pages/admin/AdminFeedPage.tsx @@ -2,7 +2,7 @@ import React, { useEffect, useState } from "react"; import { Helmet } from "react-helmet"; import { formatRelative } from "date-fns"; import AdminListCommon from "@views/admin/AdminListCommon"; -import Anchor from "@components/Anchor"; +import { Link } from "@components/index"; import AddLink from "@components/AddLink"; import { Post, getFeed } from "@models/Feed"; @@ -25,7 +25,7 @@ const renderData = (feed: Post[]) => { {feed.map(post => ( - {post.title_fi} + {post.title_fi} {post.description_fi} {formatRelative(new Date(post.publish_time), new Date())} diff --git a/src/pages/admin/AdminJobAdPage.tsx b/src/pages/admin/AdminJobAdPage.tsx index 723daed..0d2ae0f 100644 --- a/src/pages/admin/AdminJobAdPage.tsx +++ b/src/pages/admin/AdminJobAdPage.tsx @@ -2,7 +2,7 @@ import React from "react"; import { Helmet } from "react-helmet"; import { formatRelative } from "date-fns"; import AdminListCommon from "@views/admin/AdminListCommon"; -import Anchor from "@components/Anchor"; +import { Link } from "@components/index"; import AddLink from "@components/AddLink"; import useFetchJobAds from "@hooks/useFetchJobAds"; import { JobAd } from "@models/JobAd"; @@ -27,7 +27,7 @@ const renderData = (jobAds: JobAd[]) => { {jobAds.map(ad => ( - {ad.title_fi} + {ad.title_fi} {ad.description_fi} {ad.autohide_enabled ? diff --git a/src/pages/admin/AdminSignupPage.tsx b/src/pages/admin/AdminSignupPage.tsx index 1b1d425..edf66d7 100644 --- a/src/pages/admin/AdminSignupPage.tsx +++ b/src/pages/admin/AdminSignupPage.tsx @@ -2,7 +2,7 @@ import React, { useEffect, useState } from "react"; import { Helmet } from "react-helmet"; import { formatRelative } from "date-fns"; import AdminListCommon from "@views/admin/AdminListCommon"; -import Anchor from "@components/Anchor"; +import { Link } from "@components/index"; import AddLink from "@components/AddLink"; import { SignupForm, getForms } from "@models/SignupForm"; @@ -27,11 +27,11 @@ const renderData = (signupForms: SignupForm[]) => { {signupForms.map(signupForm => ( - {signupForm.title_fi} + {signupForm.title_fi} {formatRelative(new Date(signupForm.start_time), new Date())} {formatRelative(new Date(signupForm.end_time), new Date())} - View - Send + View + Send ))} diff --git a/src/views/ActualPage/ActualPageHero.tsx b/src/views/ActualPage/ActualPageHero.tsx index ccadfcf..8a44dda 100644 --- a/src/views/ActualPage/ActualPageHero.tsx +++ b/src/views/ActualPage/ActualPageHero.tsx @@ -1,6 +1,6 @@ import React from "react"; import { Hero, HeroPrimarySection, HeroSecondarySection, HeroSecondarySectionItem, HeroAside, HeroAsideItem, HeroPrimaryButtons } from "@components/Hero"; -import Anchor from "@components/Anchor"; +import { Link } from "@components/index"; import noop from "@utils/noop"; const ActualPageHero: React.FC = () => ( @@ -10,16 +10,16 @@ const ActualPageHero: React.FC = () => ( text="Teekkarielämä ei ole pelkkää saunomista, juhlimista ja muita huvituksia—tai no, on se sitäkin." > - + - - + + - + diff --git a/src/views/ContactsPage/ContactsPageView.tsx b/src/views/ContactsPage/ContactsPageView.tsx index 5f02346..14b35da 100644 --- a/src/views/ContactsPage/ContactsPageView.tsx +++ b/src/views/ContactsPage/ContactsPageView.tsx @@ -4,14 +4,14 @@ import { Occupation, Committee } from "@models/Contacts"; import CommitteeContainer from "@components/CommitteeContainer"; import { Divider, TextSection } from "@components/index"; import { colors } from "@theme/colors"; -import Anchor from "@components/Anchor"; +import { Link } from "@components/index"; interface ContactsPageViewProps { contacts: Occupation[]; committees: Committee[]; } -const BlueLink = styled(Anchor)` +const BlueLink = styled(Link)` color: ${colors.blue1}; &:hover { diff --git a/src/views/CorporatePage/JobAdList.tsx b/src/views/CorporatePage/JobAdList.tsx index 8509994..c6627e4 100644 --- a/src/views/CorporatePage/JobAdList.tsx +++ b/src/views/CorporatePage/JobAdList.tsx @@ -1,7 +1,7 @@ import React from "react"; import styled from "styled-components"; import { JobAd } from "@models/JobAd"; -// import Anchor from "@components/Anchor"; +// import { Link } from "@components/index"; import { Accordion } from "@components/index"; import ReactMarkdown from "react-markdown"; diff --git a/src/views/EventPage/EventPageView.tsx b/src/views/EventPage/EventPageView.tsx index 1a7564d..b28ed47 100644 --- a/src/views/EventPage/EventPageView.tsx +++ b/src/views/EventPage/EventPageView.tsx @@ -3,7 +3,7 @@ import styled from "styled-components"; import colors from "@theme/colors"; import { Event } from "@models/Event"; import Button from "@components/Button"; -import Anchor from "@components/Anchor"; +import { Link } from "@components/index"; import noop from "@utils/noop"; import { TextSection } from "@components/index"; import MarkdownStyles from "@views/common/MarkdownStyles"; @@ -56,11 +56,11 @@ const EventPageView: React.FC = ({ event }) => { {/* We may have multiple signup forms. Generate own Button for each one */} {event.signupForm.map(sf => ( - + - + ) )} diff --git a/src/views/FrontPage/FrontPageHero.tsx b/src/views/FrontPage/FrontPageHero.tsx index 7cf15b8..a8f2cd5 100644 --- a/src/views/FrontPage/FrontPageHero.tsx +++ b/src/views/FrontPage/FrontPageHero.tsx @@ -1,5 +1,5 @@ import React from "react"; -import Anchor from "@components/Anchor"; +import { Link } from "@components/index"; import { Hero, HeroPrimarySection, HeroAside, HeroAsideItem, HeroPrimaryButtons } from "@components/Hero"; import noop from "@utils/noop"; @@ -10,16 +10,16 @@ const FrontPageHero: React.FC = () => ( text="on opiskelijajärjestö, joka kokoaa yhteen laaja-alaisesti sähkötekniikan osaajia elektroniikasta nanoteknologiaan ja akustiikkaan. Kiltalaisista valmistuu alansa huippuja, jotka ovat avainasemassa vauhdilla sähköistyvän maailmamme kehityksessä." > - + - - + + - + diff --git a/src/views/FrontPage/FrontPageView.tsx b/src/views/FrontPage/FrontPageView.tsx index 629d900..e951da1 100644 --- a/src/views/FrontPage/FrontPageView.tsx +++ b/src/views/FrontPage/FrontPageView.tsx @@ -5,7 +5,7 @@ import FrontPageHero from "./FrontPageHero"; import { Event } from "@models/Event"; import { Post } from "@models/Feed"; import { colors } from "@theme/colors"; -import Anchor from "@components/Anchor"; +import { Link } from "@components/index"; import FullWidthSection from "@components/Sections/FullWidthSection"; import noop from "@utils/noop"; @@ -116,19 +116,19 @@ const FrontPageView: React.FC = ({ events, feed }) => (
Yhteistyössä:
- - - - - - - - - - - + + + + + + + + + + +
- Haluatko kuulla lisää yhteistyöstä kanssamme? + Haluatko kuulla lisää yhteistyöstä kanssamme?