Follow-up from "Add correct widget list styles to MR dependencies"
The following discussion from !118095 (merged) should be addressed:
-
@pgascouvaillancourt started a discussion: thought: This is one of many examples where we have applied some margin to a component's root element: https://gitlab.com/gitlab-org/gitlab/-/blob/70db6d195c9df09ef506952121cdad4624e0719a/app/assets/javascripts/issuable/components/related_issuable_item.vue#L105. This kind of approach tends to cause issues in the long run, like we're seeing here. I believe that we should never let a component adjusts its own layout relative to sibling elements, or we'll fatally end up having to override that from the outside.
I think this is fine as is, but I would suggest we consider...
- ...removing
gl-mx-n2
from<related-issuable-item>
's rool element. - ...update all three usages of this component to apply the necessary class from the parent component. So that would mean re-applying
gl-mx-n2
twice from the outside, and this occurrence would not need the!important
variation anymore.
- ...removing