diff --git a/app/assets/stylesheets/common/base/sidebar-section.scss b/app/assets/stylesheets/common/base/sidebar-section.scss index 4a4018d12c7..48c899eb39e 100644 --- a/app/assets/stylesheets/common/base/sidebar-section.scss +++ b/app/assets/stylesheets/common/base/sidebar-section.scss @@ -49,9 +49,6 @@ background: none; border: none; padding: 0.25em 0.5em; - opacity: 0; - transition: opacity 0.25s; - transition-delay: 0.5s; .d-icon { font-size: var(--font-down-1); @@ -92,12 +89,11 @@ border: none; background: transparent; padding: 0; - opacity: 0; - transition: opacity 0.25s; - transition-delay: 0.5s; + .d-icon { top: -0.1em; // visual alignment } + .discourse-no-touch & { &:hover { svg { diff --git a/app/assets/stylesheets/common/base/sidebar.scss b/app/assets/stylesheets/common/base/sidebar.scss index 66666869d09..413084428c9 100644 --- a/app/assets/stylesheets/common/base/sidebar.scss +++ b/app/assets/stylesheets/common/base/sidebar.scss @@ -13,13 +13,6 @@ align-self: start; overflow-y: auto; background-color: var(--primary-very-low); - &:hover { - .sidebar-section-header-button, - .sidebar-section-header-caret { - opacity: 1; - transition-delay: 0s; - } - } } .sidebar-container { diff --git a/app/assets/stylesheets/desktop/sidebar-section.scss b/app/assets/stylesheets/desktop/sidebar-section.scss new file mode 100644 index 00000000000..a0c4b231a2d --- /dev/null +++ b/app/assets/stylesheets/desktop/sidebar-section.scss @@ -0,0 +1,20 @@ +#main-outlet-wrapper { + .sidebar-wrapper { + .sidebar-section-header-button, + .sidebar-section-header-caret, + .sidebar-section-header-dropdown { + opacity: 0; + transition: opacity 0.25s; + transition-delay: 0.5s; + } + + &:hover { + .sidebar-section-header-button, + .sidebar-section-header-caret, + .sidebar-section-header-dropdown { + opacity: 1; + transition-delay: 0s; + } + } + } +}