From 4c10d2aeac01f2e0197d421ccdebc318dc7da110 Mon Sep 17 00:00:00 2001 From: Dmitry Nehaychik <4dmitr@gmail.com> Date: Fri, 19 Jan 2018 19:41:39 +0300 Subject: [PATCH] =?UTF-8?q?fix(menu):=20stop=20sidebar=20adding=20display:?= =?UTF-8?q?=20none=20to=20collapsed=20item=20span=20t=E2=80=A6=20(#155)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- e2e/layout.e2e-spec.ts | 2 +- e2e/menu.e2e-spec.ts | 35 +++++++++++-------- src/app/menu-test/menu-test.component.ts | 9 ++++- .../sidebar/_sidebar.component.theme.scss | 8 +++-- 4 files changed, 35 insertions(+), 19 deletions(-) diff --git a/e2e/layout.e2e-spec.ts b/e2e/layout.e2e-spec.ts index 73dc829568..c1501b2e54 100644 --- a/e2e/layout.e2e-spec.ts +++ b/e2e/layout.e2e-spec.ts @@ -19,7 +19,7 @@ describe('nb-layout', () => { it('should have correct font-family', () => { element(by.css('#layout-fluid > .scrollable-container > .layout')).getCssValue('font-family').then(value => { - expect(value).toMatch('"Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif'); + expect(value.replace(/"/g, `'`)).toMatch(`'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif`); }); }); diff --git a/e2e/menu.e2e-spec.ts b/e2e/menu.e2e-spec.ts index 5e1f1020c5..8302a9e64f 100644 --- a/e2e/menu.e2e-spec.ts +++ b/e2e/menu.e2e-spec.ts @@ -4,28 +4,30 @@ * Licensed under the MIT License. See License.txt in the project root for license information. */ -import { browser, element, by, ExpectedConditions as ec } from 'protractor'; +import { browser, by, element, ExpectedConditions as ec } from 'protractor'; import { hasClass } from './e2e-helper'; -const group = by.css('nb-menu ul li:nth-child(1) span'); -const menu1 = by.css('nb-menu ul li:nth-child(2) a'); -const menu2 = by.css('nb-menu ul li:nth-child(3) a'); -const menu3 = by.css('nb-menu ul li:nth-child(4) a'); -const menu3SubMenu = by.css('nb-menu ul li:nth-child(4) ul'); -const menu31 = by.css('nb-menu ul li:nth-child(4) ul li:nth-child(1) a'); -const menu32 = by.css('nb-menu ul li:nth-child(4) ul li:nth-child(2) a'); -const menu33 = by.css('nb-menu ul li:nth-child(4) ul li:nth-child(3) a'); -const menu33SubMenu = by.css('nb-menu ul li:nth-child(4) ul li:nth-child(3) ul'); -const menu331 = by.css('nb-menu ul li:nth-child(4) ul li:nth-child(3) ul li:nth-child(1) a'); -const menu332 = by.css('nb-menu ul li:nth-child(4) ul li:nth-child(3) ul li:nth-child(2) a'); -const menu333 = by.css('nb-menu ul li:nth-child(4) ul li:nth-child(3) ul li:nth-child(3) a'); -const newMenu = by.css('nb-menu ul li:nth-child(5) a'); +const group = by.css('#menu-first ul li:nth-child(1) span'); +const menu1 = by.css('#menu-first ul li:nth-child(2) a'); +const menu2 = by.css('#menu-first ul li:nth-child(3) a'); +const menu3 = by.css('#menu-first ul li:nth-child(4) a'); +const menu3SubMenu = by.css('#menu-first ul li:nth-child(4) ul'); +const menu31 = by.css('#menu-first ul li:nth-child(4) ul li:nth-child(1) a'); +const menu32 = by.css('#menu-first ul li:nth-child(4) ul li:nth-child(2) a'); +const menu33 = by.css('#menu-first ul li:nth-child(4) ul li:nth-child(3) a'); +const menu33SubMenu = by.css('#menu-first ul li:nth-child(4) ul li:nth-child(3) ul'); +const menu331 = by.css('#menu-first ul li:nth-child(4) ul li:nth-child(3) ul li:nth-child(1) a'); +const menu332 = by.css('#menu-first ul li:nth-child(4) ul li:nth-child(3) ul li:nth-child(2) a'); +const menu333 = by.css('#menu-first ul li:nth-child(4) ul li:nth-child(3) ul li:nth-child(3) a'); +const newMenu = by.css('#menu-first ul li:nth-child(5) a'); const addButton = by.css('#addBtn'); const homeButton = by.css('#homeBtn'); const waitTime = 20 * 1000; +const sidebarMenu31 = by.css('#menu-sidebar ul li:nth-child(4) ul li:nth-child(1) a > span'); + describe('nb-menu', () => { beforeEach((done) => { @@ -96,6 +98,11 @@ describe('nb-menu', () => { }); }); + it('collapsed sidebar item span should not be display:none', () => { + element(sidebarMenu31) + .getCssValue('display').then(value => expect(value).toEqual('block')); + }); + it('should be selected - Menu #3.1', () => { expect(hasClass(element.all(menu3SubMenu).first(), 'collapsed')).toBeTruthy(); diff --git a/src/app/menu-test/menu-test.component.ts b/src/app/menu-test/menu-test.component.ts index 1f84838e91..41fba7ece9 100644 --- a/src/app/menu-test/menu-test.component.ts +++ b/src/app/menu-test/menu-test.component.ts @@ -84,10 +84,13 @@ export class NbMenuItem4Component { } selector: 'nb-menu-test', template: ` + + + - + @@ -102,14 +105,17 @@ export class NbMenuTestComponent implements OnInit, OnDestroy { { title: 'Menu Items', group: true, + icon: 'nb-keypad', }, { title: 'Menu #1', link: '/menu/1', + icon: 'nb-keypad', }, { title: 'Menu #2', link: '/menu/2', + icon: 'nb-keypad', }, ]; @@ -140,6 +146,7 @@ export class NbMenuTestComponent implements OnInit, OnDestroy { [ { title: 'Menu #3', + icon: 'nb-keypad', children: [ { title: 'Menu #3.1', diff --git a/src/framework/theme/components/sidebar/_sidebar.component.theme.scss b/src/framework/theme/components/sidebar/_sidebar.component.theme.scss index facd0ec4d5..ef23c36243 100644 --- a/src/framework/theme/components/sidebar/_sidebar.component.theme.scss +++ b/src/framework/theme/components/sidebar/_sidebar.component.theme.scss @@ -83,12 +83,14 @@ } } - .menu-items > .menu-item { - transition: border-color 1s ease; - + > .menu-items > .menu-item > a { span, .chevron { display: none; } + } + + .menu-items > .menu-item { + transition: border-color 1s ease; &.menu-group { display: block;