feat(core): shellbar redesign, add branding and additional context area

[dpavlenishvili]

Related Issue(s)

closes #12520

Description

Implemented Shellbar ContextArea and integrated Shellbar Branding.

• Added customizable branding section with logo, title, and subtitle via fd-shellbar-branding
• Introduced fd-shellbar-context-area for additional elements like separator and spacer
• Implemented fdShellbarHidePriority directive for custom overflow management with unique priority values
• Enabled automatic priority assignment for context area elements based on placement order when fdShellbarHidePriority is omitted

Screenshots

Before:

After:

Please check whether the PR fulfills the following requirements

During Implementation

1. Visual Testing:

• visual misalignments/updates
• check Light/Dark/HCB/HCW themes
• RTL/LTR - proper rendering and labeling
• responsiveness(resize)
• Content Density (Cozy/Compact/(Condensed))
• States - hover/disabled/focused/active/on click/selected/selected hover/press state
• Interaction/Animation - open/close, expand/collapse, add/remove, check/uncheck
• Mouse vs. Keyboard support
• Text Truncation

2. API and functional correctness

• check for console logs (warnings, errors)
• API boundary values
• different combinations of components - free style
• change the API values during testing

3. Documentation and Example validations

• missing API documentation or it is not understandable
• poor examples
• Stackblitz works for all examples

4. Accessibility testing
5. Browser Testing - Edge, Safari, Chrome, Firefox

PR Quality

• the commit message(s) follows the guideline:
  https://github.com/SAP/fundamental-ngx/blob/main/CONTRIBUTING.md
• tests for the changes that have been done
• all items on the PR Review Checklist are addressed :
  https://github.com/SAP/fundamental-ngx/wiki/PR-Review-Checklist
• Run npm run build-pack-library and test in external application
• update README.md
• Breaking Changes Wiki

[netlify]

✅ Deploy Preview for fundamental-ngx ready!

Name	Link
🔨 Latest commit	efd958d
🔍 Latest deploy log	https://app.netlify.com/sites/fundamental-ngx/deploys/673225e60349b100082b02c9
😎 Deploy Preview	https://deploy-preview-12694--fundamental-ngx.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[github-actions]

Visit the preview URL for this PR (updated for commit efd958d):

https://fundamental-ngx-gh--pr12694-12520-shellbar-u73g9rxq.web.app

_{(expires Thu, 14 Nov 2024 15:47:16 GMT)}

_{🔥 via Firebase Hosting GitHub Action 🌎}

_{Sign: 41b993ee8e451bd7c6770b342ce142dc886eacff}