Merge pull request #266 from XPoet/dev

Optimize base style
XPoet · Nov 24, 2023 · a409270 · a409270
2 parents 72a6c27 + 4ca8ce3
commit a409270
Show file tree

Hide file tree

Showing 13 changed files with 32 additions and 61 deletions.
diff --git a/.github/FUNDING.yml b/.github/FUNDING.yml
@@ -9,4 +9,4 @@ community_bridge: # Replace with a single Community Bridge project-name e.g., cl
 liberapay: # Replace with a single Liberapay username
 issuehunt: # Replace with a single IssueHunt username
 otechie: # Replace with a single Otechie username
-custom: ['https://xpoet.cn/images/reward.png', 'https://xpoet.cn/images/fec/appreciation.webp']
+custom: ['https://xpoet.cn/post/0054d541d734/']
diff --git a/README.md b/README.md
@@ -1,5 +1,5 @@
 <a href="https://picx.xpoet.cn" >
-<img width="100" align="right" alt="PicX" src="https://xpoet.cn/images/picx/picx-logo.png">
+<img width="100" align="right" alt="PicX" src="https://picx-docs.xpoet.cn/images/logo.png">
 </a>
 
 # PicX
@@ -30,7 +30,7 @@
 
 ## 文档 | Documents
 
-官方文档入口 >> https://picx-docs.xpoet.cn
+官方文档 https://picx-docs.xpoet.cn
 
 通过阅读 **[快速开始](https://picx-docs.xpoet.cn/usage-guide/get-start.html)** 教程，可帮助你迅速上手 PicX。 
 
@@ -54,7 +54,7 @@
 
 欢迎各种形式的贡献，包括但不限于：美化界面、增加功能、性能优化、修复 Bug、完善文档等。
 
-> [PicX 贡献指南](https://picx-docs.xpoet.cn/user-notice/contribution-guide.html)
+> [PicX 贡献指南](https://picx-docs.xpoet.cn/contribution-guide/contribution-guide.html)
 
 ### 致谢
 
@@ -66,13 +66,13 @@
 
 ##  反馈 | Feedback
 
-在使用过程中，如遇问题，请仔细阅读 **[官方文档](https://picx-docs.xpoet.cn)**，或给作者提 **[Issue](https://github.com/XPoet/picx/issues)**。
+在使用过程中，如遇问题，请仔细阅读 **[官方文档](https://picx-docs.xpoet.cn)**，或在 GitHub 发起 **[Issue](https://github.com/XPoet/picx/issues)**。
 
 ## 赞赏 | Appreciation
 
 PicX 的更新迭代依靠作者工作之外的时间，维护不易，如果对你有帮助，欢迎赞赏作者，支持开源。
 
-<img width="320" src="https://xpoet.cn/images/fec/appreciation.webp" />
+<img width="320" src="https://xpoet.cn/images/admire-code-wechat.webp" />
 
 ## 许可 | License
 

diff --git a/src/assets/appreciation.webp b/src/assets/appreciation.webp
diff --git a/src/components/copy-image-link/copy-image-link.styl b/src/components/copy-image-link/copy-image-link.styl
@@ -1,34 +1,7 @@
 .copy-image-link-box {
-  position relative
-  display flex
-  align-items center
-  justify-content space-between
-  box-sizing border-box
-  width 100%
-  height 100%
-  padding 2rem
+  padding 5rem
 
-  .left
-  .right {
-    display flex
-    align-items center
-  }
-
-  .left {
-    justify-content flex-start
-    box-sizing border-box
-    width 30rem
-    height 100%
-    font-size 18rem
-  }
-
-  .right {
-    justify-content flex-end
-    width calc(100% - 30rem)
-    height 100%
-
-    .el-button {
-      width 100%
-    }
+  .el-button {
+    width 100%
   }
 }
diff --git a/src/components/copy-image-link/copy-image-link.vue b/src/components/copy-image-link/copy-image-link.vue
@@ -1,15 +1,10 @@
 <template>
-  <div class="copy-image-link-box">
-    <div class="left">
-      <el-tooltip :content="leftSideTip" placement="top">
-        <el-icon><IEpInfoFilled /></el-icon>
-      </el-tooltip>
-    </div>
-    <div class="right">
-      <el-button plain type="primary" size="small" @click="oneClickCopy">
+  <div class="copy-image-link-box border-box">
+    <el-tooltip :content="imgLinkRuleTip" placement="top">
+      <el-button plain type="primary" size="default" @click="oneClickCopy">
         <el-icon><IEpCopyDocument /></el-icon>&nbsp;{{ $t('upload.copyLink') }}
       </el-button>
-    </div>
+    </el-tooltip>
   </div>
 </template>
 
@@ -28,7 +23,7 @@ const props = defineProps({
 
 const userSettings = computed(() => store.getters.getUserSettings).value
 const userConfigInfo = computed(() => store.getters.getUserConfigInfo).value
-const leftSideTip = computed(() => {
+const imgLinkRuleTip = computed(() => {
   if (userSettings.imageLinkFormat.enable) {
     return `${userSettings.imageLinkType.selected} & ${userSettings.imageLinkFormat.selected}`
   }

diff --git a/src/components/image-card/image-card.styl b/src/components/image-card/image-card.styl
@@ -62,10 +62,6 @@
   }
 
 
-  .copy-link-box {
-    padding 5rem
-  }
-
   .operation-box {
     position absolute
     top 10rem

diff --git a/src/components/image-card/image-card.vue b/src/components/image-card/image-card.vue
@@ -41,7 +41,7 @@
     </div>
 
     <!-- 图片链接操作 -->
-    <div class="copy-link-box">
+    <div class="copy-link-box border-box">
       <copy-image-link :img-obj="imageObj" />
     </div>
 

diff --git a/src/locales/en.json b/src/locales/en.json
@@ -78,7 +78,7 @@
       "select_title": "Select Image Link Rule",
       "card_title": "Configure Custom Image Link Rules",
       "card_table_col_title_1": "Type",
-      "card_table_col_title_2": "CDN Rule",
+      "card_table_col_title_2": "Image Link Rule",
       "card_table_col_title_3": "Action",
       "input_name_1": "Link Type",
       "input_name_1_rule": "The Image Link Type Name cannot be empty.",

diff --git a/src/locales/zh-CN.json b/src/locales/zh-CN.json
@@ -78,7 +78,7 @@
       "select_title": "选择图片链接规则",
       "card_title": "配置自定义图片链接规则",
       "card_table_col_title_1": "类型",
-      "card_table_col_title_2": "CDN 规则",
+      "card_table_col_title_2": "图片链接规则",
       "card_table_col_title_3": "操作",
       "input_name_1": "图片链接类型",
       "input_name_1_rule": "图片链接类型名称不能为空",

diff --git a/src/locales/zh-TW.json b/src/locales/zh-TW.json
@@ -78,7 +78,7 @@
       "select_title": "選擇圖片鏈接規則",
       "card_title": "配置自定義圖片鏈接規則",
       "card_table_col_title_1": "類型",
-      "card_table_col_title_2": "CDN 規則",
+      "card_table_col_title_2": "圖片鏈接規則",
       "card_table_col_title_3": "操作",
       "input_name_1": "圖片鏈接類型",
       "input_name_1_rule": "圖片鏈接類型名稱不能為空",

diff --git a/src/styles/base.styl b/src/styles/base.styl
@@ -50,11 +50,11 @@ body {
 a {
   color var(--text-color)
   text-decoration none
-}
 
-a:link {
-  color var(--text-color)
-  text-decoration none
+  &:link {
+    color var(--text-color)
+    text-decoration none
+  }
 }
 
 
@@ -130,6 +130,7 @@ li {
     justify-content flex-start
     box-sizing border-box
     padding 8rem 10rem
+    font-size 12rem
     cursor pointer
 
     &.copy-link {
@@ -150,6 +151,7 @@ li {
   text-overflow ellipsis
 }
 
+
 .quick-actions-popover {
   position relative
   box-sizing border-box
@@ -163,6 +165,7 @@ li {
   }
 }
 
+
 .personal-center-popover {
   position relative
   box-sizing border-box
@@ -247,5 +250,10 @@ li {
   }
 }
 
+.border-box {
+  position relative
+  box-sizing border-box
+}
+
 
 
diff --git a/src/views/feedback-info/feedback-info.vue b/src/views/feedback-info/feedback-info.vue
@@ -28,7 +28,7 @@
     <div class="help-info-item" style="margin-bottom: 2rem">🎁 {{ $t('feedback.text_3') }}</div>
 
     <div class="help-info-item img">
-      <el-image style="width: 300rem" :src="QRCodeImg" />
+      <el-image style="width: 300rem" src="https://xpoet.cn/images/admire-code-wechat.webp" />
     </div>
 
     <div class="help-info-item red-text">
@@ -40,7 +40,6 @@
 <script setup lang="ts">
 import { computed } from 'vue'
 import { getOSName } from '@/utils'
-import QRCodeImg from '@/assets/appreciation.webp'
 
 const shortcutKey = computed(() => (getOSName() === 'win' ? 'Ctrl + D' : 'Command + D'))
 </script>

diff --git a/src/views/my-settings/my-settings.styl b/src/views/my-settings/my-settings.styl
@@ -23,7 +23,7 @@
       display flex
       align-items center
       color var(--text-color-4)
-      font-size 2rem
+      font-size 12rem
       user-select none
 
       .desc {