web/satellite: title removed from header component (#2749)

This commit is contained in:
Vitalii Shpital 2019-08-09 16:24:21 +03:00 committed by GitHub
parent fc4c675ffa
commit 6290d8c645
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 36 additions and 35 deletions

View File

@ -3,7 +3,6 @@
<template>
<div class="header-container">
<h1>{{title}}</h1>
<div class="header-container__wrapper">
<div class="header-container__buttons-area">
<slot></slot>
@ -32,8 +31,6 @@
private readonly placeHolder: string;
@Prop({default: () => { return ''; }})
private readonly search: searchCallback;
@Prop({default: ''})
private readonly title;
public $refs!: {
search: SearchComponent & ClearSearch;
@ -49,13 +46,6 @@
.header-container {
width: 100%;
h1 {
font-family: 'font_bold';
font-size: 32px;
line-height: 39px;
margin: 0;
}
&__wrapper {
width: 100%;
height: 85px;

View File

@ -3,23 +3,26 @@
<template>
<div class="team-header-container">
<HeaderComponent ref="headerComponent" placeHolder="Team Members" :search="processSearchQuery" title="Project Members">
<div class="header-default-state" v-if="headerState === 0">
<span>The only project role currently available is Admin, which gives <b>full access</b> to the project.</span>
<Button class="button" label="+Add" width="122px" height="48px" :onPress="onAddUsersClick"/>
</div>
<div class="header-selected-members" v-if="headerState === 1 && !isDeleteClicked">
<Button class="button deletion" label="Delete" width="122px" height="48px" :onPress="onFirstDeleteClick"/>
<Button class="button" label="Cancel" width="122px" height="48px" isWhite="true" :onPress="onClearSelection"/>
</div>
<div class="header-after-delete-click" v-if="headerState === 1 && isDeleteClicked">
<span>Are you sure you want to delete {{selectedProjectMembers}} {{userCountTitle}}</span>
<div class="header-after-delete-click__button-area">
<Button class="button deletion" label="Delete" width="122px" height="48px" :onPress="onDelete"/>
<h1>Project Members</h1>
<div class="team-header-container__wrapper">
<HeaderComponent ref="headerComponent" placeHolder="Team Members" :search="processSearchQuery">
<div class="header-default-state" v-if="headerState === 0">
<span>The only project role currently available is Admin, which gives <b>full access</b> to the project.</span>
<Button class="button" label="+Add" width="122px" height="48px" :onPress="onAddUsersClick"/>
</div>
<div class="header-selected-members" v-if="headerState === 1 && !isDeleteClicked">
<Button class="button deletion" label="Delete" width="122px" height="48px" :onPress="onFirstDeleteClick"/>
<Button class="button" label="Cancel" width="122px" height="48px" isWhite="true" :onPress="onClearSelection"/>
</div>
</div>
</HeaderComponent>
<div class="header-after-delete-click" v-if="headerState === 1 && isDeleteClicked">
<span>Are you sure you want to delete {{selectedProjectMembers}} {{userCountTitle}}</span>
<div class="header-after-delete-click__button-area">
<Button class="button deletion" label="Delete" width="122px" height="48px" :onPress="onDelete"/>
<Button class="button" label="Cancel" width="122px" height="48px" isWhite="true" :onPress="onClearSelection"/>
</div>
</div>
</HeaderComponent>
</div>
</div>
</template>
@ -107,6 +110,13 @@
</script>
<style scoped lang="scss">
h1 {
font-family: 'font_bold';
font-size: 32px;
line-height: 39px;
margin: 0;
}
.header-default-state,
.header-after-delete-click {
display: flex;
@ -140,7 +150,7 @@
line-height: 28px;
}
.team-header-container {
.team-header-container__wrapper {
margin-bottom: 4px;
display: flex;
align-items: center;

View File

@ -17,7 +17,6 @@ describe('HeaderComponent.vue', () => {
expect(wrapper.vm.$props.placeHolder).toMatch('');
expect(wrapper.vm.$props.search).toMatch('');
expect(wrapper.vm.$props.title).toMatch('');
});
it('function clearSearch works correctly', () => {

View File

@ -2,7 +2,6 @@
exports[`HeaderComponent.vue renders correctly 1`] = `
<div class="header-container">
<h1></h1>
<div class="header-container__wrapper">
<div class="header-container__buttons-area"></div>
<searchcomponent-stub placeholder="" search=""></searchcomponent-stub>

View File

@ -2,12 +2,15 @@
exports[`HeaderArea.vue renders correctly 1`] = `
<div class="team-header-container">
<headercomponent-stub placeholder="Team Members" search="function () { [native code] }" title="Project Members">
<div class="header-default-state"><span>The only project role currently available is Admin, which gives <b>full access</b> to the project.</span>
<button-stub label="+Add" width="122px" height="48px" onpress="function () { [native code] }" class="button"></button-stub>
</div>
<!---->
<!---->
</headercomponent-stub>
<h1>Project Members</h1>
<div class="team-header-container__wrapper">
<headercomponent-stub placeholder="Team Members" search="function () { [native code] }">
<div class="header-default-state"><span>The only project role currently available is Admin, which gives <b>full access</b> to the project.</span>
<button-stub label="+Add" width="122px" height="48px" onpress="function () { [native code] }" class="button"></button-stub>
</div>
<!---->
<!---->
</headercomponent-stub>
</div>
</div>
`;