From 529474a764698575675d11a5d4d04f6e39b09b3a Mon Sep 17 00:00:00 2001
From: ErnestaP
Date: Mon, 13 Mar 2023 06:42:00 +0200
Subject: [PATCH 01/18] carrousel styles: beginning
---
src/common/photos.tsx | 168 +++++++++++++++++++++++
src/components/searchField.tsx | 17 +++
src/pages/_app.tsx | 24 +++-
src/pages/_document.tsx | 18 ++-
src/pages/index.tsx | 23 +++-
src/styles/{Home.module.css => Home.css} | 0
src/styles/SearchField.css | 11 ++
src/styles/globals.css | 1 +
8 files changed, 250 insertions(+), 12 deletions(-)
create mode 100644 src/common/photos.tsx
create mode 100644 src/components/searchField.tsx
rename src/styles/{Home.module.css => Home.css} (100%)
create mode 100644 src/styles/SearchField.css
diff --git a/src/common/photos.tsx b/src/common/photos.tsx
new file mode 100644
index 0000000..d85bca3
--- /dev/null
+++ b/src/common/photos.tsx
@@ -0,0 +1,168 @@
+export const photos = [
+ {
+ key: 1,
+ alt: "Data Centre",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2788598/files/IMG_0053.jpg?subformat=icon-1440",
+ },
+
+ {
+ key: 2,
+ alt: "Data Centre",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2788598/files/IMG_0045.jpg?subformat=icon-1440",
+ },
+
+ {
+ key: 3,
+ alt: "Data Centre",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2788598/files/IMG_9974.jpg?subformat=icon-1440",
+ },
+
+ {
+ key: 4,
+ alt: "Data Centre",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2788598/files/IMG_0121.jpg?subformat=icon-1440",
+ },
+
+ {
+ key: 5,
+ alt: "LHCb - Control Room",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2791987/files/IMG_0574.jpg?subformat=icon-1440",
+ },
+
+ {
+ key: 6,
+ alt: "LHCb - DELPHI Experiment",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2791987/files/IMG_0595.jpg?subformat=icon-1440",
+ },
+
+ {
+ key: 7,
+ alt: "LHCb Experiment",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2791987/files/IMG_0606.jpg?subformat=icon-1440",
+ },
+
+ {
+ key: 8,
+ alt: "ALICE Experiment",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2790673/files/IMG_9092.jpg?subformat=icon-1440",
+ },
+
+ {
+ key: 9,
+ alt: "ALICE Experiment",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2790673/files/IMG_9104.jpg?subformat=icon-1440",
+ },
+
+ {
+ key: 10,
+ alt: "Silicon detectors",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2789072/files/IMG_0197.jpg?subformat=icon-1440",
+ },
+
+ {
+ key: 11,
+ alt: "LHCb Experiment",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2790811/files/IMG_0506-2.jpg?subformat=icon-1440",
+ },
+
+ {
+ key: 12,
+ alt: "LHCb Experiment",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2790811/files/IMG_0507.jpg?subformat=icon-1440",
+ },
+
+ {
+ key: 13,
+ alt: "CLIC Experiment",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2790804/files/IMG_0336.jpg?subformat=icon-1440",
+ },
+
+ {
+ key: 14,
+ alt: "CLIC Experiment",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2790804/files/IMG_0409.jpg?subformat=icon-1440",
+ },
+
+ {
+ key: 15,
+ alt: "ALICE Experiment",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2790673/files/IMG_9089.jpg?subformat=icon-1440",
+ },
+
+ {
+ key: 16,
+ alt: "LHCb Experiment",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2791987/files/IMG_0618.jpg?subformat=icon-1440",
+ },
+
+ {
+ key: 17,
+ alt: "Silicon detectors",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2789072/files/IMG_0148.jpg?subformat=icon-1440",
+ },
+
+ {
+ key: 18,
+ alt: "Silicon detectors",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2789072/files/IMG_0164.jpg?subformat=icon-1440",
+ },
+
+ {
+ key: 19,
+ alt: "Silicon detectors",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2789072/files/IMG_0187.jpg?subformat=icon-1440",
+ },
+
+ {
+ key: 20,
+ alt: "Silicon detectors",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2789072/files/IMG_0189.jpg?subformat=icon-1440",
+ },
+
+ {
+ key: 21,
+ alt: "CMS Experiment",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2790811/files/IMG_0500.jpg?subformat=icon-1440",
+ },
+
+ {
+ key: 22,
+ alt: "Antimatter Factory",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2790882/files/IMG_0523.jpg?subformat=icon-1440",
+ },
+ {
+ key: 23,
+ alt: "CMS Experiment",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2790811/files/IMG_0447.jpg?subformat=icon-1440",
+ },
+
+ {
+ key: 24,
+ alt: "LHCb Experiment",
+ photographer: "Franciska-Leonora Torok",
+ src: "https://cds.cern.ch/record/2791987/files/IMG_0617.jpg?subformat=icon-1440",
+ },
+];
diff --git a/src/components/searchField.tsx b/src/components/searchField.tsx
new file mode 100644
index 0000000..29e04bb
--- /dev/null
+++ b/src/components/searchField.tsx
@@ -0,0 +1,17 @@
+import { Form, Input } from "antd";
+import Router from "next/router";
+
+const { Item } = Form;
+export const SearchField = () => {
+ return (
+
+ );
+};
diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx
index 88610aa..bd2b351 100644
--- a/src/pages/_app.tsx
+++ b/src/pages/_app.tsx
@@ -1,9 +1,25 @@
-import '@/styles/globals.css'
-import 'antd/dist/reset.css'
+import "@/styles/globals.css";
+import "antd/dist/reset.css";
+import "@/styles/Home.css";
import "@/styles/CernTollBar.css";
+import "@/styles/searchField.css";
-import type { AppProps } from 'next/app'
+import type { AppProps } from "next/app";
+import { Layout } from "antd";
+import CernToolBar from "@/components/cernToolbar";
+import { SearchField } from "@/components/searchField";
export default function App({ Component, pageProps }: AppProps) {
- return
+ if (typeof window !== "undefined") {
+ window.onload = () => {
+ document.getElementById("holderStyle").remove();
+ };
+ }
+ return (
+ <>
+
+
+
+ >
+ );
}
diff --git a/src/pages/_document.tsx b/src/pages/_document.tsx
index 54e8bf3..2377c82 100644
--- a/src/pages/_document.tsx
+++ b/src/pages/_document.tsx
@@ -1,13 +1,25 @@
-import { Html, Head, Main, NextScript } from 'next/document'
+import { Html, Head, Main, NextScript } from "next/document";
export default function Document() {
return (
-
+
- )
+ );
}
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index 3d5797d..b628492 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -1,18 +1,31 @@
-import '@/styles/Home.module.css'
+import Image from "next/image";
-import { Layout } from "antd";
+import { Layout, Carousel } from "antd";
import { GetServerSideProps, NextPage } from "next";
import { LectureProps } from "@/common/interfaces";
-import CernToolBar from "@/components/cernToolbar"
+import CernToolBar from "@/components/cernToolbar";
+import { photos } from "@/common/photos";
+import { SearchField } from "@/components/searchField";
+
interface HomePagePops {
lectures: LectureProps[];
}
const Home: NextPage = ({ lectures }) => {
return (
-
-
+
+
+ {photos.map((photo) => {
+ return (
+
+
+
+
+
+ );
+ })}
+
{lectures.map((item, key) => (
{item.id}
diff --git a/src/styles/Home.module.css b/src/styles/Home.css
similarity index 100%
rename from src/styles/Home.module.css
rename to src/styles/Home.css
diff --git a/src/styles/SearchField.css b/src/styles/SearchField.css
new file mode 100644
index 0000000..fed180f
--- /dev/null
+++ b/src/styles/SearchField.css
@@ -0,0 +1,11 @@
+#searchField {
+ background-color: transparent;
+ border: none;
+ width: 100%;
+ color: #fff;
+ font: normal normal normal 16px/28px Open Sans;
+}
+
+#searchField input::placeholder {
+ color: #fff;
+}
\ No newline at end of file
diff --git a/src/styles/globals.css b/src/styles/globals.css
index d4f491e..0416944 100644
--- a/src/styles/globals.css
+++ b/src/styles/globals.css
@@ -105,3 +105,4 @@ a {
color-scheme: dark;
}
}
+
From e45edf1619e08b5bf8e9f5c684392197442e6a1a Mon Sep 17 00:00:00 2001
From: ErnestaP
Date: Fri, 17 Mar 2023 15:00:59 +0200
Subject: [PATCH 02/18] search field style
---
src/components/searchField.tsx | 6 ++++++
src/pages/index.tsx | 8 ++++----
src/styles/SearchField.css | 22 ++++++++++++++--------
3 files changed, 24 insertions(+), 12 deletions(-)
diff --git a/src/components/searchField.tsx b/src/components/searchField.tsx
index 29e04bb..7d27744 100644
--- a/src/components/searchField.tsx
+++ b/src/components/searchField.tsx
@@ -5,6 +5,12 @@ const { Item } = Form;
export const SearchField = () => {
return (