Make the account page mobile friendly
This commit is contained in:
parent
4e4a183f48
commit
ac7cefb83f
4 changed files with 19 additions and 8 deletions
|
@ -6,14 +6,18 @@
|
|||
<TwoFactorAuthentication/>
|
||||
</modal>
|
||||
<flash container="mt-6 mb-2 mx-4"/>
|
||||
<div class="flex">
|
||||
<div class="flex-1 m-4 ml-0">
|
||||
<update-email class="mb-8"/>
|
||||
<div class="bg-white p-6 border border-grey-light rounded rounded-1 text-center">
|
||||
<button class="btn btn-green btn-sm" type="submit" v-on:click="modalVisible = true">Configure 2-Factor Authentication</button>
|
||||
<div class="flex flex-wrap">
|
||||
<div class="w-full md:w-1/2">
|
||||
<div class="m-4 md:ml-0">
|
||||
<update-email class="mb-8"/>
|
||||
<div class="content-box text-center">
|
||||
<button class="btn btn-green btn-sm" type="submit" v-on:click="modalVisible = true">Configure 2-Factor Authentication</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<change-password class="flex-1 m-4 mr-0"/>
|
||||
<div class="w-full md:w-1/2">
|
||||
<change-password class="m-4 md:mr-0"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div>
|
||||
<form action="" method="post">
|
||||
<div class="bg-white p-6 border border-grey-light rounded rounded-1">
|
||||
<div class="content-box">
|
||||
<h2 class="mb-6 text-grey-darkest font-medium">Change your password</h2>
|
||||
<div class="mt-6">
|
||||
<label for="grid-password-current" class="input-label">Current password</label>
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div :class>
|
||||
<form method="post" v-on:submit.prevent="submitForm">
|
||||
<div class="bg-white p-6 border border-grey-light rounded rounded-1">
|
||||
<div class="content-box">
|
||||
<h2 class="mb-6 text-grey-darkest font-medium">Update your email</h2>
|
||||
<div>
|
||||
<label for="grid-email" class="input-label">Email address</label>
|
||||
|
|
|
@ -42,6 +42,13 @@ code {
|
|||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Styling for elements that contain the core page content.
|
||||
*/
|
||||
.content-box {
|
||||
@apply .bg-white .p-6 .border .border-grey-light .rounded;
|
||||
}
|
||||
|
||||
/**
|
||||
* Flex boxes for server listing on user dashboard.
|
||||
*/
|
||||
|
|
Loading…
Reference in a new issue