mirror of https://github.com/halo-dev/halo
fix: resolve editor styling issues in Safari browser (#7328)
#### What type of PR is this? /kind bug /area editor /area ui /milestone 2.20.x #### What this PR does / why we need it: Replace `drop-shadow-*` with `shadow-*` to resolve editor styling issues in Safari brower. before: <img width="399" alt="image" src="https://github.com/user-attachments/assets/c9305e09-9f1b-4879-b532-a09b931ca178" /> <img width="270" alt="image" src="https://github.com/user-attachments/assets/d77cf742-c374-4b2d-b5a9-86f454103039" /> after: <img width="411" alt="image" src="https://github.com/user-attachments/assets/47ab2cce-b511-4ece-ac21-c8668ef89e75" /> <img width="250" alt="image" src="https://github.com/user-attachments/assets/70008a8f-2f36-44e7-a40a-a260476342f0" /> #### Which issue(s) this PR fixes: None #### Special notes for your reviewer: #### Does this PR introduce a user-facing change? ```release-note 修复编辑器在 Safari 浏览器中关于浮动工具栏和命令列表的样式问题。 ``` <!-- Fuuuuuuuuuuuuuuuuck Safari -->pull/7331/head
parent
fb7a09738a
commit
629a0f893e
|
@ -71,7 +71,7 @@ const shouldShow = (
|
|||
:default-animation="bubbleMenu.defaultAnimation"
|
||||
>
|
||||
<div
|
||||
class="bubble-menu bg-white flex items-center rounded-md p-1 border drop-shadow space-x-1"
|
||||
class="bubble-menu bg-white flex items-center rounded-md p-1 border shadow space-x-1"
|
||||
>
|
||||
<template v-if="bubbleMenu.items">
|
||||
<template
|
||||
|
|
|
@ -59,7 +59,7 @@ function getToolboxItemsFromExtensions() {
|
|||
</script>
|
||||
<template>
|
||||
<div
|
||||
class="editor-header py-1 space-x-1 px-1 overflow-auto border-b drop-shadow-sm bg-white text-center"
|
||||
class="editor-header py-1 space-x-1 px-1 overflow-auto border-b shadow-sm bg-white text-center"
|
||||
>
|
||||
<div class="h-full inline-flex items-center">
|
||||
<VMenu>
|
||||
|
@ -68,7 +68,7 @@ function getToolboxItemsFromExtensions() {
|
|||
</button>
|
||||
<template #popper>
|
||||
<div
|
||||
class="relative rounded-md bg-white overflow-hidden drop-shadow w-56 p-1 max-h-96 overflow-y-auto space-y-1.5"
|
||||
class="relative rounded-md bg-white overflow-hidden shadow w-56 p-1 max-h-96 overflow-y-auto space-y-1.5"
|
||||
>
|
||||
<component
|
||||
:is="toolboxItem.component"
|
||||
|
@ -106,7 +106,7 @@ function getToolboxItemsFromExtensions() {
|
|||
/>
|
||||
<template #popper>
|
||||
<div
|
||||
class="relative rounded-md bg-white overflow-hidden drop-shadow w-56 p-1 max-h-96 overflow-y-auto space-y-1.5"
|
||||
class="relative rounded-md bg-white overflow-hidden shadow w-56 p-1 max-h-96 overflow-y-auto space-y-1.5"
|
||||
>
|
||||
<component
|
||||
v-bind="child.props"
|
||||
|
|
|
@ -62,7 +62,7 @@ const handleBubbleItemClick = (editor: Editor) => {
|
|||
</button>
|
||||
<template #popper>
|
||||
<div
|
||||
class="relative rounded-md bg-white overflow-hidden drop-shadow w-96 p-1 max-h-72 overflow-y-auto"
|
||||
class="relative rounded-md bg-white overflow-hidden shadow w-96 p-1 max-h-72 overflow-y-auto"
|
||||
>
|
||||
<KeepAlive>
|
||||
<component :is="componentRef" v-bind="props"></component>
|
||||
|
|
|
@ -114,7 +114,7 @@ defineExpose({
|
|||
rounded-md
|
||||
bg-white
|
||||
overflow-hidden
|
||||
drop-shadow
|
||||
shadow
|
||||
w-52
|
||||
p-1
|
||||
max-h-72
|
||||
|
|
|
@ -93,7 +93,7 @@ const handleLinkBubbleButton = () => {
|
|||
|
||||
<template #popper>
|
||||
<div
|
||||
class="relative rounded-md bg-white overflow-hidden drop-shadow w-96 p-1 max-h-72 overflow-y-auto"
|
||||
class="relative rounded-md bg-white overflow-hidden shadow w-96 p-1 max-h-72 overflow-y-auto"
|
||||
>
|
||||
<input
|
||||
v-model.lazy="href"
|
||||
|
|
|
@ -97,7 +97,7 @@
|
|||
|
||||
.v-popper--theme-editor-block-dropdown {
|
||||
.v-popper__inner {
|
||||
@apply bg-white drop-shadow-md rounded-md;
|
||||
@apply bg-white shadow-md rounded-md;
|
||||
}
|
||||
|
||||
.v-popper__arrow-container {
|
||||
|
|
Loading…
Reference in New Issue