summaryrefslogtreecommitdiffstats
path: root/wp-includes/css/dist/block-editor/content.css
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-09-19 04:51:18 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-09-19 04:51:18 +0000
commit0e41b5d52fdc6af6442816b5f465c9db9f84e126 (patch)
treee139a90049b158d4eed892d1662ee7f5c358fa31 /wp-includes/css/dist/block-editor/content.css
parentAdding upstream version 6.5.5+dfsg1. (diff)
downloadwordpress-upstream.tar.xz
wordpress-upstream.zip
Adding upstream version 6.6.1+dfsg1.upstream/6.6.1+dfsg1upstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'wp-includes/css/dist/block-editor/content.css')
-rw-r--r--wp-includes/css/dist/block-editor/content.css272
1 files changed, 131 insertions, 141 deletions
diff --git a/wp-includes/css/dist/block-editor/content.css b/wp-includes/css/dist/block-editor/content.css
index 2d23ec1..4f18061 100644
--- a/wp-includes/css/dist/block-editor/content.css
+++ b/wp-includes/css/dist/block-editor/content.css
@@ -8,7 +8,7 @@
--wp-admin-border-width-focus:2px;
--wp-block-synced-color:#7a00df;
--wp-block-synced-color--rgb:122, 0, 223;
- --wp-bound-block-color:#9747ff;
+ --wp-bound-block-color:var(--wp-block-synced-color);
}
@media (min-resolution:192dpi){
:root{
@@ -55,9 +55,6 @@
.block-editor-block-list__layout{
position:relative;
}
-.block-editor-block-list__layout:where(.block-editor-block-list__block.is-multi-selected:not(.is-partially-selected)){
- border-radius:2px;
-}
.block-editor-block-list__layout .block-editor-block-list__block.is-multi-selected:not(.is-partially-selected) ::selection,.block-editor-block-list__layout .block-editor-block-list__block.is-multi-selected:not(.is-partially-selected)::selection{
background:#0000;
}
@@ -65,7 +62,6 @@
animation:selection-overlay__fade-in-animation .1s ease-out;
animation-fill-mode:forwards;
background:var(--wp-admin-theme-color);
- border-radius:2px;
bottom:0;
content:"";
left:0;
@@ -84,26 +80,27 @@
}
}
.block-editor-block-list__layout .block-editor-block-list__block.is-multi-selected:not(.is-partially-selected).is-highlighted:after{
- box-shadow:none;
+ outline-color:#0000;
}
.block-editor-block-list__layout .block-editor-block-list__block.is-highlighted,.block-editor-block-list__layout .block-editor-block-list__block.is-highlighted~.is-multi-selected,.block-editor-block-list__layout .block-editor-block-list__block:not([contenteditable=true]):focus,.block-editor-block-list__layout.is-navigate-mode .block-editor-block-list__block.is-selected{
outline:none;
}
.block-editor-block-list__layout .block-editor-block-list__block.is-highlighted:after,.block-editor-block-list__layout .block-editor-block-list__block.is-highlighted~.is-multi-selected:after,.block-editor-block-list__layout .block-editor-block-list__block:not([contenteditable=true]):focus:after,.block-editor-block-list__layout.is-navigate-mode .block-editor-block-list__block.is-selected:after{
- border-radius:1px;
- bottom:1px;
- box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
+ bottom:0;
content:"";
- left:1px;
- outline:2px solid #0000;
+ left:0;
+ outline-color:var(--wp-admin-theme-color);
+ outline-offset:calc((-1*var(--wp-admin-border-width-focus))/var(--wp-block-editor-iframe-zoom-out-scale, 1));
+ outline-style:solid;
+ outline-width:calc(var(--wp-admin-border-width-focus)/var(--wp-block-editor-iframe-zoom-out-scale, 1));
pointer-events:none;
position:absolute;
- right:1px;
- top:1px;
+ right:0;
+ top:0;
z-index:1;
}
.is-dark-theme .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted:after,.is-dark-theme .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted~.is-multi-selected:after,.is-dark-theme .block-editor-block-list__layout .block-editor-block-list__block:not([contenteditable=true]):focus:after,.is-dark-theme .block-editor-block-list__layout.is-navigate-mode .block-editor-block-list__block.is-selected:after{
- box-shadow:0 0 0 var(--wp-admin-border-width-focus) #fff;
+ outline-color:#fff;
}
.block-editor-block-list__layout .is-block-moving-mode.block-editor-block-list__block.is-selected:after{
border-radius:2px;
@@ -150,6 +147,9 @@
-webkit-user-select:none;
user-select:none;
}
+.block-editor-block-list__layout .block-editor-block-list__block.has-negative-margin.has-child-selected,.block-editor-block-list__layout .block-editor-block-list__block.has-negative-margin.is-selected{
+ z-index:20;
+}
.block-editor-block-list__layout .block-editor-block-list__block .reusable-block-edit-panel *{
z-index:1;
}
@@ -200,52 +200,57 @@
float:none;
}
-.is-outline-mode .block-editor-block-list__block:not(.remove-outline).is-hovered{
- cursor:default;
-}
-.is-outline-mode .block-editor-block-list__block:not(.remove-outline).is-hovered:after{
- border-radius:1px;
- bottom:1px;
- box-shadow:0 0 0 1px var(--wp-admin-theme-color);
- content:"";
- left:1px;
- pointer-events:none;
- position:absolute;
- right:1px;
- top:1px;
-}
.is-outline-mode .block-editor-block-list__block:not(.remove-outline).is-selected{
cursor:default;
}
.is-outline-mode .block-editor-block-list__block:not(.remove-outline).is-selected.rich-text{
cursor:unset;
}
-.is-outline-mode .block-editor-block-list__block:not(.remove-outline).is-selected:after{
- border-radius:2px;
- bottom:1px;
- box-shadow:0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
+.is-outline-mode .block-editor-block-list__block:not(.remove-outline).is-hovered:not(.is-selected):after,.is-outline-mode .block-editor-block-list__block:not(.remove-outline):not(.rich-text):not([contenteditable=true]).is-selected:after{
+ bottom:0;
content:"";
- left:1px;
+ left:0;
+ outline-color:var(--wp-admin-theme-color);
+ outline-offset:calc((-1*var(--wp-admin-border-width-focus))/var(--wp-block-editor-iframe-zoom-out-scale, 1));
+ outline-style:solid;
+ outline-width:calc(var(--wp-admin-border-width-focus)/var(--wp-block-editor-iframe-zoom-out-scale, 1));
pointer-events:none;
position:absolute;
- right:1px;
- top:1px;
+ right:0;
+ top:0;
+}
+.is-outline-mode .block-editor-block-list__block:not(.remove-outline).is-reusable.block-editor-block-list__block:not([contenteditable]):focus:after,.is-outline-mode .block-editor-block-list__block:not(.remove-outline).is-reusable.is-highlighted:after,.is-outline-mode .block-editor-block-list__block:not(.remove-outline).is-reusable.is-hovered:after,.is-outline-mode .block-editor-block-list__block:not(.remove-outline).is-reusable.is-selected:after,.is-outline-mode .block-editor-block-list__block:not(.remove-outline).wp-block-template-part.block-editor-block-list__block:not([contenteditable]):focus:after,.is-outline-mode .block-editor-block-list__block:not(.remove-outline).wp-block-template-part.is-highlighted:after,.is-outline-mode .block-editor-block-list__block:not(.remove-outline).wp-block-template-part.is-hovered:after,.is-outline-mode .block-editor-block-list__block:not(.remove-outline).wp-block-template-part.is-selected:after{
+ outline-color:var(--wp-block-synced-color);
+}
+.is-dark-theme .is-outline-mode .block-editor-block-list__block:not(.remove-outline).is-reusable.block-editor-block-list__block:not([contenteditable]):focus:after,.is-dark-theme .is-outline-mode .block-editor-block-list__block:not(.remove-outline).wp-block-template-part.block-editor-block-list__block:not([contenteditable]):focus:after{
+ outline-color:#fff;
}
-@keyframes block-editor-has-editable-outline__fade-out-animation{
+@keyframes block-editor-is-editable__animation{
0%{
- border-color:rgba(var(--wp-admin-theme-color--rgb), 1);
+ background-color:rgba(var(--wp-admin-theme-color--rgb), .1);
}
to{
- border-color:rgba(var(--wp-admin-theme-color--rgb), 0);
+ background-color:rgba(var(--wp-admin-theme-color--rgb), 0);
}
}
-.is-root-container:not([inert]) .block-editor-block-list__block.has-editable-outline:after{
- animation:block-editor-has-editable-outline__fade-out-animation .3s ease-out;
- animation-delay:1s;
- animation-fill-mode:forwards;
- border:1px dotted rgba(var(--wp-admin-theme-color--rgb), 1);
- border-radius:2px;
+@keyframes block-editor-is-editable__animation_reduce-motion{
+ 0%{
+ background-color:rgba(var(--wp-admin-theme-color--rgb), .1);
+ }
+ 99%{
+ background-color:rgba(var(--wp-admin-theme-color--rgb), .1);
+ }
+ to{
+ background-color:rgba(var(--wp-admin-theme-color--rgb), 0);
+ }
+}
+.is-root-container:not([inert]) .block-editor-block-list__block.is-reusable.is-selected .block-editor-block-list__block.has-editable-outline:after{
+ animation-delay:.1s;
+ animation-duration:.8s;
+ animation-fill-mode:backwards;
+ animation-name:block-editor-is-editable__animation;
+ animation-timing-function:ease-out;
bottom:0;
content:"";
left:0;
@@ -255,9 +260,9 @@
top:0;
}
@media (prefers-reduced-motion:reduce){
- .is-root-container:not([inert]) .block-editor-block-list__block.has-editable-outline:after{
+ .is-root-container:not([inert]) .block-editor-block-list__block.is-reusable.is-selected .block-editor-block-list__block.has-editable-outline:after{
animation-delay:0s;
- animation-duration:1ms;
+ animation-name:block-editor-is-editable__animation_reduce-motion;
}
}
@@ -361,11 +366,6 @@
margin-bottom:auto;
}
-.block-editor-iframe__body{
- transform-origin:top center;
- transition:all .3s;
-}
-
.is-vertical .block-list-appender{
margin-left:12px;
margin-right:auto;
@@ -385,38 +385,13 @@
.block-editor-block-list__block.has-block-overlay{
cursor:default;
}
-.block-editor-block-list__block.has-block-overlay:before{
- background:#0000;
- border:none;
- border-radius:2px;
- content:"";
- height:100%;
- left:0;
- position:absolute;
- top:0;
- width:100%;
- z-index:10;
-}
-.block-editor-block-list__block.has-block-overlay:not(.is-multi-selected):after{
- content:none !important;
-}
-.block-editor-block-list__block.has-block-overlay:hover:not(.is-dragging-blocks):not(.is-multi-selected):before{
- background:rgba(var(--wp-admin-theme-color--rgb), .04);
- box-shadow:0 0 0 1px var(--wp-admin-theme-color) inset;
-}
-.block-editor-block-list__block.has-block-overlay.is-reusable:hover:not(.is-dragging-blocks):not(.is-multi-selected):before,.block-editor-block-list__block.has-block-overlay.wp-block-template-part:hover:not(.is-dragging-blocks):not(.is-multi-selected):before{
- background:rgba(var(--wp-block-synced-color--rgb), .04);
- box-shadow:0 0 0 1px var(--wp-block-synced-color) inset;
-}
-.block-editor-block-list__block.has-block-overlay.is-selected:not(.is-dragging-blocks):before{
- box-shadow:0 0 0 1px var(--wp-admin-theme-color) inset;
-}
.block-editor-block-list__block.has-block-overlay .block-editor-block-list__block{
pointer-events:none;
}
-.block-editor-iframe__body.is-zoomed-out .block-editor-block-list__block.has-block-overlay:before{
- left:calc(50% - 50vw);
- width:100vw;
+.block-editor-block-list__block.has-block-overlay .block-editor-block-list__block.has-block-overlay:before{
+ left:0;
+ right:0;
+ width:auto;
}
.block-editor-block-list__layout .is-dragging{
@@ -449,71 +424,37 @@
display:none;
}
-.block-editor-block-variation-picker .components-placeholder__instructions{
- margin-bottom:0;
-}
-.block-editor-block-variation-picker .components-placeholder__fieldset{
- flex-direction:column;
-}
-.block-editor-block-variation-picker.has-many-variations .components-placeholder__fieldset{
- max-width:90%;
-}
-
-.block-editor-block-variation-picker__variations.block-editor-block-variation-picker__variations{
+.block-editor-block-variation-picker__skip,.block-editor-block-variation-picker__variations,.wp-block-group-placeholder__variations{
display:flex;
flex-direction:row;
flex-wrap:wrap;
+ font-size:12px;
+ gap:8px;
justify-content:flex-start;
list-style:none;
- margin:16px 0;
+ margin:0;
padding:0;
width:100%;
}
-.block-editor-block-variation-picker__variations.block-editor-block-variation-picker__variations>li{
- flex-shrink:1;
- list-style:none;
- margin:8px 20px 0 0;
- text-align:center;
- width:75px;
+.block-editor-block-variation-picker__skip svg,.block-editor-block-variation-picker__variations svg,.wp-block-group-placeholder__variations svg{
+ fill:#949494 !important;
}
-.block-editor-block-variation-picker__variations.block-editor-block-variation-picker__variations>li button{
- display:inline-flex;
- margin-right:0;
+.block-editor-block-variation-picker__skip .components-button,.block-editor-block-variation-picker__variations .components-button,.wp-block-group-placeholder__variations .components-button{
+ padding:4px;
}
-.block-editor-block-variation-picker__variations.block-editor-block-variation-picker__variations .block-editor-block-variation-picker__variation{
- padding:8px;
-}
-.block-editor-block-variation-picker__variations.block-editor-block-variation-picker__variations .block-editor-block-variation-picker__variation-label{
- display:block;
- font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;
- font-size:12px;
- line-height:1.4;
+.block-editor-block-variation-picker__skip .components-button:hover,.block-editor-block-variation-picker__variations .components-button:hover,.wp-block-group-placeholder__variations .components-button:hover{
+ background:none !important;
}
-
-.block-editor-block-variation-picker__variation{
- width:100%;
+.block-editor-block-variation-picker__skip .components-button:hover svg,.block-editor-block-variation-picker__variations .components-button:hover svg,.wp-block-group-placeholder__variations .components-button:hover svg{
+ fill:var(--wp-admin-theme-color) !important;
}
-.block-editor-block-variation-picker__variation.components-button.has-icon{
- justify-content:center;
+.block-editor-block-variation-picker__skip>li,.block-editor-block-variation-picker__variations>li,.wp-block-group-placeholder__variations>li{
+ align-items:center;
+ display:flex;
+ flex-direction:column;
+ gap:4px;
width:auto;
}
-.block-editor-block-variation-picker__variation.components-button.has-icon.is-secondary{
- background-color:#fff;
-}
-.block-editor-block-variation-picker__variation.components-button{
- height:auto;
- padding:0;
-}
-.block-editor-block-variation-picker__variation:before{
- content:"";
- padding-bottom:100%;
-}
-.block-editor-block-variation-picker__variation:first-child{
- margin-left:0;
-}
-.block-editor-block-variation-picker__variation:last-child{
- margin-right:0;
-}
.block-editor-button-block-appender{
align-items:center;
@@ -569,7 +510,10 @@
top:0;
}
.block-editor-block-list__block:not(.is-selected)>.is-layout-constrained.wp-block-group__inner-container>.block-list-appender:only-child .block-editor-inserter,.block-editor-block-list__block:not(.is-selected)>.is-layout-flow.wp-block-group__inner-container>.block-list-appender:only-child .block-editor-inserter,.is-layout-constrained.block-editor-block-list__block:not(.is-selected)>.block-list-appender:only-child .block-editor-inserter,.is-layout-flow.block-editor-block-list__block:not(.is-selected)>.block-list-appender:only-child .block-editor-inserter{
- visibility:hidden;
+ opacity:0;
+}
+.block-editor-block-list__block:not(.is-selected)>.is-layout-constrained.wp-block-group__inner-container>.block-list-appender:only-child .block-editor-inserter:focus-within,.block-editor-block-list__block:not(.is-selected)>.is-layout-flow.wp-block-group__inner-container>.block-list-appender:only-child .block-editor-inserter:focus-within,.is-layout-constrained.block-editor-block-list__block:not(.is-selected)>.block-list-appender:only-child .block-editor-inserter:focus-within,.is-layout-flow.block-editor-block-list__block:not(.is-selected)>.block-list-appender:only-child .block-editor-inserter:focus-within{
+ opacity:1;
}
.block-editor-block-list__block:not(.is-selected)>.is-layout-constrained.wp-block-group__inner-container>.block-list-appender:only-child.is-drag-over:after,.block-editor-block-list__block:not(.is-selected)>.is-layout-flow.wp-block-group__inner-container>.block-list-appender:only-child.is-drag-over:after,.is-layout-constrained.block-editor-block-list__block:not(.is-selected)>.block-list-appender:only-child.is-drag-over:after,.is-layout-flow.block-editor-block-list__block:not(.is-selected)>.block-list-appender:only-child.is-drag-over:after{
border:none;
@@ -603,7 +547,8 @@
.block-editor-default-block-appender .block-editor-default-block-appender__content{
opacity:.62;
}
-:where(body .is-layout-constrained) .block-editor-default-block-appender>:first-child:first-child{
+:where(.wp-site-blocks) .block-editor-default-block-appender>:first-child,:where(body .is-layout-constrained) .block-editor-default-block-appender>:first-child{
+ margin-block-end:0;
margin-block-start:0;
}
.block-editor-default-block-appender .components-drop-zone__content-icon{
@@ -683,6 +628,59 @@
cursor:text;
}
+.block-editor-iframe__body{
+ position:relative;
+}
+
+.block-editor-iframe__container{
+ height:100%;
+ overflow-x:hidden;
+ width:100%;
+}
+
+.block-editor-iframe__scale-container{
+ display:flex;
+ height:100%;
+ width:100%;
+}
+
+.block-editor-iframe__scale-container.is-zoomed-out{
+ margin-left:calc((var(--wp-block-editor-iframe-zoom-out-prev-container-width, 100vw) - var(--wp-block-editor-iframe-zoom-out-container-width, 100vw))*-1/2);
+ width:var(--wp-block-editor-iframe-zoom-out-prev-container-width, 100vw);
+}
+
+.block-editor-iframe__html{
+ transform-origin:top center;
+ transition:transform .3s;
+}
+@media (prefers-reduced-motion:reduce){
+ .block-editor-iframe__html{
+ transition-delay:0s;
+ transition-duration:0s;
+ }
+}
+
+.block-editor-iframe__html.is-zoomed-out{
+ background-color:#ddd;
+ border:calc(var(--wp-block-editor-iframe-zoom-out-frame-size)/var(--wp-block-editor-iframe-zoom-out-scale)) solid #ddd;
+ margin-bottom:calc(var(--wp-block-editor-iframe-zoom-out-content-height)*(1 - var(--wp-block-editor-iframe-zoom-out-scale))*-1 + var(--wp-block-editor-iframe-zoom-out-frame-size)*2*-1 + -2px);
+ transform:scale(var(--wp-block-editor-iframe-zoom-out-scale));
+}
+.block-editor-iframe__html.is-zoomed-out body{
+ display:flex;
+ flex-direction:column;
+ min-height:calc((var(--wp-block-editor-iframe-zoom-out-inner-height) - 2*var(--wp-block-editor-iframe-zoom-out-frame-size))/var(--wp-block-editor-iframe-zoom-out-scale));
+}
+.block-editor-iframe__html.is-zoomed-out body>.is-root-container{
+ display:flex;
+ flex:1;
+ flex-direction:column;
+ height:100%;
+}
+.block-editor-iframe__html.is-zoomed-out body>.is-root-container>main{
+ flex:1;
+}
+
.block-editor-block-list__layout.has-overlay:after{
bottom:0;
content:"";
@@ -693,10 +691,6 @@
z-index:60;
}
-.block-editor-media-placeholder__url-input-container .block-editor-media-placeholder__button{
- margin-bottom:0;
-}
-
.block-editor-media-placeholder__url-input-form{
display:flex;
}
@@ -718,10 +712,6 @@
flex-shrink:1;
}
-.block-editor-media-placeholder__button{
- margin-bottom:.5rem;
-}
-
.block-editor-media-placeholder__cancel-button.is-link{
display:block;
margin:1em;