style: fix padding and background color

This commit is contained in:
陈凯龙 2022-04-07 10:18:47 +08:00
parent 18c6bd8686
commit f8c9d54687
3 changed files with 17 additions and 19 deletions

View File

@ -24,7 +24,7 @@ onMounted(() => {
</script> </script>
<template> <template>
<div :class="[`${prefixCls}-container`, 'relative']" ref="contentDetailWrap"> <div :class="[`${prefixCls}-container`, 'relative bg-[#fff]']" ref="contentDetailWrap">
<Sticky :offset="offset"> <Sticky :offset="offset">
<div <div
:class="[ :class="[

View File

@ -14,22 +14,20 @@ defineProps({
</script> </script>
<template> <template>
<div style="padding: var(--app-content-padding)"> <ElCard :class="[prefixCls, 'mb-20px']" shadow="never">
<ElCard :class="[prefixCls, 'mb-20px']" shadow="never"> <template v-if="title" #header>
<template v-if="title" #header> <div class="flex items-center">
<div class="flex items-center"> <span class="text-16px font-700">{{ title }}</span>
<span class="text-16px font-700">{{ title }}</span> <ElTooltip v-if="message" effect="dark" placement="right">
<ElTooltip v-if="message" effect="dark" placement="right"> <template #content>
<template #content> <div class="max-w-200px">{{ message }}</div>
<div class="max-w-200px">{{ message }}</div> </template>
</template> <Icon class="ml-5px" icon="bi:question-circle-fill" :size="14" />
<Icon class="ml-5px" icon="bi:question-circle-fill" :size="14" /> </ElTooltip>
</ElTooltip>
</div>
</template>
<div>
<slot></slot>
</div> </div>
</ElCard> </template>
</div> <div>
<slot></slot>
</div>
</ElCard>
</template> </template>

View File

@ -22,7 +22,7 @@ const getCaches = computed((): string[] => {
<template> <template>
<section <section
:class="[ :class="[
'w-[100%] bg-[var(--app-contnet-bg-color)]', 'p-[var(--app-content-padding)] w-[100%] bg-[var(--app-contnet-bg-color)]',
{ {
'!min-h-[calc(100%-var(--app-footer-height))]': '!min-h-[calc(100%-var(--app-footer-height))]':
fixedHeader && (layout === 'classic' || layout === 'topLeft') && footer, fixedHeader && (layout === 'classic' || layout === 'topLeft') && footer,