From ad5b3f585b5d3087a29cd24276a907dc641ade7a Mon Sep 17 00:00:00 2001 From: ntthitrinh Date: Fri, 18 Aug 2023 11:53:06 +0700 Subject: [PATCH 1/7] feature-9125: Fix top menu for mobile screens --- app/styles/pages/public-event.scss | 10 +- app/styles/partials/nav-bar.scss | 114 ++++++++++++++++++-- app/templates/components/nav-bar.hbs | 153 +++++++++++++++------------ 3 files changed, 194 insertions(+), 83 deletions(-) diff --git a/app/styles/pages/public-event.scss b/app/styles/pages/public-event.scss index 401b384d6ea..6efd7731d1f 100644 --- a/app/styles/pages/public-event.scss +++ b/app/styles/pages/public-event.scss @@ -228,17 +228,11 @@ } .logo-event { - margin: 10px !important; - width: 56px !important; + // margin: 10px !important; + // width: 56px !important; height: auto; } -.btn-un-bd { - border: unset; - padding: unset !important; - height: 46px !important; -} - .public-social-links { margin-top: 1.5rem !important; } diff --git a/app/styles/partials/nav-bar.scss b/app/styles/partials/nav-bar.scss index bc21b62b97e..27c86ded1ab 100644 --- a/app/styles/partials/nav-bar.scss +++ b/app/styles/partials/nav-bar.scss @@ -34,9 +34,10 @@ } .menu-item-public { + height: 100%; padding-left: unset !important; padding-right: unset !important; - font-size: 12px; + font-size: 10px; } .item-exhibition { @@ -45,10 +46,6 @@ } } -.rm-pd-l { - width: 100% !important; -} - .item-public { font-size: .85714286rem !important; } @@ -62,6 +59,109 @@ } .item-padding { - padding-left: 8px !important; - padding-right: 8px !important; + padding-left: 16px !important; + padding-right: 16px !important; +} + + + +.layout-header-mobile { + .reset-pd { + padding: unset !important; + } + + .bl-one { + display: flex !important; + margin-right: -22px !important; + padding-left: 18px !important; + border-left: 1px solid rgba(34, 36, 38, .15) !important; + + .item-bl-one { + width: calc(100% - 44px); + } + } + + .bl-two { + margin-left: 9px !important; + border-left: 1px solid rgba(34, 36, 38, .15); + font-size: 14px; + padding-right: 7px !important; + + .item-bl-two-login { + border-right: 1px solid rgba(34, 36, 38, .15) !important; + height: 100%; + display: flex !important; + justify-content: center; + align-items: center; + } + + .btn-un-bd { + border: unset; + padding: unset !important; + height: 46px !important; + width: 100%; + padding-left: 14px !important; + + img { + width: 80%; + } + } + } + + .bl-three { + + .menu-schedule { + border-right: 1px solid rgba(34, 36, 38, .15); + } + } + + .bl-four { + margin-right: 10px; + + .menu-speakers { + padding-left: 8px !important; + padding-right: 8px !important; + } + } + + .bl-six-border { + padding-left: 7px !important; + border-left: 1px solid rgba(34, 36, 38, .15); + } + + .bl-seven { + border-left: 1px solid rgba(34, 36, 38, .15); + margin-left: -4px !important; + display: flex !important; + justify-content: center; + align-items: center; + } + + .bl-six-login { + margin-right: 11px !important; + + button { + padding-left: 7px !important; + } + } + + .bl-seven-not-login { + margin-right: unset !important; + } + + .bl-seven-login { + margin-right: -4px !important; + } + + .item { + &::before { + position: unset !important; + content: unset !important; + top: unset !important; + right: unset !important; + height: unset !important; + width: unset !important; + background: unset !important; + } + } } diff --git a/app/templates/components/nav-bar.hbs b/app/templates/components/nav-bar.hbs index c7fe6383ea4..2fa7850ecc2 100644 --- a/app/templates/components/nav-bar.hbs +++ b/app/templates/components/nav-bar.hbs @@ -68,88 +68,105 @@ +
-
- - - - {{#if this.session.isAuthenticated}} - {{#if (and this.isNotPublicPageRoute this.isNotWizardPageRoute this.isNotEventPageRoute this.isNotOrderPageRoute this.isNotEventDetailPageRoute)}} - -
{{this.settings.appName}}
- - {{else }} - {{#if this.globalData.logoUrl}} - - {{else}} - - {{/if}} - {{/if}} - {{else}} - {{#if (and this.isNotPublicPageRoute this.isNotWizardPageRoute this.isNotEventPageRoute this.isNotOrderPageRoute this.isNotEventDetailPageRoute)}} +
+
+ +
+ + + +
+
+ +
+
+ {{#if (not this.isNotPublicPageRoute)}} + {{#if this.showSessions}} +
Schedule
{{/if}} - {{/if}} - {{#if (not this.isNotPublicPageRoute)}} - {{#if this.showSessions}} -
Schedule
{{/if}} - {{#if this.showSpeakers}} -
Speakers
- {{/if}} - {{#if this.showExhibitors}} -
Exhibition
+
+
+ {{#if (not this.isNotPublicPageRoute)}} + {{#if this.showSpeakers}} +
Speakers
+ {{/if}} {{/if}} - {{/if}} - -
- {{!-- {{#if this.session.isAuthenticated}} --}} - {{!-- --}} - {{!-- {{/if}} --}} - {{#if (and this.isNotEventPageRoute this.isNotExplorePageRoute this.isNotWizardPageRoute)}} + + {{#if this.session.isAuthenticated}} +
+ {{#if (and this.isNotPublicPageRoute this.isNotWizardPageRoute this.isNotEventPageRoute this.isNotOrderPageRoute this.isNotEventDetailPageRoute)}} + +
+ {{t 'Create Event'}} +
+ + {{else}} + +
{{this.settings.appName}}
+ + {{/if}} +
{{else}} - {{t 'Login'}} +
+ {{t 'Login'}} +
{{/if}} -
+
From 897bb458ac76a5293a90f365af06fe8d18ff2bc4 Mon Sep 17 00:00:00 2001 From: ntthitrinh Date: Fri, 18 Aug 2023 13:52:23 +0700 Subject: [PATCH 2/7] feature-9125: Fix top menu for mobile screens --- app/components/side-bar.js | 2 +- app/styles/partials/nav-bar.scss | 7 +++++++ app/templates/components/nav-bar.hbs | 4 ++-- 3 files changed, 10 insertions(+), 3 deletions(-) diff --git a/app/components/side-bar.js b/app/components/side-bar.js index 8ee62880251..ceb79aad67d 100644 --- a/app/components/side-bar.js +++ b/app/components/side-bar.js @@ -1,7 +1,7 @@ import classic from 'ember-classic-decorator'; import $ from 'jquery'; import Component from '@ember/component'; -import { action, computed} from '@ember/object'; +import { action, computed } from '@ember/object'; import { inject as service } from '@ember/service'; import { tracked } from '@glimmer/tracking'; @classic diff --git a/app/styles/partials/nav-bar.scss b/app/styles/partials/nav-bar.scss index 27c86ded1ab..d006f5d154d 100644 --- a/app/styles/partials/nav-bar.scss +++ b/app/styles/partials/nav-bar.scss @@ -165,3 +165,10 @@ } } } + +.set-bd-home { + padding-left: 21px !important; + padding-top: unset !important; + padding-right: unset !important; + padding-bottom: unset !important; +} diff --git a/app/templates/components/nav-bar.hbs b/app/templates/components/nav-bar.hbs index 2fa7850ecc2..cb1a43c49af 100644 --- a/app/templates/components/nav-bar.hbs +++ b/app/templates/components/nav-bar.hbs @@ -120,7 +120,7 @@ {{/if}}
-
+
{{#if (not this.isNotPublicPageRoute)}} {{#if this.showSessions}}
Schedule
@@ -147,7 +147,7 @@ {{/if}}
{{#if this.session.isAuthenticated}} -
+
{{#if (and this.isNotPublicPageRoute this.isNotWizardPageRoute this.isNotEventPageRoute this.isNotOrderPageRoute this.isNotEventDetailPageRoute)}} From 3a4d3b040a1ec9bd8d23ad08326b44520ebef4ef Mon Sep 17 00:00:00 2001 From: ntthitrinh Date: Fri, 18 Aug 2023 13:57:54 +0700 Subject: [PATCH 3/7] feature-9125: Fix top menu for mobile screens --- app/styles/partials/nav-bar.scss | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/app/styles/partials/nav-bar.scss b/app/styles/partials/nav-bar.scss index d006f5d154d..ff4ced2d9ae 100644 --- a/app/styles/partials/nav-bar.scss +++ b/app/styles/partials/nav-bar.scss @@ -130,6 +130,11 @@ } .bl-seven { + + a { + background-color: #fff !important; + } + border-left: 1px solid rgba(34, 36, 38, .15); margin-left: -4px !important; display: flex !important; From 0eb540a7c74fd6f867e4114610d00128277d9517 Mon Sep 17 00:00:00 2001 From: ntthitrinh Date: Fri, 18 Aug 2023 14:14:20 +0700 Subject: [PATCH 4/7] feature-9125: Fix top menu for mobile screens --- app/styles/partials/nav-bar.scss | 26 +++++++++++++++++++++----- app/templates/components/nav-bar.hbs | 2 +- 2 files changed, 22 insertions(+), 6 deletions(-) diff --git a/app/styles/partials/nav-bar.scss b/app/styles/partials/nav-bar.scss index ff4ced2d9ae..ec8b6bc7a23 100644 --- a/app/styles/partials/nav-bar.scss +++ b/app/styles/partials/nav-bar.scss @@ -130,16 +130,32 @@ } .bl-seven { - - a { - background-color: #fff !important; - } - border-left: 1px solid rgba(34, 36, 38, .15); margin-left: -4px !important; display: flex !important; justify-content: center; align-items: center; + + a { + background-color: #fff !important; + } + + + .a-login { + width: calc(100% - 4px); + padding-left: 10px !important; + padding-top: unset !important; + padding-right: unset !important; + padding-bottom: unset !important; + } + + .a-login-public { + width: calc(100% - 4px); + padding-left: 5px !important; + padding-top: unset !important; + padding-right: unset !important; + padding-bottom: unset !important; + } } .bl-six-login { diff --git a/app/templates/components/nav-bar.hbs b/app/templates/components/nav-bar.hbs index cb1a43c49af..3e0539753d1 100644 --- a/app/templates/components/nav-bar.hbs +++ b/app/templates/components/nav-bar.hbs @@ -164,7 +164,7 @@
{{else}}
- {{t 'Login'}} +
{{/if}}
From 64405b35600124166658a13563b6c413027d61dc Mon Sep 17 00:00:00 2001 From: odkhang Date: Mon, 21 Aug 2023 09:38:30 +0700 Subject: [PATCH 5/7] feature-9125: Fix top menu for mobile screens --- app/styles/partials/nav-bar.scss | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/app/styles/partials/nav-bar.scss b/app/styles/partials/nav-bar.scss index ec8b6bc7a23..2afbf164a7b 100644 --- a/app/styles/partials/nav-bar.scss +++ b/app/styles/partials/nav-bar.scss @@ -125,7 +125,7 @@ } .bl-six-border { - padding-left: 7px !important; + padding-left: 10px !important; border-left: 1px solid rgba(34, 36, 38, .15); } @@ -159,6 +159,7 @@ } .bl-six-login { + padding-left: 3px !important; margin-right: 11px !important; button { From 7cb68d23c588ea9d7b7fce88eaca376fb3170129 Mon Sep 17 00:00:00 2001 From: odkhang Date: Tue, 22 Aug 2023 10:33:23 +0700 Subject: [PATCH 6/7] feature-9125: Fix top menu for mobile screens --- app/components/nav-bar.js | 18 +++++ app/routes/public/cfs/edit-speaker.js | 4 +- app/styles/partials/nav-bar.scss | 99 +++++++++++++++++++-------- app/templates/components/nav-bar.hbs | 16 ++--- 4 files changed, 97 insertions(+), 40 deletions(-) diff --git a/app/components/nav-bar.js b/app/components/nav-bar.js index 5764d4d4a31..1a736fd2fd3 100644 --- a/app/components/nav-bar.js +++ b/app/components/nav-bar.js @@ -86,6 +86,23 @@ export default class NavBar extends Component { return !(String(this.session.currentRouteName).includes('events.view')); } + @computed('isNotPublicPageRoute') + get checkShowClassCssPublic() { + if (this.session.isAuthenticated) { + if (this.isNotPublicPageRoute) { + return 'au-home-page'; + } else { + return 'au-public-page'; + } + } else { + if (this.isNotPublicPageRoute) { + return 'un-home-page'; + } else { + return 'un-public-page'; + } + } + } + @action handleKeyPress() { if (event.keyCode === 13 || event.which === 13) { @@ -120,6 +137,7 @@ export default class NavBar extends Component { }); } + @action handleClick() { this.router.replaceWith('public.index', this.globalData.idEvent); diff --git a/app/routes/public/cfs/edit-speaker.js b/app/routes/public/cfs/edit-speaker.js index ebad0618777..c65891ef71a 100644 --- a/app/routes/public/cfs/edit-speaker.js +++ b/app/routes/public/cfs/edit-speaker.js @@ -9,7 +9,7 @@ export default class EditSpeakerRoute extends Route { async model(params) { const eventDetails = this.modelFor('public'); - const speaker = await this.store.findRecord('speaker', params.speaker_id, { include: 'sessions' }) + const speaker = await this.store.findRecord('speaker', params.speaker_id, { include: 'sessions' }); return { event : eventDetails, forms : await eventDetails.query('customForms', { @@ -24,4 +24,4 @@ export default class EditSpeakerRoute extends Route { speaker }; } -} \ No newline at end of file +} diff --git a/app/styles/partials/nav-bar.scss b/app/styles/partials/nav-bar.scss index 2afbf164a7b..f7542c2de40 100644 --- a/app/styles/partials/nav-bar.scss +++ b/app/styles/partials/nav-bar.scss @@ -47,7 +47,7 @@ } .item-public { - font-size: .85714286rem !important; + font-size: 9px !important; } .item-menu-right { @@ -63,9 +63,17 @@ padding-right: 16px !important; } - +.header-mobile > .layout-header-mobile > .row > .two.wide.column.bl-six { + width: 14.5% !important; +} .layout-header-mobile { + + .row { + position: absolute; + } + + .reset-pd { padding: unset !important; } @@ -85,7 +93,6 @@ margin-left: 9px !important; border-left: 1px solid rgba(34, 36, 38, .15); font-size: 14px; - padding-right: 7px !important; .item-bl-two-login { border-right: 1px solid rgba(34, 36, 38, .15) !important; @@ -100,7 +107,11 @@ padding: unset !important; height: 46px !important; width: 100%; - padding-left: 14px !important; + margin: auto !important; + text-align: center; + display: flex; + justify-content: center; + align-items: center; img { width: 80%; @@ -109,14 +120,19 @@ } .bl-three { + display: flex !important; + text-align: center; + justify-content: center; + } - .menu-schedule { - border-right: 1px solid rgba(34, 36, 38, .15); - } + .bl-three-border { + border-right: 1px solid rgba(34, 36, 38, .15); } .bl-four { - margin-right: 10px; + display: flex !important; + text-align: center; + justify-content: center; .menu-speakers { padding-left: 8px !important; @@ -124,44 +140,71 @@ } } + .bl-six { + border-right: 1px solid rgba(34, 36, 38, .15); + + .au-public-page { + justify-content: center; + } + + .un-public-page { + display: flex; + justify-content: center; + align-items: center; + } + } + .bl-six-border { - padding-left: 10px !important; border-left: 1px solid rgba(34, 36, 38, .15); } + .bl-seven-au-public-page { + margin-right: auto !important; + margin-left: auto !important; + + .au-public-page-text { + text-align: center !important; + justify-content: center; + } + } + + .bl-seven-au-home-page { + .text-home-page { + display: flex !important; + justify-content: center; + } + } + .bl-seven { - border-left: 1px solid rgba(34, 36, 38, .15); - margin-left: -4px !important; + left: 3px; + width: 18.5% !important; + margin: unset !important; display: flex !important; + text-align: center; justify-content: center; align-items: center; a { + width: calc(100% - 4px); background-color: #fff !important; } - - .a-login { - width: calc(100% - 4px); - padding-left: 10px !important; - padding-top: unset !important; - padding-right: unset !important; - padding-bottom: unset !important; + .tag-a-not-login { + display: flex; + justify-content: center; + align-items: center; + padding: unset !important; } .a-login-public { - width: calc(100% - 4px); - padding-left: 5px !important; - padding-top: unset !important; - padding-right: unset !important; - padding-bottom: unset !important; + display: flex; + justify-content: center; + align-items: center; + padding: unset !important; } } .bl-six-login { - padding-left: 3px !important; - margin-right: 11px !important; - button { padding-left: 7px !important; } @@ -171,10 +214,6 @@ margin-right: unset !important; } - .bl-seven-login { - margin-right: -4px !important; - } - .item { &::before { position: unset !important; diff --git a/app/templates/components/nav-bar.hbs b/app/templates/components/nav-bar.hbs index 3e0539753d1..71a5fa51922 100644 --- a/app/templates/components/nav-bar.hbs +++ b/app/templates/components/nav-bar.hbs @@ -69,7 +69,7 @@
-
+
-
+
{{#if (not this.isNotPublicPageRoute)}} {{#if this.showSessions}}
Schedule
@@ -137,7 +137,7 @@ {{#if this.session.isAuthenticated}} -
+
{{#if (and this.isNotPublicPageRoute this.isNotWizardPageRoute this.isNotEventPageRoute this.isNotOrderPageRoute this.isNotEventDetailPageRoute)}} + @route="create" class="item ui blue button-text small text reset-pd text-home-page">
{{t 'Create Event'}}
{{else}} + @route="index" class="item reset-pd {{checkShowClassCssPublic}}-text" @activeClass="" >
{{this.settings.appName}}
 {{/if}}
{{else}}
- +
{{/if}}
-
+
From 718f816c680aedb7753f6c75101585f8b8bf5371 Mon Sep 17 00:00:00 2001 From: odkhang Date: Tue, 22 Aug 2023 10:38:27 +0700 Subject: [PATCH 7/7] feature-9125: Fix top menu for mobile screens --- app/styles/partials/nav-bar.scss | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/app/styles/partials/nav-bar.scss b/app/styles/partials/nav-bar.scss index f7542c2de40..d56fe3ee1a8 100644 --- a/app/styles/partials/nav-bar.scss +++ b/app/styles/partials/nav-bar.scss @@ -168,6 +168,10 @@ } } + .au-home-page-text { + justify-content: center; + } + .bl-seven-au-home-page { .text-home-page { display: flex !important;