style: enhance layout and border styling in CodemirrorEditor.vue

This commit is contained in:
dribble-njr 2025-01-09 21:12:42 +08:00
parent eb64576ab6
commit f11c31cd96

View File

@ -369,7 +369,7 @@ onMounted(() => {
@end-copy="endCopy" @end-copy="endCopy"
/> />
<main class="container-main flex flex-1 flex-col"> <main class="container-main flex flex-1 flex-col">
<div class="container-main-section relative flex flex-1 overflow-hidden"> <div class="container-main-section relative flex flex-1 overflow-hidden border-1 border-t-0">
<PostSlider /> <PostSlider />
<div <div
ref="codeMirrorWrapper" ref="codeMirrorWrapper"
@ -420,7 +420,7 @@ onMounted(() => {
class="preview-wrapper flex-1 p-5" class="preview-wrapper flex-1 p-5"
> >
<div id="output-wrapper" :class="{ output_night: !backLight }"> <div id="output-wrapper" :class="{ output_night: !backLight }">
<div class="preview border shadow-xl"> <div class="preview border-x-1 shadow-xl">
<section id="output" v-html="output" /> <section id="output" v-html="output" />
<div v-if="isCoping" class="loading-mask"> <div v-if="isCoping" class="loading-mask">
<div class="loading-mask-box"> <div class="loading-mask-box">
@ -434,7 +434,7 @@ onMounted(() => {
<CssEditor class="order-2 flex-1" /> <CssEditor class="order-2 flex-1" />
<RightSlider class="order-2" /> <RightSlider class="order-2" />
</div> </div>
<footer class="h-[24px] flex items-center justify-end pr-5 text-[12px]"> <footer class="h-[30px] flex items-center justify-end pr-5 text-[12px]">
字数 {{ readingTime?.words }} 阅读大约需 {{ Math.ceil(readingTime?.minutes ?? 0) }} 分钟 字数 {{ readingTime?.words }} 阅读大约需 {{ Math.ceil(readingTime?.minutes ?? 0) }} 分钟
</footer> </footer>