From a1880039509903b3156ae2ac90f9de0b2cbeb534 Mon Sep 17 00:00:00 2001 From: Ayush Mukherjee Date: Sat, 13 Feb 2021 22:35:41 +0530 Subject: [PATCH] finish nationals stuff for now --- src/router/index.js | 5 ++ src/scss/pages/_nationals.scss | 53 +++++++++++++- src/views/Nationals.vue | 35 +++++----- src/views/NationalsRegister.vue | 119 ++++++++++++++++++++++++++++++++ 4 files changed, 190 insertions(+), 22 deletions(-) create mode 100644 src/views/NationalsRegister.vue diff --git a/src/router/index.js b/src/router/index.js index e7f35c7..fef192a 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -41,6 +41,11 @@ Vue.use(VueRouter) name: 'Nationals', component: () => import('../views/Nationals.vue') }, + { + path: '/nationals/register', + name: 'Nationals Register', + component: () => import('../views/NationalsRegister.vue') + }, { path: '*', name: 'NotFound', diff --git a/src/scss/pages/_nationals.scss b/src/scss/pages/_nationals.scss index 6d8f9cb..db74d9b 100644 --- a/src/scss/pages/_nationals.scss +++ b/src/scss/pages/_nationals.scss @@ -27,9 +27,12 @@ top: 0; left: 0; z-index: -1; - width: 100vw; - height: 100vh; overflow: hidden; + video { + object-fit: cover; + width: 100vw; + height: 100vh; + } } .presenting { font-weight: 700; @@ -108,7 +111,10 @@ justify-content: center; align-items: center; ul { - max-width: 600px; + max-width: 550px; + width: 100%; + text-align: center; + list-style-type: none; div { display: flex; justify-content: center; @@ -145,4 +151,45 @@ letter-spacing: 0.5px; line-height: 1.5; } + .grid { + display: flex; + justify-content: center; + flex-wrap: wrap; + .vertical-card { + padding: 25px 0; + text-align: center; + width: 220px; + background: rgba(white, 0.1); + backdrop-filter: blur(40px); + background-clip: padding-box; + height: auto; + margin: 2rem 1rem 0 1rem; + .card__header { + .card__header__title { + font-size: 20px; + font-weight: bold; + } + .card__header__date { + font-size: 16px; + } + .card__header__img img { + width: 90px; + height: 90px; + } + } + .card__body { + font-size: 16px; + margin-top: 0; + } + &:hover { + height: auto; + } + } + } + .deets { + margin-top: 50px; + display: flex; + justify-content: center; + align-items: center; + } } \ No newline at end of file diff --git a/src/views/Nationals.vue b/src/views/Nationals.vue index 24c7a8b..8ae402f 100644 --- a/src/views/Nationals.vue +++ b/src/views/Nationals.vue @@ -2,7 +2,7 @@
-
@@ -22,9 +22,6 @@ Rulebook
-
APL Nationals Poster
@@ -34,10 +31,10 @@ Saudi Arabia Saudi Arabia Flag -
  • Qualifier: March 12, 2021 5PM KSA
    • -
  • Last Chance Qualifier: March 19, 2021 5PM KSA
    • -
  • Group Stage: March 26, 2021 7PM KSA
    • -
  • Playoffs: April 2, 2021 7PM KSA
    • +
  • Qualifier: Mar 12, 2021 5PM KSA
    • +
  • Last Chance Qualifier: Mar 19, 2021 5PM KSA
    • +
  • Group Stage: Mar 26, 2021 7PM KSA
    • +
  • Playoffs: Apr 2, 2021 7PM KSA
    • Register @@ -58,8 +55,8 @@ Indonesia Indonesia Flag -
  • Qualifier: March 21, 2021 5PM WIB
    • -
  • Finals: March 28, 2021 7PM WIB
    • +
  • Qualifier: Mar 21, 2021 5PM WIB
    • +
  • Finals: Mar 28, 2021 7PM WIB
    • Register
    @@ -78,8 +75,8 @@ India India Flag
    -
  • Qualifier: April 10, 2021 5PM IST
    • -
  • Finals: April 11, 2021 7PM IST
    • +
  • Qualifier: Apr 10, 2021 5PM IST
    • +
  • Finals: Apr 11, 2021 7PM IST
    • Register diff --git a/src/views/NationalsRegister.vue b/src/views/NationalsRegister.vue new file mode 100644 index 0000000..fb6ad9d --- /dev/null +++ b/src/views/NationalsRegister.vue @@ -0,0 +1,119 @@ + \ No newline at end of file