style: 用 Element Plus 变量替换硬编码中性色值

src/views/demo/dict-sync.vue

@@ -281,7 +281,7 @@ pre {
   overflow-y: auto;
   overflow-wrap: break-word;
   white-space: pre-wrap;
-  background-color: #f8f9fa;
+  background-color: var(--el-fill-color-light);
   border-radius: 4px;
 }
 
@@ -290,7 +290,7 @@ pre {
   padding: 8px;
   overflow-y: auto;
   font-size: 12px;
-  background-color: #f8f9fa;
+  background-color: var(--el-fill-color-light);
   border-radius: 4px;
 }
 
@@ -300,10 +300,10 @@ pre {
 
 .text-muted {
   font-size: 0.9em;
-  color: #909399;
+  color: var(--el-text-color-secondary);
 }
 
 .border-top {
-  border-top: 1px solid #ebeef5;
+  border-top: 1px solid var(--el-border-color-light);
 }
 </style>

src/views/demo/signature.vue

@@ -26,6 +26,7 @@ import FileAPI from "@/api/file";
 const imgUrl = ref("");
 const canvas = ref();
 let ctx: CanvasRenderingContext2D;
+let strokeColor = "#000";
 
 // 正在绘制中，用来控制 move 和 end 事件
 let painting = false;
@@ -78,6 +79,8 @@ const onEventEnd = () => {
 
 onMounted(() => {
   ctx = canvas.value.getContext("2d") as CanvasRenderingContext2D;
+  const rootStyle = getComputedStyle(document.documentElement);
+  strokeColor = rootStyle.getPropertyValue("--el-text-color-primary").trim() || "#000";
 });
 const handleToFile = async () => {
   if (isCanvasBlank(canvas.value)) {
@@ -148,7 +151,7 @@ function paint(
   ctx.beginPath();
   ctx.globalAlpha = 1;
   ctx.lineWidth = 2;
-  ctx.strokeStyle = "#000";
+  ctx.strokeStyle = strokeColor;
   ctx.moveTo(startX, startY);
   ctx.lineTo(endX, endY);
   ctx.closePath();
@@ -160,10 +163,10 @@ function paint(
   width: 100%;
   height: 100%;
   padding: 0 20px;
-  background-color: #fff;
+  background-color: var(--el-bg-color);
 
   canvas {
-    border: 1px solid #e6e6e6;
+    border: 1px solid var(--el-border-color);
   }
 
   header {