Hooke / tswj

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
09f1aadf 1 parent 942686b6

✨ feat(客户端): 样式调整

Inline Side-by-side
Showing 3 changed files with 27 additions and 5 deletions
1 <template> 1 <template>
2 <div style="background-color: white;height:100%; overflow:auto;"> 2 <div style="background-color: white;height:100%; overflow:auto;">
3 <div class="client-index-page"> 3 <div class="client-index-page">
4 + <div class="cloud-bg"></div>
4 </div> 5 </div>
5 6
6 <div class="entry-wrapper"> 7 <div class="entry-wrapper">
...@@ -44,7 +45,8 @@ onMounted (() => { ...@@ -44,7 +45,8 @@ onMounted (() => {
44 // 进入项目自动打开导航栏 45 // 进入项目自动打开导航栏
45 // window.history.pushState({}, "title", "#"); 46 // window.history.pushState({}, "title", "#");
46 // 背景颜色全屏 47 // 背景颜色全屏
47 - $('.client-index-page').height($(document).height() - $('.entry-wrapper').outerHeight()); 48 + // $('.client-index-page').height($(document).height() - $('.entry-wrapper').outerHeight());
49 + $('.client-index-page').height($(document).height());
48 // $('.client-index-page').width($(document).width()); 50 // $('.client-index-page').width($(document).width());
49 }) 51 })
50 </script> 52 </script>
...@@ -68,18 +70,38 @@ export default { ...@@ -68,18 +70,38 @@ export default {
68 </script> 70 </script>
69 71
70 <style lang="less" scoped> 72 <style lang="less" scoped>
73 + // .client-index-page {
74 + // // 背景图 宽度100% 高度自适应
75 + // background-image: url('@images/yindao@2x-1.png');
76 + // background-repeat: no-repeat;
77 + // width: 100%;
78 + // height: 100%;
79 + // background-size: 100% auto;
80 + // position: relative;
81 + // .cloud-bg {
82 + // background-image: url('@images/bg-white@2x.png');
83 + // background-repeat: no-repeat;
84 + // width: 100%;
85 + // height: 10rem;
86 + // background-size: 100% auto;
87 + // position: absolute;
88 + // bottom: 12rem;
89 + // }
90 + // }
71 .client-index-page { 91 .client-index-page {
92 + // 背景图 宽度100% 高度控制
72 background-image: url('@images/yindao@2x.png'); 93 background-image: url('@images/yindao@2x.png');
73 background-repeat: no-repeat; 94 background-repeat: no-repeat;
74 - background-size: contain; 95 + width: 100%;
75 - background-position:top center; 96 + background-size: 100% 85%;
97 + position: relative;
76 } 98 }
77 99
78 .entry-wrapper { 100 .entry-wrapper {
79 position: absolute; 101 position: absolute;
80 - // bottom: 1rem; 102 + bottom: 0;
81 width: 100%; 103 width: 100%;
82 - background-color: #FFF; 104 + // background-color: #FFF;
83 .control { 105 .control {
84 margin: 1rem; 106 margin: 1rem;
85 margin-top: 0.5rem; 107 margin-top: 0.5rem;
......