Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

layout: support actions in header component

See original GitHub issue

Enhancement Request

Desired behavior

There are many page headers across the site the have some kind of button or widget to the right of the page title. The PageHeadingLayout component should allow you to pass in this content and render it in the right place.

Here are the pages I could find with this layout:

The Value Add

This would allow more BCs to adopt the header component and standardize spacing without having to rethink their whole layout.

Issue Analytics

State:
Created 5 years ago
Reactions:1
Comments:7 (7 by maintainers)

Top GitHub Comments

1reaction

KaidenRcommented, Mar 29, 2018

I would suggest something like rightContent or actionBar
In all the usages I’ve found, the items are all vertically-aligned in the center with the title. So we could just provide a flex container that will vertically-align the item you pass in. It seems like we wouldn’t want this content to change the spacing around the title so maybe give it a max height?

0reactions

jaketrentcommented, May 1, 2018

released in latest Layout package.

Top Results From Across the Web

Page header - Examples - Components

A page header defines the top of a page. It contains a title and can be optionally combined with breadcrumbs buttons, search, and...

Header - HPE Design System

The Header component translates to a <header> in the DOM, ... Provide the user with relevant, helpful actions regarding the application or page....

Header Content Layout [SAIL Design System: Components]

The header content layout allows you to design pages with two distinct zones: header and content. The header consists of one or more...

Lightning Action showing in Feed instead of header

I am trying to place a lightning action in a Console App using a lightning component. Every time I add the action to...

Theme Guidance: Header Components - Salesforce Help

Specific aspects of the theme component properties, such as header height, are hard-coded for mobile devices using the Salesforce Lightning Design $mq-small ...