@deppon/deppon-template 2.5.7 → 2.5.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/README.md +5 -0
  2. package/es/pro-layout/ProLayout.vue.css +14 -43
  3. package/package.json +6 -6
package/README.md CHANGED
@@ -325,6 +325,11 @@ const handleClick = () => {
325
325
  </script>
326
326
  ```
327
327
 
328
+ ## 设计规范
329
+
330
+ - [设计规范文档（Markdown）](./docs/design-spec.md)
331
+ - [设计规范可视化页面](./docs/design-spec.html)（浏览器直接打开）
332
+
328
333
  ## ProIframe 内嵌页
329
334
 
330
335
  在 ProLayout 内通过 iframe 加载页面，支持路由动态传 `url`。详见 [docs/pro-iframe.md](./docs/pro-iframe.md) 或文档站 [ProIframe 说明](../../docs/docs/deppon-template-pro-iframe.md)。
package/es/pro-layout/ProLayout.vue.css CHANGED
@@ -1216,9 +1216,6 @@ body .el-overlay-dialog,
1216
1216
  --pro-layout-text-muted: #64748b;
1217
1217
  /* 顶栏横向菜单：圆体（可通过 --pro-layout-top-menu-font-family 覆盖） */
1218
1218
  --pro-layout-top-menu-font-family: 'DM Sans', 'Yuanti SC', 'Yuanti TC', 'Hiragino Sans GB', 'PingFang SC', 'Microsoft YaHei UI', system-ui, sans-serif;
1219
- --pro-layout-top-menu-active-bar-width: 28px;
1220
- --pro-layout-top-menu-active-bar-height: 3px;
1221
- --pro-layout-top-menu-active-bar-offset: 4px;
1222
1219
  background: var(--pro-layout-shell-bg) !important;
1223
1220
  color: var(--pro-layout-text);
1224
1221
  font-family: 'DM Sans', 'PingFang SC', 'Microsoft YaHei', system-ui, sans-serif;
@@ -2060,7 +2057,7 @@ body .el-overlay-dialog,
2060
2057
  padding: 0 6px;
2061
2058
  /* 覆盖 Element Plus：.el-menu-item [class^=el-icon] 的 margin-right，间距改由 label 的 gap 控制 */
2062
2059
  /* 首项（工作台）：极浅底、紧凑内边距；选中与顶栏其它项一致用主题色 */
2063
- /* 其余项选中：加粗、近黑字；下划线挂在菜单项上，绝对定位不占布局、不挡选中背景 */
2060
+ /* 其余项选中：--el-color-primary 点亮文案与图标（工作台 --lead 保持独立样式） */
2064
2061
  }
2065
2062
  .pro-layout__top-menu-glass {
2066
2063
  display: flex;
@@ -2265,65 +2262,39 @@ body .el-overlay-dialog,
2265
2262
  color: var(--el-color-primary, #409eff) !important;
2266
2263
  }
2267
2264
  .pro-layout__top-menu .el-menu-item.is-active:not(.pro-layout__top-menu-divider):not(.pro-layout__top-menu-item--lead) {
2268
- position: relative !important;
2269
- color: rgba(0, 0, 0, 0.88) !important;
2265
+ color: var(--el-color-primary, #409eff) !important;
2270
2266
  background: transparent !important;
2271
2267
  box-shadow: none !important;
2272
- font-weight: 700 !important;
2273
- }
2274
- .pro-layout__top-menu .el-menu-item.is-active:not(.pro-layout__top-menu-divider):not(.pro-layout__top-menu-item--lead)::after {
2275
- content: '';
2276
- position: absolute;
2277
- left: 50%;
2278
- bottom: -2px;
2279
- width: var(--pro-layout-top-menu-active-bar-width);
2280
- height: var(--pro-layout-top-menu-active-bar-height);
2281
- transform: translateX(-50%);
2282
- border-radius: 999px;
2283
- background: var(--pro-layout-accent, #6366f1);
2284
- box-shadow: 0 1px 4px color-mix(in srgb, var(--pro-layout-accent, #6366f1) 35%, transparent);
2285
- pointer-events: none;
2286
- z-index: 1;
2268
+ font-weight: 600 !important;
2287
2269
  }
2288
2270
  .pro-layout__top-menu .el-menu-item.is-active:not(.pro-layout__top-menu-divider):not(.pro-layout__top-menu-item--lead):hover {
2289
2271
  background: transparent !important;
2290
2272
  }
2291
2273
  .pro-layout__top-menu .el-sub-menu.is-active:not(.pro-layout__top-menu-item--lead) > .el-sub-menu__title {
2292
- position: relative !important;
2293
- color: rgba(0, 0, 0, 0.88) !important;
2274
+ color: var(--el-color-primary, #409eff) !important;
2294
2275
  background: transparent !important;
2295
2276
  box-shadow: none !important;
2296
- font-weight: 700 !important;
2297
- }
2298
- .pro-layout__top-menu .el-sub-menu.is-active:not(.pro-layout__top-menu-item--lead) > .el-sub-menu__title::after {
2299
- content: '';
2300
- position: absolute;
2301
- left: 50%;
2302
- bottom: -2px;
2303
- width: var(--pro-layout-top-menu-active-bar-width);
2304
- height: var(--pro-layout-top-menu-active-bar-height);
2305
- transform: translateX(-50%);
2306
- border-radius: 999px;
2307
- background: var(--pro-layout-accent, #6366f1);
2308
- box-shadow: 0 1px 4px color-mix(in srgb, var(--pro-layout-accent, #6366f1) 35%, transparent);
2309
- pointer-events: none;
2310
- z-index: 1;
2277
+ font-weight: 600 !important;
2311
2278
  }
2312
2279
  .pro-layout__top-menu .el-sub-menu.is-active:not(.pro-layout__top-menu-item--lead) > .el-sub-menu__title:hover {
2313
2280
  background: transparent !important;
2314
2281
  }
2315
2282
  .pro-layout__top-menu .el-menu-item.is-active:not(.pro-layout__top-menu-divider):not(.pro-layout__top-menu-item--lead) .pro-layout__top-menu-item-label,
2316
2283
  .pro-layout__top-menu .el-sub-menu.is-active:not(.pro-layout__top-menu-item--lead) .pro-layout__top-menu-item-label {
2317
- color: rgba(0, 0, 0, 0.88) !important;
2318
- font-weight: 700 !important;
2284
+ color: var(--el-color-primary, #409eff) !important;
2285
+ font-weight: 600 !important;
2319
2286
  }
2320
2287
  .pro-layout__top-menu .el-menu-item.is-active:not(.pro-layout__top-menu-divider):not(.pro-layout__top-menu-item--lead) .pro-layout__top-menu-item-text,
2321
2288
  .pro-layout__top-menu .el-sub-menu.is-active:not(.pro-layout__top-menu-item--lead) .pro-layout__top-menu-item-text {
2322
- color: rgba(0, 0, 0, 0.88) !important;
2289
+ color: var(--el-color-primary, #409eff) !important;
2323
2290
  }
2324
2291
  .pro-layout__top-menu .el-menu-item.is-active:not(.pro-layout__top-menu-divider):not(.pro-layout__top-menu-item--lead) .pro-layout__top-menu-item-icon,
2325
2292
  .pro-layout__top-menu .el-sub-menu.is-active:not(.pro-layout__top-menu-item--lead) .pro-layout__top-menu-item-icon {
2326
- color: rgba(0, 0, 0, 0.62) !important;
2293
+ color: var(--el-color-primary, #409eff) !important;
2294
+ }
2295
+ .pro-layout__top-menu .el-menu-item.is-active:not(.pro-layout__top-menu-divider):not(.pro-layout__top-menu-item--lead) .pro-layout__top-menu-item-icon svg,
2296
+ .pro-layout__top-menu .el-sub-menu.is-active:not(.pro-layout__top-menu-item--lead) .pro-layout__top-menu-item-icon svg {
2297
+ fill: currentColor !important;
2327
2298
  }
2328
2299
  .pro-layout__top-menu .el-sub-menu__icon-arrow {
2329
2300
  margin-left: 2px !important;
@@ -2331,7 +2302,7 @@ body .el-overlay-dialog,
2331
2302
  color: rgba(0, 0, 0, 0.35) !important;
2332
2303
  }
2333
2304
  .pro-layout__top-menu .el-sub-menu.is-active:not(.pro-layout__top-menu-item--lead) .el-sub-menu__icon-arrow {
2334
- color: rgba(0, 0, 0, 0.5) !important;
2305
+ color: var(--el-color-primary, #409eff) !important;
2335
2306
  }
2336
2307
  .pro-layout__breadcrumb {
2337
2308
  display: flex;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@deppon/deppon-template",
3
- "version": "2.5.7",
3
+ "version": "2.5.8",
4
4
  "main": "es/index.js",
5
5
  "module": "es/index.js",
6
6
  "typings": "es/index.d.ts",
@@ -51,11 +51,11 @@
51
51
  "less": "^4.2.0"
52
52
  },
53
53
  "dependencies": {
54
- "@deppon/deppon-assets": "2.5.7",
55
- "@deppon/deppon-request": "2.5.7",
56
- "@deppon/deppon-router": "2.5.7",
57
- "@deppon/deppon-ui": "2.5.7",
58
- "@deppon/deppon-utils": "2.5.7",
54
+ "@deppon/deppon-assets": "2.5.8",
55
+ "@deppon/deppon-request": "2.5.8",
56
+ "@deppon/deppon-router": "2.5.8",
57
+ "@deppon/deppon-ui": "2.5.8",
58
+ "@deppon/deppon-utils": "2.5.8",
59
59
  "dayjs": "^1.11.10",
60
60
  "lodash-es": "^4.17.21",
61
61
  "mitt": "^3.0.1"