cycleview

src/assets/sass/main.sass

@@ -39,10 +39,10 @@ body
 .container
     margin-right: auto
     margin-left: auto
+    padding-right: 15px
+    padding-left: 15px
     @media (min-width: 992px)
         max-width: 800px
-        padding-right: 15px
-        padding-left: 15px
 
 h1
     font-weight: 700

src/router/index.js

@@ -43,6 +43,11 @@ const router = createRouter({
 			name: "Profile",
 			component: () => import("../views/ProfileView.vue"),
 		},
+		{
+			path: "/cycle",
+			name: "Cycle",
+			component: () => import("../views/CycleView.vue"),
+		},
 	],
 });
 

src/views/CycleView.vue

@@ -0,0 +1,21 @@
+<template>
+	<div class="cycle-page">
+		<div class="bloodline-page-headline">Cycle</div>
+		<div class="bloodline-page-description container">
+			Claim and trade your $BDL at each cycle's end. Become the most powerful meme clan each cycle and win extra
+			rewards.
+		</div>
+	</div>
+</template>
+
+<script setup></script>
+
+<style lang="sass">
+.bloodline-page-headline
+    text-align: center
+    font-size: 32px
+    margin-bottom: 32px
+.bloodline-page-description
+    text-align: center
+    font-size: 16px
+</style>