mirror of
https://github.com/material-components/material-web.git
synced 2024-10-26 21:56:56 +03:00
fix(elevation): expose md-elevation ::part
in all components
PiperOrigin-RevId: 612946796
This commit is contained in:
parent
1c2197bd30
commit
b74e3dd2e3
@ -15,6 +15,6 @@ import {Button} from './button.js';
|
|||||||
*/
|
*/
|
||||||
export class ElevatedButton extends Button {
|
export class ElevatedButton extends Button {
|
||||||
protected override renderElevationOrOutline() {
|
protected override renderElevationOrOutline() {
|
||||||
return html`<md-elevation></md-elevation>`;
|
return html`<md-elevation part="elevation"></md-elevation>`;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -15,6 +15,6 @@ import {Button} from './button.js';
|
|||||||
*/
|
*/
|
||||||
export class FilledButton extends Button {
|
export class FilledButton extends Button {
|
||||||
protected override renderElevationOrOutline() {
|
protected override renderElevationOrOutline() {
|
||||||
return html`<md-elevation></md-elevation>`;
|
return html`<md-elevation part="elevation"></md-elevation>`;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -15,6 +15,6 @@ import {Button} from './button.js';
|
|||||||
*/
|
*/
|
||||||
export class FilledTonalButton extends Button {
|
export class FilledTonalButton extends Button {
|
||||||
protected override renderElevationOrOutline() {
|
protected override renderElevationOrOutline() {
|
||||||
return html`<md-elevation></md-elevation>`;
|
return html`<md-elevation part="elevation"></md-elevation>`;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -69,7 +69,7 @@ export class AssistChip extends Chip {
|
|||||||
|
|
||||||
protected override renderOutline() {
|
protected override renderOutline() {
|
||||||
if (this.elevated) {
|
if (this.elevated) {
|
||||||
return html`<md-elevation></md-elevation>`;
|
return html`<md-elevation part="elevation"></md-elevation>`;
|
||||||
}
|
}
|
||||||
|
|
||||||
return super.renderOutline();
|
return super.renderOutline();
|
||||||
|
@ -97,7 +97,7 @@ export class FilterChip extends MultiActionChip {
|
|||||||
|
|
||||||
protected override renderOutline() {
|
protected override renderOutline() {
|
||||||
if (this.elevated) {
|
if (this.elevated) {
|
||||||
return html`<md-elevation></md-elevation>`;
|
return html`<md-elevation part="elevation"></md-elevation>`;
|
||||||
}
|
}
|
||||||
|
|
||||||
return super.renderOutline();
|
return super.renderOutline();
|
||||||
|
@ -57,7 +57,7 @@ export abstract class SharedFab extends LitElement {
|
|||||||
<button
|
<button
|
||||||
class="fab ${classMap(this.getRenderClasses())}"
|
class="fab ${classMap(this.getRenderClasses())}"
|
||||||
aria-label=${ariaLabel || nothing}>
|
aria-label=${ariaLabel || nothing}>
|
||||||
<md-elevation></md-elevation>
|
<md-elevation part="elevation"></md-elevation>
|
||||||
<md-focus-ring part="focus-ring"></md-focus-ring>
|
<md-focus-ring part="focus-ring"></md-focus-ring>
|
||||||
<md-ripple class="ripple"></md-ripple>
|
<md-ripple class="ripple"></md-ripple>
|
||||||
${this.renderTouchTarget()} ${this.renderIcon()} ${this.renderLabel()}
|
${this.renderTouchTarget()} ${this.renderIcon()} ${this.renderLabel()}
|
||||||
|
@ -48,7 +48,7 @@ export class NavigationBar extends LitElement implements NavigationBarState {
|
|||||||
@keydown="${this.handleKeydown}"
|
@keydown="${this.handleKeydown}"
|
||||||
@navigation-tab-interaction="${this.handleNavigationTabInteraction}"
|
@navigation-tab-interaction="${this.handleNavigationTabInteraction}"
|
||||||
@navigation-tab-rendered=${this.handleNavigationTabConnected}
|
@navigation-tab-rendered=${this.handleNavigationTabConnected}
|
||||||
><md-elevation></md-elevation
|
><md-elevation part="elevation"></md-elevation
|
||||||
><div class="md3-navigation-bar__tabs-slot-container"><slot></slot></div
|
><div class="md3-navigation-bar__tabs-slot-container"><slot></slot></div
|
||||||
></div>`;
|
></div>`;
|
||||||
}
|
}
|
||||||
|
@ -40,7 +40,7 @@ export class NavigationDrawer extends LitElement {
|
|||||||
aria-modal="${ariaModal || nothing}"
|
aria-modal="${ariaModal || nothing}"
|
||||||
class="md3-navigation-drawer ${this.getRenderClasses()}"
|
class="md3-navigation-drawer ${this.getRenderClasses()}"
|
||||||
role="dialog">
|
role="dialog">
|
||||||
<md-elevation></md-elevation>
|
<md-elevation part="elevation"></md-elevation>
|
||||||
<div class="md3-navigation-drawer__slot-content">
|
<div class="md3-navigation-drawer__slot-content">
|
||||||
<slot></slot>
|
<slot></slot>
|
||||||
</div>
|
</div>
|
||||||
|
@ -440,7 +440,9 @@ export class Slider extends sliderBaseClass {
|
|||||||
for=${name}
|
for=${name}
|
||||||
class=${name}
|
class=${name}
|
||||||
?disabled=${this.disabled}></md-ripple>
|
?disabled=${this.disabled}></md-ripple>
|
||||||
<div class="handleNub"><md-elevation></md-elevation></div>
|
<div class="handleNub">
|
||||||
|
<md-elevation part="elevation"></md-elevation>
|
||||||
|
</div>
|
||||||
${when(this.labeled, () => this.renderLabel(label))}
|
${when(this.labeled, () => this.renderLabel(label))}
|
||||||
</div>`;
|
</div>`;
|
||||||
}
|
}
|
||||||
|
@ -99,7 +99,7 @@ export class Tab extends tabBaseClass {
|
|||||||
role="presentation"
|
role="presentation"
|
||||||
@click=${this.handleContentClick}>
|
@click=${this.handleContentClick}>
|
||||||
<md-focus-ring part="focus-ring" inward .control=${this}></md-focus-ring>
|
<md-focus-ring part="focus-ring" inward .control=${this}></md-focus-ring>
|
||||||
<md-elevation></md-elevation>
|
<md-elevation part="elevation"></md-elevation>
|
||||||
<md-ripple .control=${this}></md-ripple>
|
<md-ripple .control=${this}></md-ripple>
|
||||||
<div
|
<div
|
||||||
class="content ${classMap(this.getContentClasses())}"
|
class="content ${classMap(this.getContentClasses())}"
|
||||||
|
Loading…
Reference in New Issue
Block a user