Go to main content

Textpattern CMS support forum

You are not logged in. Register | Login | Help

#1 2016-03-07 01:10:39

phiw13
Plugin Author
From: Japan
Registered: 2004-02-27
Posts: 3,058
Website

plugins adding a row on edit panels

These row display poorly (out of alignment) compared to the core generated ones.
The core generated rows have a .txp-form-field class in addition to a row specific class, whereas the plugin-rows miss the first one.

example plugins: rah_sitemap (on the category and section edit panels), wet_native (on the users edit panel)

screenshot:
The select widget should be on the same line as the label, compare to the previous row ( role /publisher)

I think the problem is the inputLabel function, more specifically $fallback_class.

I modified that (adding txp-form-field):

-  $fallback_class = 'edit-'.str_replace('_', '-', $name);
+  $fallback_class = 'txp-form-field edit-'.str_replace('_', '-', $name);

That seems to do the trick. But note, it doesn’t help in case a plugin inserts a textarea – core rows add an extra txp-form-field-textarea class (example: rah_sitemap does that on the preferences panel).

There may be more to it that I missed though…


Where is that emoji for a solar powered submarine when you need it ?
Sand space – admin theme for Textpattern

Offline

#2 2016-03-07 10:55:57

Bloke
Developer
From: Leeds, UK
Registered: 2006-01-29
Posts: 11,250
Website GitHub

Re: plugins adding a row on edit panels

phiw13 wrote #298173:

I think the problem is the inputLabel function, more specifically $fallback_class.

Good sleuthing and an interesting solution, but I don’t know about this offhand. Would have to look into it further due to inputLabel being widely used throughout core and plugins. Don’t want to impose too much, but as this is only a fallback class there’s scope to do so, since any calls that don’t want it can override it. Plus it gives plugin authors less to deal with at transition time.

The question probably comes down to if people/the core end up overriding it more times than they use the default fallback. Will investigate, thanks.


The smd plugin menagerie — for when you need one more gribble of power from Textpattern. Bleeding-edge code available on GitHub.

Txp Builders – finely-crafted code, design and Txp

Offline

#3 2016-03-08 00:37:48

phiw13
Plugin Author
From: Japan
Registered: 2004-02-27
Posts: 3,058
Website

Re: plugins adding a row on edit panels

Bloke wrote #298177:

Good sleuthing …

:-)

The question probably comes down to if people/the core end up overriding it more times than they use the default fallback. Will investigate, thanks.

Afaict —and as I said, I may have missed something— Core always set the classes it needs. I did test that potential fix, going through all panels to see if something unexpected happened. Everything displayed as it should. Plugins of course is another matter, but from what I’ve been able to test (limited, unfortunately), it shouldn’t be a cause for concern, it is a fallback class after all.

I’ll add an issue on Github I’ve added an issue on Github.

For the time being, I can patch up that layout issue in my stylesheet.

Updated to add link to Github issue

Last edited by phiw13 (2016-03-08 01:49:09)


Where is that emoji for a solar powered submarine when you need it ?
Sand space – admin theme for Textpattern

Offline

#4 2016-03-08 10:38:54

philwareham
Core designer
From: Haslemere, Surrey, UK
Registered: 2009-06-11
Posts: 3,564
Website GitHub Mastodon

Re: plugins adding a row on edit panels

I think this indeed should be done. The expected layout pattern for all forms field from now on is:

<div class="txp-form-field example-1">
    <div class="txp-form-field-label"><label for="example_1">Long text</label></div>
    <div class="txp-form-field-value"><input id="example_1" name="example_1" type="text" size="32"></div>
</div>
<div class="txp-form-field example-2">
    <div class="txp-form-field-label"><label for="example_2">Medium text</label></div>
    <div class="txp-form-field-value"><input class="input-medium" id="example_2" name="example_2" type="text" size="8"></div>
</div>
<div class="txp-form-field example-3">
    <div class="txp-form-field-label"><label for="example_3">Select</label></div>
    <div class="txp-form-field-value">
        <select id="example_3" name="example_3">
            <option value="" selected="selected"> </option>
            <option value="option1">Option 1</option>
            <option value="option2">Option 2</option>
        </select>
    </div>
</div>
<div class="txp-form-field example-4">
    <div class="txp-form-field-label">Radio buttons</div>
    <div class="txp-form-field-value">
        <input class="radio active" id="example_4_0" name="example_4" type="radio" value="0" checked="checked">
        <label for="example_4_0">No</label>
        <input class="radio" id="example_4_1" name="example_4" type="radio" value="1">
        <label for="example_4_1">Yes</label>
    </div>
</div>
<div class="txp-form-field txp-form-field-textarea example-5">
    <div class="txp-form-field-label"><label for="example_5">Textarea</label></div>
    <div class="txp-form-field-value"><textarea id="example_5" name="example_5" cols="64" rows="4"></textarea></div>
</div>
...etc...

See design patterns documentation here.

Offline

#5 2016-03-08 11:01:16

Bloke
Developer
From: Leeds, UK
Registered: 2006-01-29
Posts: 11,250
Website GitHub

Re: plugins adding a row on edit panels

Oki doke. Done


The smd plugin menagerie — for when you need one more gribble of power from Textpattern. Bleeding-edge code available on GitHub.

Txp Builders – finely-crafted code, design and Txp

Offline

#6 2016-03-08 11:58:09

phiw13
Plugin Author
From: Japan
Registered: 2004-02-27
Posts: 3,058
Website

Re: plugins adding a row on edit panels

Thanks!


Where is that emoji for a solar powered submarine when you need it ?
Sand space – admin theme for Textpattern

Offline

Board footer

Powered by FluxBB