Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(vwc-top-app-bar): alternate #1087

Merged
merged 20 commits into from
Oct 12, 2021
Merged

fix(vwc-top-app-bar): alternate #1087

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
20 commits
Select commit Hold shift + click to select a range
a5f0f15
add alternate
rinaok Oct 10, 2021
0c06661
Merge branch 'master' of https://github.com/Vonage/vivid into viv-740…
rinaok Oct 10, 2021
98736de
add ui test
rinaok Oct 10, 2021
43de08f
remove duplications
rinaok Oct 10, 2021
e903307
add tests
rinaok Oct 11, 2021
7c58e0e
test
rinaok Oct 11, 2021
0a10fdf
remove tests
rinaok Oct 11, 2021
a11afa6
remove snapshot
rinaok Oct 11, 2021
5eac1ff
Merge branch 'master' into viv-740-top-app-bar-alternate
rinaok Oct 11, 2021
de8447c
better alignment
yinonov Oct 11, 2021
14641c2
elevation?
yinonov Oct 11, 2021
6785081
update ui test
rinaok Oct 11, 2021
4ed2714
Merge branch 'viv-740-top-app-bar-alternate' of https://github.com/Vo…
rinaok Oct 11, 2021
3d27094
update ui test
rinaok Oct 11, 2021
9c223b9
alternate ui test
rinaok Oct 11, 2021
df07d5c
remove ui tests
rinaok Oct 12, 2021
1681152
Merge branch 'master' into viv-740-top-app-bar-alternate
rinaok Oct 12, 2021
4268de0
gd chips
yinonov Oct 12, 2021
4cb7e64
Update components/top-app-bar-fixed/stories/arg-types.js
yinonov Oct 12, 2021
5236e9e
Update components/top-app-bar/stories/arg-types.js
yinonov Oct 12, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
13 changes: 12 additions & 1 deletion components/top-app-bar-fixed/src/vwc-top-app-bar-fixed.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import '@vonage/vvd-core';
import { customElement } from 'lit-element';
import { customElement, property } from 'lit-element';
import { observer } from '@material/mwc-base/observer';
import { TopAppBarFixedBase as MWCTopAppBarFixedBase } from '@material/mwc-top-app-bar-fixed/mwc-top-app-bar-fixed-base.js';
import { styles as MWCTopAppBarStyles } from '@material/mwc-top-app-bar/mwc-top-app-bar.css.js';
import { style as VWCTopAppBarStyle } from '@vonage/vwc-top-app-bar/vwc-top-app-bar.css.js';
Expand All @@ -15,5 +16,15 @@ declare global {
*/
@customElement('vwc-top-app-bar-fixed')
export class VWCTopAppBarFixed extends MWCTopAppBarFixedBase {
@property({ type: Boolean })
@observer(function (this: VWCTopAppBarFixed, newVal: boolean) {
if (newVal) {
this.mdcRoot.setAttribute('part', 'vvd-scheme-alternate');
} else {
this.mdcRoot.removeAttribute('part');
}
})
alternate = false;

static override styles = [MWCTopAppBarStyles, VWCTopAppBarStyle];
}
37 changes: 18 additions & 19 deletions components/top-app-bar-fixed/stories/arg-types.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,21 +1,20 @@
const control = {
type: 'inline-radio',
options: { true: '', false: undefined },
};

export const argTypes = {
centerTitle: {
control: {
type: 'inline-radio',
options: { true: '', false: undefined },
},
},
dense: {
control: {
type: 'inline-radio',
options: { true: '', false: undefined },
},
},
prominent: {
control: {
type: 'inline-radio',
options: { true: '', false: undefined },
},
},
styles: { table: { disable: true } },
centerTitle: {
control
},
dense: {
control
},
alternate: {
control
},
prominent: {
control
},
styles: { table: { disable: true } },
};
11 changes: 7 additions & 4 deletions components/top-app-bar-fixed/stories/top-app-bar-fixed.stories.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,12 +13,12 @@ export default {

const Template = (args) => html`
<vwc-top-app-bar-fixed ...=${spread(args)}>
<vwc-icon-button slot="navigationIcon" icon="menu-line" layout="filled"></vwc-icon-button>
<vwc-icon-button slot="navigationIcon" icon="menu-line"></vwc-icon-button>
<span slot="title">Top App Bar</span>

<vwc-icon-button slot="actionItems" icon="twitter-mono" layout="filled"></vwc-icon-button>
<vwc-icon-button slot="actionItems" icon="facebook-mono" layout="filled"></vwc-icon-button>
<vwc-icon-button slot="actionItems" icon="heart-solid" layout="filled"></vwc-icon-button>
<vwc-icon-button slot="actionItems" icon="twitter-mono"></vwc-icon-button>
<vwc-icon-button slot="actionItems" icon="facebook-mono"></vwc-icon-button>
<vwc-icon-button slot="actionItems" icon="heart-solid"></vwc-icon-button>
<span slot="actionItems">Toggle theme:</span>
<vwc-theme-switch slot="actionItems"></vwc-theme-switch>

Expand All @@ -37,3 +37,6 @@ export const Default = Template.bind({});

export const Dense = Template.bind({});
Dense.args = { dense: '' };

export const Alternate = Template.bind({});
Alternate.args = { alternate: true };
37 changes: 18 additions & 19 deletions components/top-app-bar/stories/arg-types.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,21 +1,20 @@
const control = {
type: 'inline-radio',
options: { true: '', false: undefined },
};

export const argTypes = {
centerTitle: {
control: {
type: 'inline-radio',
options: { true: '', false: undefined },
},
},
dense: {
control: {
type: 'inline-radio',
options: { true: '', false: undefined },
},
},
prominent: {
control: {
type: 'inline-radio',
options: { true: '', false: undefined },
},
},
styles: { table: { disable: true } },
centerTitle: {
control
},
dense: {
control
},
alternate: {
control
},
prominent: {
control
},
styles: { table: { disable: true } },
};
11 changes: 7 additions & 4 deletions components/top-app-bar/stories/top-app-bar.stories.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,12 +13,12 @@ export default {

const Template = (args) => html`
<vwc-top-app-bar ...=${spread(args)}>
<vwc-icon-button slot="navigationIcon" icon="menu-line" layout="filled"></vwc-icon-button>
<vwc-icon-button slot="navigationIcon" icon="menu-line"></vwc-icon-button>
<span slot="title">Top App Bar</span>

<vwc-icon-button slot="actionItems" icon="twitter-mono" layout="filled"></vwc-icon-button>
<vwc-icon-button slot="actionItems" icon="facebook-mono" layout="filled"></vwc-icon-button>
<vwc-icon-button slot="actionItems" icon="heart-solid" layout="filled"></vwc-icon-button>
<vwc-icon-button slot="actionItems" icon="twitter-mono"></vwc-icon-button>
<vwc-icon-button slot="actionItems" icon="facebook-mono"></vwc-icon-button>
<vwc-icon-button slot="actionItems" icon="heart-solid"></vwc-icon-button>
<span slot="actionItems">Toggle theme:</span>
<vwc-theme-switch slot="actionItems"></vwc-theme-switch>

Expand All @@ -37,3 +37,6 @@ export const Default = Template.bind({});

export const Dense = Template.bind({});
Dense.args = { dense: '' };

export const Alternate = Template.bind({});
Alternate.args = { alternate: true };
Binary file modified ui-tests/snapshots/vwc-elevation.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.