Fix: Bookmark Menu - padding inline at Mac #136

- [lp]: padding-left
- [rp]: padding-right
- [rm]: margin-right

/** Global Menu Bookmark *****************************************************/
/* None: Mac doesnt have global menu bookmark in browser */

/** Popup Menu Bookmark ******************************************************/
/*= General =================================================================*/
/* = Arrowpanel
 * .subviewbutton: var(--arrowpanel-menuitem-padding)[lp]
 * .toolbarbarbutton-icon: 16px[icon]
 * .toolbarbarbutton-text: var(--arrowpanel-menuicon-padding, 8px)[lp]
 *
 * Result: var(--arrowpanel-menuitem-padding) + var(--arrowpanel-menuicon-padding) + 16px */

/* = Icon Bookmark
 * .subviewbutton: var(--arrowpanel-menuitem-padding)[lp]
 * .menu-iconic-left: 3px[rm]
 * .menu-iconic-icon: 16px[icon] + 5px[rm]
 *
 * Result: var(--arrowpanel-menuitem-padding) + 24px */
\#BMB_bookmarksPopup .subviewbutton {
  padding: var(--arrowpanel-menuitem-padding);
}

\#BMB_bookmarksPopup .subviewbutton > .menu-iconic-left {
  margin-inline-end: 3px;
}
.menu-iconic-icon {
  margin-inline-end: 5px;
8px

/*= Result =====
 * DONT TOUCH
 */

/*= Empty Icon at list ======================================================*/
.subviewbutton:not([image], [targetURL], .bookmert-item) > .menu-iconic-left {
  display: none;
}
menu, menuitem, menucaption {
  list-style-iamge: none;
}

/*= Result =====
 * Show Icon
 */
\#BMB_bookmarksShowAllTop {
  list-style-image: url("chrome://browser/skin/bookmark-star-on-tray.svg") !important;
}
\#BMB_bookmarksShowAllTop > .menu-conic-left {
  display: -moz-box !important;
}

/*= None Icon Bookmark  =====================================================
 * .subviewbutton: var(--context-menu-background-padding)[lp, rp]
 * .menu-text: 21px[lp]
 *
 * Result(Icon): var(--context-menu-background-padding)
 * Result(Text): var(--context-menu-background-padding) + 21px
 */

:not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menuitem:not(.menuitem-iconic),
:not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menu:not(.menu-iconic),
menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup)
  menuitem:not(.menuitem-iconic, .in-menulist, [type="checkbox"], [checked="true"], .bookmark-item),
menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup)
  menu:not(.menu-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
\#blockedPopupDontShowMessage {
  /* Icon */
  background-position: left var(--context-menu-background-padding) center !important;

  /* Text */
  padding-inline-start: var(--context-menu-background-padding) !important;
}

@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") {
  :root {
    --context-menu-background-padding-default: 10px;
    --context-menu-mac-padding: 21px;
  }

  /* .subviewbutton - rp */
  :not(menu, #ContentSelectDropdown, #context-navigation)
    > menupopup
    > menuitem:not(.menuitem-iconic, [type="checkbox"], [checked="true"], .in-menulist),
  :not(menu, #ContentSelectDropdown, #context-navigation)
    > menupopup
    > menu:not(.menu-iconic, [type="checkbox"], [checked="true"], .in-menulist),
  #blockedPopupDontShowMessage {
    padding-inline-end: var(--context-menu-background-padding) !important; /* same as var(--context-menu-background-padding-default) */
  }
}

/*= Result =====
 * Result(Icon): --context-menu-background-padding to var(--arrowpanel-menuitem-padding)
 * Result(Text):
 * (var(--arrowpanel-menuitem-padding) + 24px)) - (var(--arrowpanel-menuitem-padding) + 21px) = 3px
 */
\#BMB_bookmarksPopup {
  --context-menu-background-padding: var(--arrowpanel-menuitem-padding);
}
menupopup:is(#BMB_bookmarksPopup) menuitem:not(.menuitem-iconic, [disabled="true"]),
menupopup:is(#BMB_bookmarksPopup) menu:not(.menu-iconic) {
  padding-inline-start: calc(var(--arrowpanel-menuitem-padding) + 3px) !important;
}

userChrome.css

@@ -2028,6 +2028,15 @@
     --menuitem-image: url("chrome://browser/skin/bookmarks-toolbar.svg");
   }
 
+  @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") {
+    #BMB_bookmarksShowAllTop {
+      list-style-image: url("chrome://browser/skin/bookmark-star-on-tray.svg") !important;
+    }
+    #BMB_bookmarksShowAllTop > .menu-conic-left {
+      display: -moz-box !important;
+    }
+  }
+
   /*= identity-popup =========================================================*/
   #identity-popup-clear-sitedata-button,
   #identity-popup-more-info {
@@ -2247,6 +2256,19 @@
     }
   }
 
+  @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") {
+    /* Bookmark Popup - As Arrow Panel */
+    #BMB_bookmarksPopup {
+      --context-menu-background-padding: var(--arrowpanel-menuitem-padding);
+    }
+
+    /* Bookmark Popup - None icon menu */
+    menupopup:is(#BMB_bookmarksPopup) menuitem:not(.menuitem-iconic, [disabled="true"]),
+    menupopup:is(#BMB_bookmarksPopup) menu:not(.menu-iconic) {
+      padding-inline-start: calc(var(--arrowpanel-menuitem-padding) + 3px) !important;
+    }
+  }
+
   /* Empty Menu */
   menupopup menupopup[emptyplacesresult] .menu-text,
   #PersonalToolbar menupopup[emptyplacesresult] .menu-text {