diff --git a/web/src/app/page.tsx b/web/src/app/page.tsx
index e89e840..ed965aa 100644
--- a/web/src/app/page.tsx
+++ b/web/src/app/page.tsx
@@ -10,6 +10,7 @@ import { Pig } from "@/components/general/Pig";
import Link from "next/link";
import { Icon } from "@/components/general/Icon";
import { SectionHeader } from "@/components/general/SectionHeader";
+import { SectionFooter } from "@/components/general/SectionFooter";
const HomeFragmentDefinition = graphql(`
fragment Home on HomePage {
@@ -61,7 +62,7 @@ export default async function Home() {
-
+
Skal du besøke Chateau Neuf?
@@ -84,6 +85,7 @@ export default async function Home() {
+
diff --git a/web/src/components/events/FeaturedEvents.tsx b/web/src/components/events/FeaturedEvents.tsx
index aa16500..3524a4b 100644
--- a/web/src/components/events/FeaturedEvents.tsx
+++ b/web/src/components/events/FeaturedEvents.tsx
@@ -2,16 +2,18 @@ import { EventFragment } from "@/gql/graphql";
import { EventItem } from "./EventItem";
import styles from "./featuredEvents.module.scss";
import { SectionHeader } from "../general/SectionHeader";
+import { SectionFooter } from "../general/SectionFooter";
export const FeaturedEvents = ({ events }: { events: EventFragment[] }) => {
return (
-
+
{events.slice(0, 3).map((event) => (
))}
+
);
};
diff --git a/web/src/components/events/UpcomingEvents.tsx b/web/src/components/events/UpcomingEvents.tsx
index c1c26c0..7cda288 100644
--- a/web/src/components/events/UpcomingEvents.tsx
+++ b/web/src/components/events/UpcomingEvents.tsx
@@ -10,6 +10,7 @@ import Link from "next/link";
import { EventItem } from "./EventItem";
import styles from "./upcomingEvents.module.scss";
import { SectionHeader } from "../general/SectionHeader";
+import { SectionFooter } from "../general/SectionFooter";
export const UpcomingEvents = ({ events }: { events: EventFragment[] }) => {
const upcomingSingularEvents = sortSingularEvents(
@@ -50,6 +51,7 @@ export const UpcomingEvents = ({ events }: { events: EventFragment[] }) => {
})}
+
);
};
diff --git a/web/src/components/events/featuredEvents.module.scss b/web/src/components/events/featuredEvents.module.scss
index f779d08..6f2bdd2 100644
--- a/web/src/components/events/featuredEvents.module.scss
+++ b/web/src/components/events/featuredEvents.module.scss
@@ -1,9 +1,12 @@
+.featuredEvents {
+ padding-bottom: var(--spacing-section-bottom);
+}
+
.eventList {
display: grid;
grid-template-columns: repeat(3, 1fr);
column-gap: var(--spacing-gap-column);
row-gap: var(--spacing-gap-row);
- padding-bottom: var(--spacing-section-bottom);
}
@media (max-width: 900px) {
diff --git a/web/src/components/events/upcomingEvents.module.scss b/web/src/components/events/upcomingEvents.module.scss
index 8d09e97..3d21409 100644
--- a/web/src/components/events/upcomingEvents.module.scss
+++ b/web/src/components/events/upcomingEvents.module.scss
@@ -6,11 +6,15 @@
position: relative;
overflow-x: hidden;
- header {
+ header, footer {
position: relative;
z-index: 10;
}
+ footer, footer a {
+ margin-top: 0;
+ }
+
h2 {
margin-bottom: var(--spacing-xs);
}
@@ -52,4 +56,10 @@
ul {
display: flex;
}
+}
+
+@media (max-width: 800px) {
+ .upcomingContent {
+ margin-top: var(--spacing-s);
+ }
}
\ No newline at end of file
diff --git a/web/src/components/general/SectionFooter.tsx b/web/src/components/general/SectionFooter.tsx
new file mode 100644
index 0000000..cadcd10
--- /dev/null
+++ b/web/src/components/general/SectionFooter.tsx
@@ -0,0 +1,10 @@
+import Link from "next/link";
+import styles from "./sectionFooter.module.scss";
+
+export const SectionFooter = ({ link, linkText }: { link: string, linkText: string }) => {
+ return (
+
+ );
+};
diff --git a/web/src/components/general/sectionFooter.module.scss b/web/src/components/general/sectionFooter.module.scss
new file mode 100644
index 0000000..bb3044c
--- /dev/null
+++ b/web/src/components/general/sectionFooter.module.scss
@@ -0,0 +1,25 @@
+.sectionFooter {
+ margin-top: var(--spacing-s);
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+ flex-wrap: wrap;
+
+ a {
+ display: block;
+ font-family: var(--font-serif);
+ position: relative;
+ padding-right: 1.4rem;
+
+ &:after {
+ content: "→";
+ position: absolute;
+ right: 0;
+ }
+ }
+
+ display: none;
+ @media (max-width: 800px) {
+ display: flex;
+ }
+}
diff --git a/web/src/components/general/sectionHeader.module.scss b/web/src/components/general/sectionHeader.module.scss
index c20193c..d46d578 100644
--- a/web/src/components/general/sectionHeader.module.scss
+++ b/web/src/components/general/sectionHeader.module.scss
@@ -17,4 +17,10 @@
right: 0;
}
}
+
+ @media (max-width: 800px) {
+ a {
+ display: none;
+ }
+ }
}
diff --git a/web/src/components/news/NewsList.tsx b/web/src/components/news/NewsList.tsx
index cd016f4..fd119e2 100644
--- a/web/src/components/news/NewsList.tsx
+++ b/web/src/components/news/NewsList.tsx
@@ -4,6 +4,7 @@ import { SectionHeader } from "../general/SectionHeader";
import { NewsItem } from "./NewsItem";
import styles from "./newsList.module.scss";
import { NewsFragment } from "@/lib/news";
+import { SectionFooter } from "../general/SectionFooter";
export const NewsList = ({
news,
@@ -36,6 +37,9 @@ export const NewsList = ({
)}
+ {heading && (
+
+ )}
);
};