How can I change the order of buttons in header?

[anton21m]

hello everyone, I want to completely redo the header of the discourse.
The designer of our company sketched such a design for me, and with the help of css did not bring it much

However, I got a problem to move the profile button to the beginning, I searched for sources and found something \app\assets\javascripts\discourse\app\widgets\header.js
Using this help I was able to remove the icons from production and a little more [Solved] How to use virtual-dom's "h" helper in <head> for header-dropdown hamburger widget override? + How to override @computed method?

However, I could not move
The forum now looks like this:

And you need this: (move account button and change icon)

Where do I need to dig to do this:

[awesomerobot (Kris)]

You can do something like this with CSS:

.d-header-icons { 
  display: flex;
}

.header-dropdown-toggle.current-user { 
  order: 1; 
}
.header-dropdown-toggle.search-dropdown { 
  order: 2; 
}
.header-dropdown-toggle.hamburger-dropdown { 
  order: 3; 
}

[anton21m]

Thanks, very good.

@awesomerobot

You can do something like this with CSS:

.panel .d-header-icons {
  display: flex;
}
.d-header-icons #current-user{
  order: 1;
}
.d-header-icons .header-dropdown-toggle {
  order: 2;
}

Modifying it a bit helped me