Oneric/admin-fe
1
0
Fork 0
forked from AkkomaGang/admin-fe
Code Pull requests Activity

Add mobile UI styles for invite tokens section

Browse source
This commit is contained in:
Angelina Filippova 2020-02-27 00:23:15 +03:00
parent f6683f6d21
commit 0e3cfb4b72
1 changed files with 17 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
src/views/invites/index.vue
View file

@ -85,7 +85,7 @@
sortable/> sortable/>
<el-table-column <el-table-column
:label="$t('invites.token')" :label="$t('invites.token')"
:min-width="isDesktop ? 350 : 125" :min-width="isDesktop ? 320 : 120"
prop="token"/> prop="token"/>
<el-table-column <el-table-column
v-if="isDesktop" v-if="isDesktop"
@ -119,7 +119,9 @@
<template slot-scope="scope"> <template slot-scope="scope">
<el-tag <el-tag
:type="scope.row.used ? 'danger' : 'success'" :type="scope.row.used ? 'danger' : 'success'"
disable-transitions>{{ scope.row.used ? $t('invites.used') : $t('invites.active') }}</el-tag> disable-transitions>
{{ scope.row.used ? $t('invites.used') : $t('invites.active') }}
</el-tag>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
@ -268,9 +270,8 @@ export default {
margin: 0 0 10px 0; margin: 0 0 10px 0;
} }
} }
@media
only screen and (max-width: 760px), @media only screen and (max-width:480px) {
(min-device-width: 768px) and (max-device-width: 1024px) {
.invites-container { .invites-container {
.actions-container { .actions-container {
display: flex; display: flex;
@ -279,6 +280,9 @@ only screen and (max-width: 760px),
align-items: center; align-items: center;
margin: 15px 10px 7px 10px; margin: 15px 10px 7px 10px;
} }
.cell {
padding: 0;
}
.create-invite-token { .create-invite-token {
width: 100%; width: 100%;
} }
@ -296,7 +300,9 @@ only screen and (max-width: 760px),
} }
.invite-token-table { .invite-token-table {
width: 100%; width: 100%;
margin: 0; margin: 0 5px;
font-size: 12px;
font-weight: 500;
} }
.invite-via-email { .invite-via-email {
width: 100%; width: 100%;
@ -308,6 +314,11 @@ only screen and (max-width: 760px),
.info { .info {
margin: 0 0 10px 5px; margin: 0 0 10px 5px;
} }
th {
.cell {
padding: 0;
}
}
} }
.create-invite-token { .create-invite-token {
width: 100% width: 100%