mirror of
https://github.com/bitwarden/browser
synced 2025-12-12 14:23:32 +00:00
[EC 456] Component Library Content Switching Tabs (#3452)
* [EC-456] Rename bitTabItem -> bitTab * [EC-456] Use templateRefs or text for tab label content * [EC-456] Add bit-tab-nav-bar component * [EC-456] Finish content tab switching and nav tabs * [EC-456] Undo accidental eslintrc.json change * [EC-456] Fix directive/component selector naming convention * [EC-456] Cleanup unnecessary InjectionTokens and simplify template label property * [EC-456] Cleanup one more unnecessary InjectionToken * [EC-456] Cleanup tab styles to better match Figma. Add internal tab header component for styling header background according to Figma. * [EC-456] Add sub-folders for nav, content, and shared tab components/directives * [EC-456] Code/style cleanup * [EC-456] Remove underscore from protected members * [EC-456] Cleanup tab stories and forgotten any type. * [EC-456] Fix dark theme story tab content text color * [EC-456] Add missing padding to tab header * [EC-456] Add tab content padding to align with tab headers * [EC-456] Move bottom tab border to header to span entire content area * [EC-456] Force text-main tab label color * [EC-456] Undo text-main change
This commit is contained in:
14
libs/components/src/tabs/shared/tab-header.component.ts
Normal file
14
libs/components/src/tabs/shared/tab-header.component.ts
Normal file
@@ -0,0 +1,14 @@
|
||||
import { Component } from "@angular/core";
|
||||
|
||||
/**
|
||||
* Component used for styling the tab header/background for both content and navigation tabs
|
||||
*/
|
||||
@Component({
|
||||
selector: "bit-tab-header",
|
||||
host: {
|
||||
class:
|
||||
"tw-h-16 tw-pl-4 tw-bg-background-alt tw-flex tw-items-end tw-border-0 tw-border-b tw-border-solid tw-border-secondary-300",
|
||||
},
|
||||
template: `<ng-content></ng-content>`,
|
||||
})
|
||||
export class TabHeaderComponent {}
|
||||
Reference in New Issue
Block a user