diff --git a/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/components/LabelsSelectionSheet.kt b/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/components/LabelsSelectionSheet.kt
index ee244b9f8..6adeeb60b 100644
--- a/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/components/LabelsSelectionSheet.kt
+++ b/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/components/LabelsSelectionSheet.kt
@@ -42,7 +42,6 @@ fun WebReaderLabelsSelectionSheet(viewModel: WebReaderViewModel) {
 
   val modalBottomSheetState = rememberModalBottomSheetState(
     ModalBottomSheetValue.HalfExpanded,
-    confirmStateChange = { it != ModalBottomSheetValue.Hidden }
   )
 
   if (isActive) {
diff --git a/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/notebook/NotebookView.kt b/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/notebook/NotebookView.kt
index d33f96401..c0603ef7a 100644
--- a/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/notebook/NotebookView.kt
+++ b/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/notebook/NotebookView.kt
@@ -3,12 +3,7 @@ package app.omnivore.omnivore.ui.notebook
 import android.content.ClipData
 import android.content.ClipboardManager
 import android.content.Context
-import android.content.Intent
-import android.os.Bundle
-import androidx.activity.ComponentActivity
 import androidx.activity.compose.LocalOnBackPressedDispatcherOwner
-import androidx.activity.compose.setContent
-import androidx.activity.viewModels
 import androidx.compose.foundation.*
 import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.shape.RoundedCornerShape
@@ -37,73 +32,14 @@ import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
-import app.omnivore.omnivore.MainActivity
 import app.omnivore.omnivore.R
 import app.omnivore.omnivore.persistence.entities.SavedItemWithLabelsAndHighlights
 import app.omnivore.omnivore.ui.library.*
-import app.omnivore.omnivore.ui.theme.OmnivoreTheme
-import com.google.accompanist.systemuicontroller.rememberSystemUiController
-import dagger.hilt.android.AndroidEntryPoint
 import dev.jeziellago.compose.markdowntext.MarkdownText
 import kotlinx.coroutines.launch
-import android.util.Log
-import androidx.compose.ui.platform.LocalDensity
 import app.omnivore.omnivore.persistence.entities.Highlight
-import kotlin.math.roundToInt
 
-@AndroidEntryPoint
-class NotebookActivity: ComponentActivity() {
-    val viewModel: NotebookViewModel by viewModels()
 
-    override fun onCreate(savedInstanceState: Bundle?) {
-        super.onCreate(savedInstanceState)
-        val savedItemId = intent.getStringExtra("SAVED_ITEM_ID")
-
-        setContent {
-            val systemUiController = rememberSystemUiController()
-            val useDarkIcons = !isSystemInDarkTheme()
-
-            DisposableEffect(systemUiController, useDarkIcons) {
-                systemUiController.setSystemBarsColor(
-                    color = Color.Black,
-                    darkIcons = false
-                )
-
-                onDispose {}
-            }
-
-            OmnivoreTheme {
-                Box(
-                    modifier = Modifier
-                        .fillMaxSize()
-                        // .background(color = Color.Black)
-                ) {
-                    savedItemId?.let {
-                        NotebookView(
-                            savedItemId = savedItemId,
-                            viewModel = viewModel
-                        )
-                    }
-                }
-                }
-            }
-        }
-
-//        // animate the view up when keyboard appears
-//        WindowCompat.setDecorFitsSystemWindows(window, false)
-//        val rootView = findViewById<View>(android.R.id.content).rootView
-//        ViewCompat.setOnApplyWindowInsetsListener(rootView) { _, insets ->
-//            val imeHeight = insets.getInsets(WindowInsetsCompat.Type.ime()).bottom
-//            rootView.setPadding(0, 0, 0, imeHeight)
-//            insets
-//        }
-//    }
-
-    private fun startMainActivity() {
-        val intent = Intent(this, MainActivity::class.java)
-        this.startActivity(intent)
-    }
-}
 
 fun notebookMD(notes: List<Highlight>, highlights: List<Highlight>): String {
     var result = ""
diff --git a/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/AnnotationEditView.kt b/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/AnnotationEditView.kt
index 3bd3a875d..f7c1605cb 100644
--- a/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/AnnotationEditView.kt
+++ b/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/AnnotationEditView.kt
@@ -1,5 +1,6 @@
 package app.omnivore.omnivore.ui.reader
 
+import android.content.ClipData
 import android.content.DialogInterface
 import android.os.Bundle
 import android.view.LayoutInflater
@@ -8,6 +9,10 @@ import android.view.ViewGroup
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.foundation.verticalScroll
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.ArrowBack
+import androidx.compose.material.icons.filled.MoreVert
 import androidx.compose.material3.*
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
@@ -22,7 +27,11 @@ import androidx.compose.ui.platform.ComposeView
 import androidx.compose.ui.platform.ViewCompositionStrategy
 import androidx.compose.ui.unit.dp
 import androidx.fragment.app.DialogFragment
+import app.omnivore.omnivore.ui.notebook.ArticleNotes
+import app.omnivore.omnivore.ui.notebook.HighlightsList
+import app.omnivore.omnivore.ui.notebook.notebookMD
 import app.omnivore.omnivore.ui.theme.OmnivoreTheme
+import kotlinx.coroutines.launch
 
 class AnnotationEditFragment : DialogFragment() {
   private var onSave: (String) -> Unit = {}
@@ -54,7 +63,7 @@ class AnnotationEditFragment : DialogFragment() {
             initialAnnotation,
             onSave,
             onCancel,
-            dismissAction = { dismiss() }
+         //    dismissAction = { dismiss() }
           )
         }
       }
@@ -73,62 +82,96 @@ fun AnnotationEditView(
   initialAnnotation: String,
   onSave: (String) -> Unit,
   onCancel: () -> Unit,
-  dismissAction: () -> Unit = {}
 ) {
   val annotation = remember { mutableStateOf(initialAnnotation) }
   val focusRequester = FocusRequester()
 
-  Column(
-    modifier = Modifier
-      .clip(RoundedCornerShape(4.dp))
-      .background(MaterialTheme.colorScheme.background)
-      .padding(8.dp),
-  ) {
-    Column(
-      modifier = Modifier.padding(16.dp),
-      horizontalAlignment = Alignment.CenterHorizontally,
-    ) {
-      Row {
-        TextButton(
-          onClick = {
+  Scaffold(
+    topBar = {
+      TopAppBar(
+        title = { Text("Notebook") },
+        colors = TopAppBarDefaults.topAppBarColors(
+          containerColor = MaterialTheme.colorScheme.background
+        ),
+        navigationIcon = {
+          IconButton(onClick = {
             onCancel()
-            dismissAction()
+          }) {
+            Icon(
+              imageVector = Icons.Filled.ArrowBack,
+              modifier = Modifier,
+              contentDescription = "Back",
+            )
           }
-        ) {
-          Text("Cancel")
-        }
-
-        Spacer(modifier = Modifier.weight(1.0F))
-
-        Text(text = "Note")
-
-        Spacer(modifier = Modifier.weight(1.0F))
-
-        TextButton(
-          onClick = {
-            onSave(annotation.value)
-            dismissAction()
+        },
+        actions = {
+          TextButton(
+            onClick = {
+              onSave(annotation.value)
+            }
+          ) {
+            Text("Save")
           }
-        ) {
-          Text("Save")
         }
-      }
-
-      Spacer(modifier = Modifier.height(8.dp))
-
+      )
+    }
+  ) { paddingValues ->
+    Column(
+      modifier = Modifier
+        .padding(paddingValues)
+        .fillMaxSize()
+    ) {
       TextField(
         value = annotation.value,
         onValueChange = { annotation.value = it },
         modifier = Modifier
-          .width(IntrinsicSize.Max)
-          .height(IntrinsicSize.Max)
-          .weight(1.0F)
           .focusRequester(focusRequester)
+          .fillMaxSize()
       )
+    }
+  }
+}
+//
+//    Column(
+//      modifier = Modifier.padding(16.dp),
+//      horizontalAlignment = Alignment.CenterHorizontally,
+//    ) {
+//      Row {
+//        TextButton(
+//          onClick = {
+//            onCancel()
+//            dismissAction()
+//          }
+//        ) {
+//          Text("Cancel")
+//        }
+//
+//        Spacer(modifier = Modifier.weight(1.0F))
+//
+//        Text(text = "Note")
+//
+//        Spacer(modifier = Modifier.weight(1.0F))
+//
+//        TextButton(
+//          onClick = {
+//            onSave(annotation.value)
+//            dismissAction()
+//          }
+//        ) {
+//          Text("Save")
+//        }
+//      }
+//
+//      Spacer(modifier = Modifier.height(8.dp))
+//
+//
+//
+//      Spacer(modifier = Modifier.height(16.dp))
 
-      LaunchedEffect(Unit) {
-        focusRequester.requestFocus()
-      }
+//
+//      LaunchedEffect(Unit) {
+//        focusRequester.requestFocus()
+//      }
 
 //      Row {
 //        Spacer(modifier = Modifier.weight(0.1F))
@@ -142,8 +185,7 @@ fun AnnotationEditView(
 //        )
 //        Spacer(modifier = Modifier.weight(0.1F))
 //      }
-    }
-
-    Spacer(modifier = Modifier.height(16.dp))
-  }
-}
+//    }
+//
+// // }
+//}
diff --git a/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/ReaderPreferencesView.kt b/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/ReaderPreferencesView.kt
index 6101a6002..7d452170b 100644
--- a/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/ReaderPreferencesView.kt
+++ b/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/ReaderPreferencesView.kt
@@ -49,6 +49,7 @@ fun ReaderPreferencesView(webReaderViewModel: WebReaderViewModel) {
   Column(
     modifier = Modifier
       .padding(horizontal = 15.dp)
+      .padding(vertical = 35.dp)
       .verticalScroll(rememberScrollState())
   ) {
     Row(
diff --git a/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/WebReader.kt b/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/WebReader.kt
index 80d2c5592..6dc195ffc 100644
--- a/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/WebReader.kt
+++ b/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/WebReader.kt
@@ -30,7 +30,6 @@ import java.util.*
 @SuppressLint("SetJavaScriptEnabled")
 @Composable
 fun WebReader(
-  preferences: WebPreferences,
   styledContent: String,
   webReaderViewModel: WebReaderViewModel
 ) {
diff --git a/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/WebReaderLoadingContainer.kt b/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/WebReaderLoadingContainer.kt
index 8410aeb59..56f1263f0 100644
--- a/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/WebReaderLoadingContainer.kt
+++ b/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/WebReaderLoadingContainer.kt
@@ -121,7 +121,7 @@ fun WebReaderLoadingContainer(slug: String? = null, requestID: String? = null,
   val onBackPressedDispatcher = LocalOnBackPressedDispatcherOwner.current?.onBackPressedDispatcher
 
   var isMenuExpanded by remember { mutableStateOf(false) }
-  var bottomSheetState by remember { mutableStateOf(app.omnivore.omnivore.ui.reader.BottomSheetState.NONE)}
+  var bottomSheetState by remember { mutableStateOf(BottomSheetState.NONE) }
 
   val currentThemeKey = webReaderViewModel.currentThemeKey.observeAsState()
   val currentTheme = Themes.values().find { it.themeKey == currentThemeKey.value }
@@ -147,11 +147,18 @@ fun WebReaderLoadingContainer(slug: String? = null, requestID: String? = null,
   } ?: null
 
   val modalBottomSheetState = rememberModalBottomSheetState(
-    ModalBottomSheetValue.Hidden,
+    initialValue = ModalBottomSheetValue.Hidden,
   )
 
   val themeTintColor = Color(currentTheme?.foregroundColor ?: 0xFFFFFFFF)
 
+  annotation?.let {
+    bottomSheetState = BottomSheetState.HIGHLIGHTNOTE
+    coroutineScope.launch {
+      modalBottomSheetState.animateTo(ModalBottomSheetValue.Expanded)
+    }
+  }
+
   ModalBottomSheetLayout(
     modifier = Modifier
       .statusBarsPadding(),
@@ -172,7 +179,27 @@ fun WebReaderLoadingContainer(slug: String? = null, requestID: String? = null,
           }
         }
         BottomSheetState.HIGHLIGHTNOTE -> {
-
+          annotation?.let { annotation ->
+            BottomSheetUI(title = "Note") {
+              AnnotationEditView(
+                initialAnnotation = annotation,
+                onSave = {
+                  webReaderViewModel.saveAnnotation(it)
+                  coroutineScope.launch {
+                    modalBottomSheetState.hide()
+                    bottomSheetState = BottomSheetState.NONE
+                  }
+                },
+                onCancel = {
+                  webReaderViewModel.cancelAnnotationEdit()
+                  coroutineScope.launch {
+                    modalBottomSheetState.hide()
+                    bottomSheetState = BottomSheetState.NONE
+                  }
+                }
+              )
+            }
+          }
         }
         BottomSheetState.NONE -> {
 
@@ -215,9 +242,9 @@ fun WebReaderLoadingContainer(slug: String? = null, requestID: String? = null,
             }
             webReaderParams?.let {
               IconButton(onClick = {
-                bottomSheetState = BottomSheetState.NOTEBOOK
                 coroutineScope.launch {
-                  modalBottomSheetState.show()
+                  bottomSheetState = BottomSheetState.NOTEBOOK
+                  modalBottomSheetState.animateTo(ModalBottomSheetValue.Expanded)
                 }
               }) {
                 Icon(
@@ -228,9 +255,9 @@ fun WebReaderLoadingContainer(slug: String? = null, requestID: String? = null,
               }
             }
             IconButton(onClick = {
-              bottomSheetState = BottomSheetState.PREFERENCES
               coroutineScope.launch {
-                modalBottomSheetState.show()
+                bottomSheetState = BottomSheetState.PREFERENCES
+                modalBottomSheetState.animateTo(ModalBottomSheetValue.HalfExpanded)
               }
             }) {
               Icon(
@@ -239,52 +266,39 @@ fun WebReaderLoadingContainer(slug: String? = null, requestID: String? = null,
                 tint = themeTintColor
               )
             }
-            IconButton(onClick = { isMenuExpanded = true }) {
-              Icon(
-                painter = painterResource(id = R.drawable.dots_horizontal),
-                contentDescription = null,
-                tint = themeTintColor
-              )
-              if (isMenuExpanded) {
-                webReaderParams?.let { params ->
-                  SavedItemContextMenu(
-                    isExpanded = isMenuExpanded,
-                    isArchived = params.item.isArchived,
-                    onDismiss = { isMenuExpanded = false },
-                    actionHandler = {
-                      webReaderViewModel.handleSavedItemAction(
-                        params.item.savedItemId,
-                        it
-                      )
-                    }
-                  )
+              IconButton(onClick = { isMenuExpanded = true }) {
+                Icon(
+                  painter = painterResource(id = R.drawable.dots_horizontal),
+                  contentDescription = null,
+                  tint = themeTintColor
+                )
+                if (isMenuExpanded) {
+                  webReaderParams?.let { params ->
+                    SavedItemContextMenu(
+                      isExpanded = isMenuExpanded,
+                      isArchived = params.item.isArchived,
+                      onDismiss = { isMenuExpanded = false },
+                      actionHandler = {
+                        webReaderViewModel.handleSavedItemAction(
+                          params.item.savedItemId,
+                          it
+                        )
+                      }
+                    )
+                  }
                 }
               }
-            }
           },
         )
       }
     ) { paddingValues ->
           if (styledContent != null) {
             WebReader(
-              preferences = webReaderViewModel.storedWebPreferences(isSystemInDarkTheme()),
               styledContent = styledContent,
               webReaderViewModel = webReaderViewModel
             )
           }
 
-          if (annotation != null) {
-            AnnotationEditView(
-              initialAnnotation = annotation!!,
-              onSave = {
-                webReaderViewModel.saveAnnotation(it)
-              },
-              onCancel = {
-                webReaderViewModel.cancelAnnotationEdit()
-              }
-            )
-          }
-
           WebReaderLabelsSelectionSheet(webReaderViewModel)
         }
 
@@ -296,6 +310,7 @@ fun WebReaderLoadingContainer(slug: String? = null, requestID: String? = null,
     }
 }
 
+
 @OptIn(ExperimentalMaterial3Api::class, ExperimentalMaterialApi::class)
 @Composable
 fun BottomSheetUI(title: String?, content: @Composable () -> Unit) {
@@ -310,7 +325,6 @@ fun BottomSheetUI(title: String?, content: @Composable () -> Unit) {
     Scaffold(
     ) { paddingValues ->
       Box(modifier = Modifier
-        .padding(paddingValues)
         .fillMaxSize()) {
         content()
       }