cancel
Showing results for 
Search instead for 
Did you mean: 
cancel
Showing results for 
Search instead for 
Did you mean: 

Community Tip - You can Bookmark boards, posts or articles that you'd like to access again easily! X

Unable to increase size of checkbox

krishnakomal123
14-Alexandrite

Unable to increase size of checkbox

Thingworx 8.5.2 :

 

I have increased width and height of checkbox widget but couldn't increase it's size more than default size.Could you help me.

1 ACCEPTED SOLUTION

Accepted Solutions

@krishnakomal123 ,

Is this the type of change you would like to be able to accomplish?

PEHOWE_0-1592404645279.png

I used the Visual SDK and added Custom CSS to the mashup:

#root_ptcscheckbox-13.widget-ptcscheckbox::part(box){
    	width: 28px;
    	height: 28px;
	}
#root_ptcscheckbox-13.widget-ptcscheckbox::part(check-mark) {
    	width: 28px;
    	height: 28px;
}

#root_ptcscheckbox-14.widget-ptcscheckbox::part(box){
    	width: 56px;
    	height: 56px;
	}
#root_ptcscheckbox-14.widget-ptcscheckbox::part(check-mark) {
    	width: 56px;
    	height: 56px;
}

In my test case the IDs of the second and third check box are "ptcscheckbox-13" and "ptcscheckbox-14". I included a second CSS to increase the size of the check to match the box. If you wanted the modification applied to all the checkbox's you would not need the "#" and the item ID.

 

HTH

Peter

View solution in original post

1 REPLY 1

@krishnakomal123 ,

Is this the type of change you would like to be able to accomplish?

PEHOWE_0-1592404645279.png

I used the Visual SDK and added Custom CSS to the mashup:

#root_ptcscheckbox-13.widget-ptcscheckbox::part(box){
    	width: 28px;
    	height: 28px;
	}
#root_ptcscheckbox-13.widget-ptcscheckbox::part(check-mark) {
    	width: 28px;
    	height: 28px;
}

#root_ptcscheckbox-14.widget-ptcscheckbox::part(box){
    	width: 56px;
    	height: 56px;
	}
#root_ptcscheckbox-14.widget-ptcscheckbox::part(check-mark) {
    	width: 56px;
    	height: 56px;
}

In my test case the IDs of the second and third check box are "ptcscheckbox-13" and "ptcscheckbox-14". I included a second CSS to increase the size of the check to match the box. If you wanted the modification applied to all the checkbox's you would not need the "#" and the item ID.

 

HTH

Peter

Top Tags