Suggestion for CSS improvement on subscribe page construction about phplist3 HOT 8 CLOSED

@xh3n1 Perhaps you could investigate this and share your findings?

from phplist3.

@samtuke I wasn't aware that the frontend uses backend stuff, but I agree with @luison that it would be better to separate that.

from phplist3.

@luison Is your goal to be able to style individual table rows within the subscribe pages, or to be able to replace the tables altogether? Adding unique CSS class names or IDs shouldn't be difficult, which would allow you to add more specific styling.

from phplist3.

My goal would be to improve or have more personalization options on those pages. The idea of having an ID on the rows/cells would just be an easy way to help doing it with CSS Styles. The PHP code that generates that seems rather confusing and diversified.

from phplist3.

@luison By personalised options, do you mean custom theming of their inputs and labels? Deeper customisation would require changes to how attributes are added and managed.

from phplist3.

Hi @samtuke. Again as a suggestion whatever you guys find "doable". Truth is the design options via CSS are very limited now and therefore of my suggestion of at least move the attribute class you already seem to include on inputs, radios, etc further up as possible within the element.
In the case of the tables as you are building them today that would be on the TR I guess. In this form the label, text of radio buttons and other elements within that attribute become somehow "modifiable"

With a sample current code:

<tr>
<td><div class="required"><label for="attribute4">Label*</label></div></td>
<td class="attributeinput">
            <input type="text" name="attribute4" class="attributeinput" size="40" value="" id="attribute4"></td>
</tr>

Making it just something like:

<tr class="attribute4">
<td class="label_container"><div class="required"><label for="attribute4">Label*</label></div></td>
<td class="attributeinput">
            <input type="text" name="attribute4" class="attributeinput" size="40" value="" id="attribute4"></td>
</tr>

Would allow to change the background of the td for the label on some of them, increase padding on most important items, add the required * via CSS, etc.

Again, further tuning via divs and classes would be better, but that kind of change should not break compatibility and allow some small additional tuning.

thanks.

from phplist3.

@luison Thanks for the snippet in #428 -- how about this for next steps:

• Replace table structure with divs, as you proposed
• Add auto-generated IDs for each div containing an input for easier CSS styling
• Add dedicated copies of currently shared UI libraries (e.g. jQuery)
• Make use of those UI libraries explicit within the public page template itself (can be changed or removed by the phpList admin, so other UI libraries can be used instead)

Thoughts? Which of those steps would you be happy to work on?

from phplist3.

It seems that there is no activity on this issue for a long time. Additionally, this discussion can continue on the community forum: https://discuss.phplist.org/t/suggestion-for-css-improvement-on-subscribe-page-construction/4078

from phplist3.