diff --git a/routes/admin.js b/routes/admin.js
index 81e08cc..290cee7 100644
--- a/routes/admin.js
+++ b/routes/admin.js
@@ -11,6 +11,11 @@ router.get('/dashboard', (req, res) => {
});
});
+router.get('/classes', (req, res) => {
+ return res.render('classes', {
+ title: 'Stratos - Classes'
+ });
+});
module.exports = {
root: '/admin',
diff --git a/src/stylesheets/components/_class.scss b/src/stylesheets/components/_class.scss
new file mode 100644
index 0000000..bbf2db0
--- /dev/null
+++ b/src/stylesheets/components/_class.scss
@@ -0,0 +1,12 @@
+.classes__class {
+ transition: background .25s, color .25s;
+ position: relative;
+ min-height: 10rem;
+ border-top: 10px solid $primary-colour;
+
+ @include on-event() {
+ cursor: pointer;
+ background-color: $primary-colour;
+ color: white;
+ }
+}
diff --git a/src/stylesheets/main.scss b/src/stylesheets/main.scss
index e2b9458..bf40b16 100644
--- a/src/stylesheets/main.scss
+++ b/src/stylesheets/main.scss
@@ -18,6 +18,8 @@
@import 'components/adminNav';
@import 'components/adminNavItem';
@import 'components/admin';
+@import 'components/class';
@import 'pages/index';
@import 'pages/dashboard';
+@import 'pages/classes';
diff --git a/src/stylesheets/pages/_classes.scss b/src/stylesheets/pages/_classes.scss
new file mode 100644
index 0000000..fbdb6de
--- /dev/null
+++ b/src/stylesheets/pages/_classes.scss
@@ -0,0 +1,14 @@
+.classes {
+ display: grid;
+ column-gap: 1rem;
+ row-gap: 1.5rem;
+ margin-top: 1rem;
+
+ @include respond-to('medium') {
+ grid-template-columns: repeat(2, 1fr);
+ }
+
+ @include respond-to('large') {
+ grid-template-columns: repeat(3, 1fr);
+ }
+}
diff --git a/views/classes.hbs b/views/classes.hbs
new file mode 100644
index 0000000..9603e2d
--- /dev/null
+++ b/views/classes.hbs
@@ -0,0 +1,16 @@
+