swisnl / jQuery-contextMenu

jQuery contextMenu plugin & polyfill
https://swisnl.github.io/jQuery-contextMenu/
MIT License
2.25k stars 744 forks source link

Font awesome menu icons aren't centered vertically #711

Open Serproger opened 4 years ago

Serproger commented 4 years ago

Currently this plugin uses the incorrect style:

.context-menu-icon.context-menu-icon--fa5 i, .context-menu-icon.context-menu-icon--fa5 svg {
  position: absolute;
  top: .3em; 
  left: .5em;
  color: #2980b9;
}

This style doesn't take into account icon sizes that can be different. As a result, an icon isn't centered vertically relative to context menu item. To solve this problem, the style could look as follows:

.context-menu-icon.context-menu-icon--fa5 i, .context-menu-icon.context-menu-icon--fa5 svg {
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  left: .5em;
  color: #2980b9;
}