julien/vaquant
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: change new account design

Browse Source
This commit is contained in:
Julien Calixte
2019-08-22 12:13:28 +02:00
parent dbd63d341c
commit f19cdbba6f
3 changed files with 23 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/AccountUserNew.vue
View File

@@ -3,7 +3,6 @@
<h3 class="subtitle is-3">{{ $tc('account.friends', localeUsers.length, { count: localeUsers.length }) }}</h3> <h3 class="subtitle is-3">{{ $tc('account.friends', localeUsers.length, { count: localeUsers.length }) }}</h3>
<user-new v-if="user" v-model="user" /> <user-new v-if="user" v-model="user" />
<div v-for="(user, k) in localeUsers" :key="k"> <div v-for="(user, k) in localeUsers" :key="k">
<hr />
<user-new v-model="localeUsers[k]" @remove="() => remove(k)" /> <user-new v-model="localeUsers[k]" @remove="() => remove(k)" />
</div> </div>
<br /> <br />

10
src/components/UserNew.vue
View File

@@ -1,5 +1,5 @@
<template> <template>
<div class="user-new columns"> <div class="user-new box columns">
<div class="column is-5" v-if="user"> <div class="column is-5" v-if="user">
<div class="field is-horizontal"> <div class="field is-horizontal">
<div class="field-label is-normal"> <div class="field-label is-normal">
@@ -22,7 +22,7 @@
<div class="field-body"> <div class="field-body">
<div class="field"> <div class="field">
<p class="control"> <p class="control">
<input required class="input" type="text" maxlength="20" v-model="newUser.alias" /> <input required class="input" type="text" maxlength="20" v-model="newUser.alias" :placeholder="newUser.userId" />
</p> </p>
<p class="help is-info">Nom utilisé dans ce compte</p> <p class="help is-info">Nom utilisé dans ce compte</p>
<p <p
@@ -70,3 +70,9 @@ export default class UserNew extends Vue {
} }
} }
</script> </script>
<style>
.user-new {
margin: 5px 0;
}
</style>

32
src/views/accounts/AccountNew.vue
View File

@@ -33,6 +33,21 @@
</div> </div>
</div> </div>
<div class="columns"> <div class="columns">
<div class="column">
<h3 class="subtitle is-3">Compte privé / public</h3>
<div class="field">
<input
id="is-public"
type="checkbox"
name="is-public"
class="switch"
v-model="isPublic"
/>
<label for="is-public">Compte {{ isPublic ? 'public' : 'privé' }}</label>
<p class="help is-danger" v-if="isPublic" v-t="'account.publicInformation'"></p>
<p class="help is-info" v-else v-t="'account.privateInformation'"></p>
</div>
</div>
<div class="column"> <div class="column">
<account-user-new v-model="users" /> <account-user-new v-model="users" />
</div> </div>
@@ -67,23 +82,6 @@
</transition> </transition>
</div> </div>
</div> </div>
<div class="columns">
<div class="column">
<h3 class="subtitle is-3">Compte privé / public</h3>
<div class="field">
<input
id="is-public"
type="checkbox"
name="is-public"
class="switch"
v-model="isPublic"
/>
<label for="is-public">Compte {{ isPublic ? 'public' : 'privé' }}</label>
<p class="help is-danger" v-if="isPublic" v-t="'account.publicInformation'"></p>
<p class="help is-info" v-else v-t="'account.privateInformation'"></p>
</div>
</div>
</div>
<div class="columns is-centered"> <div class="columns is-centered">
<div class="column is-one-third"> <div class="column is-one-third">
<button type="submit" class="button is-primary is-fullwidth is-large"> <button type="submit" class="button is-primary is-fullwidth is-large">