<template>
  <!--      悬浮层  -->
  <div class="home-suspension">
    <div class="right-handler"></div>
    <div class="bottom-advertisement">
      <div class="advertisement-content">
      </div>
    </div>
  </div>
</template>
<script setup lang="ts">

</script>
<style scoped lang="scss">
.home-suspension {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  z-index: 998;

  .bottom-advertisement {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 130px;
    background: #8a65d9;

    .advertisement-content {
      width: 1180px;
      height: 130px;
      margin: auto auto;
      //左右渐变
      background: linear-gradient(to right, #8a65d9, #6ac5a9, #6ac5a9, #8a65d9);
    }
  }

  .right-handler {
    position: fixed;
    bottom: 50px;
    right: 0;
    width: 100px;
    height: 300px;
    background-image: linear-gradient(#4466FF, #a028d3);
    z-index: 1;
  }


}
</style>