1
0
forked from bot/app

📝 修复暗黑模式下商店物品显示对比度不高的问题

This commit is contained in:
远野千束 2024-08-31 22:06:04 +08:00
parent ae34ff622d
commit c3072e93c7
3 changed files with 43 additions and 63 deletions

View File

@ -7,11 +7,16 @@
--vp-home-hero-image-background-image: linear-gradient(-45deg, #d0e9ff 50%, #a2d8f4 50%); --vp-home-hero-image-background-image: linear-gradient(-45deg, #d0e9ff 50%, #a2d8f4 50%);
--vp-home-hero-image-filter: blur(44px); --vp-home-hero-image-filter: blur(44px);
--vp-c-gray-1: #eee;
--vp-c-gray-2: #aaa;
} }
.dark { .dark {
--vp-home-hero-image-background-image: linear-gradient(-45deg, #004785 50%, #0374ad 50%); --vp-home-hero-image-background-image: linear-gradient(-45deg, #004785 50%, #0374ad 50%);
--vp-c-gray-1: #333;
--vp-c-gray-2: #666;
} }
.tab-buttons { .tab-buttons {
@ -49,12 +54,39 @@
} }
.item-card { .item-card {
position: relative; position: relative;
border-radius: 15px; border-radius: 15px;
background-color: #99999922; background-color: var(--vp-c-gray-1);
height: 160px; height: 160px;
padding: 16px; padding: 16px;
margin: 10px; margin: 10px;
box-sizing: border-box; box-sizing: border-box;
transition: background 0.3s ease; transition: background 0.3s ease;
}
.item-name {
font-size: 20px;
margin-bottom: 10px;
}
.item-description {
color: var(--vp-c-gray-2);
font-size: 13px;
white-space: pre-wrap;
}
.author-info {
display: flex;
justify-content: left;
align-items: center;
}
.author-name {
font-size: 15px;
font-weight: normal;
}
.avatar {
border-radius: 50%;
margin: 0 10px;
} }

View File

@ -14,7 +14,7 @@
</svg> </svg>
</a> </a>
<!-- <button class="copy-btn btn"><div @click="copyToClipboard">安装</div></button> 点击后把安装命令写入剪贴板--> <!-- <button class="copy-btn btn"><div @click="copyToClipboard">安装</div></button> 点击后把安装命令写入剪贴板-->
<button class="btn copy-btn" @click="copyToClipboard">复制安装命令</button> <button class="btn copy-btn" @click="copyToClipboard">复制安装命令</button>
<div class="btn"> <div class="btn">
@ -82,42 +82,11 @@ button {
color: #666; color: #666;
} }
.copy-btn:hover {
color: #111;
}
.item-name {
color: #111;
font-size: 20px;
margin-bottom: 10px;
}
.item-description {
color: #333;
font-size: 12px;
white-space: pre-wrap;
}
.icon { .icon {
width: 20px; width: 20px;
height: 20px; height: 20px;
} }
.author-info {
display: flex;
justify-content: left;
align-items: center;
}
.author-name {
font-size: 15px;
font-weight: normal;
}
.avatar {
border-radius: 50%;
margin: 0 10px;
}
.item-bar { .item-bar {
position: absolute; position: absolute;
@ -132,7 +101,7 @@ button {
.tag { .tag {
display: inline-block; display: inline-block;
padding: 0px 5px; padding: 0 5px;
margin-right: 5px; margin-right: 5px;
border-radius: 5px; border-radius: 5px;
font-size: 12px; font-size: 12px;

View File

@ -29,16 +29,7 @@ const props = defineProps({
<style scoped> <style scoped>
.item-name {
font-size: 20px;
margin-bottom: 10px;
}
.item-description {
color: #333;
font-size: 15px;
white-space: pre-wrap;
}
.icon { .icon {
width: 20px; width: 20px;
@ -46,21 +37,9 @@ const props = defineProps({
color: $themeColor; color: $themeColor;
} }
.author-info {
display: flex;
justify-content: left;
align-items: center;
}
.author-name {
font-size: 15px;
font-weight: normal;
}
.avatar {
border-radius: 50%;
margin: 0 10px;
}
.item-bar { .item-bar {
position: absolute; position: absolute;