AkkomaGang/admin-fe
6
2
Fork 9
Code Issues 5 Pull requests 2 Projects Releases Wiki 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/>
<el-table-column
:label="$t('invites.token')"
:min-width="isDesktop ? 350 : 125"
:min-width="isDesktop ? 320 : 120"
prop="token"/>
<el-table-column
v-if="isDesktop"
@ -119,7 +119,9 @@
<template slot-scope="scope">
<el-tag
: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>
</el-table-column>
<el-table-column
@ -268,9 +270,8 @@ export default {
margin: 0 0 10px 0;
}
}
@media
only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px) {
@media only screen and (max-width:480px) {
.invites-container {
.actions-container {
display: flex;
@ -279,6 +280,9 @@ only screen and (max-width: 760px),
align-items: center;
margin: 15px 10px 7px 10px;
}
.cell {
padding: 0;
}
.create-invite-token {
width: 100%;
}
@ -296,7 +300,9 @@ only screen and (max-width: 760px),
}
.invite-token-table {
width: 100%;
margin: 0;
margin: 0 5px;
font-size: 12px;
font-weight: 500;
}
.invite-via-email {
width: 100%;
@ -308,6 +314,11 @@ only screen and (max-width: 760px),
.info {
margin: 0 0 10px 5px;
}
th {
.cell {
padding: 0;
}
}
}
.create-invite-token {
width: 100%