diff --git a/src/App.vue b/src/App.vue index a952719..5083d98 100644 --- a/src/App.vue +++ b/src/App.vue @@ -49,7 +49,8 @@ li { -moz-osx-font-smoothing: grayscale; color: #fff; overflow-x: auto; - background: #263445; + // background: #263445; + background: #fff; } //只显示一排内容 diff --git a/src/assets/css/homeScreen.scss b/src/assets/css/homeScreen.scss index 006cadc..250f570 100644 --- a/src/assets/css/homeScreen.scss +++ b/src/assets/css/homeScreen.scss @@ -17,6 +17,30 @@ width: 442px; height: 100%; z-index: 10; + .asideTitle{ + display: flex; + align-items: center; + justify-content: space-between; + padding: 0 10px; + box-sizing: border-box; + background: linear-gradient( 90deg, #124CB3 0%, rgba(18,76,179,0.23) 77%, rgba(18,76,179,0) 100%); + border-radius: 0px 0px 0px 0px; + height: 40px; + .title{ + font-weight: bold; + font-size: 16px; + color: #FFFFFF; + margin-right: 20px; + } + } + .asideCnt{ + height: calc(100% - 40px); + } + .aside-middle{ + height: calc(100%/2); + padding: 4px; + box-sizing: border-box; + } } .homeBtn{ height: 302px; @@ -32,9 +56,15 @@ position: fixed; top: 0; width: 100%; - height: 151px; - background: url("~@/assets/images/home_head.png") no-repeat center center; - background-size: 100% 100%; + height: 70px; + background: rgba(0,0,0,0.8); + .headBoxBg{ + width: 100%; + height: 100%; + background: url("~@/assets/images/home_head.png") no-repeat center center; + background-size: 100% 100%; + height: 151px; + } .top-center { position: absolute; left: 50%; @@ -44,14 +74,7 @@ letter-spacing: 2px; font-family: "YSBTH"; white-space: nowrap; - background-image: linear-gradient( - 72deg, - #0072ff 0%, - #00ffff 18%, - #07e9ff 51%, - #00ffff 83%, - #0072ff 100% - ); + background: linear-gradient(180deg, #FFFFFF 0%, #66B5FF 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-shadow: 4px 4px 4px rgba(54, 255, 243, 0.15); @@ -76,26 +99,10 @@ @include textColor(#a1d6ff, #ffffff); } } - .yjbtn{ - width: 155px; - height: 38px; - line-height: 38px; - text-align: center; - background: url("~@/assets/images/home_btns.png") no-repeat center center; - background-size: 100% 100%; - font-size: 16px; - font-family: "YSBTH"; - .btms{ - @include textColor(#a1d6ff, #ffffff); - } - } - .yjbtnActive{ - // background: url("~@/assets/images/home_btns_active.png") no-repeat center center; - // background-size: 100% 100%; - } + } .topBtn-left { - left: 5px; + left: 35px; font-size: 12px; .text { font-family: "YSBTH"; @@ -105,8 +112,31 @@ color: #0a99ff; } } + .leftBtn-yjbtn{ + position: absolute; + left: 430px; + top: 20px; + width: 155px; + height: 38px; + line-height: 38px; + text-align: center; + background: url("~@/assets/images/home_btns.png") no-repeat center center; + background-size: 100% 100%; + font-size: 16px; + font-family: "YSBTH"; + .btms{ + @include textColor(#a1d6ff, #ffffff); + } + } + .yjbtnActive{ + background: url("~@/assets/images/home_btns_active.png") no-repeat center center; + background-size: 100% 100%; + .btms{ + @include textColor(#00ffff, #faff00); + } + } .topBtn-right { - right: 170px; + right: 270px; .topBtn-item { background: url("~@/assets/images/home_btns_right.png") no-repeat center center; diff --git a/src/assets/images/meun.png b/src/assets/images/meun.png index 2ec29d3..10e0235 100644 Binary files a/src/assets/images/meun.png and b/src/assets/images/meun.png differ diff --git a/src/layout/components/Header.vue b/src/layout/components/Header.vue index 61b0086..5c6a93a 100644 --- a/src/layout/components/Header.vue +++ b/src/layout/components/Header.vue @@ -1,6 +1,8 @@