diff --git a/changes/36342-scroll-yml-in-gitops-mode b/changes/36342-scroll-yml-in-gitops-mode new file mode 100644 index 0000000000..9fbbcf9f9f --- /dev/null +++ b/changes/36342-scroll-yml-in-gitops-mode @@ -0,0 +1 @@ +- Fleet UI: Allow users to scroll through disabled yml fields \ No newline at end of file diff --git a/frontend/components/YamlAce/_styles.scss b/frontend/components/YamlAce/_styles.scss index 61d6c207f2..537a1fc4b3 100644 --- a/frontend/components/YamlAce/_styles.scss +++ b/frontend/components/YamlAce/_styles.scss @@ -7,7 +7,7 @@ } } &--disabled { - @include disabled; + @include disabled($allow-pointer-events: true); } } diff --git a/frontend/styles/var/mixins.scss b/frontend/styles/var/mixins.scss index 7ec0ae163a..6c7bbf461f 100644 --- a/frontend/styles/var/mixins.scss +++ b/frontend/styles/var/mixins.scss @@ -118,12 +118,17 @@ $max-width: 2560px; } } -@mixin disabled { +@mixin disabled($allow-pointer-events: false) { opacity: 0.5; filter: grayscale(0.5); - pointer-events: none; cursor: default; + @if $allow-pointer-events { + pointer-events: auto; // Allows text selection/scroll in disabled state + } @else { + pointer-events: none; + } + // Must override &:hover, &:focus {