style: 全部样式更新2.0

This commit is contained in:
chenchun
2025-08-05 14:09:39 +08:00
parent 09a2f91cbf
commit e73678c788
15 changed files with 135 additions and 91 deletions

View File

@@ -5,8 +5,6 @@
"ComputedRef": true,
"DirectiveBinding": true,
"EffectScope": true,
"ElMessage": true,
"ElMessageBox": true,
"ExtractDefaultPropTypes": true,
"ExtractPropTypes": true,
"ExtractPublicPropTypes": true,

View File

@@ -11,7 +11,7 @@
<link rel="stylesheet" href="/src/assets/loading.css" />
</head>
<body>
<body style="background: linear-gradient(135deg, #0a0a0a 0%, #0d1520 30%, #0a0a0a 70%, #0f1520 100%), linear-gradient(135deg, rgba(0, 255, 136, 0.03) 0%, rgba(0, 0, 0, 0.8) 50%, rgba(0, 255, 136, 0.02) 100%);">
<div id="Loading">
<div class="loader JS_on">
<span class="binary"></span>

View File

@@ -1,5 +1,3 @@
<script setup></script>
<template>
<el-config-provider :locale="locale">
<RouterView />

View File

@@ -1,35 +1,39 @@
/* Element Plus 主色调覆盖 */
html.dark {
--el-color-primary: #00DA72 ;
--el-color-primary-light-3: #40e394;
--el-color-primary-light-5: #66eaa6;
--el-color-primary-light-7: #8cf1b8;
--el-color-primary-light-8: #a6f5c9;
--el-color-primary-light-9: #bff8db;
--el-color-primary-dark-2: #00b05c;
--el-menu-hover-bg-color: none;
html.dark {
--el-color-primary: #00DA72;
--el-color-primary-light-3: #40e394;
--el-color-primary-light-5: #66eaa6;
--el-color-primary-light-7: #8cf1b8;
--el-color-primary-light-8: #a6f5c9;
--el-color-primary-light-9: #bff8db;
--el-color-primary-dark-2: #00b05c;
--el-menu-hover-bg-color: none;
}
.el-tag {
--el-tag-border-radius: 0px;
--el-tag-border-radius: 0px;
}
.el-tag.el-tag--primary {
--el-tag-text-color: #000;
}
.el-button {
border-radius: 0px;
}
.el-card {
--el-card-bg-color: none !important;
border-radius: 0px !important;
--el-card-bg-color: none !important;
border-radius: 0px !important;
}
.el-card:hover {
border-color: rgba(0, 255, 136, 0.4) !important;
}
:root {
--w-e-toolbar-bg-color:#0E131D !important;
--w-e-toolbar-color:#fff !important;
--w-e-toolbar-bg-color: #0E131D !important;
--w-e-toolbar-color: #fff !important;
--w-e-textarea-bg-color: #0E131D !important;
}
}

View File

@@ -3,6 +3,7 @@
* http://cssreset.com
* 全局初始化样式
*/
html,
body,
div,
@@ -78,25 +79,30 @@ mark,
audio,
video,
input {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font-weight: normal;
vertical-align: baseline;
outline: none;
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font-weight: normal;
vertical-align: baseline;
outline: none;
}
body {
/* px-to-viewport-ignore-next */
min-width: 1024px; /* px-to-viewport-ignore */
}
html {
/* px-to-viewport-ignore-next */
min-width: 1024px; /* px-to-viewport-ignore */
/* px-to-viewport-ignore-next */
min-width: 1024px;
/* px-to-viewport-ignore */
}
html {
/* px-to-viewport-ignore-next */
min-width: 1024px;
/* px-to-viewport-ignore */
}
/* HTML5 display-role reset for older browsers */
article,
aside,
details,
@@ -107,88 +113,99 @@ header,
menu,
nav,
section {
display: block;
display: block;
}
blockquote,
q {
quotes: none;
quotes: none;
}
blockquote::before,
blockquote::after,
q::before,
q::after {
content: none;
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
border-collapse: collapse;
border-spacing: 0;
}
/* custom */
li {
//list-style: none;
//list-style: none;
}
button {
outline: none;
cursor: pointer;
background-color: transparent;
border-style: none;
outline: none;
cursor: pointer;
background-color: transparent;
border-style: none;
}
.el-textarea__inner::placeholder {
color: #999 !important;
color: #999 !important;
}
.el-input__inner::placeholder {
color: #999 !important;
color: #999 !important;
}
input::-webkit-input-placeholder {
color: #999 !important;
color: #999 !important;
}
.el-input__inner::-webkit-input-placeholder {
color: #999 !important;
color: #999 !important;
}
input::placeholder {
color: #999 !important;
color: #999 !important;
}
textarea::placeholder {
color: #999 !important;
color: #999 !important;
}
* {
box-sizing: border-box;
box-sizing: border-box;
}
html,
body,
#app {
width: 100%;
height: 100%;
font-family: Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif,
Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbo;
width: 100%;
// height: 100%;
font-family: Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbo;
}
/* //滚动条样式 */
::-webkit-scrollbar {
width: 10px;
height: 10px;
width: 10px;
height: 10px;
}
/* 滚动槽 */
::-webkit-scrollbar-track {
border-radius: 10px;
border-radius: 10px;
}
/* 滚动条滑块 */
::-webkit-scrollbar-thumb {
border-radius: 10px;
background: #ccc;
border-radius: 10px;
background: #ccc;
}
::-webkit-scrollbar-thumb:window-inactive {
background: rgba(249, 222, 222, 0.6);
}
background: rgba(249, 222, 222, 0.6);
}

View File

@@ -44,11 +44,12 @@
<div class="item item-bottom">
<div class="tag-list">
<el-tag v-if="discuss.permissionRoleCodes.length>0" v-for="item in discuss.permissionRoleCodes" effect="dark" type="danger" :key="item">{{item}}</el-tag>
<el-tag class="tag-list-item" v-if="discuss.permissionRoleCodes.length>0" v-for="item in discuss.permissionRoleCodes" effect="dark" type="danger" :key="item">{{item}}</el-tag>
<el-tag v-if="discuss.title!=''&& discuss.lables.length===0">暂无标签</el-tag>
<el-tag class="tag-list-item" v-if="discuss.title!=''&& discuss.lables.length===0">暂无标签</el-tag>
<el-tag v-if="discuss.lables.length>0" v-for="item in discuss.lables" :key="item.id">{{item.name}}</el-tag>
<el-tag class="tag-list-item" v-if="discuss.lables.length>0" v-for="item in discuss.lables" :key="item.id">{{item.name}}</el-tag>
</div>
<el-space :size="10" :spacer="spacer">
<div class="item-description">
@@ -250,4 +251,10 @@ onMounted(() => {
opacity: 1; /* 鼠标悬浮时完全显示 */
}
}
.tag-list-item{
border: 0px;
color: #BCBCBC;
background: none;
}
</style>

View File

@@ -144,5 +144,28 @@ const change=(value,render)=>{
width: 100%;
}
.edit ::v-deep(.auto-textarea-input){
/* background: none !important; */
background: #1D1E1F !important;
color: #fff !important;
}
.edit ::v-deep(.content-input-wrapper)
{
background: #1D1E1F !important;
color: #fff !important;
}
.edit ::v-deep(.v-note-edit)
{
background: #1D1E1F !important;
color: #fff !important;
}
.edit ::v-deep(.v-note-op){
background: #1D1E1F !important;
color: #fff !important;
}
.edit ::v-deep(.v-show-content){
background: #1D1E1F !important;
color: #fff !important;
}
</style>

View File

@@ -1,5 +1,4 @@
<template>
<StarBackground :speed="0.2" :number="1000"/>
<div class="content-main">
<RouterView />
</div>
@@ -7,7 +6,6 @@
</template>
<script setup>
import StarBackground from "@/components/StarBackground.vue";
</script>
<style scoped>
.content-main {

View File

@@ -44,11 +44,11 @@ const handleScroll = () => {
.common {
&-layout {
width: 100%;
height: 100%;
// height: 100%;
}
&-container {
width: 100%;
height: 100%;
// height: 100%;
}
&-header {
width: 100%;

View File

@@ -12,11 +12,9 @@
</div>
</div>
</div>
<StarBackground :speed="0.01" :number="4000"/>
</template>
<!-- <style src="@/assets/styles/login.scss" scoped></style> -->
<script setup>
import StarBackground from "@/components/StarBackground.vue";
import useConfigStore from "@/stores/config";
const configStore=useConfigStore();
const isIcp=import.meta.env.VITE_APP_ICP==="true";

View File

@@ -43,11 +43,11 @@ const handleScroll = () => {
.common {
&-layout {
width: 100%;
height: 100%;
// height: 100%;
}
&-container {
width: 100%;
height: 100%;
// height: 100%;
}
&-header {
width: 100%;

View File

@@ -524,7 +524,7 @@ watch(
}
.right-div .el-col {
background-color: #1D1E1F;
// background-color: #1D1E1F;
min-height: 10rem;
margin-bottom: 1rem;
}

View File

@@ -470,7 +470,8 @@ const getFile = async (e) => {
.body-div {
position: relative;
min-height: 1000px;
background-color: #fff;
/* background-color: #fff; */
border: 1px solid rgba(0, 255, 136, 0.2);
margin: 1.5rem;
padding: 1.5rem;

View File

@@ -533,13 +533,13 @@ const onClickToWeChat = () => {
.left-div .el-col,
.right-div .el-col {
margin-bottom: 1rem;
margin-bottom: 0.5rem;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.05); /* 添加微妙阴影 */
transition: all 0.3s ease; /* 过渡效果 */
&:hover {
transform: translateY(-5px); /* 悬停时微抬升 */
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); /* 悬停时增强阴影 */
// transform: translateY(-5px); /* 悬停时微抬升 */
// box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); /* 悬停时增强阴影 */
}
}
@@ -593,7 +593,7 @@ const onClickToWeChat = () => {
background-color: #080E14;
background-position: 0 30px;
background-size: 150% 100%;
border: 1px solid #00DA72;
border: 1px solid rgba(0, 255, 136, 0.2);
color: #00DA72;
.content {
@@ -664,12 +664,12 @@ const onClickToWeChat = () => {
}
&:hover {
background-color: #ebf5ff; /* 更柔和的悬停色 */
// background-color: #ebf5ff; /* 更柔和的悬停色 */
color: #00DA72; /* 文字颜色变化 */
// border: 1px solid rgba(0, 255, 136, 0.2);
.el-icon {
color: #00DA72; /* 图标颜色跟随变化 */
transform: scale(1.1); /* 图标微放大 */
// transform: scale(1.1); /* 图标微放大 */
}
}
}
@@ -679,7 +679,7 @@ const onClickToWeChat = () => {
.VisitsLineChart p {
display: flex;
justify-content: flex-end;
color: #000;
color: #fff;
cursor: pointer;
margin-top: 8px;
}
@@ -705,7 +705,7 @@ const onClickToWeChat = () => {
overflow: hidden;
white-space: nowrap;
box-sizing: border-box;
border: 1px solid #00DA72;
border: 1px solid rgba(0, 255, 136, 0.2);
span {
color: red;
}
@@ -755,8 +755,8 @@ const onClickToWeChat = () => {
.switch-span {
display: inline-block;
padding: 5px 12px;
background-color: #00DA72;
color: #00DA72;
// background-color: #00DA72;
color: #fff;
font-size: 13px;
cursor: pointer;
transition: all 0.3s ease;
@@ -765,9 +765,10 @@ const onClickToWeChat = () => {
overflow: hidden;
&:hover {
background-color: #00DA72;
border: 1px solid rgba(0, 255, 136, 0.2);
// background-color: #00DA72;
color: #fff !important;/* 悬浮时文字变为白色 */
transform: translateY(-2px);
// transform: translateY(-2px);
box-shadow: 0 4px 8px rgba(64, 158, 255, 0.25);
}

View File

@@ -368,7 +368,6 @@ width: 80%;
&-left {
padding-top: 30px;
height: 280px;
background-color: #1D1E1F;
border: 1px solid rgba(0, 255, 136, 0.2);
}
&-right {