chore(NcAppSidebar): correctly define and document exposed CSS variables

[ShGKme]

☑️ Resolves

• Although AppSidebar's and AppNavigation's toggle button paddings have the same value, they don't have a single source
• Replaced using navigation SCSS variable in the sidebar with the direct value
• Fixed docs for --app-sidebar-offset
• Added "Exposed CSS Variables" docs section

🖼️ Screenshots

🏁 Checklist

• [x] ⛑️ Tests are included or are not applicable
• [x] 📘 Component documentation has been extended, updated or is not applicable
• [x] 3️⃣ Backport to next requested with a Vue 3 upgrade

[susnux]

Thank you this is a very nice thing :)

[ShGKme]

Force pushed just a commit message typo fix

[susnux]

@ShGKme you need to update cypress snapshots :see_no_evil:

[ShGKme]

@ShGKme you need to update cypress snapshots 🙈

I changed nothing 🥲

[ShGKme]

Will do so later today

[susnux]

I changed nothing 🥲

Maybe a padding or something else moved like 1px?

[ShGKme]

Ok, actually, it is relevant. Variables are defined on an element outside the AppSidebar which doesn't work for Cypress.

[susnux]

Ok, actually, it is relevant. Variables are defined on an element outside the AppSidebar which doesn't work for Cypress.

Put it into NcContent in the cypress tests? For the PlayWright migration this was done :sweat_smile:

[susnux]

Rebased onto main