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

Fixed Mobile misalignment of info on Assets and Users view pages #15352

Merged
merged 3 commits into from
Aug 22, 2024

Conversation

Godmartinz
Copy link
Collaborator

@Godmartinz Godmartinz commented Aug 20, 2024

Description

This corrects the misalignment of the info on the users' and assets' view pages. These changes now position both divs into a column and display the table info first. The push and pull classes were oddly the culprit here on smaller screens. Since there is only room for 1 column they were pushing/pulling the divs 25% and 75% respectively from center.
I've introduced an info-stack-container class as well as an info-stack for the children divs applying an order now.

Before:
image

After:
Assets:
image
Users:
image

Fixes #[SC-26615]

Type of change

Please delete options that are not relevant.

  • [ x] Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to not work as expected)
  • This change requires a documentation update

How Has This Been Tested?

Please describe the tests that you ran to verify your changes. Provide instructions so we can reproduce. Please also list any relevant details for your test configuration

  • Test A
  • Test B

Test Configuration:

  • PHP version:
  • MySQL version
  • Webserver version
  • OS version

Checklist:

Copy link

what-the-diff bot commented Aug 20, 2024

PR Summary

  • Implemented Responsive Layout
    Adaptations were made to the styling code in the overrides.less file. These additional lines of code – known as media queries - will ensure that our application's layout adjusts optimally for users on smaller screens like mobiles or iPads.

  • Introduction of Info Stack Container
    The view.blade.php file was updated to include a new division named info-stack-container. This newly introduced container will be responsible for encapsulating and managing the elements that are part of the info stack. The organization of these elements will be more efficient due to this change.

@Godmartinz Godmartinz changed the title Mobile breakpoint Fixed Mobile misalignment of info on Assets and Users view pages Aug 20, 2024
@snipe
Copy link
Owner

snipe commented Aug 21, 2024

I don't think this is the behavior I designed this for though. The reason for using the pull and push elements on those columns is that I wanted the pics+buttons to show up first on mobile view.

@Godmartinz
Copy link
Collaborator Author

changed the order of the sections @snipe

@snipe
Copy link
Owner

snipe commented Aug 21, 2024

@Godmartinz WTF are you doing working at this hour?? Looks great tho :)

@snipe snipe merged commit bc9ea5a into snipe:develop Aug 22, 2024
9 checks passed
@snipe snipe mentioned this pull request Aug 22, 2024
2 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants