浏览代码

文物列表页文物标题外观改版

任一存 1 年之前
父节点
当前提交
26335e37f0
共有 3 个文件被更改,包括 12 次插入11 次删除
  1. 二进制
      src/assets/images/relic-item-title-bg-wide.png
  2. 二进制
      src/assets/images/relic-item-title-bg.png
  3. 12 11
      src/views/RelicList.vue

二进制
src/assets/images/relic-item-title-bg-wide.png


二进制
src/assets/images/relic-item-title-bg.png


+ 12 - 11
src/views/RelicList.vue

@@ -59,7 +59,7 @@
           <div
             class="name"
             :class="{
-              wide: item['名称'].length > 12
+              wide: item['名称'].length > 11
             }"
             :title="item['名称']"
           >
@@ -388,15 +388,15 @@ function onClickItem(idx) {
         >.name {
           flex: 0 0 auto;
           position: absolute;
-          top: calc(15 / @page-height-design-px * 100vh * 0.83);
-          right: calc(30 / @page-height-design-px * 100vh * 0.83);
-          width: calc(56 / @page-height-design-px * 100vh * 0.83);
-          height: calc(313 / @page-height-design-px * 100vh * 0.83);
-          font-size: calc(23 / @page-height-design-px * 100vh * 0.83);
+          top: calc(10 / @page-height-design-px * 100vh * 0.83);
+          right: calc(32 / @page-height-design-px * 100vh * 0.83);
+          width: calc(47 / @page-height-design-px * 100vh * 0.83);
+          line-height: calc(47 / @page-height-design-px * 100vh * 0.83);
+          height: calc(261 / @page-height-design-px * 100vh * 0.83);
+          font-size: calc(19 / @page-height-design-px * 100vh * 0.83);
           font-family: Source Han Serif CN, Source Han Serif CN;
           font-weight: 800;
           color: #43310E;
-          line-height: calc(56 / @page-height-design-px * 100vh * 0.83);
           display: -webkit-box;
           -webkit-box-orient: vertical;
           -webkit-line-clamp: 2;
@@ -407,13 +407,14 @@ function onClickItem(idx) {
           background-repeat: no-repeat;
           background-position: center center;
           text-align: center;
-          padding-top: calc(10 / @page-height-design-px * 100vh * 0.83);
-          padding-bottom: calc(10 / @page-height-design-px * 100vh * 0.83);
+          padding-top: calc(17 / @page-height-design-px * 100vh * 0.83);
+          padding-bottom: calc(17 / @page-height-design-px * 100vh * 0.83);
           z-index: 1;
         }
         >.name.wide{
-          width: calc(102 / @page-height-design-px * 100vh * 0.83);
-          height: calc(316 / @page-height-design-px * 100vh * 0.83);
+          right: calc(12 / @page-height-design-px * 100vh * 0.83);
+          width: calc(82 / @page-height-design-px * 100vh * 0.83);
+          height: calc(255 / @page-height-design-px * 100vh * 0.83);
           line-height: 1.5em;
           background-image: url(@/assets/images/relic-item-title-bg-wide.png);
           padding-right: 0.7em;