mirror of
https://github.com/Bubka/2FAuth.git
synced 2024-11-26 02:04:52 +01:00
Try a new 2FAccounts html template for the grid view
This commit is contained in:
parent
cfaffca536
commit
775d71395a
@ -1,6 +1,7 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="container" v-if="this.showAccounts">
|
||||
<!-- search -->
|
||||
<div class="columns is-gapless is-mobile is-centered">
|
||||
<div class="column is-three-quarters-mobile is-one-third-tablet is-one-quarter-desktop is-one-quarter-widescreen is-one-quarter-fullhd">
|
||||
<div class="field">
|
||||
@ -14,13 +15,14 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="buttons are-large is-centered">
|
||||
<span v-for="account in filteredAccounts" class="button is-black has-background-black-bis twofaccount" >
|
||||
<span @click.stop="showAccount(account.id)">
|
||||
<!-- accounts -->
|
||||
<div class="columns is-multiline is-centered is-gapless">
|
||||
<div class="column is-narrow" v-for="account in filteredAccounts">
|
||||
<div class="tfa has-background-black-bis has-text-white is-size-3" @click.stop="showAccount(account.id)">
|
||||
<img :src="'storage/icons/' + account.icon" v-if="account.icon">
|
||||
{{ account.service }}
|
||||
<span class="is-family-primary is-size-7 has-text-grey">{{ account.account }}</span>
|
||||
</span>
|
||||
<span class="is-family-primary is-size-6 has-text-grey">{{ account.account }}</span>
|
||||
</div>
|
||||
<span v-if="editMode">
|
||||
<router-link :to="{ name: 'edit', params: { twofaccountId: account.id }}" class="tag is-dark">
|
||||
<font-awesome-icon :icon="['fas', 'edit']" />
|
||||
@ -29,9 +31,11 @@
|
||||
<font-awesome-icon :icon="['fas', 'trash']" />
|
||||
</a>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- No account -->
|
||||
<div class="container has-text-centered" v-show="this.showNoAccount">
|
||||
<p class="no-account"></p>
|
||||
<p class="subtitle is-5 has-text-grey">
|
||||
|
27
resources/sass/app.scss
vendored
27
resources/sass/app.scss
vendored
@ -9,7 +9,7 @@
|
||||
@import '~bulma/bulma';
|
||||
|
||||
.main-section {
|
||||
padding: 1.5rem 1.5rem 8rem 1.5rem;
|
||||
padding: 1.5rem 1rem 8rem 1rem;
|
||||
}
|
||||
|
||||
.form-column {
|
||||
@ -25,31 +25,34 @@
|
||||
padding-top: 1.5rem !important;
|
||||
}
|
||||
|
||||
nav.level {
|
||||
padding: 0 20px;
|
||||
/*postion: fixed;*/
|
||||
}
|
||||
|
||||
#otp {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.twofaccount {
|
||||
font-size: 1.7rem !important;
|
||||
width: 250px;
|
||||
.tfa {
|
||||
display: block;
|
||||
height: auto;
|
||||
border-radius: 6px;
|
||||
text-align: center;
|
||||
padding: 0.75rem 2.5rem;
|
||||
margin: 0.5rem;
|
||||
cursor: pointer;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.twofaccount img {
|
||||
.tfa img {
|
||||
height: 0.75em;
|
||||
width: 0.75em;
|
||||
margin-right: .1em;
|
||||
}
|
||||
|
||||
.twofaccount span {
|
||||
.tfa span {
|
||||
display: block;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.dots {
|
||||
@ -135,7 +138,7 @@ nav.level {
|
||||
}
|
||||
|
||||
footer {
|
||||
padding: 10px 0;
|
||||
padding: 10px 0 20px 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
|
Loading…
Reference in New Issue
Block a user