JakeHillion/storj
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[V3-1113] empty search result area bug fixed (#1303)

Browse Source
This commit is contained in:
Nikolay Yurchenko 2019-02-15 23:19:17 +10:00 committed by GitHub
parent 12261c0624
commit df20597f67
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 32 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
web/satellite/src/components/common/EmptyStateArea.vue
View File

@ -6,9 +6,8 @@
<div class="empty-state__wrap">
<h1>{{mainTitle}}</h1>
<div class="empty-state__wrap__additional-text" v-html="additionalText"/>
<div id="addApiKeysPopupEmptyButton">
<div id="addApiKeysPopupEmptyButton" v-if="isButtonShown">
<Button
v-if="isButtonShown"
:onPress="onButtonClick"
:label="buttonLabel"
width="170px" />
@ -60,7 +59,7 @@ export default class EmptyStateProjectArea extends Vue {
&__additional-text {
font-family: 'montserrat_regular';
font-size: 16px;
width: 50%;
width: 60%;
margin-bottom: 10px;
b {
@ -70,7 +69,7 @@ export default class EmptyStateProjectArea extends Vue {
}
&__img {
margin-top: 90px;
margin-top: 50px;
}
h1 {
@ -78,6 +77,7 @@ export default class EmptyStateProjectArea extends Vue {
font-size: 32px;
line-height: 35px;
margin-bottom: 30px;
min-width: 900px;
}
p {

35
web/satellite/src/components/team/TeamArea.vue
View File

@ -2,7 +2,7 @@
// See LICENSE for copying information.
<template>
<div>
<div class="team-area">
<div class="team-header">
<HeaderArea/>
</div>
@ -20,10 +20,10 @@
<Footer/>
</div>
</div>
<EmptyState
v-if="projectMembers.length === 0"
mainTitle="No results found"
:imageSource="emptyImage" />
<div class="empty-search-result-area" v-if="projectMembers.length === 0">
<h1 class="empty-search-result-area__text">No results found</h1>
<div class="empty-search-result-area__image" v-html="emptyImage"></div>
</div>
</div>
</template>
@ -32,7 +32,6 @@ import { Component, Vue } from 'vue-property-decorator';
import TeamMemberItem from '@/components/team/TeamMemberItem.vue';
import HeaderArea from '@/components/team/headerArea/HeaderArea.vue';
import Footer from '@/components/team/footerArea/Footer.vue';
import EmptyState from '@/components/common/EmptyStateArea.vue';
import { EMPTY_STATE_IMAGES } from '@/utils/constants/emptyStatesImages';
import { NOTIFICATION_ACTIONS, PM_ACTIONS } from '@/utils/constants/actionNames';
@ -80,7 +79,6 @@ import { NOTIFICATION_ACTIONS, PM_ACTIONS } from '@/utils/constants/actionNames'
TeamMemberItem,
HeaderArea,
Footer,
EmptyState,
}
})
@ -89,6 +87,10 @@ export default class TeamArea extends Vue {
</script>
<style scoped lang="scss">
.team-area {
position: relative;
}
.team-header {
position: fixed;
top: 100px;
@ -120,6 +122,25 @@ export default class TeamArea extends Vue {
height: 160px;
}
.empty-search-result-area {
height: 80vh;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
&__text {
font-family: 'montserrat_bold';
font-size: 32px;
line-height: 39px;
margin-top: 100px;
}
&__image {
margin-top: 40px;
}
}
@media screen and (max-width: 1600px) {
.team-container {