diff --git a/core/modules/navigation/css/components/admin-toolbar.css b/core/modules/navigation/css/components/admin-toolbar.css index 25680dd2519..b0404be1b3e 100644 --- a/core/modules/navigation/css/components/admin-toolbar.css +++ b/core/modules/navigation/css/components/admin-toolbar.css @@ -65,14 +65,6 @@ body { font-family: var(--admin-toolbar-font-family); inline-size: calc(var(--admin-toolbar-sidebar-width) + 1px); } -.admin-toolbar::after { - position: absolute; - top: 0; - height: 100%; - content: ""; - border-inline-end: 1px solid var(--admin-toolbar-color-gray-100); - inset-inline-end: 0; -} [dir="rtl"] .admin-toolbar { right: 0; transform: translateX(100%); @@ -272,6 +264,7 @@ body { gap: var(--admin-toolbar-space-12); padding-block: var(--admin-toolbar-sidebar-header) var(--admin-toolbar-space-16); padding-inline: var(--admin-toolbar-space-16); + border-inline-end: 1px solid var(--admin-toolbar-color-gray-100); } @media (min-width: 64rem) { .admin-toolbar__content { @@ -307,10 +300,11 @@ body { margin-block-start: auto; padding: var(--admin-toolbar-space-16); border-block-start: 1px solid var(--admin-toolbar-color-gray-200); + border-inline-end: 1px solid var(--admin-toolbar-color-gray-100); } @media (min-width: 64rem) { .admin-toolbar__footer { - --admin-toolbar-z-index-footer: -1; + --admin-toolbar-z-index-footer: 1; position: sticky; bottom: 0; diff --git a/core/modules/navigation/css/components/admin-toolbar.pcss.css b/core/modules/navigation/css/components/admin-toolbar.pcss.css index 0977baf3c4a..71eae9586bc 100644 --- a/core/modules/navigation/css/components/admin-toolbar.pcss.css +++ b/core/modules/navigation/css/components/admin-toolbar.pcss.css @@ -66,15 +66,6 @@ body { font-family: var(--admin-toolbar-font-family); inline-size: calc(var(--admin-toolbar-sidebar-width) + 1px); - &::after { - position: absolute; - top: 0; - height: 100%; - content: ""; - border-inline-end: 1px solid var(--admin-toolbar-color-gray-100); - inset-inline-end: 0; - } - [dir="rtl"] & { right: 0; transform: translateX(100%); @@ -286,6 +277,7 @@ body { gap: var(--admin-toolbar-space-12); padding-block: var(--admin-toolbar-sidebar-header) var(--admin-toolbar-space-16); padding-inline: var(--admin-toolbar-space-16); + border-inline-end: 1px solid var(--admin-toolbar-color-gray-100); @media (--admin-toolbar-desktop) { display: flex; @@ -321,9 +313,10 @@ body { margin-block-start: auto; padding: var(--admin-toolbar-space-16); border-block-start: 1px solid var(--admin-toolbar-color-gray-200); + border-inline-end: 1px solid var(--admin-toolbar-color-gray-100); @media (--admin-toolbar-desktop) { - --admin-toolbar-z-index-footer: -1; + --admin-toolbar-z-index-footer: 1; position: sticky; bottom: 0; diff --git a/core/modules/navigation/css/components/toolbar-popover.css b/core/modules/navigation/css/components/toolbar-popover.css index 880c96f1ebc..af5551032a8 100644 --- a/core/modules/navigation/css/components/toolbar-popover.css +++ b/core/modules/navigation/css/components/toolbar-popover.css @@ -62,7 +62,7 @@ filter: drop-shadow(0 0 4.5rem rgba(0, 0, 0, 0.2)) drop-shadow(0 0 0.5rem rgba(0, 0, 0, 0.04)) drop-shadow(0 0 2.5rem rgba(0, 0, 0, 0.06)); inline-size: var(--admin-toolbar-popover-width); inset-block-start: 0; - inset-inline-start: 0; + inset-inline-start: 1px; } } [data-toolbar-popover-safe-triangle] { diff --git a/core/modules/navigation/css/components/toolbar-popover.pcss.css b/core/modules/navigation/css/components/toolbar-popover.pcss.css index ecaca8bda87..394f8b67334 100644 --- a/core/modules/navigation/css/components/toolbar-popover.pcss.css +++ b/core/modules/navigation/css/components/toolbar-popover.pcss.css @@ -62,7 +62,7 @@ filter: drop-shadow(0 0 72px rgba(0, 0, 0, 0.2)) drop-shadow(0 0 8px rgba(0, 0, 0, 0.04)) drop-shadow(0 0 40px rgba(0, 0, 0, 0.06)); inline-size: var(--admin-toolbar-popover-width); inset-block-start: 0; - inset-inline-start: 0; + inset-inline-start: 1px; } }