Page 1 of 1
[Added] ContentBox Object
Posted: Fri Jul 23, 2021 8:18 am
by admin
Group related information into logical blocks or sets. Grouping together related fields will also help users make sense of the information they must fill in.
The new
ContentBox makes it easy to add a visual and semantic grouping for form controls.
Demo at
https://demo.nubuilder.cloud/
Compare the ungrouped data:
ContentBox.png
... with a form using ContentBox
ContentBox_2.png
Adding a ContentBox:
object_contentbox.png
Re: [Added] ContentBox Object
Posted: Sat Jul 24, 2021 1:47 am
by admin
"Arrange Objects" now also shows the ContentBox "frame"
Re: [Added] ContentBox Object
Posted: Sat Jul 24, 2021 1:58 am
by admin
By modifying and adding these 3 classes in the Header Tab of Setup, you can customise the look of the ContentBox.
Code: Select all
.nuContentBox .content {
height:inherit;
padding:10px;
font-size:15px;
border-bottom-left-radius:7px;
border-bottom-right-radius:7px;
border:1px solid #dddddd;
background-color:#fff
}
.nuContentBox .title {
height:4px;
line-height:4px;
border-top-left-radius:7px;
border-top-right-radius:7px;
color:#333;
font-size:14px;
font-weight:700;
font-family:sans-serif,"Segoe UI",Helvetica,"Helvetica Neue",Arial,sans-serif;
display:block;
padding:9px;
letter-spacing:1px
}
.nuContentBox {
z-index:-1;
position:absolute;
height:90px
}
Example, colors changed:
custom_color.png
Update: Styling has become even easier:
https://forums.nubuilder.cloud/viewtopic.php?f=31&t=11294