tdpeuter/2025SELab2-project-Dwengo
tdpeuter/2025SELab2-project-Dwengo
Archived
1
Fork 0
Code Issues Releases 4 Packages 2 Wiki Activity

style: assignment knop blijft staan

Browse source
This commit is contained in:
Timo De Meyst 2025-04-23 22:21:53 +02:00
parent 7d1a55710f
commit 7b613a5d79
1 changed files with 20 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

38
frontend/src/views/learning-paths/LearningPathPage.vue
View file

@ -251,10 +251,11 @@
> >
</template> </template>
</v-list-item> </v-list-item>
</div> <v-list-item>
<v-divider></v-divider> <div v-if="(authService.authState.activeRole === 'student') && (pathIsAssignment)" class="assignment-indicator">
<div v-if="(authService.authState.activeRole === 'student') && (pathIsAssignment)" class="assignment-indicator"> ASSIGNMENT
ASSIGNMENT </div>
</v-list-item>
</div> </div>
</v-navigation-drawer> </v-navigation-drawer>
<div class="control-bar-above-content"> <div class="control-bar-above-content">
@ -277,7 +278,7 @@
v-if="currentNode" v-if="currentNode"
></learning-object-view> ></learning-object-view>
</div> </div>
<div class="question-box"> <div v-if="authService.authState.activeRole === 'student'" class="question-box">
<div class="input-wrapper"> <div class="input-wrapper">
<input <input
type="text" type="text"
@ -343,19 +344,20 @@
justify-content: space-between; justify-content: space-between;
} }
.assignment-indicator { .assignment-indicator {
position: absolute; position: absolute;
bottom: 10px; bottom: 10px;
left: 10px; left: 10px;
padding: 4px 12px; padding: 4px 12px;
border: 2px solid #f8bcbc; border: 2px solid #f8bcbc;
border-radius: 20px; border-radius: 20px;
color: #f36c6c; color: #f36c6c;
background-color: rgba(248, 188, 188, 0.1); background-color: rgba(248, 188, 188, 0.1);
font-weight: bold; font-weight: bold;
font-family: Arial, sans-serif; font-family: Arial, sans-serif;
font-size: 14px; font-size: 14px;
text-transform: uppercase; text-transform: uppercase;
} z-index: 2; /* Less than modals/popups */
}
.question-box { .question-box {
width: 100%; width: 100%;
max-width: 400px; max-width: 400px;