背景

src/views/home/index.vue

@@ -1,15 +1,15 @@
 <template>
   <div>
-    <div class="box" :style="{ height: `calc(100vh - ${size.menuH}px)` }">
+    <div class="boxx" :style="{ height: `calc(100vh - ${size.menuH}px)` }">
       <n-layout>
         <n-layout has-sider>
-          <n-layout-content class="sm:w-[90vh] w-[70%]" :content-style="{ height: `calc(100vh - ${size.menuH}px)`,backgroundColor:'#f1f2f3' }">
+          <n-layout-content class="sm:w-[90vh] w-[70%]" :content-style="{ height: `calc(100vh - ${size.menuH}px)` }">
             <n-scrollbar class="" trigger="hover" :style="{ height: `calc(100vh - ${size.menuH}px)` }">
               <search></search>
               <NavMenu />
             </n-scrollbar>
           </n-layout-content>
-          <n-layout-sider class="sm:hidden" :content-style="{width: '30vw',height: `calc(100vh - ${size.menuH}px)`,overflow:'hidden',backgroundColor:'#f1f2f3' }">
+          <n-layout-sider class="sm:hidden" :content-style="{width: '30vw',height: `calc(100vh - ${size.menuH}px)`,overflow:'hidden',}">
             <Suspense>
               <side />
             </Suspense>
@@ -42,10 +42,16 @@ onMounted(async () => {
 </script>
 
 <style scoped>
-
+.boxx{
+  background: transparent url("../../assets/bg/06.jpeg") no-repeat center center !important;
+}
+:deep(.n-layout){
+  background: unset !important;
+}
 :deep(.n-layout-sider) {
   width: unset !important;
   max-width: unset !important;
+  background: unset !important;
 }
 
 :deep(.n-scrollbar-rail) {

src/views/home/navMenu.vue

@@ -148,4 +148,7 @@ onMounted(async () => {
 .extra_collapsed {
   transform: rotate(90deg);
 }
+:deep(.n-card) {
+  background-color: #ffffff70;
+}
 </style>

src/views/home/search.vue

@@ -108,6 +108,7 @@ onMounted(() => {
 </script>
 
 <style scoped lang="less">
+
 .search-box {
   background-size: contain;
   background-repeat: no-repeat;
@@ -135,11 +136,22 @@ onMounted(() => {
 .sop:hover span {
   color: @orange !important;
 }
-</style>
+:deep(.n-input) {
-<style>
+  border: none;
-.n-input-group>*:not(:first-child) {
+  background: #ffffff70;
-  margin-left: unset !important;
+  padding: 0;
-  border-top-left-radius: 1rem !important;
-  border-bottom-left-radius: 1rem !important;
 }
-</style>
+
+:deep(.n-input .n-input__border) {
+  border: none;
+}
+
+:deep(.n-input .n-input__state-border) {
+  border: none;
+}
+
+:deep(.n-input .n-input__input-el) {
+  padding: 0;
+  border: none;
+}
+</style>

src/views/home/side.vue

@@ -1,6 +1,6 @@
 <template>
   <n-scrollbar class="box">
-    <div class="top w-[80%] ml-[10%] mt-6 mb-4 bg-[#fafbfc]">
+    <div class="top w-[80%] ml-[10%] mt-6 mb-4">
       <div class="left p-6">
         <div class="time text-pp-500">
           {{ time }}
@@ -21,7 +21,7 @@
       </div>
     </div>
 
-    <div class="mid w-[80%] ml-[10%] mt-4 mb-4 bg-[#fafbfc]">
+    <div class="mid w-[80%] ml-[10%] mt-4 mb-4">
       <div class="lunar">
         <div class="lunarDate p-1 text-[22px] text-center">
           {{ jq.data.yearTips }}年 {{ jq.data.lunarCalendar }}
@@ -52,7 +52,7 @@
       </div>
     </div>
 
-    <div class="lianxi w-[80%] ml-[10%] mt-4 mb-4 bg-[#fafbfc] p-2">
+    <div class="lianxi w-[80%] ml-[10%] mt-4 mb-4 p-2">
       <div class="t">
         <n-divider title-placement="center">
           <div class="flex items-center font-bold text-xl">
@@ -127,7 +127,7 @@ const jq = await $http.wea.getJq()
 const j = jq.data.solarTerms.slice(0, 2)
 const jNum = jqs.indexOf(j) + 1
 jqImg.value = 'https://www.hxyouzi.com/img/jieqi/' + jNum + '.jpg'
-const isBaidu = ref(false);
+const isBaidu = ref(true);
 const baidu = ref({})
 
 // const holi = await $http.wea.getNextHoliday()
@@ -172,9 +172,10 @@ const gotonews = (url) => {
   // background-color: #f1f2f3;
 }
 
-.lianxi {
+.lianxi,.top,.mid {
   box-shadow: @ps;
   border-radius: 4px;
+  background-color: #ffffff70;
 
   .row {
     display: flex;

src/views/login.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="body" ref="bg" :style="{ backgroundImage: `url(https://www.hxyouzi.com/blog/bg/bg-l.webp)` }">
+  <div class="body" ref="bg">
     <n-card class="box" v-if="!isPass">
       <n-tabs class="card-tabs" ref="tabsInstRef" v-model:value="value" size="large" animated default-value="signin" justify-content="space-evenly">
         <n-tab-pane name="signin" tab="登录">
@@ -247,7 +247,7 @@ function stepBack() {
 .body {
   width: 100vw;
   height: 100vh;
-  // background-image: url(../assets/bg/bg-d.webp);
+  background-image: url(../assets/bg/05.jpeg);
   background-repeat: no-repeat;
   background-size: cover;
   position: relative;