用css 画斜线, 根据文字动态长度

<template>
      <div class="logo2">
        <div class="lb" style="padding-left: 60px;">
          <span>
            <img src="../assets/logo_sp.svg" alt /></span>
        </div>
        <div class="lb">
          <span>{{title}}</span>
        </div>
      </div>
</template>

<style lang="scss" scoped>
  .logo2 {
    font-size: 26px;
    background: linear-gradient(39deg, aqua, #007cc6);
    -webkit-background-clip: text;
    color: transparent;
    font-weight: bold;
    line-height: 62px;
    /* padding: 0 0 0 40px;
    box-shadow: 6px -4px 6px #007cc6 inset; */
    margin-left: -40px;
    z-index: 2;


    .lb {
      display: inline-block;
      transform: skewX(-50deg);
      border-right: 1px solid #007cc6;
      padding: 0px 40px;
      box-shadow: -3px -5px 4px #007cc6 inset;
      background: #192d70;
    }

    img {
      width: 100px;
    }

    span {
      text-align: center;
      display: inline-block;
      line-height: 50px;
      color: #fff;
      transform: skewX(50deg);
      -webkit-text-fill-color: transparent;
      background: linear-gradient(to right, aqua, #007cc6);
      -webkit-background-clip: text;
    }
  }

</style>