Jelajahi Sumber

Always show StreamField and InlinePanel nesting guide lines

Thibaud Colas 2 tahun lalu
induk
melakukan
6b32591c85

+ 0 - 2
client/scss/components/forms/_nested-panel.scss

@@ -12,8 +12,6 @@ $panel-x-offset: calc($header-button-size-sm / 2 + $header-gap);
 
 // Styles for the top-level panel, and any panel within.
 .w-panel--nested {
-  @include guide-line-active();
-
   .w-panel__divider {
     @include guide-line-horizontal();
     // Slightly nicer text alignment.

+ 4 - 13
client/scss/tools/_mixins.guide-line.scss

@@ -3,13 +3,15 @@
  * StreamField and InlinePanel.
  */
 
+$guide-line-default-color: theme('colors.grey.150');
+
 @mixin guide-line-vertical() {
   // 3px dash height, 3px space, 1px dash width.
   background-size: 1px 6px;
   background-repeat: repeat-y;
   background-image: linear-gradient(
     to bottom,
-    var(--guide-line-color, transparent) 50%,
+    var(--guide-line-color, $guide-line-default-color) 50%,
     rgba(255, 255, 255, 0) 0%
   );
 
@@ -26,7 +28,7 @@
   background-repeat: repeat-x;
   background-image: linear-gradient(
     to right,
-    var(--guide-line-color, transparent) 50%,
+    var(--guide-line-color, $guide-line-default-color) 50%,
     rgba(255, 255, 255, 0) 0%
   );
 
@@ -38,17 +40,6 @@
   }
 }
 
-// Default guide line color for nested panels.
-@mixin guide-line-active() {
-  @media (hover: none) {
-    --guide-line-color: theme('colors.grey.150');
-  }
-
-  &:is(:hover, :focus-within) {
-    --guide-line-color: theme('colors.grey.150');
-  }
-}
-
 // More visible guide line for nested panels in the currently-active DOM tree.
 @mixin guide-line-nested() {
   &:is(:hover, :focus-within) {