Changeset 13175

Timestamp:

02/05/2024 10:09:32 PM (15 months ago)

Author:

coffee2code

Message:

Breathe: Add toggle indicator to welcome box toggle button.

Props pitamdey, coffee2code.
Fixes #7333.

Location:

sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-breathe

Files:

• functions.php (modified) (2 diffs)
• style.css (modified) (1 diff)

sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-breathe/functions.php

@@ -105 +105 @@
                 // Toggle it
                 $toggle.text( $toggle.data( isHide ? 'show' : 'hide' ) );
+                $welcome.get( 0 ).classList.toggle( 'collapsed', isHide );
                 $content.slideToggle();
                 $welcome.find('.post-edit-link' ).toggle( ! isHide );
@@ -160 +161 @@
                     if ( -1 !== document.cookie.indexOf( elContent.dataset.cookie + '=' + elContent.dataset.hash ) ) {
                         var elToggle = document.getElementById( 'make-welcome-toggle' ),
-                            elEditLink = document.getElementsByClassName( 'make-welcome-edit-post-link' )
+                            elEditLink = document.getElementsByClassName( 'make-welcome-edit-post-link' ),
+                            elContainer = document.querySelector( '.make-welcome' );
 
                         // It's hidden, hide it ASAP.
                         elContent.className += " hidden";
                         elToggle.innerText = elToggle.dataset.show;
+
+                        // Add class to welcome box container indicating collapsed state.
+                        elContainer && elContainer.classList.add( 'collapsed' );
 
                         if ( elEditLink.length ) {

sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-breathe/style.css

@@ -933 +933 @@
 }
 
+.make-welcome #make-welcome-toggle::after {
+    content: "\f343";
+    font-family: dashicons;
+    vertical-align: middle;
+    margin-left: 9px;
+    overflow: auto;
+}
+.make-welcome.collapsed #make-welcome-toggle::after {
+    content: "\f347";
+}
+
 .make-welcome .hidden {
     display: none;