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

Fix btn text word wrap, other responsive layout improvements [ref #7326] #7535

Merged
merged 3 commits into from Jan 29, 2021

Conversation

mheppler
Copy link
Contributor

@mheppler mheppler commented Jan 25, 2021

What this PR does / why we need it:

Overwrite CSS from Bootstrap 3 stylesheet that causes long button text overflow to be hidden by the width of the containing button. Specifically this issue can be best scene in the action buttons on the top of the dataset and file pgs, when the language display is set to French, when the button text "Modalités d'accès à l'ensemble de données" needs to break to another line to display fully inside in the button container.

As a result of this CSS overwrite added to our stylesheet, we also had to remove the "Find" button text label from various input-btn-group components that included a magnifying glass glyphicon, because the text label inexplicably wrapped to another line under the glyphicon. This was resolved by removing the text label and moving it to the button title attribute, so that it displays on hover. This change to the search components can be found in the dataverse header, manage users dashboard pg, dataverse pg and dataset pg.

Which issue(s) this PR closes:

Closes #7326 Dataset page - button and citations display issues in different languages

Special notes for your reviewer:

Happy to discuss any changes found in the code that are not clearly outlined above. If more detail is needed to better explain anything, I can add that as well.

Suggestions on how to test this:

Requires an installation configured with the French language bundle. View pages in multiple browser window sizes (Pro-tip: Safari provides a Responsive Design Mode under the Develop OS menu option.)

Does this PR introduce a user interface change? If mockups are available, please link/include them here:

No mockups for these UI clean up changes.

Is there a release notes update needed for this change?:

N/A

Additional documentation:

N/A

@mheppler
Copy link
Contributor Author

Screen Shot 2021-01-25 at 2 05 19 PM

@coveralls
Copy link

Coverage Status

Coverage remained the same at 19.614% when pulling a9289fb on 7326-wrap-btn-text into 56b5b27 on develop.

Copy link
Contributor

@scolapasta scolapasta left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code is mostly CSS changes but looks ok to me.

It does seem strange to me to remove "Find" from the buttons, as all other buttons have a glyphicon with accompanying text. (right?)

@scolapasta scolapasta assigned scolapasta and unassigned scolapasta Jan 27, 2021
Copy link
Contributor

@scolapasta scolapasta left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@mheppler let me know if you plan on making any other changes here (as mentioned); otherwise I can approve when ready.

@mheppler
Copy link
Contributor Author

Added tooltip style to search input-group-btn as suggested by @scolapasta. Ready for review and approval.

Screen Shot 2021-01-27 at 7 41 54 PM

IQSS/dataverse (TO BE RETIRED / DELETED in favor of project 34) automation moved this from Review 🦁 to QA 🔎✅ Jan 28, 2021
@scolapasta scolapasta removed their assignment Jan 28, 2021
@kcondon kcondon self-assigned this Jan 29, 2021
@kcondon kcondon merged commit abcf9fd into develop Jan 29, 2021
IQSS/dataverse (TO BE RETIRED / DELETED in favor of project 34) automation moved this from QA 🔎✅ to Done 🚀 Jan 29, 2021
@kcondon kcondon deleted the 7326-wrap-btn-text branch January 29, 2021 21:15
@djbrooke djbrooke added this to the 5.4 milestone Jan 29, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
No open projects
Development

Successfully merging this pull request may close these issues.

Dataset page - button and citations display issues in different languages
5 participants