<!--
 * @Author: Jason Liu
 * @Date: 2023-03-07 14:04:53
 * @Desc: 
-->
<template>
  <div :class="['win_title', `win_title_${size}`]">
    <slot></slot>
  </div>
</template>

<script>
export default {
  name: "winTitle",
  props: {
    size: {
      type: String,
      default: undefined,
    },
  },
  data() {
    return {
      
    }
  },
};
</script>

<style lang="less">
@import "~w-vue-middle/themes/config.less";
.win_title {
  display: initial;
  position: relative;
  padding-left: 10px;
  font-size: 14px;
  font-weight: 600;
  color: #000;
  text-overflow: ellipsis; /*让截断的文字显示为点点。还有一个值是clip意截断不显示点点*/
  white-space: nowrap; /*让文字不换行*/
  overflow: hidden; /*超出要隐藏*/

  &.win_title_large {
    font-size: 16px;
  }
  &::before {
    content: "";
    position: absolute;
    width: 4px;
    background: linear-gradient(90deg, @main, @secondaryColor);
    border-radius: 2px;
    left: 0;
    bottom: 0px;
    top: 0px;
  }

  .ant-input {
    border: 0;
    border-radius: 0;
    border-bottom: 1px solid @borderColor;
    &:focus {
      box-shadow: none;
    }
  }
}
</style>
