From e9e3f938053174b93a0ee246600c5771d801e712 Mon Sep 17 00:00:00 2001 From: Simounet Date: Mon, 4 Dec 2017 19:25:03 +0100 Subject: Label replaced by a button on the nav new entry form --- app/Resources/static/themes/material/css/nav.scss | 1 - app/Resources/static/themes/material/css/various.scss | 11 +++++++++++ 2 files changed, 11 insertions(+), 1 deletion(-) (limited to 'app/Resources') diff --git a/app/Resources/static/themes/material/css/nav.scss b/app/Resources/static/themes/material/css/nav.scss index 99a048b0..7191a71a 100644 --- a/app/Resources/static/themes/material/css/nav.scss +++ b/app/Resources/static/themes/material/css/nav.scss @@ -68,7 +68,6 @@ nav .nav-wrapper i { .input-field input { display: block; line-height: inherit; - padding-left: 4rem !important; width: calc(100% - 8rem); height: 4.1rem; } diff --git a/app/Resources/static/themes/material/css/various.scss b/app/Resources/static/themes/material/css/various.scss index 7daf40ec..9d2f94f5 100644 --- a/app/Resources/static/themes/material/css/various.scss +++ b/app/Resources/static/themes/material/css/various.scss @@ -21,6 +21,17 @@ div.settings div.file-field { nav .input-field input { margin: 0; + padding-left: 0.5rem; +} + +.new-entry-button { + padding: 0 1rem; + background-color: transparent; + border: none; + + &:focus { + background-color: inherit; + } } .tabs { -- cgit v1.2.3 From f86c2b5fa6e8e681dbc6608e8272b63679336676 Mon Sep 17 00:00:00 2001 From: Simounet Date: Thu, 28 Dec 2017 20:24:39 +0100 Subject: Label replaced by a button on the nav search form --- app/Resources/static/themes/material/css/nav.scss | 10 ++++++++++ app/Resources/static/themes/material/css/various.scss | 10 ---------- 2 files changed, 10 insertions(+), 10 deletions(-) (limited to 'app/Resources') diff --git a/app/Resources/static/themes/material/css/nav.scss b/app/Resources/static/themes/material/css/nav.scss index 7191a71a..f5447b8c 100644 --- a/app/Resources/static/themes/material/css/nav.scss +++ b/app/Resources/static/themes/material/css/nav.scss @@ -116,6 +116,16 @@ nav .nav-wrapper i { } } +.nav-form-button { + padding: 0 1rem; + background-color: transparent; + border: none; + + &:focus { + background-color: inherit; + } +} + #button_filters { display: none; } diff --git a/app/Resources/static/themes/material/css/various.scss b/app/Resources/static/themes/material/css/various.scss index 9d2f94f5..ba6570f2 100644 --- a/app/Resources/static/themes/material/css/various.scss +++ b/app/Resources/static/themes/material/css/various.scss @@ -24,16 +24,6 @@ nav .input-field input { padding-left: 0.5rem; } -.new-entry-button { - padding: 0 1rem; - background-color: transparent; - border: none; - - &:focus { - background-color: inherit; - } -} - .tabs { display: flex; } -- cgit v1.2.3 From 63771b9ae31a8df8050677b53e64f7cf17924c27 Mon Sep 17 00:00:00 2001 From: Simounet Date: Thu, 28 Dec 2017 20:28:10 +0100 Subject: Fix nav new entry and search form alignment --- app/Resources/static/themes/material/css/nav.scss | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) (limited to 'app/Resources') diff --git a/app/Resources/static/themes/material/css/nav.scss b/app/Resources/static/themes/material/css/nav.scss index f5447b8c..d2e14e69 100644 --- a/app/Resources/static/themes/material/css/nav.scss +++ b/app/Resources/static/themes/material/css/nav.scss @@ -69,7 +69,7 @@ nav .nav-wrapper i { display: block; line-height: inherit; width: calc(100% - 8rem); - height: 4.1rem; + height: 3rem; } .input-field input:focus { @@ -108,6 +108,7 @@ nav .nav-wrapper i { &.nav-panel-search form { display: flex; flex: 1; + align-items: center; } &.nav-panel-add form.disabled, -- cgit v1.2.3 From 2831e77cce6eae213c0cec8f5a90a6a00c383633 Mon Sep 17 00:00:00 2001 From: Simounet Date: Thu, 28 Dec 2017 22:54:42 +0100 Subject: Nav close button alignment and nav boxes improved --- app/Resources/static/themes/material/css/nav.scss | 58 +++++++++++------------ app/Resources/static/themes/material/index.js | 14 ++---- 2 files changed, 31 insertions(+), 41 deletions(-) (limited to 'app/Resources') diff --git a/app/Resources/static/themes/material/css/nav.scss b/app/Resources/static/themes/material/css/nav.scss index d2e14e69..147f163f 100644 --- a/app/Resources/static/themes/material/css/nav.scss +++ b/app/Resources/static/themes/material/css/nav.scss @@ -2,8 +2,7 @@ /* ========================================================================== Nav ========================================================================== */ -nav, -.nav-wrapper { +nav { height: auto; line-height: initial; } @@ -18,25 +17,25 @@ nav { } } -.nav-wrapper { +.nav-panel-item .button-collapse { + margin-left: 0; + margin-right: 0.5rem; + padding: 0 0.5rem; + height: auto; + line-height: 1; + background-color: transparent; + border: none; +} + +.nav-panel-item { display: flex; padding: 0.6rem 0.4rem 0.6rem 0.75rem; flex-wrap: wrap; justify-content: space-between; align-items: center; - - .button-collapse { - margin-left: 0; - margin-right: 0.5rem; - padding: 0 0.5rem; - height: auto; - line-height: 1; - background-color: transparent; - border: none; - } } -nav .nav-wrapper i { +.nav-panel-item .material-icons { height: 46px; line-height: 46px; } @@ -51,8 +50,8 @@ nav .nav-wrapper i { justify-content: flex-end; } -.nav-panel-add .add, -.nav-panel-search .search, +.nav-panel-item .add, +.nav-panel-item .search, .nav-panels .close { color: #444 !important; } @@ -68,7 +67,6 @@ nav .nav-wrapper i { .input-field input { display: block; line-height: inherit; - width: calc(100% - 8rem); height: 3rem; } @@ -86,39 +84,32 @@ nav .nav-wrapper i { } .input-field { - &.nav-panel-add label, - &.nav-panel-search label { + &.nav-panel-item label { left: 1rem; } - &.nav-panel-add .close, - &.nav-panel-search .close { - position: absolute; - top: 0; - right: 1rem; + &.nav-panel-item .close { color: transparent; cursor: pointer; font-size: 2rem; transition: 0.3s color; } - &.nav-panel-add, - &.nav-panel-add form, - &.nav-panel-search, - &.nav-panel-search form { + &.nav-panel-item { display: flex; flex: 1; + flex-wrap: nowrap; align-items: center; } - &.nav-panel-add form.disabled, - &.nav-panel-add form.disabled input { + &.nav-panel-add.disabled, + &.nav-panel-add.disabled input { background-color: whitesmoke; } } .nav-form-button { - padding: 0 1rem; + padding: 0; background-color: transparent; border: none; @@ -127,6 +118,11 @@ nav .nav-wrapper i { } } +.nav-form-button, +.nav-panel-item .close { + margin: 0 1%; +} + #button_filters { display: none; } diff --git a/app/Resources/static/themes/material/index.js b/app/Resources/static/themes/material/index.js index 36505d71..bdccc534 100755 --- a/app/Resources/static/themes/material/index.js +++ b/app/Resources/static/themes/material/index.js @@ -42,24 +42,20 @@ $(document).ready(() => { return false; }); $('#nav-btn-add').on('click', () => { - $('.nav-panel-buttom').hide(100); + $('.nav-panel-actions').hide(100); $('.nav-panel-add').show(100); - $('.nav-panels .action').hide(100); - $('.nav-panel-menu').addClass('hidden'); $('.nav-panels').css('background', 'white'); $('#entry_url').focus(); return false; }); - const materialAddForm = $('.nav-panel-add form[name=entry]'); + const materialAddForm = $('.nav-panel-add'); materialAddForm.on('submit', () => { materialAddForm.addClass('disabled'); $('input#entry_url', materialAddForm).prop('readonly', true).trigger('blur'); }); $('#nav-btn-search').on('click', () => { - $('.nav-panel-buttom').hide(100); + $('.nav-panel-actions').hide(100); $('.nav-panel-search').show(100); - $('.nav-panels .action').hide(100); - $('.nav-panel-menu').addClass('hidden'); $('.nav-panels').css('background', 'white'); $('#search_entry_term').focus(); return false; @@ -67,9 +63,7 @@ $(document).ready(() => { $('.close').on('click', () => { $('.nav-panel-add').hide(100); $('.nav-panel-search').hide(100); - $('.nav-panel-buttom').show(100); - $('.nav-panels .action').show(100); - $('.nav-panel-menu').removeClass('hidden'); + $('.nav-panel-actions').show(100); $('.nav-panels').css('background', 'transparent'); return false; }); -- cgit v1.2.3 From 91f5992423bb69d518f9f4ed17cab36a765fcd13 Mon Sep 17 00:00:00 2001 From: Simounet Date: Thu, 28 Dec 2017 23:27:45 +0100 Subject: Close add entry and search nav JS action improved --- app/Resources/static/themes/material/index.js | 22 +++++++++++----------- 1 file changed, 11 insertions(+), 11 deletions(-) (limited to 'app/Resources') diff --git a/app/Resources/static/themes/material/index.js b/app/Resources/static/themes/material/index.js index bdccc534..96310d81 100755 --- a/app/Resources/static/themes/material/index.js +++ b/app/Resources/static/themes/material/index.js @@ -35,6 +35,13 @@ $(document).ready(() => { initFilters(); initExport(); + const toggleNav = (toShow, toFocus) => { + $('.nav-panel-actions').hide(100); + $(toShow).show(100); + $('.nav-panels').css('background', 'white'); + $(toFocus).focus(); + }; + $('#nav-btn-add-tag').on('click', () => { $('.nav-panel-add-tag').toggle(100); $('.nav-panel-menu').addClass('hidden'); @@ -42,10 +49,7 @@ $(document).ready(() => { return false; }); $('#nav-btn-add').on('click', () => { - $('.nav-panel-actions').hide(100); - $('.nav-panel-add').show(100); - $('.nav-panels').css('background', 'white'); - $('#entry_url').focus(); + toggleNav('.nav-panel-add', '#entry_url'); return false; }); const materialAddForm = $('.nav-panel-add'); @@ -54,15 +58,11 @@ $(document).ready(() => { $('input#entry_url', materialAddForm).prop('readonly', true).trigger('blur'); }); $('#nav-btn-search').on('click', () => { - $('.nav-panel-actions').hide(100); - $('.nav-panel-search').show(100); - $('.nav-panels').css('background', 'white'); - $('#search_entry_term').focus(); + toggleNav('.nav-panel-search', '#search_entry_term'); return false; }); - $('.close').on('click', () => { - $('.nav-panel-add').hide(100); - $('.nav-panel-search').hide(100); + $('.close').on('click', (e) => { + $(e.target).parent('.nav-panel-item').hide(100); $('.nav-panel-actions').show(100); $('.nav-panels').css('background', 'transparent'); return false; -- cgit v1.2.3