diff --git a/frontend/src/components/submission_notes/toolbars/AnnotatedSubmissionBottomToolbar.vue b/frontend/src/components/submission_notes/toolbars/AnnotatedSubmissionBottomToolbar.vue index 7e25ecf178dcc9d8d81e0cdf9f7e9fdb19122d98..e7c8390a429706606847f7718ce1064740faeaea 100644 --- a/frontend/src/components/submission_notes/toolbars/AnnotatedSubmissionBottomToolbar.vue +++ b/frontend/src/components/submission_notes/toolbars/AnnotatedSubmissionBottomToolbar.vue @@ -1,5 +1,9 @@ +<!-- TODO: remove inline stylings --> + <template> - <v-toolbar dense class="bottom-toolbar"> +<v-layout> + <div class="tb-container"> + <div style="margin-top: 10px;"> <v-tooltip top v-if="skippable"> <v-btn slot="activator" @@ -15,6 +19,8 @@ icon="warning" :value="scoreError" >{{ scoreError }}</v-alert> + </div> + <div style="margin-top: 10px;"> <span class="mr-2">Score:</span> <input class="score-text-field" @@ -34,10 +40,12 @@ @click="score = fullScore" color="blue darken-3" class="score-button">{{fullScore}}</v-btn> + </div> + <div style="display: flex; flex-wrap: wrap; margin-left: 20px; margin-top: 10px;"> <v-tooltip top v-if="showFinalCheckbox"> - <v-toolbar-items slot="activator" style="margin-top: 28px;"> + <v-toolbar-items slot="activator"> <v-checkbox slot="activator" v-model="isFinal" class="final-checkbox"/> - <span>Final</span> + <label style="margin-top: 25%; margin-right: 20px;">Final</label> </v-toolbar-items> <span>Non final feedback will be sent to the reviewer.</span> </v-tooltip> @@ -50,7 +58,9 @@ >Submit<v-icon>chevron_right</v-icon></v-btn> <span>Submit and continue</span> </v-tooltip> - </v-toolbar> + </div> + </div> +</v-layout> </template> <script> @@ -159,6 +169,7 @@ export default { .score-text-field { max-width: 50px; box-sizing: border-box; + height: 2.5vh; border: 1px solid grey; border-radius: 2px; padding: 3px; @@ -170,6 +181,10 @@ export default { min-width: 0px; } .final-checkbox { - float: left; + margin-top: 10px; + } + .tb-container { + display: flex; + flex-wrap: wrap; } </style>