From 8b967d776ba780cb8b29e3de4ddec4ae4f88ccf4 Mon Sep 17 00:00:00 2001 From: =?utf8?q?Sven=20Sch=C3=B6ling?= Date: Thu, 14 Jul 2016 14:56:29 +0200 Subject: [PATCH] Reapply "Partpicker styling" MIME-Version: 1.0 Content-Type: text/plain; charset=utf8 Content-Transfer-Encoding: 8bit 3.4.1 ist durch, also wieder rein, auf dass es bis zum nächsten Release gefixt wird. --- css/kivitendo/main.css | 20 ++++++++++- css/lx-office-erp/main.css | 38 ++++++++++++++++++++- image/search.svg | 6 ++++ js/autocomplete_part.js | 8 ++--- templates/webpages/part/test_page.html | 47 ++++++++++++++++++++++++-- 5 files changed, 109 insertions(+), 10 deletions(-) create mode 100644 image/search.svg diff --git a/css/kivitendo/main.css b/css/kivitendo/main.css index fc6b38fd9..06afe14af 100644 --- a/css/kivitendo/main.css +++ b/css/kivitendo/main.css @@ -392,7 +392,6 @@ label { } .part_picker { - padding-right: 16px; } .chart_picker { padding-right: 16px; @@ -430,6 +429,25 @@ div.ppp_block { float:left; width: 350px; } +span.ppp_popup_button { + position: absolute; + margin-left: -24px; + margin-top: 5px; + width: 20px; + height: 20px; + cursor: pointer; + background: url("../../image/search.svg") no-repeat center right; + background-size: contain; +} +span.part_picker input { + padding-right: 20px; + box-sizing: padding-box; + -moz-box-sizing: padding-box; + -webkit-box-sizing: padding-box; +} +span.part_picker { + white-space: nowrap; +} /* div.cpc_block { */ /* overflow:hidden; */ /* float:left; */ diff --git a/css/lx-office-erp/main.css b/css/lx-office-erp/main.css index 2b539fac8..db288deef 100644 --- a/css/lx-office-erp/main.css +++ b/css/lx-office-erp/main.css @@ -25,6 +25,8 @@ input, textarea, select { select { -moz-appearance: none; + -webkit-appearance: none; + -o-appearance: none; appearance : none; background: white url('../../image/select-down.png') no-repeat scroll right center; padding: 0 14px 0 0; @@ -389,7 +391,6 @@ label { } .part_picker { - padding-right: 16px; } .chart_picker { padding-right: 16px; @@ -425,6 +426,40 @@ div.ppp_block { float:left; width: 350px; } +span.ppp_popup_button { + display: inline-block; + position: relative; + margin-left: -18px; + margin-top: 3px; + height: 16px; + width: 16px; + cursor: pointer; +} + +td span.ppp_popup_button, +th span.ppp_popup_button { + height: 9px; + width: 9px; + margin-left: -13px; +} +span.part_picker input { + padding-right: 20px; + background: white url("../../image/search.svg") no-repeat center right; + background-size: contain; + box-sizing: padding-box; + -moz-box-sizing: padding-box; + -webkit-box-sizing: padding-box; +} + +td span.part_picker input, +th span.part_picker input { + padding-right: 15px; +} + +span.part_picker { + /* white-space: nowrap;*/ +} + div.ppp_block span.ppp_block_number, div.cpc_block span.cpc_block_number { @@ -481,3 +516,4 @@ a.red { background-color:#FF0000; border:none; } + diff --git a/image/search.svg b/image/search.svg new file mode 100644 index 000000000..4858934cc --- /dev/null +++ b/image/search.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/js/autocomplete_part.js b/js/autocomplete_part.js index 0366ed270..cc9354ac3 100644 --- a/js/autocomplete_part.js +++ b/js/autocomplete_part.js @@ -237,11 +237,9 @@ namespace('kivi', function(k){ }); // now add a picker div after the original input - var pcont = $('').addClass('position-absolute'); - var picker = $('
'); - $dummy.after(pcont); - pcont.append(picker); - picker.addClass('icon16 search').click(open_dialog); + var popup_button = $('').addClass('ppp_popup_button'); + $dummy.after(popup_button); + popup_button.click(open_dialog); var pp = { real: function() { return $real }, diff --git a/templates/webpages/part/test_page.html b/templates/webpages/part/test_page.html index 33bea4e35..38cd2fa4f 100644 --- a/templates/webpages/part/test_page.html +++ b/templates/webpages/part/test_page.html @@ -1,6 +1,6 @@ [% USE L %] -

Waren Picker Testpage

+

Part Picker Testpage


Alle:
@@ -11,10 +11,51 @@ Nur Dienstleistungen:
[% L.part_picker('part_id3', undef, type='service') %]
Waren und Dienstleistungen:
[% L.part_picker('part_id4', undef, type='part,service') %]
- Pre-filled:
-[% L.part_picker('part_id', pre_filled_part) %]
+[% L.part_picker('part_id5', pre_filled_part) %]
+ +

Styling

+ +Ina span: +Leading text: [% L.part_picker('p1', undef, type='part,service') %] and text after with spacing
+Leading text:[% L.part_picker('p2', undef, type='part,service') %]and text after without spacing
+
Leading text: [% L.part_picker('p3', undef, type='part,service') %] and text after with spacing with div

+
Leading text:[% L.part_picker('p4', undef, type='part,service') %]and text after with spacing with div

+ +Picker + input next to each other: [% L.part_picker('p5', undef, type='part,service', width="100%") %] + +
[% L.part_picker('p6', undef, type='part,service', style="width:500px") %] 500px width
+
[% L.part_picker('p7', undef, type='part,service', style="width:200px") %] 200px width
+
[% L.part_picker('p8', undef, type='part,service', style="height:40px") %] 40px height
[%# FOREACH i IN 1..50 %] [%# L.part_picker('part_id_' _ i) %]
[%# END %] + +

In tables

+ +

No classes:

+ + + + + + + + + + +
Part picker in table heading[% L.part_picker('p9', undef, type='part,service') %]
Part picker in table cell[% L.part_picker('p10', undef, type='part,service') %]
+ +

With classes:

+ + + + + + + + + + +
Part picker in table heading[% L.part_picker('p11', undef, type='part,service') %]
Part picker in table cell[% L.part_picker('p12', undef, type='part,service') %]
-- 2.20.1