BubbleBase
  • Introduction
    • What is BubbleBase?
    • Why Use BubbleBase?
    • How BubbleBase Works
  • Getting started
    • 1. Installing & Setting Up BubbleBase
    • 2. Understanding the Folder & Page Structure
    • 3. How to Customize BubbleBase for Your Project
  • Best practices
    • Database
      • Database Naming Conventions
      • Iconography
    • Design
      • Designing Responsively
        • Responsive Group Settings
        • Breakpoints
        • Page/Group Structure
      • The APG Naming System
        • Naming Conventions
        • Element Shorthand
        • Standardizing Group and Element Names
          • Commonly Occurring Elements
          • Naming Groups Within Groups
    • Workflows
  • APIs
    • Stripe
      • Stripe Checkout (payment mode)
        • Stripe Checkout (payment + price id)
        • Stripe Checkout (payment + no price id)
        • Stripe Checkout (payment + price id + multi line items)
      • Stripe Checkout (subscription mode)
        • Stripe Checkout (Subscription with price id)
        • ⏳ Stripe Checkout (Subscription without price id)
      • Stripe Checkout (marketplace)
      • Stripe Customer Portal
      • Create Customer
      • Retrieve Charges
      • Delete Subscription
      • Retrieve Subscription
      • Retrieve Invoice
      • Retrieve Price
    • SendGrid
      • Send Email (standard)
      • Send Email (template)
  • Data
    • Data types
      • Essential Data Types
        • User
        • Dt_user_profile_images
      • Navigation Data Types
        • Dt_Sidenav
      • Functionality Data Types
        • Dt_Reviews
        • Dt_Notifications
        • Dt_Invoices
        • Dt_Line_Items
        • Dt_email
        • Dt_email_template
        • Dt_email_footer_link
        • Dt_charge
        • Dt_credit
        • Dt_contact_requests
        • Dt_API_logs
      • Kit Data Types
        • Dt_(Kit)_Jobs
        • Dt_(Kit)_AI_messaging_thread
        • Dt_(Kit)_ai_thread
        • Dt_(Kit)_comment data
        • Dt_(Kit)_company data
        • Dt_(Kit)_dashboard_metrics
        • Dt_(Kit)_FAQs
        • Dt_(kit)_form_questions
        • DT_(Kit)_form_answers
        • Dt_(kit)_listings
        • Dt_(kit)_messaging_channel
        • Dt_(kit)_messaging_thread
        • Dt_(kit)_pricing
        • Dt_(kit)_reviews
        • DT_(Kit)_Task List
        • Dt_(Kit)_Task Stage
        • Dt_(kit)_task_comments
        • Dt_(kit)_Tasks
    • Option Sets
      • Navigation Items
        • 🔒 os_navPage
        • 🔒 os_nav_Subpage
        • 🔒 Os_nav_Tab
      • User Roles and Actions
        • 🔒 os_user_types
      • Data Categorization
        • 🔒 os_record_interaction
        • 🔒 os_record_type
        • 🔒 os_action_type
        • Os_toast_type
      • App-Wide Settings
        • 🔒 System
  • Plugins
    • Google
  • Reusable Elements
    • UI Components
      • Authentication Page
        • Design
        • Workflows
      • Landing Page (index)
        • Hero
        • Features
        • Metrics
        • Call-to-Action
        • Pricing
        • FAQs
        • Testimonials
      • Dashboard Page (home)
      • My Profile
  • Popups
    • 🍿 PU_CRUD
    • 🍿 PU_Delete
    • 🍿PU_Action
    • 🍿 PU_Loading
  • App-Wide Components
    • 🔐 Security Redirect
    • ⚙️ Global Events
    • 📌 FG_Sidebar
  • Workflows
    • Frontend workflows
    • Backend workflows
      • delete_user (example)
Powered by GitBook
On this page
  1. App-Wide Components

📌 FG_Sidebar

FG_Sidebar is a flexible and dynamic sidebar navigation component designed to enhance user experience and accessibility within the app.

It serves as a structured navigation panel, pulling in its main sections from the 🔒 os_navPage option set. Its features includes:

  1. Page-Based Navigation: The sidebar dynamically lists primary pages from 🔒 os_navPage, ensuring a well-organized and intuitive browsing experience. These include sections like Dashboard, Settings, Users, Tasks, Chat, and more.

  2. Sub-Navigation Support: Depending on the structure of a selected page, the sidebar can include:

  • Nav Bar for 🔒 os_nav_Subpages – Useful for pages that have multiple subsections, ensuring seamless navigation between related screens.

  • Tab-Based Navigation from 🔒 os_nav_Tab – Enables switching between different tabs within a page without needing to reload content.

  1. Consistent UX – Designed to maintain uniform navigation across different sections of the app, improving usability and accessibility.

Previous⚙️ Global EventsNextFrontend workflows

Last updated 2 months ago