Label/data alignment for readonly field

This sub-forum is for discussing all topics related to AppGini Helper JavaScript Library, provided by bizzworxx as a third-party AppGini plugin.
Post Reply
pfrumkin
Veteran Member
Posts: 157
Joined: 2020-02-18 17:58
Location: Albuquerque, New Mexico USA

Label/data alignment for readonly field

Post by pfrumkin » 2021-03-20 13:31

Hi Jan, All,

I am using the multi-column output, as

Code: Select all

$j(function() {
	var dv = new AppGiniDetailView();

	var rowAuction = dv.addLayout([6, 6], "Auction Information", false)
		.add(1, ["Auction", "Vehicle", "Sale_Status", "Buyer", "Bidder_Number"])
		.add(2, ["Lot_Num", "Status" ])
		;

	$j(".form-control-static").css("padding", 0);  // align label with data
})
Fields in column 1 on the left are dropdown, fields on the right are readonly values. As you describe on https://appgini.bizzworxx.de/products/j ... -layout/2/ there is a UI flaw with the alignment. I applied the style tweak but perhaps that does not work for readonly(?).

ReadonlyAlign.png
ReadonlyAlign.png (5.76 KiB) Viewed 1208 times
Any ideas?

Thanks.

~Paul
AG v5.84

User avatar
jsetzer
AppGini Super Hero
AppGini Super Hero
Posts: 1807
Joined: 2018-07-06 06:03
Location: Kiel, Germany
Contact:

Re: Label/data alignment for readonly field

Post by jsetzer » 2021-03-20 14:08

I suggest you should inspect the controls in the right column and check margin and padding css settings. This depends on the selected theme.

Then adjust padding and margin in a <style> section for example in header-extras.php
Kind regards,
<js />

My AppGini Blog:
https://appgini.bizzworxx.de/blog

You can help us helping you:
Please always put code fragments inside [code]...[/code] blocks for better readability

AppGini 24.10 Revision 1579 + all AppGini Helper tools

pfrumkin
Veteran Member
Posts: 157
Joined: 2020-02-18 17:58
Location: Albuquerque, New Mexico USA

Re: Label/data alignment for readonly field

Post by pfrumkin » 2021-03-21 16:01

Thanks Jan. Actually removing the line

$j(".form-control-static").css("padding", 0); // align label with data

made it look respectable.

~Paul

Post Reply