diff --git a/app/(home-pages)/discover/PubListing.tsx b/app/(home-pages)/discover/PubListing.tsx
index e3bc5224..fae42889 100644
--- a/app/(home-pages)/discover/PubListing.tsx
+++ b/app/(home-pages)/discover/PubListing.tsx
@@ -37,22 +37,12 @@ export const PubListing = (
           px-3 py-3 selected-outline
           hover:outline-accent-contrast hover:border-accent-contrast
           relative overflow-hidden`}
+        style={{
+          backgroundImage: `url(${backgroundImage})`,
+          backgroundRepeat: backgroundImageRepeat ? "repeat" : "no-repeat",
+          backgroundSize: `${backgroundImageRepeat ? `${backgroundImageSize}px` : "cover"}`,
+        }}
       >
-        {backgroundImage && (
-          <img
-            src={backgroundImage}
-            alt=""
-            loading="lazy"
-            fetchPriority="low"
-            className="absolute inset-0 pointer-events-none"
-            style={{
-              width: backgroundImageRepeat ? `${backgroundImageSize}px` : "100%",
-              height: backgroundImageRepeat ? "auto" : "100%",
-              objectFit: backgroundImageRepeat ? "none" : "cover",
-              objectPosition: "center",
-            }}
-          />
-        )}
         <div
           className={`flex w-full flex-col justify-center text-center max-h-48 pt-4 pb-3 px-3 rounded-lg relative z-10 ${props.resizeHeight ? "" : "sm:h-48 h-full"} ${record.theme?.showPageBackground ? "bg-[rgba(var(--bg-page),var(--bg-page-alpha))] " : ""}`}
         >
diff --git a/app/(home-pages)/discover/SortedPublicationList.tsx b/app/(home-pages)/discover/SortedPublicationList.tsx
index dee6e495..c980939f 100644
--- a/app/(home-pages)/discover/SortedPublicationList.tsx
+++ b/app/(home-pages)/discover/SortedPublicationList.tsx
@@ -81,7 +81,7 @@ const SortButton = (props: {
     <div className="relative">
       <button
         onClick={props.onClick}
-        className={`text-sm bg-accent-1 text-accent-2 rounded-md px-[8px] py-0.5 border ${props.selected ? "border-accent-contrast  font-bold" : "border-border-light"}`}
+        className={`text-sm  rounded-md px-[8px] font-bold py-0.5 border ${props.selected ? "border-accent-contrast bg-accent-1 text-accent-2 " : "bg-bg-page text-accent-contrast border-accent-contrast"}`}
       >
         {props.children}
       </button>
diff --git a/components/ActionBar/Publications.tsx b/components/ActionBar/Publications.tsx
index fee908b7..f38cd4ce 100644
--- a/components/ActionBar/Publications.tsx
+++ b/components/ActionBar/Publications.tsx
@@ -102,7 +102,9 @@ export const PubIcon = (props: {
   let iconSizeClassName = `${props.small ? "w-4 h-4" : props.large ? "w-12 h-12" : "w-6 h-6"} rounded-full`;
 
   return props.record.icon ? (
-    <div className={`${iconSizeClassName} ${props.className} relative overflow-hidden`}>
+    <div
+      className={`${iconSizeClassName} ${props.className} relative overflow-hidden`}
+    >
       <img
         src={`/api/atproto_images?did=${new AtUri(props.uri).host}&cid=${(props.record.icon?.ref as unknown as { $link: string })["$link"]}`}
         alt={`${props.record.name} icon`}
@@ -116,7 +118,7 @@ export const PubIcon = (props: {
       <div
         className={`${props.small ? "text-xs" : props.large ? "text-2xl" : "text-sm"} font-bold  absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 text-accent-2`}
       >
-        {props.record?.name.slice(0, 1)}
+        {props.record?.name.slice(0, 1).toUpperCase()}
       </div>
     </div>
   );