diff --git a/components/Awards.vue b/components/Awards.vue index 3af2420d8778bbefbd94d83d6a07cfe8cdf22825..95d5462ff7d169a20c39bf25d52245a33026fcc0 100644 --- a/components/Awards.vue +++ b/components/Awards.vue @@ -1,5 +1,5 @@ <template> - <div class="awards-wrap" :class="{ active: showAwards }"> + <div class="awards-wrap"> <div class="title">Hi! Our team got</div> <div class="prize-wrap"> <div class="medal"> @@ -50,20 +50,7 @@ </template> <script> -export default { - data() { - const showAwards = true; - - return { - showAwards, - }; - }, - mounted() { - const timer = setTimeout(() => { - this.showAwards = false; - }, 1000); - }, -}; +export default {} </script> <style lang='scss' scoped> @@ -114,48 +101,5 @@ export default { text-align: center; transition: all 1s; } - - &.active { - top: 40%; - left: 30vw; - right: 30vw; - height: 200px; - font-size: 200%; - border-radius: 20px; - background-color: rgba(255, 255, 255, 0.8); - - .prize-wrap { - height: 50%; - } - - .title { - font-size: 100%; - height: 100%; - } - } -} - -@media (max-width: 991px) { - .awards-wrap { - &.active { - left: 5vw; - right: 5vw; - font-size: 150%; - height: 250px; - - .prize-wrap { - height: 40%; - - .text { - font-size: 150%; - } - } - - .title { - font-size: 100%; - height: fit-content; - } - } - } } </style> \ No newline at end of file diff --git a/components/Menu.vue b/components/Menu.vue index 5a76f409f41e16106489bf5ec09ad15808e892e0..60e6565fe319cfb9fce87844d4b64134b6da066c 100644 --- a/components/Menu.vue +++ b/components/Menu.vue @@ -171,6 +171,10 @@ export default { text: "Awards", url: false, children: [ + { + text: "Awards", + url: "award", + }, { text: "Judging", url: "judging", diff --git a/pages/award.vue b/pages/award.vue new file mode 100644 index 0000000000000000000000000000000000000000..8f4edb1ac958618325c61efa192625bac07d78dd --- /dev/null +++ b/pages/award.vue @@ -0,0 +1,52 @@ +<template> + <Header :title="page"></Header> + <Banner + img="https://static.igem.wiki/teams/4774/wiki/static/img/banner-placeholder-h-2.jpg" + >{{ page }}</Banner + > + <div class="main"> + <Sidebar class="sidebar" :title="page" /> + <div class="content-wrap"> + <ContentBlock :id="0"> + <template #abstract></template> + </ContentBlock> + <ContentBlock :id="1"> + <template #subtitle> Silver Medal </template> + <Figure url="https://static.igem.wiki/teams/4774/wiki/static/img/award/award-2.jpg"></Figure> + </ContentBlock> + <ContentBlock :id="2"> + <template #subtitle> Winner of 2023 Impact Grant </template> + <p>We are thrilled to share that we won the 2023 Impact Grant, which is among the 90 teams out of more than 240 iGEM teams from all over the world. The application of the 2023 Impact Grant was reviewed by the iGEM Impact Commission members using a set of criteria based on novelty and impact on synthetic biology. We received a grant of $2,500 USD to facilitate our preparative work for the iGEM competition.</p> + <Figure url="https://static.igem.wiki/teams/4774/wiki/static/img/award/award-3-2.jpg"></Figure> + </ContentBlock> + <ContentBlock :id="3"> + <template #subtitle> Best Hackathon Project Finalist </template> + <p> + Evan Chan and Dave Li took an active role as representatives from our + team in the iGEM Hackathon during the Jamboree. Their outstanding + performance led them to achieve an impressive top 3 ranking among all + the participating teams. The Hackathon is a unique event held at the + Grand Jamboree 2023, brought together a dynamic community of + programmers, designers, and technology enthusiasts. This side + competition provided us with an invaluable opportunity to engage with + mentors, participate in workshops, and collaborate with Karyo Studios, + offering a meaningful and enriching experience for our team. + </p> + <Figure url="https://static.igem.wiki/teams/4774/wiki/static/img/award/award-4.jpg"></Figure> + </ContentBlock> + </div> + </div> +</template> + +<script> +export default { + data() { + return { + page: "Awards", + }; + }, +}; +</script> + +<style lang='scss' scoped> +</style> \ No newline at end of file