样式提交

whyczyk

2021-03-10 c284de82804aa9ed68eaf1cb825c8874e2878bc6

样式提交

 src/pages/index.vue

@@ -1,5 +1,5 @@
<template>
  <div class="indexWarp">
  <div class="indexWarp" ref="indexWarp">
    <div class="datav-header" :style="{backgroundColor:isBgColor?'#031d67':''}">
      <div class="logo">
        <div class="top-tip"></div>
@@ -28,7 +28,7 @@
            <div class="emptyCon">空白画板</div>
          </div>
        </div>
        <div class="template-item" v-for="(item,i) in 20" :key="i">
        <div class="template-item" v-for="(item,i) in 1" :key="i">
          <div class="template-image">
            <div class="screen-edit">
              <el-tooltip class="item" effect="dark" content="查看" placement="top">
@@ -76,7 +76,8 @@
    mounted() {
      window.addEventListener('scroll', () => {
        this.scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
        if (this.scrollTop > 260) {
        let clientHeight = this.$refs.indexWarp.clientHeight;
        if (this.scrollTop / clientHeight > 0.2) {
          this.isBgColor = true
        } else {
          this.isBgColor = false
@@ -90,8 +91,8 @@
<style scoped>
  .indexWarp {
    width: 100%;
    height: 100%;
    background: #171b22 !important;
    min-height: 100%;
    background: #031d67 !important;
    -webkit-font-smoothing: antialiased;
  }

@@ -113,7 +114,7 @@
    top: 0;
    justify-content: center;
    flex-direction: column;
    background: #171b22;
    background: #031d67;
    height: 360px;
    transition: .5s height cubic-bezier(.65, .05, .36, 1);
    width: 100%;