New sidebar design on tablets

[Moin]

Continuing the discussion from New sidebar experiment (Sidebar Feng Shui):

I have the impression tablets now get a inconvenient mix of desktop mode and touch device styling. While the design experiment added those lines on my tablet, the version merged into core does not.

Especially in the admin sidebar, the headings are difficult to recognise, as they simply get lost in the list. It works fine on desktop devices without touch, where the lines are shown, and on mobile with the gaps, but the version for touch devices in desktop mode has no lines and no gaps.

Mobile:

Desktop:

Tablet:

[Jagster (Jakke Lehtonen)]

@Moin

headings are difficult to recognise

Hear hear… I came today asking how can I make headings more readable on iPad.

[Moin]

@Jagster

I came today asking how can I make headings more readable on iPad.

I added

.sidebar-section-wrapper {
    padding-block: .35rem;
    border-bottom: 1px solid var(--secondary-very-high);
}

to the desktop css section of my theme

[Sidi_Codet (Olajuwon)]

@Lilly , was certainly impressed with the Desktop Version , Welldone!

[Lilly]

why are you mentioning me? what are you even talking about?

[Sidi_Codet (Olajuwon)]

lol, that was a mistake Lilly, the mention wasn’t for you but for @Moin , sorry!

[chapoi (Charlie)]

Thanks for the report.

I’ve added the divider on tablets too, as was the original intention.

UX: fix sidebar styling on tablet