fix: state and styles for toolbar handler for hp (#6126)

plone · Jul 29, 2024 · 8530234 · 8530234
1 parent 2c53ebf
commit 8530234
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 6 deletions.
diff --git a/packages/volto/news/6126.bugfix b/packages/volto/news/6126.bugfix
@@ -0,0 +1 @@
+Fix the toolbar handler color for the homepage to match its "published" state. @sabrina-bongiovanni
diff --git a/packages/volto/src/components/manage/Toolbar/Toolbar.jsx b/packages/volto/src/components/manage/Toolbar/Toolbar.jsx
@@ -623,7 +623,7 @@ class Toolbar extends Component {
                 aria-label={this.props.intl.formatMessage(
                   messages.shrinkToolbar,
                 )}
-                className={cx({
+                className={cx('toolbar-handler-button', {
                   [this.props.content?.review_state]:
                     this.props.content?.review_state,
                 })}

diff --git a/packages/volto/src/components/manage/Toolbar/__snapshots__/Toolbar.test.jsx.snap b/packages/volto/src/components/manage/Toolbar/__snapshots__/Toolbar.test.jsx.snap
@@ -183,7 +183,7 @@ Array [
     >
       <button
         aria-label="Shrink toolbar"
-        className=""
+        className="toolbar-handler-button"
         onClick={[Function]}
       />
     </div>
@@ -377,7 +377,7 @@ Array [
     >
       <button
         aria-label="Shrink toolbar"
-        className=""
+        className="toolbar-handler-button"
         onClick={[Function]}
       />
     </div>

diff --git a/packages/volto/theme/themes/pastanaga/extras/toolbar.less b/packages/volto/theme/themes/pastanaga/extras/toolbar.less
@@ -129,7 +129,7 @@ body:not(.has-sidebar):not(.has-sidebar-collapsed) {
     }
 
     .toolbar-handler {
-      button {
+      .toolbar-handler-button {
         opacity: 0.3;
       }
 
@@ -243,7 +243,7 @@ body:not(.has-sidebar):not(.has-sidebar-collapsed) {
       width: 100%;
       justify-content: center;
 
-      button {
+      .toolbar-handler-button {
         width: @toolbarWidth;
         height: 20px;
         padding: 0;
@@ -428,7 +428,7 @@ body:not(.has-sidebar):not(.has-sidebar-collapsed) {
         flex-direction: column;
         justify-content: center;
 
-        button {
+        .toolbar-handler-button {
           width: @toolbarWidthMin;
           height: @toolbarWidth;
 
@@ -752,3 +752,10 @@ body:not(.has-sidebar):not(.has-sidebar-collapsed) {
   }
 }
 // End Orphaned CSS
+
+// Toolbar handler color in homepage
+.contenttype-plone-site {
+  #toolbar .toolbar-handler .toolbar-handler-button:before {
+    background: @teal-blue;
+  }
+}
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		Fix the toolbar handler color for the homepage to match its "published" state. @sabrina-bongiovanni