ads_web/src/views/adManage/sd/campaigns/CreateCampaigns/component/Creativity.vue

<template>
  <div class="customize-container">
    <el-card body-style="padding: 20px 80px 0 80px;">
      <div class="custom-card-title">
        <span class="custom-card-icon">|</span>
        <span class="custom-card-Text">创意</span>
      </div>
      <div style="display: flex">
        <div class="left-container">
          <p class="left-part-title">请选择您想要自定义商品广告的方式</p>
        </div>
        <div class="right-container">
          <div class="preview-title-line">
            <p class="right-part-title">广告预览</p>
            <el-select></el-select>
          </div>
        </div>
      </div>
    </el-card>
  </div>
</template>

<script setup lang="ts"></script>

<style scoped>
.customize-container {
  margin-top: 10px;
}
.custom-card-title {
  font-weight: 700;
  padding-bottom: 18px;
}
.custom-card-Text {
  font-size: 18px;
  padding-left: 5px;
}
.custom-card-icon {
  color: #306cd7;
  font-size: 26px;
}
.left-container {
  width: 50%;
}
.left-part-title {
  color: #4e5969;
  padding-bottom: 4px;
  height: 32px;
  font-weight: 700;
  line-height: 32px;
}
.right-part-title {
  color: #4e5969;
  padding-bottom: 4px;
  height: 32px;
  font-weight: 700;
  line-height: 32px;
}
</style>