fsulib / website-refresh-issues

A repository to keep track of our website refresh backlog
0 stars 0 forks source link

"Add Section Hover Effect Disrupts Other elements" #65

Open jessicapple opened 1 year ago

jessicapple commented 1 year ago

When you are trying to delete anything using the Mercury Editor, the confirmation to delete appears very close to the Add Section button. Occasionally, I will click Add Section when meaning to click delete.

https://user-images.githubusercontent.com/87393268/213297773-1cb39797-c24d-4b28-a7ea-bac5c08de0ac.mov

jessicapple commented 1 year ago
Screen Shot 2023-01-21 at 6 27 06 PM
barsenault-fsu commented 1 year ago

In this commit are the following changes

  1. I lowered the z-index of the blue Add Section buttons from 520 to 80, so they won't appear on top of other dialogs or the "+" button for adding components
  2. I raised the z-index of the "+" button for adding components to make sure that it appears on top of the blue Add Section button, particularly when there's a 3 column layout. This way you can access the smaller "+" button. I tried moving the "+" over to the right in a 3 column layout but it looked weird, and I think made it harder to find the "+" in empty sections not being centered.
  3. I lowered the component controls a few pixels so they appear below the blue Add Section button and the "+" button for adding components.
  4. Since the top of the component controls are no longer right up against the border of the component, I rounded the top right corner image