Verified Commit 2732a4f2 authored by Théodore Biadala's avatar Théodore Biadala
Browse files

Issue #3518192 by joville, igorgoncalves, sandip, ressa: Dropdown does not... 

Issue #3518192 by joville, igorgoncalves, sandip, ressa: Dropdown does not show desired arrow on open state

(cherry picked from commit 601118ff)
parent dce32095

core/themes/olivero/css/components/dropbutton.css

+5 −5
Original line number Diff line number Diff line
@@ -75,6 +75,10 @@ 
  outline-offset: -2px;

}



.dropbutton-toggle button:dir(rtl) {

  border-radius: var(--dropbutton--border-radius) 0 0 var(--dropbutton--border-radius);

}



.dropbutton-toggle button::before {

  display: block;

  width: var(--sp0-5);
@@ -85,14 +89,10 @@ 
  border-bottom: solid 2px var(--dropbutton--outline-color);

}



.dropbutton-wrapper.open :is(.dropbutton-toggle button::before) {

.dropbutton-wrapper.open :is(.dropbutton-toggle button)::before {

  transform: translateY(25%) rotate(225deg);

}



.dropbutton-toggle button:dir(rtl) {

  border-radius: var(--dropbutton--border-radius) 0 0 var(--dropbutton--border-radius);

}



/* This is the first <li> element in the list of actions. */



.dropbutton-action:first-child {

core/themes/olivero/css/components/dropbutton.pcss.css

+7 −5
Original line number Diff line number Diff line
@@ -66,6 +66,10 @@ 
    outline-offset: -2px;

  }



  &:dir(rtl) {

    border-radius: var(--dropbutton--border-radius) 0 0 var(--dropbutton--border-radius);

  }



  &::before {

    display: block;

    width: var(--sp0-5);
@@ -74,15 +78,13 @@ 
    transform: translateY(-25%) rotate(45deg);

    border-right: solid 2px var(--dropbutton--outline-color);

    border-bottom: solid 2px var(--dropbutton--outline-color);

  }



  .dropbutton-wrapper.open & {

    &::before {

      transform: translateY(25%) rotate(225deg);

    }

  }



  &:dir(rtl) {

    border-radius: var(--dropbutton--border-radius) 0 0 var(--dropbutton--border-radius);

  }

}



/* This is the first <li> element in the list of actions. */