lensapp/lens
1
0
Fork 0
mirror of https://github.com/lensapp/lens.git synced 2024-09-20 05:47:24 +03:00
Code Issues Projects Releases Wiki Activity

hotbar icon status led (#2651)

Browse Source 
Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com>
This commit is contained in:
Jari Kolehmainen 2021-04-28 11:25:16 +03:00 committed by GitHub
parent ce27d704ae
commit 1e1cbd3333
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 26 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/renderer/components/hotbar/hotbar-icon.scss
View File

@ -24,6 +24,23 @@
}
}
> .led {
position: absolute;
left: 3px;
top: 3px;
background-color: var(--layoutBackground);
border: 1px solid var(--clusterMenuBackground);
border-radius: 50%;
padding: 0px;
width: 8px;
height: 8px;
&.online {
background-color: var(--primary);
box-shadow: 0 0 5px var(--clusterMenuBackground), 0 0 5px var(--primary);
}
}
.badge {
position: absolute;
right: -2px;
@ -34,14 +51,10 @@
color: white;
padding: 0px;
border-radius: 50%;
border: 3px solid var(--clusterMenuBackground);
border: 2px solid var(--clusterMenuBackground);
width: 15px;
height: 15px;
&.online {
background-color: #44b700;
}
svg {
width: 13px;
}

9
src/renderer/components/hotbar/hotbar-icon.tsx
View File

@ -67,7 +67,7 @@ export class HotbarIcon extends React.Component<Props> {
}
get kindIcon() {
const className = cssNames("badge", { online: this.props.entity.status.phase == "connected"});
const className = "badge";
const category = catalogCategoryRegistry.getCategoryForEntity(this.props.entity);
if (!category) {
@ -81,6 +81,12 @@ export class HotbarIcon extends React.Component<Props> {
}
}
get ledIcon() {
const className = cssNames("led", { online: this.props.entity.status.phase == "connected"}); // TODO: make it more generic
return <div className={className} />;
}
toggleMenu() {
this.menuOpen = !this.menuOpen;
}
@ -142,6 +148,7 @@ export class HotbarIcon extends React.Component<Props> {
>
{this.iconString}
</Avatar>
{ this.ledIcon }
{ this.kindIcon }
<Menu
usePortal