itsdave/msp
2
0
Fork 0
mirror of https://github.com/itsdave-de/msp.git synced 2025-05-06 15:35:12 +02:00
Code Issues Actions Packages Projects Releases Wiki Activity

#15 | Improve loader UI for better UX

Browse Source
This commit is contained in:
Jordi Albert 2022-07-20 09:27:54 +02:00
parent 3bcd65c052
commit f717150c8a
1 changed files with 13 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
msp/msp/doctype/it_object/it_object.js
View File

@ -14,7 +14,8 @@ frappe.ui.form.on('IT Object', {
--uib-line-weight: 5px; --uib-line-weight: 5px;
position: relative; position: relative;
margin: 6rem auto; margin: 0 auto;
top: 45%;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@ -59,6 +60,17 @@ frappe.ui.form.on('IT Object', {
`; `;
const container = document.getElementById('oitc-output'); const container = document.getElementById('oitc-output');
// Set width and height to <div> parent element and to <form> grandparent element so relative width and height with % works greate
container.parentElement.parentElement.style.width = '100%';
container.parentElement.parentElement.style.height = '100%';
container.parentElement.style.width = '100%';
container.parentElement.style.height = '90%';
// Set this styles to showcase where the information will appear
container.style.width = '100%';
container.style.height = '100%';
container.style.background = 'rgba(212, 204, 203, 0.4)';
container.innerHTML = loader; container.innerHTML = loader;
frm.call('get_oitc_host_status_data', {}) frm.call('get_oitc_host_status_data', {})