Secondo i documenti, Posso modellare la mia sovrapposizione con gli attributi --iron-overlay-backdrop-opacity e --iron-overlay-backdrop-background-color.
Questo è quello che sto provando, ma non sta avendo alcun effetto sul sottostante iron-overlay-backdrop:
<dom-module id="my-overlay">
<style>
:host {
--iron-overlay-backdrop-opacity: 0.9;
--iron-overlay-backdrop-background-color: #222;
}
</style>
<template>
<content></content>
</template>
<script>
Polymer({
is: "my-overlay",
behaviors: [
Polymer.IronOverlayBehavior
],
attached: function(){
this.setAttribute("with-backdrop", "");
}
});
</script>
</dom-module>
Ispezionando nel broswer rivela che il iron-overlay-backdrop sta mantenendo i suoi valori di default per opacity e background-color:
risposte:
3 per risposta № 1il fondale in ferro sovrapposto verrà aggiunto al corpo, quindi devi applicare questi stili nel tuo corpo in questo modo:
<body>
<style is="custom-style">
iron-overlay-backdrop {
--iron-overlay-backdrop-opacity: 0.9;
--iron-overlay-backdrop-background-color: #222;
}
</style>
<my-overlay></my-overlay>
</body>