[
https://issues.apache.org/jira/browse/AIRAVATA-3306?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=17093575#comment-17093575
]
Marcus Christie edited comment on AIRAVATA-3306 at 4/27/20, 6:57 PM:
---------------------------------------------------------------------
h3. Option #1: Containers as inline editor
- Containers have their usual attributes
- the body is a StreamField
- a new type of StreamBlock would be the row-start (or row-end) block
h3. Option #2: Rows as inline editor, with container attributes
- Row has addition attributes
- A new row can start in a new container, or, by default, be added to the
previous container
h3. Option #3: Rows as inline editor, each row body is a struct
- the struct has additional attributes for starting a new container, much like
above
h3. Option #4: Rows as inline editor, each row a struct with ChoiceBlock for
determining whether to start a container or not
- Question, can a ChoiceBlock be used for Blocks and not just strings?
- Is the editor dynamic based on the selected ChoiceBlock
- This would mean each row would have a dropdown ChoiceBlock:
-- Use existing container
-- Start new full-width container
-- Start new fixed-width container
h3. Questions
- can we hide the rest of the container attributes if the default of
no-container is specified?
Option #4 is the preferred one here, if it works. I'm not sure that the wagtail
editor is dynamic or that ChoiceBlock can be used for blocks, but i'll try it
and see.
----
ChoiceBlock didn't work but I think a StreamBlock with max_num=1 will work and
I'll try that next time.
was (Author: marcuschristie):
h3. Option #1: Containers as inline editor
- Containers have their usual attributes
- the body is a StreamField
- a new type of StreamBlock would be the row-start (or row-end) block
h3. Option #2: Rows as inline editor, with container attributes
- Row has addition attributes
- A new row can start in a new container, or, by default, be added to the
previous container
h3. Option #3: Rows as inline editor, each row body is a struct
- the struct has additional attributes for starting a new container, much like
above
h3. Option #4: Rows as inline editor, each row a struct with ChoiceBlock for
determining whether to start a container or not
- Question, can a ChoiceBlock be used for Blocks and not just strings?
- Is the editor dynamic based on the selected ChoiceBlock
- This would mean each row would have a dropdown ChoiceBlock:
-- Use existing container
-- Start new full-width container
-- Start new fixed-width container
h3. Questions
- can we hide the rest of the container attributes if the default of
no-container is specified?
Option #4 is the preferred one here, if it works. I'm not sure that the wagtail
editor is dynamic or that ChoiceBlock can be used for blocks, but i'll try it
and see.
> Wagtail: allow specifying a container for page rows
> ---------------------------------------------------
>
> Key: AIRAVATA-3306
> URL: https://issues.apache.org/jira/browse/AIRAVATA-3306
> Project: Airavata
> Issue Type: Improvement
> Components: Django Portal
> Reporter: Marcus Christie
> Assignee: Marcus Christie
> Priority: Major
>
> The BlankPage template assumes a container of class {{container-fluid}} for
> the entire page. But the max-width of Bootstrap's {{container}} class is nice
> to have for a lot of layouts, especially ones with text.
> Instead of rows as the top-level collection, it should instead be containers.
> We'll need a new Page type since this would break existing instances of
> BlankPage.
> Also, it's useful to be able to define a background for containers that spans
> the entire page even though the container itself may be fixed width. We could
> do the following:
> {code:xml}
> [div class="container-fluid" style="background-color: ..."]
> [div class="container"]
> [/div]
> [/div]
> {code}
> However, that would result in twice as much padding as usual on the left and
> right for the doubly nested container (container-fluid and container both
> define padding-left and padding-right of 15px). Instead I think just having
> a wrapping div that can be styled will allow setting background colors and
> images as needed.
> h5. Design
> - MultiContainerPage (subclass of Page)
> -- has one or more Containers
> - Container
> -- has zero or more Rows
> -- has an outer wrapping div for setting a background
> -- attributes
> --- type: "container" or "container-fluid"
> --- background color: applied to wrapper div
> --- banner image: applied to wrapper div. Sets background-image: ...,
> background-size: cover, background-repeat: no-repeat;
> --- minimum height: necessary when defining a banner image with no content
> rows
> --- background image: applied to wrapper div. Sets background-image only
> --- wrapper inline styles: applied via style
> --- inline styles:
> --- wrapper custom classes:
> --- custom classes:
> h5. Use cases
> - background color for a container of rows that spans full width
> -- example: red background portion of https://gateway.futurewater.indiana.edu/
> - background image for a container of rows that spans responsive max-width
> - banner background image that spans the full width and doesn't have any
> additional content in it
> -- example: banner image in https://gateway.futurewater.indiana.edu/
> See also
> * https://getbootstrap.com/docs/4.4/layout/overview/
> h5. TODO
> - [ ] Make the various container options a StreamBlock with only one allowed
> option ({{max_num=1}})
--
This message was sent by Atlassian Jira
(v8.3.4#803005)
