diff --git a/module/block/css/docmycollectionblock.ui.css b/module/block/css/docmycollectionblock.ui.css
index a1df96d0ef..779d17cd1d 100644
--- a/module/block/css/docmycollectionblock.ui.css
+++ b/module/block/css/docmycollectionblock.ui.css
@@ -1,10 +1 @@
-.docmycollection-block .panel-body {padding: 0px 16px 12px 16px;}
-.docmycollection-block .doc-list {display: flex; flex-wrap: wrap; padding: 0 4px 0 0;}
-.docmycollection-block .doc-list > .doc-box {flex: 0 1 50%; padding: 4px; width: 0;}
-.docmycollection-block .doc-list > .doc-box .date-interval {float: right; padding: 8px 0 8px 12px;}
-.docmycollection-block .doc-list > .doc-box > .btn > h4 {padding-right: 5px;}
-.docmycollection-block .doc-list > .doc-box .file-icon {margin-right: 2px; margin-bottom: 2px;}
-.docmycollection-block .doc-list > .doc-box .plug-title {height: 16px; overflow: hidden;}
-.docmycollection-block .doc-list > .doc-box .border:hover {border-color: var(--color-primary-600)}
-
-.docmycollection-block.block-sm .doc-list > .doc-box {flex: 0 1 100%;}
+.block-docmycollection .flex > .border:hover {border-color: var(--color-primary-600)}
diff --git a/module/block/ui/docmycollectionblock.html.php b/module/block/ui/docmycollectionblock.html.php
index 175a46b83b..f0cf811807 100644
--- a/module/block/ui/docmycollectionblock.html.php
+++ b/module/block/ui/docmycollectionblock.html.php
@@ -10,67 +10,65 @@ declare(strict_types=1);
 */
 
 namespace zin;
-?>
-<?php $canView = common::hasPriv('doc', 'view');?>
-<div>
-  <?php if(empty($docList)):?>
-    <div class='table-empty-tip'><p><span class='text-muted'><?php echo $lang->doc->noDoc;?></p></span></div>
-  <?php else:?>
-  <div class="doc-list">
-    <?php foreach($docList as $doc):?>
-    <div class="doc-box">
-      <a href='<?php echo $canView ? $this->createLink("doc", "view", "docID=$doc->id") : 'javascript:;';?>'>
-        <div class="p-2 border">
-            <span class='date-interval text-muted text-gray'>
-              <?php
-              $interval = $doc->editInterval;
-              $editTip  = $lang->doc->todayUpdated;
-              if($interval->year)
-              {
-                $editTip = sprintf($lang->doc->yearsUpdated, $interval->year);
-              }
-              elseif($interval->month)
-              {
-                $editTip = sprintf($lang->doc->monthsUpdated, $interval->month);
-              }
-              elseif($interval->day)
-              {
-                $editTip = sprintf($lang->doc->daysUpdated, $interval->day);
-              }
-              echo $editTip;
-              ?>
-            </span>
-            <h4 class="plug-title my-2 text-black font-bold" title="<?php echo $doc->title;?>">
-              <?php
-              $docType = $doc->type == 'text' ? 'wiki-file' : $doc->type;
-              echo html::image("static/svg/{$docType}.svg", "class='file-icon inline'");
-              ?>
-              <?php echo $doc->title;?>
-            </h4>
-            <p class='edit-date text-muted text-gray mb-2'><?php echo $lang->doc->editedDate . (common::checkNotCN() ? ': ' : '：') . $doc->editedDate;?></p>
-        </div>
-      </a>
-    </div>
-    <?php endforeach;?>
-  </div>
-  <?php endif;?>
-</div>
-<?php
-panel
-(
-    set('class', 'docmycollection-block ' . ($longBlock ? 'block-long' : 'block-sm')),
-    set::title($block->title),
-    to::headingActions
+
+$canView = common::hasPriv('doc', 'view');
+
+$docItems = array();
+foreach($docList as $doc)
+{
+    $editTip  = $lang->doc->todayUpdated;
+    $interval = $doc->editInterval;
+    if($interval->year)
+    {
+      $editTip = sprintf($lang->doc->yearsUpdated, $interval->year);
+    }
+    elseif($interval->month)
+    {
+      $editTip = sprintf($lang->doc->monthsUpdated, $interval->month);
+    }
+    elseif($interval->day)
+    {
+      $editTip = sprintf($lang->doc->daysUpdated, $interval->day);
+    }
+
+    $docType = $doc->type == 'text' ? 'wiki-file' : $doc->type;
+
+    $docItems[] = cell
     (
+        set::width('49%'),
+        setStyle('width', '49%'),
+        setClass('border rounded-lg p-2'),
         a
         (
-            set('class', 'text-gray'),
-            set('href', createLink('doc', 'myspace', 'type=collect&libID=0&moduleID=0&browseType=all&param=0&orderBy=editedDate_desc')),
-            $lang->more,
-            icon('caret-right')
+            setClass('text-left w-full'),
+            set('href', $canView ? createLink('doc', 'view', "docID={$doc->id}") : null),
+            span
+            (
+                setClass('text-gray my-2 pl-2 pull-right'),
+                $editTip,
+            ),
+            div
+            (
+                setClass('article-h3 my-2 mr-2 clip'),
+                img
+                (
+                    setClass('inline pr-1'),
+                    set('src', "static/svg/{$docType}.svg")
+                ),
+                $doc->title
+            ),
+            p
+            (
+                setClass('edit-date text-gray'),
+                $lang->doc->editedDate . (common::checkNotCN() ? ': ' : '：') . $doc->editedDate
+            )
         )
-    ),
-    rawContent()
+    );
+}
+
+blockPanel
+(
+    empty($docList) ? $lang->doc->noDoc : div(setClass('flex flex-wrap content-between gap-3'), $docItems)
 );
 
 render();