alois/OpenFrontIO
1
0
Fork 0
mirror of https://github.com/openfrontio/OpenFrontIO.git synced 2026-07-20 00:41:14 +00:00
Code Issues Packages Projects Releases Wiki Activity

Ran prettier

Browse Source
This commit is contained in:
NewHappyRabbit
2025-02-12 21:30:43 +02:00
parent 303543d246
commit e0aa6b5d9c
3 changed files with 138 additions and 142 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/client/components/FlagInput.ts
+61 -75
View File
@@ -152,80 +152,66 @@ export class FlagInput extends LitElement {
}
render() {
return html`
<div class="flag-container">
${this.flag === ""
? html` <button
class="no-selected-flag"
@click=${() => (this.showModal = true)}
return html`
<div class="flag-container">
${this.flag === ""
? html` <button
class="no-selected-flag"
@click=${() => (this.showModal = true)}
>
Flags
</button>`
: html`<img
class="selected-flag"
src="/flags/${this.flag}.svg"
@click=${() => (this.showModal = true)}
/>`}
${this.showModal
? html`
<div class="flag-modal ${this.showModal ? "" : "hidden"}">
<input
class="flag-search"
type="text"
placeholder="Search..."
@change=${this.handleSearch}
@keyup=${this.handleSearch}
/>
<div class="flag-dropdown">
<!-- Show each flag as button -->
<button
@click=${() => this.setFlag("")}
class="dropdown-item"
>
<img class="country-flag" src="/flags/none.svg" />
<span class="country-name">None</span>
</button>
${Countries.filter(
(country) =>
country.name
.toLowerCase()
.includes(this.search.toLowerCase()) ||
country.code
.toLowerCase()
.includes(this.search.toLowerCase()),
).map(
(country) => html`
<button
@click=${() => this.setFlag(country.code)}
class="dropdown-item"
>
Flags
</button>`
: html`<img
class="selected-flag"
src="/flags/${this.flag}.svg"
@click=${() => (this.showModal = true)}
/>`}
${this.showModal
? html`
<div
class="flag-modal ${this.showModal
? ""
: "hidden"}"
>
<input
class="flag-search"
type="text"
placeholder="Search..."
@change=${this.handleSearch}
@keyup=${this.handleSearch}
/>
<div class="flag-dropdown">
<!-- Show each flag as button -->
<button
@click=${() => this.setFlag("")}
class="dropdown-item"
>
<img
class="country-flag"
src="/flags/none.svg"
/>
<span class="country-name">None</span>
</button>
${Countries.filter(
(country) =>
country.name
.toLowerCase()
.includes(
this.search.toLowerCase()
) ||
country.code
.toLowerCase()
.includes(
this.search.toLowerCase()
)
).map(
(country) => html`
<button
@click=${() =>
this.setFlag(country.code)}
class="dropdown-item"
>
<img
class="country-flag"
src="/flags/${country.code}.svg"
/>
<span class="country-name"
>${country.name}</span
>
</button>
`
)}
</div>
</div>
`
: ""}
</div>
`;
}
<img
class="country-flag"
src="/flags/${country.code}.svg"
/>
<span class="country-name">${country.name}</span>
</button>
`,
)}
</div>
</div>
`
: ""}
</div>
`;
}
}
src/client/graphics/layers/NameLayer.ts
+2 -2
View File
@@ -153,8 +153,8 @@ export class NameLayer implements Layer {
const flagImg = document.createElement("img");
flagImg.classList.add("player-flag");
flagImg.style.marginBottom = "-5%";
flagImg.style.opacity = '0.8';
flagImg.src = '/flags/' + sanitize(player.flag()) + '.svg';
flagImg.style.opacity = "0.8";
flagImg.src = "/flags/" + sanitize(player.flag()) + ".svg";
flagImg.style.zIndex = "1";
flagImg.style.width = "40%";
flagImg.style.aspectRatio = "3/4";