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 ( +
+ Router.push(`search?search=${searchValue}?`) + } + > + + + +
+ ); +}; 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 ( - + +