From 9f47199428d62a713f62861685ee52bfcb55c3aa Mon Sep 17 00:00:00 2001
From: Kyle Conroy <kyleconroy@gmail.com>
Date: Fri, 5 Jan 2024 11:44:04 -0500
Subject: [PATCH] fix top app bar style to align in notebook, popout, and mast

---
 CHANGES.rst    | 2 ++
 jdaviz/app.vue | 2 +-
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/CHANGES.rst b/CHANGES.rst
index 6cd1ca6416..83dcab85d4 100644
--- a/CHANGES.rst
+++ b/CHANGES.rst
@@ -54,6 +54,8 @@ Specviz2d
 Bug Fixes
 ---------
 
+* Fix app top-bar alignment in popouts and when embedded in websites. [#2648]
+
 Cubeviz
 ^^^^^^^
 
diff --git a/jdaviz/app.vue b/jdaviz/app.vue
index c5bb5464ed..6a1e522a58 100644
--- a/jdaviz/app.vue
+++ b/jdaviz/app.vue
@@ -35,7 +35,7 @@
         </v-row>
       </div>
     </v-overlay>
-    <v-app-bar color="toolbar" dark :dense="state.settings.dense_toolbar" flat app absolute clipped-right style="margin-left: 1px; margin-right: 1px">
+    <v-app-bar color="toolbar" dark :dense="state.settings.dense_toolbar" flat app absolute clipped-right :style="checkNotebookContext() ? 'margin-left: 1px; margin-right: 1px' : ''">
       <v-toolbar-items v-for="item in state.tool_items">
         <v-divider v-if="['g-data-tools', 'g-subset-tools'].indexOf(item.name) === -1" vertical style="margin: 0px 10px"></v-divider>
         <v-divider v-else-if="item.name === 'g-subset-tools'" vertical style="margin: 0px 10px; border-width: 0"></v-divider>