diff --git a/CHANGELOG.md b/CHANGELOG.md index 4b90be6..a21b52e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,7 @@ +Add: +- New settings area called "Consistency" for things that make it more consistent with the original spotify theme +- Ability to hide album name and year in playbar (#85) + Fix: - Some sidebar items hawing wrong width on hover [(see)](https://github.com/JulienMaille/dribbblish-dynamic-theme/issues/87#issuecomment-954305428) - Sidebar config buttons being below the text diff --git a/src/js/main.js b/src/js/main.js index c408af2..dcf1c6e 100644 --- a/src/js/main.js +++ b/src/js/main.js @@ -51,13 +51,27 @@ waitForElement(["#main"], () => { }); DribbblishShared.config.register({ + area: "Consistency", type: "select", data: { dribbblish: "Dribbblish", spotify: "Spotify" }, key: "playerControlsStyle", name: "Player Controls Style", description: "Style of the Player Controls. Selecting Spotify basically changes Play / Pause back to the center", defaultValue: "dribbblish", - onChange: (val) => $("#main").attr("player-controls", val) + onChange: (val) => { + $("#main").attr("player-controls", val); + $(".main-trackInfo-container").toggleClass("left", val == "spotify"); + } + }); + + DribbblishShared.config.register({ + area: "Consistency", + type: "checkbox", + key: "showAlbumInfoInPlaybar", + name: "Show Album Info in Playbar", + description: "Show Album Name and Year in the Playbar", + defaultValue: true, + onChange: (val) => $("#main-trackInfo-year").css("display", val ? "block" : "none") }); DribbblishShared.config.register({ diff --git a/src/styles/main.scss b/src/styles/main.scss index fd37cba..132adbc 100644 --- a/src/styles/main.scss +++ b/src/styles/main.scss @@ -661,6 +661,17 @@ input:hover:not([disabled]):not(:active) ~ .x-toggle-indicatorWrapper { flex: 0 0 32px; } +.main-trackInfo-container { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + + &.left { + align-items: flex-start; + } +} + .main-trackInfo-name { font-weight: 500; }