nyanogang/nyanoblog
2
1
Fork 0
Code Issues Pull requests Projects 1 Releases Packages Wiki Activity

web: refactor local globe icon

Browse source
This commit is contained in:
anna 2023-01-10 16:08:31 +01:00
parent d4be43c06f
commit 0000137461
Signed by: fef
GPG key ID: EC22E476DC2D3D84
3 changed files with 6 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
src/web/components/icon-button.ts
View file

@ -10,6 +10,9 @@ export default class IconButton extends LitElement {
@property({type: String, attribute: true}) @property({type: String, attribute: true})
public icon = ""; public icon = "";
@property({type: Number, attribute: true})
public size = 20;
@property({type: String, attribute: true}) @property({type: String, attribute: true})
public color = "var(--text-color)"; public color = "var(--text-color)";
@ -32,7 +35,7 @@ export default class IconButton extends LitElement {
@mouseleave=${() => this.pressed = false} @mouseleave=${() => this.pressed = false}
title="${this.label}" title="${this.label}"
> >
<svg-icon id="#icon" icon="${this.icon}" color="${this.color}" size="20"></svg-icon> <svg-icon id="#icon" icon="${this.icon}" color="${this.color}" size="${this.size}"></svg-icon>
</button> </button>
`; `;
} }

15
src/web/components/nav-bar.ts
View file

@ -27,7 +27,7 @@ export default class NavBar extends LitElement {
<li> <li>
<a href="#"> <a href="#">
<span class="name">${msg("Federated")}</span> <span class="name">${msg("Federated")}</span>
<svg-icon size="20" icon="${this.getGlobeIconName()}" role="none"></svg-icon> <svg-icon size="20" icon="globe-local" role="none"></svg-icon>
</a> </a>
</li> </li>
<li> <li>
@ -53,19 +53,6 @@ export default class NavBar extends LitElement {
`; `;
} }
private getGlobeIconName() {
const offset = new Date().getTimezoneOffset();
if (offset < -7 * 60) {
return "globe-asia-australia";
} else if (offset < -2 * 60) {
return "globe-central-south-asia";
} else if (offset < 3 * 60) {
return "globe-europe-africa";
} else {
return "globe-americas";
}
}
static get styles() { static get styles() {
return withSharedStyles(css` return withSharedStyles(css`
:host { :host {

15
src/web/features/compose-form.ts
View file

@ -49,7 +49,7 @@ export default class ComposeForm extends LitElement {
<icon-button icon="paperclip" label="${msg("Add attachment")}"></icon-button> <icon-button icon="paperclip" label="${msg("Add attachment")}"></icon-button>
<icon-button icon="list-ul" label="${msg("Add poll")}"></icon-button> <icon-button icon="list-ul" label="${msg("Add poll")}"></icon-button>
<icon-button icon="emoji-laughing" label="${msg("Insert emogi")}"></icon-button> <icon-button icon="emoji-laughing" label="${msg("Insert emogi")}"></icon-button>
<icon-button icon="${this.getGlobeIconName()}" label="${msg("Note visibility")}"></icon-button> <icon-button icon="globe-local" label="${msg("Note visibility")}"></icon-button>
</div> </div>
<div <div
@ -75,19 +75,6 @@ export default class ComposeForm extends LitElement {
} }
} }
private getGlobeIconName() {
const offset = new Date().getTimezoneOffset();
if (offset < -7 * 60) {
return "globe-asia-australia";
} else if (offset < -2 * 60) {
return "globe-central-south-asia";
} else if (offset < 3 * 60) {
return "globe-europe-africa";
} else {
return "globe-americas";
}
}
static get styles() { static get styles() {
return withSharedStyles(css` return withSharedStyles(css`
textarea { textarea {