[Bug] Lack of spacing between 'Add Link' and 'Submit Case' buttons for mobile screens
justaskulkarni opened this issue · 2 comments
Description
There is no margin between the 'Add Link' and 'Submit Case' buttons.
Add Link buttons is aligned to the right and therefore, it doesn't cause an issue on larger screens.
However on smaller screens, the lack of a margin is clearly noticable.
Reproduction
- Visit https://legaldb.creativecommons.org/cases/submit/
- Open inspect.
- Use the Toggle device toolbar to simulate a smaller screen. You may use a dimension such as 270x760.
- See error.
Expectation
There should be spacing between the two buttons.
Screenshots
Environment
- Device: Mobile Devices
- OS: Not OS specific
- Browser: Not browser specific
- Version: Not version specific
Resolution
- I would be interested in resolving this bug.
Approaches tried
Tried using Bulma class mgb-small on 'Add Link' button to no avail.
Similarly, use of class mgt-small on 'Submit Case' button does not solve the issue.
Then I tried removing some of the existing Bulma classes and then eventually came to the following conclusion.
Cause of the Error
When the is-pulled-right class is removed, we obtain the desired spacing.
However, as expected, the 'Add Link' is no longer aligned to the right.
Course of Action
Clearly, we need to design a way to align the 'Add Link' button to the right without the use of is-pulled-right class.
Solution
buttons.is-right can be used to align the 'Add Link' button to the right.
Current Code
Suggested Solution
