Make important releases stand out better in the sidebar

This commit is contained in:
Yuri Sizov
2023-03-24 22:20:13 +01:00
parent 4f7df863bb
commit a8be83ca45
2 changed files with 18 additions and 3 deletions

View File

@@ -13,8 +13,8 @@ export default class VersionItem extends LitElement {
@media (prefers-color-scheme: dark) {
:host {
--tab-hover-background-color: rgba(255, 255, 255, 0.14);
--tab-active-background-color: #2c3c55;
--tab-active-border-color: #397adf;
--tab-active-background-color: #283446;
--tab-active-border-color: #5394f9;
}
}
@@ -79,6 +79,12 @@ export default class VersionItem extends LitElement {
overflow: hidden;
}
:host .version-item--major .version-title,
:host .version-item--minor .version-title {
font-weight: 600;
color: var(--tab-active-border-color);
}
:host .version-pull-count {
color: var(--dimmed-font-color);
flex-grow: 1;
@@ -141,6 +147,7 @@ export default class VersionItem extends LitElement {
@property({ type: String }) path = "";
@property({ type: String, reflect: true }) name = "";
@property({ type: String, reflect: true }) type = "";
@property({ type: String, reflect: true }) flavor = "";
@property({ type: Boolean, reflect: true }) active = false;
@property({ type: Boolean, reflect: true }) expanded = false;
@property({ type: Boolean, reflect: true }) loading = false;
@@ -153,7 +160,7 @@ export default class VersionItem extends LitElement {
}
render(){
const classList = [ "version-item", "version-item--" + this.type ];
const classList = [ "version-item", "version-item--" + this.type, "version-item--" + this.flavor ];
if (this.active) {
classList.push("version-item--active");
}

View File

@@ -107,11 +107,18 @@ export default class VersionList extends LitElement {
return html`
<div class="version-list">
${this.versions.map((item) => {
let versionFlavor = "patch";
let versionBits = item.name.split(".");
if (versionBits.length === 2) {
versionFlavor = (versionBits[1] === "0" ? "major" : "minor");
}
return html`
<div class="version-list-main">
<gr-version-item
.name="${item.name}"
.type="${"main"}"
.flavor="${versionFlavor}"
.pull_count="${item.commit_log.length}"
?active="${this.selectedVersion === item.name}"
?expanded="${this.toggledVersions.includes(item.name)}"
@@ -128,6 +135,7 @@ export default class VersionList extends LitElement {
<gr-version-item
.name="${release.name}"
.type="${"sub"}"
.flavor="${"preview"}"
.pull_count="${release.commit_log.length}"
?active="${this.selectedVersion === item.name && this.selectedRelease === release.name}"
@click="${this._onItemClicked.bind(this, "sub", item.name, release.name)}"