|  |  | 
 |  |  | <template> | 
 |  |  |   <div class="bole-cell-wrapper"> | 
 |  |  |     <div class="cell-title-wrapper"> | 
 |  |  |     <div class="cell-title-wrapper" v-if="showTitle"> | 
 |  |  |       <slot name="title"> | 
 |  |  |         <div :class="titleSize === 'normal' ? 'cell-title' : 'cell-title-large'">{{ title }}</div> | 
 |  |  |         <slot name="title-right"></slot> | 
 |  |  | 
 |  |  | type Props = { | 
 |  |  |   title?: string; | 
 |  |  |   titleSize?: 'large' | 'normal'; | 
 |  |  |   showTitle?: boolean; | 
 |  |  | }; | 
 |  |  |  | 
 |  |  | const props = withDefaults(defineProps<Props>(), { | 
 |  |  |   titleSize: 'normal', | 
 |  |  |   showTitle: true, | 
 |  |  | }); | 
 |  |  | </script> | 
 |  |  |  | 
 |  |  | 
 |  |  |  | 
 |  |  | .bole-cell-wrapper { | 
 |  |  |   background: #ffffff; | 
 |  |  |   border-radius: 8px; | 
 |  |  |   padding: 24px 28px; | 
 |  |  |   margin-bottom: 24px; | 
 |  |  |   border-radius: 12px; | 
 |  |  |   padding: 36px 34px; | 
 |  |  |   margin-bottom: 20px; | 
 |  |  |  | 
 |  |  |   .cell-title-wrapper { | 
 |  |  |     display: flex; | 
 |  |  | 
 |  |  |  | 
 |  |  |     .cell-title-large { | 
 |  |  |       font-weight: 600; | 
 |  |  |       font-size: 32px; | 
 |  |  |       font-size: 30px; | 
 |  |  |       color: boleGetCssVar('text-color', 'primary'); | 
 |  |  |       line-height: 44px; | 
 |  |  |       line-height: 42px; | 
 |  |  |       @include ellipsis; | 
 |  |  |     } | 
 |  |  |   } |