more reasonable fixed layout

src/components/ZoomPaper.vue

@@ -62,11 +62,10 @@ const lessThanOneScale = computed(() => {
 <style scoped>
 .zoom-container {
   z-index: 1000;
-  position: sticky;
+  position: fixed;
   background-color: rgba(0, 0, 0, 0.9);
-  bottom: 0px;
-  margin-top: -100px;
-  left: calc(100% - 50px);
+  bottom: 10px;
+  right: 320px;
   width: 40px;
   height: 100px;
   border-radius: 10px;

src/features/mark/CommonMarkBody.vue

@@ -509,6 +509,7 @@ const showBigImage = (event: MouseEvent) => {
 
 <style scoped>
 .mark-body-container {
+  position: relative;
   min-height: calc(100vh - 56px);
   height: calc(100vh - 56px);
   overflow: auto;
@@ -522,6 +523,7 @@ const showBigImage = (event: MouseEvent) => {
     linear-gradient(-45deg, transparent 75%, #e0e0e0 75%);
   background-size: 20px 20px;
   background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
+  transform: inherit;
 }
 .mark-body-container img {
   width: 100%;
@@ -533,10 +535,9 @@ const showBigImage = (event: MouseEvent) => {
   border: 2px solid transparent;
 }
 .status-container {
-  position: sticky;
-  bottom: calc(100% - 40px);
-  left: calc(100% - 40px);
-  margin-top: -40px;
+  position: fixed;
+  top: 56px;
+  right: 340px;
   color: white;
   pointer-events: none;
   font-size: 16px;