Skip to content

E
ecommerce-ui
Commit 511afdb1 authored by Sven Franck's avatar Sven Franck
Browse files
Options

switched gadget-attributes and classes to page layout API

parent 0fb2e0e8
Show whitespace changes
Inline Side-by-side
Showing with 43 additions and 42 deletions
account.html
View file @ 511afdb1
...@@ -20,9 +20,9 @@ ...@@ -20,9 +20,9 @@
<div id="account" data-role="page" data-theme="slapos-white"> <div id="account" data-role="page" data-theme="slapos-white">
<div class="ui-content"> <div class="ui-content">
<div class="content_element"></div> <div class="span_1"></div>
<div class="content_element"> <div class="span_1">
<div class="erp5_gadget" data-gadget="actionMenu" data-gadget-id="account_actions"> <div class="gadget" data-gadget-type="actionMenu" data-gadget-id="account_actions">
<!-- action menu --> <!-- action menu -->
</div> </div>
</div> </div>
......
css/themes.css
View file @ 511afdb1
...@@ -877,16 +877,9 @@ html head + body .ui-body-slapos-black.ui-focus{ ...@@ -877,16 +877,9 @@ html head + body .ui-body-slapos-black.ui-focus{
right: 0.25em; right: 0.25em;
} }
} }
/* content grid */
.popup_element { /* ============================= content grid ============================= */
padding-top: .75em; .span_1, .span_2 {
padding-left: .75em;
padding-right: .75em;
}
.popup_element p {
margin-bottom: 0.15em;
}
.content_element {
display: inline-block; display: inline-block;
vertical-align: top; vertical-align: top;
width: 45%; width: 45%;
...@@ -895,27 +888,32 @@ html head + body .ui-body-slapos-black.ui-focus{ ...@@ -895,27 +888,32 @@ html head + body .ui-body-slapos-black.ui-focus{
/* ~ 98% for 2 col layout */ /* ~ 98% for 2 col layout */
padding-top: 2%; padding-top: 2%;
} }
.content_element_fullscreen { .span_2 {
width: 96% /* 2% padding-left/right */ width: 96% /* 2% padding-left/right */
} }
/* is this padding really necessary? */ /* is this padding really necessary? */
.content_element .ui-controlgroup-vertical, .span_1 .ui-controlgroup-vertical,
.content_element .ui-controlgroup-horizontal, .span_2 .ui-controlgroup-vertical,
.content_element form { .span_1 .ui-controlgroup-horizontal,
.span_2 .ui-controlgroup-horizontal,
.span_1 form,
.span_2 form {
margin-top: 1em; margin-top: 1em;
margin-bottom: 1em; margin-bottom: 1em;
vertical-align: middle; vertical-align: middle;
} }
@media (max-width: 40em) { @media (max-width: 40em) {
.content_element { .span_1, .span_2 {
width: 100%; width: 100%;
padding: 0; padding: 0;
} }
} }
.content_element .ui-input-search { .span_1 .ui-input-search,
.span_2 .ui-input-search {
width: 50%; width: 50%;
} }
.content_element .ui-table-wrapper .ui-input-search { .span_1 .ui-table-wrapper .ui-input-search,
.span_2 .ui-table-wrapper .ui-input-search{
width: auto; width: auto;
margin: 0; margin: 0;
box-shadow: none; box-shadow: none;
...@@ -924,12 +922,14 @@ html head + body .ui-body-slapos-black.ui-focus{ ...@@ -924,12 +922,14 @@ html head + body .ui-body-slapos-black.ui-focus{
border-bottom-width: 1px; border-bottom-width: 1px;
} }
@media (max-width: 45em) { @media (max-width: 45em) {
.content_element .ui-input-search { .span_1 .ui-input-search,
.span_2 .ui-input-search {
width: 100%; width: 100%;
} }
} }
@media (min-width: 45em) { @media (min-width: 45em) {
.content_element .ui-input-search { .span_1 .ui-input-search,
.span_2 .ui-input-search {
width: 60%; width: 60%;
} }
} }
......
invoices.html
View file @ 511afdb1
...@@ -20,8 +20,8 @@ ...@@ -20,8 +20,8 @@
<div id="invoices" data-role="page" data-theme="slapos-white"> <div id="invoices" data-role="page" data-theme="slapos-white">
<div class="ui-content"> <div class="ui-content">
<div class="content_element content_element_fullscreen"> <div class="span_2">
<table class="erp5_gadget" data-gadget="listbox" data-gadget-id="invoices_01"> <table class="gadget" data-gadget-type="listbox" data-gadget-id="invoices_01">
<!-- dynamic --> <!-- dynamic -->
</table> </table>
</div> </div>
......
js/erp5_loader.js
View file @ 511afdb1
...@@ -218,6 +218,7 @@ ...@@ -218,6 +218,7 @@
* @param {boolean} update Update or create gadget * @param {boolean} update Update or create gadget
* @returns {objects} fragment * @returns {objects} fragment
*/ */
// TODO: parameters are not good, modify into something more generic!
constructListbox: function (config, answer, fields, query, total, update) { constructListbox: function (config, answer, fields, query, total, update) {
var fragment, bar, wrap, arr, local_popup, global_popup, set, id; var fragment, bar, wrap, arr, local_popup, global_popup, set, id;
...@@ -2656,7 +2657,7 @@ ...@@ -2656,7 +2657,7 @@
// fetch gadgets // fetch gadgets
// WARNING: slow & IE8 compliant? // WARNING: slow & IE8 compliant?
gadgets = active.querySelectorAll("[data-gadget]"); gadgets = active.querySelectorAll("[data-gadget-type]");
// load gadgets // load gadgets
for (i = 0; i < gadgets.length; i += 1) { for (i = 0; i < gadgets.length; i += 1) {
...@@ -2664,7 +2665,7 @@ ...@@ -2664,7 +2665,7 @@
parent = gadget.parentNode; parent = gadget.parentNode;
gadget_id = gadget.getAttribute("data-gadget-id"); gadget_id = gadget.getAttribute("data-gadget-id");
method = "construct" + util.capFirstLetter( method = "construct" + util.capFirstLetter(
gadget.getAttribute("data-gadget") gadget.getAttribute("data-gadget-type")
); );
// TODO: merge with updatePageElement // TODO: merge with updatePageElement
...@@ -2733,7 +2734,7 @@ ...@@ -2733,7 +2734,7 @@
active.getElementsByTagName("div")[0].appendChild( active.getElementsByTagName("div")[0].appendChild(
util.generateErrorMessage( util.generateErrorMessage(
"Error: Could not generate gadget " + "Error: Could not generate gadget " +
gadget.getAttribute("data-gadget") + ".", "" gadget.getAttribute("data-gadget-id") + ".", ""
) )
); );
}); });
......
networks.html
View file @ 511afdb1
...@@ -20,15 +20,15 @@ ...@@ -20,15 +20,15 @@
<div id="networks" data-role="page" data-theme="slapos-white"> <div id="networks" data-role="page" data-theme="slapos-white">
<div class="ui-content"> <div class="ui-content">
<div class="content_element"></div> <div class="span_1"></div>
<div class="content_element"> <div class="span_1">
<div class="erp5_gadget" data-gadget="actionMenu" data-gadget-id="network_actions"> <div class="gadget" data-gadget-type="actionMenu" data-gadget-id="network_actions">
<!-- action menu --> <!-- action menu -->
</div> </div>
</div> </div>
<hr> <hr>
<div class="content_element content_element_fullscreen"> <div class="span_2">
<table class="erp5_gadget" data-gadget="listbox" data-gadget-id="networks_01"> <table class="gadget" data-gadget-type="listbox" data-gadget-id="networks_01">
<!-- dynamic --> <!-- dynamic -->
</table> </table>
</div> </div>
......
servers.html
View file @ 511afdb1
...@@ -20,15 +20,15 @@ ...@@ -20,15 +20,15 @@
<div id="servers" data-role="page" data-theme="slapos-white"> <div id="servers" data-role="page" data-theme="slapos-white">
<div class="ui-content"> <div class="ui-content">
<div class="content_element"></div> <div class="span_1"></div>
<div class="content_element"> <div class="span_1">
<div class="erp5_gadget" data-gadget="actionMenu" data-gadget-id="computer_actions"> <div class="gadget" data-gadget-type="actionMenu" data-gadget-id="computer_actions">
<!-- action menu --> <!-- action menu -->
</div> </div>
</div> </div>
<hr> <hr>
<div class="content_element content_element_fullscreen"> <div class="span_2">
<table class="erp5_gadget" data-gadget="listbox" data-gadget-id="computer_01"> <table class="gadget" data-gadget-type="listbox" data-gadget-id="computer_01">
<!-- dynamic --> <!-- dynamic -->
</table> </table>
</div> </div>
......
services.html
View file @ 511afdb1
...@@ -20,15 +20,15 @@ ...@@ -20,15 +20,15 @@
<div id="services" data-role="page" data-theme="slapos-white"> <div id="services" data-role="page" data-theme="slapos-white">
<div class="ui-content"> <div class="ui-content">
<div class="content_element"></div> <div class="span_1"></div>
<div class="content_element"> <div class="span_1">
<div class="erp5_gadget" data-gadget="actionMenu" data-gadget-id="service_actions"> <div class="gadget" data-gadget-type="actionMenu" data-gadget-id="service_actions">
<!-- action menu --> <!-- action menu -->
</div> </div>
</div> </div>
<hr> <hr>
<div class="content_element content_element_fullscreen"> <div class="span_2">
<table class="erp5_gadget" data-gadget="listbox" data-gadget-id="services_01"> <table class="erp5_gadget" data-gadget-type="listbox" data-gadget-id="services_01">
<!-- dynamic --> <!-- dynamic -->
</table> </table>
</div> </div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7