Refactored Wilma CSS for Better Responsiveness #4061
Conversation
| @@ -23,6 +23,7 @@ VIVO wilma theme: screen styles | |||
| @charset "UTF-8"; | |||
|
|
|||
| @import url("reset.css"); | |||
| @import url("grid.css"); | |||
There was a problem hiding this comment.
@milospp do we need this line?
There was a problem hiding this comment.
We don't, I forgot to remove it.
There was a problem hiding this comment.
Done! Now it's reduced to a total of 5 file changes in PR
| /* margin-top: var(--bs-gutter-y); */ | ||
| } | ||
|
|
||
| .col-1 { |
There was a problem hiding this comment.
I found only col-md5 used once and col-md7 used once. All other 'col-' classes aren't used, right?
The same is related to container-xxl, container-fluid, container-xl, container-lg, container-md, container-sm
If that is the case I would suggest to clean up not used styles.
|
Noticing a delay in the responsiveness on the home page. If I quickly decrease the window size there is a half second where the page looks like in the screenshot above. It might be related to the login box, since I'm not seeing it when logged in. Any idea what's going on? |
I just tested it in and I had no issue Also tested in Safari and Vivaldi browser ScreenshotCan anyone else confirm? |
|
Very strange. Responsive.movI can't replicate in Firefox or within Chrome in incognito mode. I've tried turning off all my extensions still no change. Since it doesn't happen in incognito I assume it's an issue on my end rather than with the implementation. |
VIVO GitHub issue
What does this pull request do?
Created breakpoints for smaller screen, so that smaller devices can
What's new?
Mobile optimised design(up to 320px width)
Avoided horizontal scroll
How should this be tested?
Open every page and test by resizing up to around 400px in width (Mobile device toolbar can be used in Google Chrome to simulate phone display or ViewPort resizer extension)
Additional Notes:
Here is the video example
https://youtu.be/9B0_cevrEeE
Reviewers' expertise
Candidates for reviewing this PR should have some of the following expertises: