Apply borders to frame rather than other UI elements (#31081)

WordPress · Nov 5, 2021 · e4c3eb6 · e4c3eb6
1 parent 5fc66ef
commit e4c3eb6
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 12 deletions.
diff --git a/packages/edit-post/src/components/visual-editor/index.js b/packages/edit-post/src/components/visual-editor/index.js
@@ -117,6 +117,7 @@ export default function VisualEditor( { styles } ) {
 		// We intentionally omit a 100% height here. The container is a flex item, so the 100% height is granted by default.
 		// If a percentage height is present, older browsers such as Safari 13 apply that, but do so incorrectly as the inheritance is buggy.
 		width: '100%',
+		border: '1px solid #ddd',
 		margin: 0,
 		display: 'flex',
 		flexFlow: 'column',

diff --git a/packages/interface/src/components/interface-skeleton/style.scss b/packages/interface/src/components/interface-skeleton/style.scss
@@ -114,30 +114,20 @@ html.interface-interface-skeleton__html-container {
 
 .interface-interface-skeleton__sidebar {
 	overflow: auto;
-
-	@include break-medium() {
-		border-left: $border-width solid $gray-200;
-	}
-}
-
-.interface-interface-skeleton__secondary-sidebar {
-	@include break-medium() {
-		border-right: $border-width solid $gray-200;
-	}
+	border-top: $border-width solid $gray-200;
+	border-bottom: $border-width solid $gray-200;
 }
 
 .interface-interface-skeleton__header {
 	flex-shrink: 0;
 	height: auto;  // Keep the height flexible.
-	border-bottom: $border-width solid $gray-200;
 	z-index: z-index(".interface-interface-skeleton__header");
 	color: $gray-900;
 }
 
 .interface-interface-skeleton__footer {
 	height: auto; // Keep the height flexible.
 	flex-shrink: 0;
-	border-top: $border-width solid $gray-200;
 	color: $gray-900;
 	position: absolute;
 	bottom: 0;