问题修改

src/components/CommonPreview.vue

@@ -4,7 +4,8 @@
       <div class="menu-container">
         {{ courseware_info.book_name }}
       </div>
-      <div class="courseware">
+
+      <div class="courseware-top">
         <span class="name-path">{{ courseware_info.name_path }}</span>
         <span class="flow-nodename">{{ courseware_info.cur_audit_flow_node_name }}</span>
         <slot name="middle" :courseware="courseware_info"></slot>
@@ -1855,7 +1856,7 @@ $total-width: $courseware-width + $courseware-left-margin + $courseware-right-ma
       border-right: $border;
     }
 
-    > .courseware {
+    > .courseware-top {
       display: flex;
       flex-grow: 1;
       column-gap: 16px;

src/views/book/courseware/create/components/SetBackground.vue

@@ -278,7 +278,8 @@ export default {
         const isGlobal = this.backgroundData.is_global;
         const courseware = isGlobal
           ? document.querySelector('main.preview-main')
-          : document.querySelector('div.courseware');
+          : document.querySelector('div.courseware.preview');
+
         if (courseware) {
           const rect = courseware.getBoundingClientRect();
           const coursewareRatio = rect.width / rect.height;

src/views/book/courseware/preview/CoursewarePreview.vue

@@ -2,7 +2,7 @@
   <div
     id="selectable-area-preview"
     ref="courseware"
-    class="courseware"
+    class="courseware preview"
     :style="computedCoursewareStyle"
     @mouseup="handleTextSelection"
     @mousedown="startSelection"