Make the clock's <DIV> accessible by outside CSS. This will allow the font to be configurable without a rebuild.
This commit is contained in:
parent
f7349ac854
commit
bf73427be7
|
@ -3,9 +3,19 @@
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<style>
|
<style>
|
||||||
body {
|
@font-face {
|
||||||
background: #fafafa;
|
font-family: 'Bitwise';
|
||||||
}
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
src: url("https://pendorwright.com/fonts/Bitwise/Bitwise.woff2") format("woff2"),
|
||||||
|
url("https://pendorwright.com/fonts/Bitwise/Bitwise.ttf") format("truetype");
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
background: #fafafa;
|
||||||
|
}
|
||||||
|
pendor-clock::clock {
|
||||||
|
font-family: Bitwise;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
|
@ -152,6 +152,6 @@ export class PendorClock extends LitElement {
|
||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
return html`<div id="clock">${this.tick(this.clock.value)}</div>`;
|
return html`<div id="clock" part="clock">${this.tick(this.clock.value)}</div>`;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue