Reducing the font size in dropdowns,checkboxes,textfield

[Raga Mounika]

Hi,

I have created some dropdowns,checkboxes,textfields. To differentiate there attributes from actual content I need to reduce the size of content in dropdown, textfield, checkboxes. But the font here is inherited from parent element. So please help me in reducing the font size for these.

Thanks

Best Regards,
Mounika

[alex_jitianu]

Hi Mounika,

Since these form controls are added on a "before" element, you can use fontInherit as this:
p:before {
font-size:0.6em;
content: oxy_textfield(...., fontInherit, true)
}

Best regards,
Alex

[Raga Mounika]

Hi Alex,

Thanks for the reply, it works

Consider the example of note element.I am having generated text as "Note:". The code you provided should not impact the generated text and should be applicable for content in dropdown only.Please help me with this as well.

Please go through the code which I used:

Code: Select all

*[class~="topic/note"]:before {

 content:" Note: ";

  font-weight: bold;

 }

 note:not(*[conkeyref]){

font-size:0.7em;

   content :

   oxy_combobox(edit , "@type" , editable , false , values , ", ,other,tip" , columns , 7,fontInherit,false) ; 

  }

  

  /* When other is selected from dropdown we are getting an another dropdown showing do,stop( where DO, Stop are also generated texts) */

  note[type="other"]{

font-size:0.7em;

   content : oxy_combobox(edit , "@othertype" , editable , false , values , ", Do, Stop" , columns , 7,fontInherit,true) ; 

     }

Thank you!

Regards,
Mounika

[alex_jitianu]

Hi Mounika,

You can use multiple pseudo elements:

Code: Select all

*[class ~= "topic/note"]:before(10){

    content: " Note: ";

    font-weight: bold;

}

note:not(*[conkeyref]):before(5) {

    font-size: 0.7em;

    content: oxy_combobox(edit, "@type", editable, false, values, ", ,other,tip", columns, 7, fontInherit, true);

}



/* When other is selected from dropdown we are getting an another dropdown showing do,stop( where DO, Stop are also generated texts) */

note[type = "other"]:before(5){

    font-size: 0.7em;

    content: oxy_combobox(edit, "@othertype", editable, false, values, ", Do, Stop", columns, 7, fontInherit, true);

}

Best regards,
Alex

[Raga Mounika]

Hi Alex,

Thanks for the code...That really works

Regards,
Mounika

[Raga Mounika]

Hi Alex,

I need one more clarification from you.
Is there any possibility to reduce the size of checkbox without impacting the checkbox label?
Similarly to reduce dropdown size also.

Regards
Mounika

[alex_jitianu]

Hi Mounika,

Let's say you have something like this:

Code: Select all

p:before {

  content: "My Label" oxy_combo(....)

}

If you want to reduce the size of the combo but keep "My Label" at a bigger size, you can do this:

Code: Select all

p:before {

  font-size:12px;

  content: oxy_label(text, "My Label", styles, "font-size:20px") oxy_combo(...., fontInherit, true)

}

I hope I understood what you want...

Best regards,
Alex