qbism/qb-admin-fe
1
0
Fork 0
forked from AkkomaGang/admin-fe
Code Issues Pull requests Projects Releases Packages Wiki Activity

Fix styles for report show page

Browse source
This commit is contained in:
Angelina Filippova 2020-10-28 14:40:28 +03:00
parent 5bd81b1901
commit 4851642faf
1 changed files with 39 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

69
src/views/reports/show.vue
View file

@ -1,5 +1,5 @@
<template> <template>
<div v-if="!loading"> <div v-if="!loading" class="report-show-page-container">
<header class="report-page-header-container"> <header class="report-page-header-container">
<div class="report-page-header"> <div class="report-page-header">
<div v-if="propertyExists(report.account, 'nickname')" class="avatar-name-container"> <div v-if="propertyExists(report.account, 'nickname')" class="avatar-name-container">
@ -11,10 +11,10 @@
</a> </a>
</div> </div>
<h1 v-else>{{ $t('reports.report') }}</h1> <h1 v-else>{{ $t('reports.report') }}</h1>
<h4 v-if="propertyExists(report.account, 'id')" class="id">{{ $t('reports.id') }}: {{ report.id }}</h4>
</div> </div>
<reboot-button/> <reboot-button/>
</header> </header>
<h4 v-if="propertyExists(report.account, 'id')" class="id">{{ $t('reports.id') }}: {{ report.id }}</h4>
<el-card class="report"> <el-card class="report">
<report-content :report="report"/> <report-content :report="report"/>
</el-card> </el-card>
@ -53,37 +53,46 @@ export default {
</script> </script>
<style rel='stylesheet/scss' lang='scss'> <style rel='stylesheet/scss' lang='scss'>
.report-page-header { .report-show-page-container {
display: flex;
flex-direction: column;
margin: 22px 15px 22px 20px;
padding: 0;
h1 {
display: inline;
margin: 0;
}
h4 {
margin-top: 10px;
}
.avatar-name-container {
display: flex;
align-items: center;
.el-icon-top-right {
font-size: 2em;
line-height: 36px;
color: #606266;
}
}
.id { .id {
color: gray; color: gray;
margin: 0 15px 22px 15px;
} }
.report-page-avatar { .report {
margin: 0 7px 0 12px; width: 1000px;
margin: auto;
}
.report-page-header {
display: flex;
flex-direction: column;
margin: 10px 0;
padding: 0;
h1 {
display: inline;
margin: 0;
}
h4 {
margin-top: 10px;
}
.avatar-name-container {
display: flex;
align-items: center;
.el-icon-top-right {
font-size: 2em;
line-height: 36px;
color: #606266;
}
}
.report-page-avatar {
margin: 0 7px 0 12px;
}
}
.report-page-header-container {
align-items: center;
display: flex;
justify-content: space-between;
margin: 0 15px;
padding: 0;
} }
}
.report-page-header-container {
align-items: center;
display: flex;
justify-content: space-between;
} }
</style> </style>