diff --git a/.github/workflows/static.yml b/.github/workflows/static.yml index 5cbe3aea7..2fa1ec4e8 100644 --- a/.github/workflows/static.yml +++ b/.github/workflows/static.yml @@ -4,10 +4,10 @@ name: Deploy static content to Pages on: # Runs on pushes targeting the default branch push: - branches: ["master"] + branches: "open_the_popup_portrait_on_a_specific_page" pull_request: branches: - - '*' + - "open_the_popup_portrait_on_a_specific_page" # Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages @@ -19,6 +19,24 @@ concurrency: cancel-in-progress: false jobs: +replace_string: + runs-on: ubuntu-latest + + steps: + - name: Checkout code + uses: actions/checkout@v3 + + - name: Set environment variable for branch name + env: + BRANCH_NAME: ${{ github.ref_name }} + REPO_NAME: ${{github.repository_name}} + + run: echo "Branch name is $BRANCH_NAME" + + - name: Replace 'BaseUrl' with branch name in file + run: | + sed -i "s/BaseUrl/${BRANCH_NAME}/g" docusaurus.config.ts + build: runs-on: ubuntu-latest steps: @@ -38,8 +56,8 @@ jobs: path: ./build deploy: - needs: build - if: github.ref == 'refs/heads/master' + needs: build, replace_string + if: github.ref == 'refs/heads/open_the_popup_portrait_on_a_specific_page' environment: name: github-pages url: ${{ steps.deployment.outputs.page_url }} diff --git a/src/components/about/LargePortraitCard.tsx b/src/components/about/LargePortraitCard.tsx index d536c346d..1e952ecab 100644 --- a/src/components/about/LargePortraitCard.tsx +++ b/src/components/about/LargePortraitCard.tsx @@ -8,7 +8,7 @@ import Avatar from "./Avatar"; export function Distinction({ person }) { if (person.distinctionTitle.length !== 0) { return person.distinctionTitle.map((distinction, index) => ( -
+
{distinction} diff --git a/src/components/about/SmallPortraitCard.tsx b/src/components/about/SmallPortraitCard.tsx index 947af9200..3a0329ffd 100644 --- a/src/components/about/SmallPortraitCard.tsx +++ b/src/components/about/SmallPortraitCard.tsx @@ -6,20 +6,28 @@ import LargePortraitCard from "./LargePortraitCard"; import Avatar from "./Avatar"; const contentStyle = { + position: "fixed", + top: "50%", + left: "50%", + transform: "translate(-50%, -50%)", background: "white", - borderRadius: "10px", + borderRadius: "20px", + opacity: 1.0, + zIndex: "4000" }; const overlayStyle = { backgroundColor: "var(--ifm-background-color-popup-overlay)", - opacity: "0.4", + opacity: 0.4, width: "100%", height: "100%", + zIndex: "1000", }; function getCenterOfViewport() { let horizontalCenter = Math.floor(window.innerWidth / 2); let verticalCenter = Math.floor(window.innerHeight / 2); + console.log("Center of viewport:", [horizontalCenter, verticalCenter]); return [horizontalCenter, verticalCenter]; } @@ -34,6 +42,7 @@ function calculateOffsets(elementRef) { xViewportCenter - xCardCenter, yViewportCenter - yCardCenter, ]; + console.log("Offsets are:", offsets); return offsets; } @@ -65,30 +74,26 @@ export function SmallPortraitCard({ person, setOffsets }) { > {person.position}
-
- -
+
); } -export default function PopupPortrait({ person }) { +export default function PopupPortrait({ person, ...props }) { const [offsets, setOffsets] = useState([0, 0]); - let [isPopupOpen, setIsPopupOpen] = useState(false); - + let [isPopupOpen, setIsPopupOpen] = useState(props.isPopupOpen); return (
+
+ +
setIsPopupOpen(false)} - trigger={ -
- -
- } onOpen={() => { + props.isPopupOpen = true; setIsPopupOpen(true); }} contentStyle={contentStyle} diff --git a/src/components/about/SocialMediaContacts.tsx b/src/components/about/SocialMediaContacts.tsx index b8208404d..1cb17e1c1 100644 --- a/src/components/about/SocialMediaContacts.tsx +++ b/src/components/about/SocialMediaContacts.tsx @@ -27,9 +27,9 @@ export default function SocialMediaContacts({ person }) { )}
- + {/* {person.githubName} - + */}
); diff --git a/src/components/about/SubTeam.tsx b/src/components/about/SubTeam.tsx index bc3d840af..4dc2d6b22 100644 --- a/src/components/about/SubTeam.tsx +++ b/src/components/about/SubTeam.tsx @@ -1,24 +1,35 @@ import styles from "./styles.module.css"; import PopupPortrait from "./SmallPortraitCard"; +import Link from "@docusaurus/Link"; +import { useLocation } from "@docusaurus/router"; + +export default function SubTeam({ subTeamName, subTeam }) { + let firstName = useLocation().pathname.split("/about/")[1]; + console.log('First name before transformation:', firstName); + -export default function SubTeam({ - subTeamName, - subTeam -}) { return (

{subTeamName}

diff --git a/src/components/about/index.tsx b/src/components/about/index.tsx index 2a307e33b..ee610bf1f 100644 --- a/src/components/about/index.tsx +++ b/src/components/about/index.tsx @@ -1,12 +1,18 @@ import styles from "./styles.module.css"; -import { coreTeam, QSCollaboratorsTeam, leadershipTeam } from "./Team/team"; +import { coreTeam, QSCollaboratorsTeam, leadershipTeam } from "./Team/team"; import FourValues from "./FourValues"; import SubTeam from "./SubTeam"; import LinkToContact from "../home/LinkToContact"; +import PopupPortrait from "./SmallPortraitCard"; +import { Interface } from "readline"; + +export interface IProps { +popup : React.JSX.Element | null +} export function About() { return ( -
+
@@ -29,11 +35,10 @@ export function About() { - + + {() => } + + ); +} diff --git a/src/pages/about/Anastasiia.tsx b/src/pages/about/Anastasiia.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/Anastasiia.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +} diff --git a/src/pages/about/Andreas.tsx b/src/pages/about/Andreas.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/Andreas.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +} diff --git a/src/pages/about/Antoine.tsx b/src/pages/about/Antoine.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/Antoine.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +} diff --git a/src/pages/about/Anutosh.tsx b/src/pages/about/Anutosh.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/Anutosh.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +} diff --git a/src/pages/about/Darian.tsx b/src/pages/about/Darian.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/Darian.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +} diff --git a/src/pages/about/David.tsx b/src/pages/about/David.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/David.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +} diff --git a/src/pages/about/Denisa.tsx b/src/pages/about/Denisa.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/Denisa.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +} diff --git a/src/pages/about/Florence.tsx b/src/pages/about/Florence.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/Florence.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +} diff --git a/src/pages/about/Gabriela.tsx b/src/pages/about/Gabriela.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/Gabriela.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +} diff --git a/src/pages/about/Greg.tsx b/src/pages/about/Greg.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/Greg.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +} diff --git a/src/pages/about/Hind.tsx b/src/pages/about/Hind.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/Hind.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +} diff --git a/src/pages/about/Ian.tsx b/src/pages/about/Ian.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/Ian.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +} diff --git a/src/pages/about/Isabel.tsx b/src/pages/about/Isabel.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/Isabel.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +} diff --git a/src/pages/about/Jeremy.tsx b/src/pages/about/Jeremy.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/Jeremy.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +} diff --git a/src/pages/about/Joel.tsx b/src/pages/about/Joel.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/Joel.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +} diff --git a/src/pages/about/Johan.tsx b/src/pages/about/Johan.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/Johan.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +} diff --git a/src/pages/about/Julien.tsx b/src/pages/about/Julien.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/Julien.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +} diff --git a/src/pages/about/Martin.tsx b/src/pages/about/Martin.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/Martin.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +} diff --git a/src/pages/about/Meriem.tsx b/src/pages/about/Meriem.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/Meriem.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +} diff --git a/src/pages/about/Nicolas.tsx b/src/pages/about/Nicolas.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/Nicolas.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +} diff --git a/src/pages/about/Sylvain.tsx b/src/pages/about/Sylvain.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/Sylvain.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +} diff --git a/src/pages/about/Thorsten.tsx b/src/pages/about/Thorsten.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/Thorsten.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +} diff --git a/src/pages/about/Trung.tsx b/src/pages/about/Trung.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/Trung.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +} diff --git a/src/pages/about/index.tsx b/src/pages/about/index.tsx new file mode 100644 index 000000000..8fd02be9c --- /dev/null +++ b/src/pages/about/index.tsx @@ -0,0 +1,11 @@ +import Layout from "@theme/Layout"; +import { About } from "@site/src/components/about"; +import BrowserOnly from "@docusaurus/BrowserOnly"; + +export default function AboutPage(): JSX.Element { + return ( + + {() => } + + ); +}