diff --git a/web/src/app/app/(primary_layout)/datasets/[datasetId]/_DatasetsLayout/DatasetPageContext.tsx b/web/src/app/app/(primary_layout)/datasets/[datasetId]/_DatasetsLayout/DatasetPageContext.tsx
index fd3f5a885..9067e5b0f 100644
--- a/web/src/app/app/(primary_layout)/datasets/[datasetId]/_DatasetsLayout/DatasetPageContext.tsx
+++ b/web/src/app/app/(primary_layout)/datasets/[datasetId]/_DatasetsLayout/DatasetPageContext.tsx
@@ -25,6 +25,8 @@ export const useDatasetPageContext = ({ datasetId }: { datasetId: string }) => {
     return !datasetId || !sql || !ymlFile || (originalYmlFile === ymlFile && originalSQL === sql);
   }, [datasetSQL, sql, datasetId, datasetYmlFile, ymlFile]);
 
+  console.log(disablePublish);
+
   const isChangedSQL = useMemo(() => {
     return originalDatasetSQL !== sql;
   }, [originalDatasetSQL, sql]);
diff --git a/web/src/app/app/(primary_layout)/datasets/[datasetId]/editor/EditorContainerSubHeader.tsx b/web/src/app/app/(primary_layout)/datasets/[datasetId]/editor/EditorContainerSubHeader.tsx
index a1c5732f8..bbdc99437 100644
--- a/web/src/app/app/(primary_layout)/datasets/[datasetId]/editor/EditorContainerSubHeader.tsx
+++ b/web/src/app/app/(primary_layout)/datasets/[datasetId]/editor/EditorContainerSubHeader.tsx
@@ -25,10 +25,15 @@ export const EditorContainerSubHeader: React.FC<{
   return (
     <div
       className={cn(
-        'bg-disabled h-[36px] w-full border-b',
+        'bg-page-background h-[36px] w-full border-b',
         'flex items-center justify-between px-4'
       )}>
-      <AppSegmented options={options} value={selectedApp} onChange={onSegmentedChange} />
+      <AppSegmented
+        options={options}
+        type="button"
+        value={selectedApp}
+        onChange={onSegmentedChange}
+      />
     </div>
   );
 });
diff --git a/web/src/app/app/(primary_layout)/datasets/[datasetId]/editor/EditorContent.tsx b/web/src/app/app/(primary_layout)/datasets/[datasetId]/editor/EditorContent.tsx
index 79e21798b..2bf02799f 100644
--- a/web/src/app/app/(primary_layout)/datasets/[datasetId]/editor/EditorContent.tsx
+++ b/web/src/app/app/(primary_layout)/datasets/[datasetId]/editor/EditorContent.tsx
@@ -64,7 +64,7 @@ export const EditorContent: React.FC<{
   return (
     <div className="flex h-full w-full flex-col overflow-hidden" ref={ref}>
       <EditorContainerSubHeader selectedApp={selectedApp} setSelectedApp={setSelectedApp} />
-      <div className={cn('h-full w-full overflow-hidden p-5', 'bg-item-hover')}>
+      <div className={cn('bg-page-background h-full w-full overflow-hidden p-5')}>
         {selectedApp === EditorApps.PREVIEW && (
           <AppVerticalCodeSplitter
             autoSaveId="dataset-editor"
diff --git a/web/src/components/ui/buttons/Button.tsx b/web/src/components/ui/buttons/Button.tsx
index 6ea0cd13b..2ec52e98f 100644
--- a/web/src/components/ui/buttons/Button.tsx
+++ b/web/src/components/ui/buttons/Button.tsx
@@ -9,7 +9,7 @@ export const buttonTypeClasses = {
     'bg-background border hover:bg-item-hover disabled:bg-disabled disabled:text-gray-light active:bg-item-active data-[selected=true]:bg-item-select',
   black: 'bg-black text-white hover:bg-foreground-hover disabled:bg-black/60',
   primary:
-    'bg-primary text-white hover:bg-primary-light active:bg-primary-dark data-[selected=true]:bg-primary-dark',
+    'bg-primary disabled:bg-disabled text-white hover:bg-primary-light disabled:text-gray-light active:bg-primary-dark data-[selected=true]:bg-primary-dark',
   ghost:
     'bg-transparent text-gray-dark shadow-none hover:bg-item-hover hover:text-foreground disabled:bg-transparent disabled:text-gray-light active:bg-item-active data-[selected=true]:bg-item-select',
   link: 'bg-transparent text-gray-dark shadow-none hover:text-foreground disabled:bg-transparent disabled:text-gray-light',