diff --git a/app.js b/app.js index 90b00cb..aa12997 100644 --- a/app.js +++ b/app.js @@ -80,6 +80,11 @@ async function main() { } })); + app.get('*', (req, res, next) => { + req.app.locals.layout = 'main'; + next(); + }); + app.get('/admin/*', (req, res, next) => { req.app.locals.layout = 'admin'; next(); diff --git a/routes/admin.js b/routes/admin.js new file mode 100644 index 0000000..81e08cc --- /dev/null +++ b/routes/admin.js @@ -0,0 +1,18 @@ +const express = require('express'); +const router = express.Router(); + +router.get('/', (req, res) => { + return res.redirect('/admin/dashboard'); +}); + +router.get('/dashboard', (req, res) => { + return res.render('dashboard', { + title: 'Stratos - Dashboard' + }); +}); + + +module.exports = { + root: '/admin', + router: router +}; diff --git a/src/stylesheets/components/_adminNav.scss b/src/stylesheets/components/_adminNav.scss index 7fc7efa..547e4c3 100644 --- a/src/stylesheets/components/_adminNav.scss +++ b/src/stylesheets/components/_adminNav.scss @@ -1,5 +1,5 @@ .adminNav { - display: flex; + display: none; flex-direction: column; justify-content: space-between; align-items: center; @@ -11,8 +11,6 @@ padding: 3rem 0; padding-top: 5rem; - display: none; - a { color: white; } @@ -20,6 +18,7 @@ &__profile { display: flex; flex-direction: column; + padding-bottom: 4rem; img { border-radius: 100%; @@ -36,6 +35,10 @@ align-self: flex-end; text-decoration: underline; } + + @include respond-to('large') { + padding-bottom: 0; + } } &__items { diff --git a/src/stylesheets/components/_mainNav.scss b/src/stylesheets/components/_mainNav.scss index 9411439..837f2d1 100644 --- a/src/stylesheets/components/_mainNav.scss +++ b/src/stylesheets/components/_mainNav.scss @@ -5,8 +5,7 @@ padding: 0.5em 1em; &__buttons { - display: grid; - grid-template-columns: repeat(2, 1fr); + display: flex; align-items: center; justify-items: end; gap: 1em; diff --git a/src/stylesheets/main.scss b/src/stylesheets/main.scss index e0f0fec..aa9a137 100644 --- a/src/stylesheets/main.scss +++ b/src/stylesheets/main.scss @@ -19,3 +19,4 @@ @import 'components/adminNavItem'; @import 'pages/index'; +@import 'pages/dashboard'; diff --git a/src/stylesheets/pages/_dashboard.scss b/src/stylesheets/pages/_dashboard.scss new file mode 100644 index 0000000..2593125 --- /dev/null +++ b/src/stylesheets/pages/_dashboard.scss @@ -0,0 +1,77 @@ +.adminContent { + min-height: 91vh; + background-color: #E5E5E5; + padding: .5rem 2rem 0 2rem; + + .dashboard__item { + padding: .7rem; + background-color: white; + border-radius: 15px; + } + + .dashboard__row { + margin: 1rem 0; + + &:last-child { + margin-bottom: 0; + padding-bottom: 1rem; + } + + h2 { + color: $text-colour; + font-weight: normal; + margin-left: .5rem; + } + } + + .dashboard__table { + background-color: #E5E5E5; + padding: 1rem; + border-radius: 15px; + + table { + width: 100%; + + } + + tr { + @include on-event() { + background-color: white; + cursor: pointer; + } + } + + td { + padding: .5rem; + + &:last-child { + width: 100%; + } + } + } + + .dashboard__stats { + display: grid; + grid-template-columns: repeat(2, 1fr); + gap: 1rem; + + .dashboard__stat { + text-align: center; + padding: 1rem; + + h2 { + color: $primary-colour; + margin: .75rem 0; + font-weight: bold; + } + } + + @include respond-to('medium') { + grid-template-columns: repeat(4, 1fr); + } + } + + @include respond-to('large') { + margin-left: 20vw; + } +} diff --git a/views/dashboard.hbs b/views/dashboard.hbs new file mode 100644 index 0000000..695f4ab --- /dev/null +++ b/views/dashboard.hbs @@ -0,0 +1,109 @@ +
+
+
+

5

+ Classes +
+
+

11

+ Completed Tests +
+
+

1

+ Upcoming Test +
+
+

90%

+ Pass Rate +
+
+
+
+

Recent Tests

+
+ + + + + + + + + + + + + +
+ 08/01/2022 + + Lagged homework 8 +
+ 08/01/2022 + + Lagged homework 8 +
+ 08/01/2022 + + Lagged homework 8 +
+
+
+
+
+
+

Upcoming Tests

+
+ + + + + + + + + + + + + +
+ 08/01/2022 + + Lagged homework 8 +
+ 08/01/2022 + + Lagged homework 8 +
+ 08/01/2022 + + Lagged homework 8 +
+
+
+
+
+ +