Application Shell 30 block design & features
ApplicationShell30 is a responsive application shell built with Shadcn UI. On desktop it uses a sidebar that collapses to icons with tooltips. The sidebar has the workspace, a Create menu, Home, Inbox with a badge, Tasks, Calendar and Reports, Settings pinned low and the user menu in the footer.
On mobile the sidebar is replaced by a bottom tab bar with Home, Inbox, Tasks and a More menu, plus a raised round Create button in the centre that opens the same create menu. The selected section is shared, so the header title, sidebar and tab bar always agree.
The mobile header shows the logo, the current section and the user avatar. The main area is filled with skeleton cards.
The tab bar respects the safe area inset at the bottom of the screen, and the content is padded so it never sits under the tab bar.