form formatting the <span class="middleColumn">
windandwaves
As most of you know who work with SS forms, there is something like
<span class="middleColumn">. For those of you who care about
validating code, you may also know that this often leads to non-
validating codes as several form field types add <ul>, <div> or other
block elements within this <span>.
My suggestion would be to simply change the <span> to a <div>. For
backwards compatibility we perhaps need a system to select <span> or
<span> (<span> being the default)
The alternative would be to change the <span> to <div> only in
situations where it is needed. However, that is less predictable and
more difficult to manage in my opinion.
Nicolaas
www.sunnysideup.co.nz
Ingo Schommer
we're aware of this, but there's heaps of legacy CSS relying
on "span.middleColumn" classes. Essentially this is an "API Change"
affecting both backend and frontend.
We've been talking about doing manual CSS testing by
creating test forms for the backend and frontend with all kinds
of field combinations in different nesting levels, and make reference
screenshots from them.
With these tools you could more reliably tell if a "simple" CSS change
will break existing layouts. But unless these tests are in place,
I think this change is too risky, or at least has to wait until a
major revision.
So, anybody keen on writing some css tests? Doesn't require any
special knowledge,
just a little bit of legwork :-)
Ingo
-------
Ingo Schommer | Senior Developer
SilverStripe
http://silverstripe.com
Phone: +64 4 978 7330 ext 42
Skype: chillu23
Level 3, 97-99 Courtenay Place
Wellington, New Zealand
windandwaves
sure exactly what you mean.
Ingo Schommer
stylings :
class FrontendFormFieldCSSTest extends Controller {
function index() {
Requirements::css('sapphire/css/Form.css'); // formfield css should
be automatically included
$form = new Form(
$this,
'Form',
new FieldSet(
// all kinds of formfields in different nesting levels in here
),
new FieldSet(
new FormAction('submit') // doesn't need to do anything
)
);
return $form->forTemplate();
}
}
we could then let a screencapture tool (e.g. http://browsershots.org)
do reference renderings of the current state, and visually compare
these references against any changes made to the CSS (like <span
class="middleColumn"> to <div class="middleColumn">).
this test class would be delivered in the sapphire/tests directory.
for CSS rendering inside the CMS we could create testing pagetypes
with the same method outlined above.
keen? it would help us a great deal to stabilize the UI! :)