diff --git a/packages/core/src/components.d.ts b/packages/core/src/components.d.ts index 8476fd1..7c19bb4 100644 --- a/packages/core/src/components.d.ts +++ b/packages/core/src/components.d.ts @@ -448,6 +448,10 @@ export namespace Components { * Heading of the overlay content */ "heading"?: string; + /** + * HTML tag for the heading + */ + "headingTag"?: string; "open": () => Promise; /** * If persistent, the overlay will not be closed when the user clicks outside of it or presses the escape key. @@ -2087,6 +2091,10 @@ declare namespace LocalJSX { * Heading of the overlay content */ "heading"?: string; + /** + * HTML tag for the heading + */ + "headingTag"?: string; /** * If persistent, the overlay will not be closed when the user clicks outside of it or presses the escape key. */ diff --git a/packages/core/src/components/go-dialog/go-dialog.scss b/packages/core/src/components/go-dialog/go-dialog.scss index b1a20c1..c391946 100644 --- a/packages/core/src/components/go-dialog/go-dialog.scss +++ b/packages/core/src/components/go-dialog/go-dialog.scss @@ -28,7 +28,11 @@ go-overlay.go-dialog { display: flex; align-items: flex-start; justify-content: space-between; - flex: 1; + .heading{ + font-size: var(--go-size-3); + font-weight: 500; + line-height: 1.5; + } .close-btn { flex: 0; } diff --git a/packages/core/src/components/go-dialog/go-dialog.tsx b/packages/core/src/components/go-dialog/go-dialog.tsx index e78b266..72e6288 100644 --- a/packages/core/src/components/go-dialog/go-dialog.tsx +++ b/packages/core/src/components/go-dialog/go-dialog.tsx @@ -22,6 +22,11 @@ export class GoDialog { */ @Prop() heading?: string; + /** + * HTML tag for the heading + */ + @Prop() headingTag?: string = 'h2'; + // aria-labelledby https://www.w3.org/TR/wai-aria-practices/examples/dialog-modal/dialog.html headingId: string = uniqueId('overlay-label-'); @@ -52,7 +57,7 @@ export class GoDialog { } render() { - const { active, heading, persistent, headingId } = this; + const { active, heading, persistent, headingId, headingTag: H } = this; return ( this.handleOverlayClose()}>
-

{heading}

+ {heading}
{!persistent ? (