From 8477b53b17d499b606a74b1d20d12ba118f6dfb0 Mon Sep 17 00:00:00 2001
From: marcustyphoon <marcustyphoon@gmail.com>
Date: Thu, 4 May 2023 14:30:43 -0700
Subject: [PATCH] Meatballs util: Fix blog menu item styling (#1059)

---
 src/content_scripts/meatballs.css | 10 +++++-----
 src/util/meatballs.js             |  2 ++
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/content_scripts/meatballs.css b/src/content_scripts/meatballs.css
index e2f6d93b2..b46aba284 100644
--- a/src/content_scripts/meatballs.css
+++ b/src/content_scripts/meatballs.css
@@ -1,4 +1,4 @@
-[data-xkit-meatball-button] {
+.xkit-meatball-button {
   display: flex;
   flex-direction: row;
   justify-content: center;
@@ -16,15 +16,15 @@
   text-decoration: none;
 }
 
-[data-xkit-meatball-button][hidden] {
+.xkit-meatball-button[hidden] {
   display: none;
 }
 
-[data-xkit-meatball-button]:not([hidden]) ~ [data-xkit-meatball-button] {
+.xkit-meatball-button:not([hidden]) ~ .xkit-meatball-button {
   border-top: none;
 }
 
-[data-xkit-meatball-button]:hover,
-[data-xkit-meatball-button]:focus {
+.xkit-meatball-button:hover,
+.xkit-meatball-button:focus {
   background-color: rgb(var(--secondary-accent));
 }
diff --git a/src/util/meatballs.js b/src/util/meatballs.js
index eadf49fa5..343fba9a5 100644
--- a/src/util/meatballs.js
+++ b/src/util/meatballs.js
@@ -82,6 +82,7 @@ const addPostMeatballItem = async meatballMenu => {
     const { label, onclick, postFilter } = meatballItems[id];
 
     const meatballItemButton = dom('button', {
+      class: 'xkit-meatball-button',
       'data-xkit-meatball-button': id,
       hidden: true
     }, {
@@ -127,6 +128,7 @@ const addBlogMeatballItem = async meatballMenu => {
     const { label, onClick, blogFilter } = blogMeatballItems[id];
 
     const meatballItemButton = dom('button', {
+      class: 'xkit-meatball-button',
       'data-xkit-blog-meatball-button': id,
       hidden: true
     }, {