publiccode-editor icon indicating copy to clipboard operation
publiccode-editor copied to clipboard

RESET and GENERATE buttons breaking DOM

Open tikhsuP opened this issue 5 years ago • 1 comments

Subject of the issue

The Reset and Generate buttons are breaking the desired DOM for screen sizes less then 580px. The width of these buttons is fixed at 242px with a fixed gap of 80px between these buttons (i.e. left and right margins of 40px) irrespective of the screen size. Clearly 40px+242px+80px+242px+40px = 644px exceeds the size of 580px.

Steps to reproduce

Using developer options check the buttons for screen sizes less then 580px.

Expected behavior

The button size should adjust according to the screen size.

This can be done by using a responsive unit like vw (viewport width) rather than a fixed unit like px (pixel(s)) in the class editor_button and removing the width attribute from the class editor_button--custom.

Actual behaviour

For screen sizes less than 580px:

Screenshot (16)

Swipe Left to see this:

Screenshot (17)

tikhsuP avatar Feb 18 '20 15:02 tikhsuP