瀏覽代碼

fix: resolve responsive layout issues

likui628 8 月之前
父節點
當前提交
3a7b5c2965

+ 3 - 3
apps/web-antd/src/views/dashboard/workspace/index.vue

@@ -211,12 +211,12 @@ const trendItems: WorkbenchTrendItem[] = [
       <template #description> 今日晴,20℃ - 32℃! </template>
     </WorkbenchHeader>
 
-    <div class="mt-5 flex">
-      <div class="mr-4 w-full md:w-3/5">
+    <div class="mt-5 flex flex-col lg:flex-row">
+      <div class="mr-4 w-full lg:w-3/5">
         <WorkbenchProject :items="projectItems" title="项目" />
         <WorkbenchTrends :items="trendItems" class="mt-5" title="最新动态" />
       </div>
-      <div class="w-full md:w-2/5">
+      <div class="w-full lg:w-2/5">
         <WorkbenchQuickNav :items="quickNavItems" title="快捷导航" />
         <WorkbenchTodo :items="todoItems" class="mt-5" title="待办事项" />
         <AnalysisChartCard class="mt-5" title="访问来源">

+ 1 - 1
packages/effects/common-ui/src/dashboard/workbench/workbench-project.vue

@@ -36,7 +36,7 @@ withDefaults(defineProps<Props>(), {
             'border-b-0': index < 3,
             'pb-4': index > 2,
           }"
-          class="border-border group w-1/3 cursor-pointer border-b border-r border-t p-4 transition-all hover:shadow-xl"
+          class="border-border group w-full cursor-pointer border-b border-r border-t p-4 transition-all hover:shadow-xl md:w-1/2 lg:w-1/3"
         >
           <div class="flex items-center">
             <VbenIcon