Skip to content
Snippets Groups Projects
Commit c474242d authored by Maddy's avatar Maddy
Browse files

Change DashboardView.vue

parent 14a6ba50
Branches
No related tags found
1 merge request!51Ui playquiz
Pipeline #270152 passed
Showing
with 25 additions and 166 deletions
<script> <script>
import { RouterLink, RouterView } from 'vue-router';
import router from "@/router/index.js";
import { useRouter } from 'vue-router';
export default { export default {
props: { props: {
answerId: { answerId: {
...@@ -36,19 +33,6 @@ export default { ...@@ -36,19 +33,6 @@ export default {
</template> </template>
<style> <style>
.overViewQuestion-page{
padding: 50px;
}
.quiz-header{
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 10px;
}
.quiz-body{
margin-bottom: 40px;
}
.question-wrapper { .question-wrapper {
display: flex; display: flex;
......
...@@ -77,9 +77,7 @@ export default { ...@@ -77,9 +77,7 @@ export default {
} }
} }
} }
} }
</script> </script>
<template> <template>
...@@ -126,75 +124,6 @@ export default { ...@@ -126,75 +124,6 @@ export default {
</div> </div>
</div> </div>
</div> </div>
<!--
<div class="modal-overlay" @click="closeModal">
<div @click.stop class="modal-mask">
<div class="modal-container">
<div class="question-title">
<h3>Question: </h3>
<input v-model="questionText" placeholder="Type your question here">
</div>
<div class="modal-body">
<table class="table">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">Answer</th>
<th scope="col">Correct ?</th>
</tr>
</thead>
<tbody>
<tr v-for="answer in answers">
<th scope="row">{{answer.answer}}</th>
<td>
<input type="text" v-model="answer.answer" id="questionInput">
</td>
<td>
<input :checked="answer.correct_answer === 1" class="form-check-input" :value="answer.id" @change="handleRadioToggle(answer.id)" type="radio">
</td>
</tr>
</tbody>
</table>
</div>
<div class="modal-footer">
default footer
<button
class="modal-default-button"
@click="$emit('close')">
OK
</button>
</div>
</div>
</div>
</div>-->
<!--
<Transition name="modal">
<div v-if="show" class="modal-mask">
<div class="modal-container">
<div class="modal-header">
<slot name="header">default header</slot>
</div>
<div class="modal-body">
<slot name="body">default body</slot>
</div>
<div class="modal-footer">
<slot name="footer">
default footer
<button
class="modal-default-button"
@click="$emit('close')"
>OK</button>
</slot>
</div>
</div>
</div>
</Transition>
-->
</template> </template>
<style> <style>
...@@ -225,9 +154,6 @@ export default { ...@@ -225,9 +154,6 @@ export default {
justify-content: space-between; justify-content: space-between;
} }
.modal-header h5 { .modal-header h5 {
margin-top: 0; margin-top: 0;
color: #363636; color: #363636;
...@@ -241,7 +167,6 @@ export default { ...@@ -241,7 +167,6 @@ export default {
float: right; float: right;
} }
.modal-enter-from .modal-container, .modal-enter-from .modal-container,
.modal-leave-to .modal-container { .modal-leave-to .modal-container {
-webkit-transform: scale(1.1); -webkit-transform: scale(1.1);
......
...@@ -90,32 +90,6 @@ export default { ...@@ -90,32 +90,6 @@ export default {
</div> </div>
</div> </div>
</div> </div>
<!--
<Transition name="modal">
<div v-if="show" class="modal-mask">
<div class="modal-container">
<div class="modal-header">
<slot name="header">default header</slot>
</div>
<div class="modal-body">
<slot name="body">default body</slot>
</div>
<div class="modal-footer">
<slot name="footer">
default footer
<button
class="modal-default-button"
@click="$emit('close')"
>OK</button>
</slot>
</div>
</div>
</div>
</Transition>
-->
</template> </template>
<style> <style>
...@@ -146,9 +120,6 @@ export default { ...@@ -146,9 +120,6 @@ export default {
justify-content: space-between; justify-content: space-between;
} }
.modal-header h5 { .modal-header h5 {
margin-top: 0; margin-top: 0;
color: #363636; color: #363636;
...@@ -162,7 +133,6 @@ export default { ...@@ -162,7 +133,6 @@ export default {
float: right; float: right;
} }
.modal-enter-from .modal-container, .modal-enter-from .modal-container,
.modal-leave-to .modal-container { .modal-leave-to .modal-container {
-webkit-transform: scale(1.1); -webkit-transform: scale(1.1);
......
...@@ -61,27 +61,11 @@ export default { ...@@ -61,27 +61,11 @@ export default {
<ul v-if="question.options"> <ul v-if="question.options">
<li v-for="(option) in question.options" :key="option"> <li v-for="(option) in question.options" :key="option">
<!--
<input type="radio" :id="'option'" :value="option"
:checked="option === selectedOption" @change="selectOption(option)">
-->
<label :for="option">option label</label> <label :for="option">option label</label>
</li> </li>
</ul> </ul>
<!--
<div class="choice">
<div class="options"><input type="radio" name="options" value="option1" id="opt0"><label for="opt0" id="lb0">Option1</label></div>
<div class="options"><input type="radio" name="options" value="option2" id="opt1"><label for="opt1" id="lb1">Option2</label></div>
<div class="options"><input type="radio" name="options" value="option3" checked="checked" id="opt2"><label for="opt2" id="lb2">Option3</label></div>
<div class="options"><input type="radio" name="options" value="option4" id="opt3"><label for="opt3" id="lb3">Option4</label></div>
</div>
<div class="ans-btn">
<button type="button" class="submit-answer">Submit Answer</button>
<a href="#display-final-score" type="button" class="view-results">View Results</a>
</div>
-->
</div> </div>
...@@ -203,7 +187,5 @@ input[type=radio] { ...@@ -203,7 +187,5 @@ input[type=radio] {
margin-top: 3%; margin-top: 3%;
} }
} }
</style> </style>
\ No newline at end of file
...@@ -16,7 +16,6 @@ export default { ...@@ -16,7 +16,6 @@ export default {
</template> </template>
<style scoped> <style scoped>
/*Final Results*/ /*Final Results*/
.final-result{ .final-result{
text-align: center; text-align: center;
...@@ -52,7 +51,6 @@ export default { ...@@ -52,7 +51,6 @@ export default {
background-color: #CCA43B; background-color: #CCA43B;
color:#fff; color:#fff;
cursor: pointer; cursor: pointer;
/* width: 120px;*/
font-size: 90%; font-size: 90%;
} }
......
<script> <script>
import { RouterLink, RouterView } from 'vue-router';
import router from "@/router/index.js";
import { useRouter } from 'vue-router';
import EditQuestionModel from "@/components/shared/EditQuestionModel.vue"; import EditQuestionModel from "@/components/shared/EditQuestionModel.vue";
import {apiClient} from "@/api.js"; import {apiClient} from "@/api.js";
export default { export default {
...@@ -55,20 +53,6 @@ export default { ...@@ -55,20 +53,6 @@ export default {
</template> </template>
<style> <style>
.overViewQuestion-page{
padding: 50px;
}
.quiz-header{
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
}
.quiz-body{
margin-bottom: 40px;
}
.question-wrapper { .question-wrapper {
display: flex; display: flex;
width: 80%; width: 80%;
......
...@@ -38,7 +38,3 @@ export default { ...@@ -38,7 +38,3 @@ export default {
} }
}; };
</script> </script>
<style>
/* Add your CSS styles here */
</style>
...@@ -188,5 +188,4 @@ input{ ...@@ -188,5 +188,4 @@ input{
height: 25px; height: 25px;
width: 100%; width: 100%;
} }
</style> </style>
\ No newline at end of file
...@@ -69,8 +69,6 @@ export default { ...@@ -69,8 +69,6 @@ export default {
</template> </template>
<style> <style>
.quiz-header{ .quiz-header{
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
......
...@@ -86,6 +86,7 @@ export default { ...@@ -86,6 +86,7 @@ export default {
.go-back-icon{ .go-back-icon{
margin-left: 1px; margin-left: 1px;
} }
.search-container { .search-container {
flex-grow: 1; flex-grow: 1;
} }
...@@ -99,13 +100,35 @@ export default { ...@@ -99,13 +100,35 @@ export default {
display: block; display: block;
text-align: center; text-align: center;
} }
.quiz-list {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.quiz-col {
flex-basis: 30%;
}
.quiz-col { .quiz-col {
flex-basis: 31%; flex-basis: 31%;
background: #d7d7d7; background: var(--card-background);
border-radius: 10px; border-radius: 10px;
margin-bottom: 5%; margin-bottom: 5%;
padding: 20px; padding: 20px;
box-sizing: border-box; box-sizing: border-box;
transition: 0.5s; transition: 0.5s;
} }
.row{
margin-top: 5%;
display: flex;
justify-content: space-between;
margin-left: 5%;
margin-right: 5%;
}
.quiz-col:hover{
box-shadow: 0 0 20px 0px rgba(0,0,0,0.3);
}
</style> </style>
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment