Skip to content

Commit c5f8ebd

Browse files
committed
fix(calendar-view): [calendar-view] increase the maximum height and overflow handling of calendar-view tooltip content to optimize display effect
1 parent 1a03127 commit c5f8ebd

File tree

4 files changed

+15
-2
lines changed

4 files changed

+15
-2
lines changed

packages/theme-saas/src/calendar-view/index.less

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -630,6 +630,8 @@
630630
@apply ~'max-w-[theme(spacing.80)]';
631631

632632
.tooltip-main{
633+
@apply overflow-auto;
634+
@apply max-h-[80vh];
633635
@apply p-2;
634636

635637
.title{

packages/theme/src/calendar-view/index.less

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -630,12 +630,17 @@
630630
.inject-CalendarView-vars();
631631
position: absolute;
632632
max-width: 320px;
633+
633634
.tooltip-main {
635+
overflow: auto;
636+
max-height: 80vh;
634637
padding: var(--tv-CalendarView-tooltip-title-font-size);
638+
635639
.title {
636640
font-size: var(--tv-CalendarView-tooltip-title-font-size);
637641
font-weight: var(--tv-CalendarView-tooltip-title-font-weight);
638642
}
643+
639644
.date {
640645
margin: 6px 0;
641646
color: var(--tv-CalendarView-tooltip-date-text-color);

packages/vue/src/calendar-view/src/mobile-first.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<tiny-tooltip
44
ref="tooltip"
55
v-model="state.eventTipVisible"
6-
popper-class="absolute max-w-[theme(spacing.80)]"
6+
popper-class="absolute max-w-[theme(spacing.80)] max-h-[80vh] overflow-auto"
77
:manual="true"
88
effect="light"
99
placement="right"

packages/vue/src/tooltip/src/mobile-first.vue

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -136,6 +136,8 @@ export default defineComponent({
136136
component: {
137137
render: () => {
138138
let content = getContent(this)
139+
// 当内容为纯文本时,添加一层wrapper,其他情况(插槽、renderContent)原样输出
140+
const addWrapper = typeof content === 'string'
139141
let propsData = { on: { 'after-leave': this.doDestroy } }
140142
let mouseenter = () => this.setExpectedState(true)
141143
let mouseleave = () => {
@@ -163,7 +165,11 @@ export default defineComponent({
163165
aria-hidden={this.disabled || !this.state.showPopper ? 'true' : 'false'}
164166
onMouseenter={() => mouseenter()}
165167
onMouseleave={() => mouseleave()}>
166-
<div style={`overflow:auto; max-height:${this.contentMaxHeight}`}>{content}</div>
168+
{addWrapper ? (
169+
<div style={`overflow:auto;max-height:${this.contentMaxHeight}`}>{content}</div>
170+
) : (
171+
content
172+
)}
167173
{this.visibleArrow ? (
168174
<div
169175
x-arrow

0 commit comments

Comments
 (0)