Skip to content
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

UI misalignment on seed info #77

Open
realtrueheather opened this issue Apr 22, 2017 · 2 comments
Open

UI misalignment on seed info #77

realtrueheather opened this issue Apr 22, 2017 · 2 comments

Comments

@realtrueheather
Copy link

For some reason, the information of this seed jumped over
screen shot 2017-04-22 at 12 40 05 pm

@machawk1
Copy link

This appears to be an issue with the alignment of the information on the right column of information. All three rows have the same right margin (see attached). The middle row has a different value for its second line (Page + All internal and external links instead of Page + Same Domain Links) than the first and third row. A fourth row with the crawl values of the second would likely be horizontally aligned with the second column of the second row.

With that in-mind, this design issue should be normalized. While the text in the right column is left aligned, the "cell's size" is defined by the content. @N0taN3rd ?

align

@N0taN3rd
Copy link
Owner

@machawk1
Right now that UI section is layed out via flex (wail-ui/components/collections/viewCollection/mementoCard/mementoCardBody.js)

const MementoCardBody = ({added, mementos, conf}) => (
  <Flex key={`MementoCardBody-flex-${added}-${mementos}`} row alignItems='baseline' justifyContent='space-between'>
    <CardHeader key={`MementoCardBody-mementos-${added}-${mementos}`} title={`Mementos: ${mementos}`} />
    <CardHeader key={`MementoCardBody-confTitle-${added}-${mementos}`} title='Archive Configuration' subtitle={conf} />
  </Flex>
)

The issue comes from the interal styling used by the material-ui/Card/CarcHeader and have noticed this happening as well for the Archive Twitter section and Adding Seeds
when I transitioned to a more "flexable" layout scheme overall for the UI.

The conf (Page + Same Domain....) is only text with each entry on its own line.
My plan for this issue and section is to pull out the Archive config into its own Component in order to facilitate better UI look/feel and hopefully facilitate the addition of relaunching an archive configuration from here.

N0taN3rd added a commit that referenced this issue May 11, 2017
fixes #51

relaxed minimum width for WAIL started to address #77
refactored large list rendering components to not use arrow functions
refactored components to use bound methods for setState callbacks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants