fix ذشزنلقخعدی

src/views/base/home/components/BoursecuAssetsSummary.vue

@@ -17,23 +17,23 @@
         >
           <BasicIcon icon="vuesax-linear:info-circle" size="18" :color="iconColor" />
         </button>
+      </div>
+      <div
+        v-if="openRowId === row.id"
+        class="boursecu-assets__popup"
+        @click.stop
+      >
         <div
-          v-if="openRowId === row.id"
-          class="boursecu-assets__popup"
-          @click.stop
+          v-for="line in row.popupLines"
+          :key="line.label"
+          class="boursecu-assets__popup-line"
+          :class="{
+            'boursecu-assets__popup-line--profit': line.tone === 'profit',
+            'boursecu-assets__popup-line--loss': line.tone === 'loss',
+          }"
         >
-          <div
-            v-for="line in row.popupLines"
-            :key="line.label"
-            class="boursecu-assets__popup-line"
-            :class="{
-              'boursecu-assets__popup-line--profit': line.tone === 'profit',
-              'boursecu-assets__popup-line--loss': line.tone === 'loss',
-            }"
-          >
-            <span class="boursecu-assets__popup-label">{{ line.label }}</span>
-            <span class="boursecu-assets__popup-value">{{ line.value }}</span>
-          </div>
+          <span class="boursecu-assets__popup-label">{{ line.label }}</span>
+          <span class="boursecu-assets__popup-value">{{ line.value }}</span>
         </div>
       </div>
     </div>
@@ -86,6 +86,7 @@ onClickOutside(rootRef, () => {
 }
 
 .boursecu-assets__row {
+  position: relative;
   display: flex;
   align-items: center;
   justify-content: center;
@@ -122,9 +123,12 @@ onClickOutside(rootRef, () => {
 .boursecu-assets__popup {
   position: absolute;
   top: calc(100% + 8px);
-  right: 0;
+  left: 50%;
+  right: auto;
+  transform: translateX(-50%);
   z-index: 40;
-  min-width: min(18rem, 78vw);
+  width: min(18rem, calc(100vw - 2rem));
+  max-width: calc(100vw - 2rem);
   padding: 10px 12px;
   border-radius: 10px;
   background: #fff;
@@ -177,9 +181,11 @@ onClickOutside(rootRef, () => {
   }
 
   .boursecu-assets__popup {
-    right: auto;
     left: 0;
-    min-width: 20rem;
+    right: auto;
+    transform: none;
+    width: min(20rem, calc(100% - 1rem));
+    max-width: 20rem;
   }
 }
 </style>