diff options
author | Mateja <mail@matejamaric.com> | 2021-03-18 19:37:53 +0100 |
---|---|---|
committer | Mateja <mail@matejamaric.com> | 2021-03-18 19:37:53 +0100 |
commit | 074bff2e79d91610a936f329ac8f603049c3b334 (patch) | |
tree | 24cc8ad4b62a268e462d3096fdee90004a2ec935 | |
parent | 1bbc94a7e39a1ca84d8aee2d10d942375ca3f264 (diff) | |
download | yota-laravel-074bff2e79d91610a936f329ac8f603049c3b334.tar.gz yota-laravel-074bff2e79d91610a936f329ac8f603049c3b334.zip |
Better styling for `reservation.vue` component.
-rw-r--r-- | resources/js/components/reservation.vue | 32 |
1 files changed, 17 insertions, 15 deletions
diff --git a/resources/js/components/reservation.vue b/resources/js/components/reservation.vue index fbb5fdc..85348bd 100644 --- a/resources/js/components/reservation.vue +++ b/resources/js/components/reservation.vue @@ -1,20 +1,18 @@ <template> <tr> - <td class="align-middle text-center">{{ reservation.id }}</td> - <td class="align-middle text-center"> - <input type="checkbox" :checked="reservation.approved"/> - </td> - <td class="align-middle"><input type="text" v-model="reservation.operatorCall"></td> - <td class="align-middle"><input type="text" v-model="reservation.qso"></td> - <td class="align-middle"><input type="text" v-model="reservation.fromTime"></td> - <td class="align-middle"><input type="text" v-model="reservation.toTime"></td> - <td class="align-middle"><input type="text" v-model="reservation.specialCall"></td> - <td class="align-middle"><input type="text" v-model="reservation.frequencies"></td> - <td class="align-middle"><input type="text" v-model="reservation.modes"></td> - <td class="align-middle"><input type="text" v-model="reservation.operatorName"></td> - <td class="align-middle"><input type="text" v-model="reservation.operatorEmail"></td> - <td class="align-middle"><input type="text" v-model="reservation.operatorCall"></td> - <td class="align-middle"> + <td v-text="reservation.id"></td> + <td><input type="checkbox" :checked="reservation.approved"/></td> + <td><input type="text" v-model="reservation.operatorCall"></td> + <td><input type="text" v-model="reservation.qso"></td> + <td><input type="text" v-model="reservation.fromTime"></td> + <td><input type="text" v-model="reservation.toTime"></td> + <td><input type="text" v-model="reservation.specialCall"></td> + <td><input type="text" v-model="reservation.frequencies"></td> + <td><input type="text" v-model="reservation.modes"></td> + <td><input type="text" v-model="reservation.operatorName"></td> + <td><input type="text" v-model="reservation.operatorEmail"></td> + <td><input type="text" v-model="reservation.operatorCall"></td> + <td> <button class="btn btn-primary mr-2">Update</button> <button class="btn btn-warning mr-2">Restore</button> <button class="btn btn-danger">Delete</button> @@ -34,6 +32,10 @@ export default { </script> <style scoped> +td { + text-align: center; + vertical-align: middle; +} input { background-color: white; border: 1px solid lightgray; |