summaryrefslogtreecommitdiffstats
path: root/browser/components/firefoxview/card-container.mjs
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-06-12 05:35:37 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-06-12 05:35:37 +0000
commita90a5cba08fdf6c0ceb95101c275108a152a3aed (patch)
tree532507288f3defd7f4dcf1af49698bcb76034855 /browser/components/firefoxview/card-container.mjs
parentAdding debian version 126.0.1-1. (diff)
downloadfirefox-a90a5cba08fdf6c0ceb95101c275108a152a3aed.tar.xz
firefox-a90a5cba08fdf6c0ceb95101c275108a152a3aed.zip
Merging upstream version 127.0.
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'browser/components/firefoxview/card-container.mjs')
-rw-r--r--browser/components/firefoxview/card-container.mjs131
1 files changed, 63 insertions, 68 deletions
diff --git a/browser/components/firefoxview/card-container.mjs b/browser/components/firefoxview/card-container.mjs
index 1755d97555..84c6acc5c4 100644
--- a/browser/components/firefoxview/card-container.mjs
+++ b/browser/components/firefoxview/card-container.mjs
@@ -132,76 +132,71 @@ class CardContainer extends MozLitElement {
rel="stylesheet"
href="chrome://browser/content/firefoxview/card-container.css"
/>
- <section
- aria-labelledby="header"
- aria-label=${ifDefined(this.sectionLabel)}
- >
- ${when(
- this.toggleDisabled,
- () => html`<div
- class=${classMap({
- "card-container": true,
- inner: this.isInnerCard,
- "empty-state": this.isEmptyState && !this.isInnerCard,
- })}
+ ${when(
+ this.toggleDisabled,
+ () => html`<div
+ class=${classMap({
+ "card-container": true,
+ inner: this.isInnerCard,
+ "empty-state": this.isEmptyState && !this.isInnerCard,
+ })}
+ >
+ <span
+ id="header"
+ class="card-container-header"
+ ?hidden=${ifDefined(this.hideHeader)}
+ toggleDisabled
+ ?withViewAll=${this.showViewAll}
>
- <span
- id="header"
- class="card-container-header"
- ?hidden=${ifDefined(this.hideHeader)}
- toggleDisabled
- ?withViewAll=${this.showViewAll}
- >
- <slot name="header"></slot>
- <slot name="secondary-header"></slot>
- </span>
- <a
- href="about:firefoxview#${this.shortPageName}"
- @click=${this.viewAllClicked}
- class="view-all-link"
- data-l10n-id="firefoxview-view-all-link"
- ?hidden=${!this.showViewAll}
- ></a>
- <slot name="main"></slot>
- <slot name="footer" class="card-container-footer"></slot>
- </div>`,
- () => html`<details
- class=${classMap({
- "card-container": true,
- inner: this.isInnerCard,
- "empty-state": this.isEmptyState && !this.isInnerCard,
- })}
- ?open=${this.isExpanded}
- ?isOpenTabsView=${this.removeBlockEndMargin}
- @toggle=${this.onToggleContainer}
+ <slot name="header"></slot>
+ <slot name="secondary-header"></slot>
+ </span>
+ <a
+ href="about:firefoxview#${this.shortPageName}"
+ @click=${this.viewAllClicked}
+ class="view-all-link"
+ data-l10n-id="firefoxview-view-all-link"
+ ?hidden=${!this.showViewAll}
+ ></a>
+ <slot name="main"></slot>
+ <slot name="footer" class="card-container-footer"></slot>
+ </div>`,
+ () => html`<details
+ class=${classMap({
+ "card-container": true,
+ inner: this.isInnerCard,
+ "empty-state": this.isEmptyState && !this.isInnerCard,
+ })}
+ ?open=${this.isExpanded}
+ ?isOpenTabsView=${this.removeBlockEndMargin}
+ @toggle=${this.onToggleContainer}
+ role=${this.isInnerCard ? "presentation" : "group"}
+ >
+ <summary
+ class="card-container-header"
+ ?hidden=${ifDefined(this.hideHeader)}
+ ?withViewAll=${this.showViewAll}
>
- <summary
- id="header"
- class="card-container-header"
- ?hidden=${ifDefined(this.hideHeader)}
- ?withViewAll=${this.showViewAll}
- >
- <span
- class="icon chevron-icon"
- aria-role="presentation"
- data-l10n-id="firefoxview-collapse-button-${this.isExpanded
- ? "hide"
- : "show"}"
- ></span>
- <slot name="header"></slot>
- </summary>
- <a
- href="about:firefoxview#${this.shortPageName}"
- @click=${this.viewAllClicked}
- class="view-all-link"
- data-l10n-id="firefoxview-view-all-link"
- ?hidden=${!this.showViewAll}
- ></a>
- <slot name="main"></slot>
- <slot name="footer" class="card-container-footer"></slot>
- </details>`
- )}
- </section>
+ <span
+ class="icon chevron-icon"
+ role="presentation"
+ data-l10n-id="firefoxview-collapse-button-${this.isExpanded
+ ? "hide"
+ : "show"}"
+ ></span>
+ <slot name="header"></slot>
+ </summary>
+ <a
+ href="about:firefoxview#${this.shortPageName}"
+ @click=${this.viewAllClicked}
+ class="view-all-link"
+ data-l10n-id="firefoxview-view-all-link"
+ ?hidden=${!this.showViewAll}
+ ></a>
+ <slot name="main"></slot>
+ <slot name="footer" class="card-container-footer"></slot>
+ </details>`
+ )}
`;
}
}