Large Checkboxes with Classic Theme

Questions
21

Can yall post some XML of a broken page here for me? I haven’t seen any large checkboxes yet in Millau.

22

Stephen,

Here is what I am seeing in my developer org when viewed through Chrome.

Here is the page xml:

<skuidpage unsavedchangeswarning="yes" personalizationmode="server" useviewportmeta="true" showsidebar="true" showheader="true" tabtooverride="Contact">
<models>
    <model id="Contact" limit="1" query="true" createrowifnonefound="false" datasource="salesforce" sobject="Contact" type="">
        <fields>
            <field id="FirstName"></field>
            <field id="LastName"></field>
            <field id="IsEmailBounced"></field>
        </fields>
        <conditions>
            <condition type="param" enclosevalueinquotes="true" operator="=" field="Id" value="id"></condition>
        </conditions>
        <actions></actions>
    </model>
</models>
<components>
    <pagetitle model="Contact" uniqueid="sk-2TMVdh-203">
        <maintitle>
            <template>{{FirstName}} {{LastName}}</template>
        </maintitle>
        <subtitle>
            <template>{{Model.label}}</template>
        </subtitle>
        <actions>
            <action type="delete" uniqueid="sk-2TMVdX-192"></action>
            <action type="clone" uniqueid="sk-2TMVda-195"></action>
            <action type="share" uniqueid="sk-2TMVdc-198"></action>
            <action type="savecancel" window="self" uniqueid="sk-2TMVdf-201"></action>
        </actions>
    </pagetitle>
    <basicfieldeditor showsavecancel="false" showheader="true" model="Contact" mode="read" uniqueid="sk-2TMVe6-222">
        <columns>
            <column width="50%">
                <sections>
                    <section title="Basics" collapsible="no">
                        <fields>
                            <field id="FirstName" uniqueid="sk-2TMVds-211"></field>
                            <field id="LastName" uniqueid="sk-2TMVdt-214"></field>
                        </fields>
                    </section>
                </sections>
            </column>
            <column width="50%">
                <sections>
                    <section title="Checkbox" collapsible="no">
                        <fields>
                            <field uniqueid="sk-2TMnAY-324" id="IsEmailBounced"></field>
                        </fields>
                    </section>
                </sections>
            </column>
        </columns>
    </basicfieldeditor>
</components>
<resources>
    <labels></labels>
    <css></css>
    <javascript></javascript>
    <actionsequences uniqueid="sk-2TMcTN-256"></actionsequences>
</resources>
<styles>
    <styleitem type="background" bgtype="none"></styleitem>
</styles>

Thanks!

Bill

23

Have you been able to replicate the big size?

24

We are still seeing it. Here it is in Chrome on the Skuid “Theme” tab (version 10.0.9.) To solve this across my org, I put some inline css on my custom theme so we didn’t have to worry about the large checkboxes coming back.

/* fixes checkbox sizing - avoids the oversized checkbox in some browsers*/
.nx-field input, .nx-field textarea, .nx-field .flex-text-wrap pre, .nx-field .nx-richtext-input {
min-height:1em;
}

25

That did the trick.  Thank you, Chandra! You are a great resource. I appreciate you!

26

Large checkboxes are back, I’m seeing it in Chrome and Firefox.  On Skuid 11.2.6.  Unfortunately my css workaround above is no longer working.

Can we get a new workaround while waiting on a fix?

EDIT to add: I’m now using  Lightning based theme.


27

Hi Chandra,

Similar to the existing workaround you mentioned earlier in this conversation, here’s a CSS rule you can try:

.nx-field input, .nx-field textarea, .nx-field .flex-text-wrap pre, .nx-field .nx-richtext-input {
    min-height: 1em !important;
    max-height: 1.2em !important;
}

It looks like this issue is slightly different underneath the hood, since before, a max-height wasn’t necessary. I will surface this with our product team for further investigation. 

28

Tried to use this, but the max-height made all our text input fields get super small, and our users could not see the text they were typing in to the field.

29

Mark - any thing else here we can try. The above workaround caused the other issues described. So we are left with still having large check boxes.