New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

New layout concept #209

Closed
Guite opened this Issue Jun 14, 2018 · 2 comments

Comments

Projects
None yet
2 participants
@Guite
Member

Guite commented Jun 14, 2018

The layout types are not flexible enough for responsive page layouts. We would end up with very very many layouts which all contain much boilerplate code (for each layout: one php class, one edit template, one display template). Thus, a new idea is needed.

Here is the proposal:

  • A page basically consists of one or multiple sections which contain one or multiple rows which contain one or multiple content elements.

  • Each content element has attributes for it's grid style (instead of "float left, 1/2 width" we say "md-4 lg-2") (widths, offsets, pull-overs)

  • Persisted using a concise JSON notation

  • Update model

    • Page: replace string field layout by a JSON array field for storing custom layout data
    • Content item: remove stylePosition and styleWidth
    • Content item: rename styleClasses to stylingClasses and make it a generic string field
    • Regenerate
  • Implementation

    • Dynamically add rows
    • Drag n drop using a new arrangement script
    • Content item creation using a palette
    • Content item removal
    • Content item grid attributes (widths, offsets, pull-overs)
    • Change content item details using a modal

@Guite Guite added the Feature label Jun 14, 2018

@Guite Guite added this to the 5.0.0 milestone Jun 14, 2018

@Guite Guite self-assigned this Jun 14, 2018

Guite added a commit that referenced this issue Jun 14, 2018

@robbrandt

This comment has been minimized.

Show comment
Hide comment
@robbrandt

robbrandt Jun 14, 2018

Contributor

I think that from a technical point of view you are on the right track. I am thinking of my non-designer users though, and about having to train them on bootstrap css. Will they need to know bootstrap techniques in order to layout a page? In other words, what sm-6 and xs 12 mean? And that each page is laid out on a 12 column grid? I wonder if anyone has created an interface that hides all of that for non-techie users that we can make use of.

Contributor

robbrandt commented Jun 14, 2018

I think that from a technical point of view you are on the right track. I am thinking of my non-designer users though, and about having to train them on bootstrap css. Will they need to know bootstrap techniques in order to layout a page? In other words, what sm-6 and xs 12 mean? And that each page is laid out on a 12 column grid? I wonder if anyone has created an interface that hides all of that for non-techie users that we can make use of.

@Guite

This comment has been minimized.

Show comment
Hide comment
@Guite

Guite Jun 14, 2018

Member

Will they need to know bootstrap techniques in order to layout a page?
interface that hides all of that

No. Currently working on a POC

Member

Guite commented Jun 14, 2018

Will they need to know bootstrap techniques in order to layout a page?
interface that hides all of that

No. Currently working on a POC

Guite added a commit that referenced this issue Jun 16, 2018

Guite added a commit that referenced this issue Jun 16, 2018

@zikula-modules zikula-modules deleted a comment from robbrandt Jun 16, 2018

@zikula-modules zikula-modules deleted a comment from robbrandt Jun 16, 2018

Guite added a commit that referenced this issue Jun 16, 2018

Guite added a commit that referenced this issue Jun 20, 2018

@Guite Guite closed this Jul 11, 2018

@Guite Guite assigned Guite and unassigned Guite Aug 8, 2018

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment