From 7112f5a04a9ad6f5af8cf6eec7b98fb382e4a847 Mon Sep 17 00:00:00 2001
From: Devyani Ravi <devyaniravi2003@gmail.com>
Date: Fri, 27 Sep 2024 22:09:49 +0000
Subject: [PATCH] fix cycles
---
docs/.vuepress/components/IterativeCycle.vue | 72 +++++++++++++-------
1 file changed, 48 insertions(+), 24 deletions(-)
diff --git a/docs/.vuepress/components/IterativeCycle.vue b/docs/.vuepress/components/IterativeCycle.vue
index a25f042..ffeafb9 100644
--- a/docs/.vuepress/components/IterativeCycle.vue
+++ b/docs/.vuepress/components/IterativeCycle.vue
@@ -1,3 +1,4 @@
+iteration cycle page working
<template>
<div class="iterative-cycle">
<!-- Module Selector Tabs -->
@@ -19,16 +20,14 @@
<button @click="toggleCycle(index)" class="cycle-button">
{{ cycle.title }}
</button>
- <transition name="fade">
- <div v-if="isCycleOpen(index)" class="cycle-details">
- <h3>Phases:</h3>
- <ul>
- <li v-for="(phase, phaseIndex) in cycle.phases" :key="phaseIndex">
- <strong>{{ phase.title }}:</strong> {{ phase.description }}
- </li>
- </ul>
- </div>
- </transition>
+ <div v-if="isCycleOpen(index)" class="cycle-details">
+ <h3>Phases:</h3>
+ <ul>
+ <li v-for="(phase, phaseIndex) in cycle.phases" :key="phaseIndex">
+ <strong>{{ phase.title }}:</strong> {{ phase.description }}
+ </li>
+ </ul>
+ </div>
</div>
</div>
</div>
@@ -38,8 +37,8 @@
export default {
data() {
return {
- selectedModule: 0,
- openCycles: [],
+ selectedModule: 0, // Default module selected
+ openCycles: [], // Track which cycles are open
modules: [
{
title: 'Module 1: DBTL Cycles',
@@ -50,7 +49,7 @@ export default {
{ title: 'Design', description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.' },
{ title: 'Build', description: 'Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.' },
{ title: 'Test', description: 'Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.' },
- { title: 'Learn', description: 'Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore.' }
+ { title: 'Learn', description: 'Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore.' },
]
},
{
@@ -59,7 +58,16 @@ export default {
{ title: 'Design', description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.' },
{ title: 'Build', description: 'Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.' },
{ title: 'Test', description: 'Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.' },
- { title: 'Learn', description: 'Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore.' }
+ { title: 'Learn', description: 'Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore.' },
+ ]
+ },
+ {
+ title: 'Cycle 3',
+ phases: [
+ { title: 'Design', description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.' },
+ { title: 'Build', description: 'Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.' },
+ { title: 'Test', description: 'Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.' },
+ { title: 'Learn', description: 'Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore.' },
]
}
]
@@ -75,6 +83,28 @@ export default {
]
}
]
+ },
+ {
+ title: 'Module 3: Design Only',
+ cycles: [
+ {
+ title: 'Cycle 1',
+ phases: [
+ { title: 'Design', description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.' }
+ ]
+ }
+ ]
+ },
+ {
+ title: 'Module 4: Design Only',
+ cycles: [
+ {
+ title: 'Cycle 1',
+ phases: [
+ { title: 'Design', description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.' }
+ ]
+ }
+ ]
}
]
};
@@ -92,7 +122,7 @@ export default {
},
selectModule(index) {
this.selectedModule = index;
- this.openCycles = [];
+ this.openCycles = []; // Close all cycles when switching modules
}
}
};
@@ -152,7 +182,7 @@ export default {
width: 100%;
padding: 10px;
font-size: 16px;
- background-color: #a3c88a; /* Button color */
+ background-color: #a3c88a; /* Updated button color */
color: white;
border: none;
border-radius: 5px;
@@ -173,13 +203,7 @@ export default {
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
}
-.fade-enter-active, .fade-leave-active {
- transition: opacity 0.5s;
-}
-.fade-enter, .fade-leave-to {
- opacity: 0;
-}
-
+/* Typography */
h2 {
color: #2c3e50;
text-align: center;
@@ -197,4 +221,4 @@ ul {
li {
color: #555;
}
-</style>
+</style>
\ No newline at end of file
--
GitLab