[FR] Custom Home Logo

[C0D6WasTaken]

Suggestion

Hello there! I've been trying to change the Discord home logo, but I can't seem to resolve an issue. The replaced image seems to be overlain on servers without an icon, like in the image below.

Here's the code:

/* Hide Left Discord Watermark */
.wordmark-3wYFg6 {
display: none
}

/* Change Home Screen Discord Logo */
.childWrapper-1j_1ub path {
fill: transparent;
}

.childWrapper-1j_1ub {
background: var(--home-icon) center/cover no-repeat;
width: 38px;
height: 38px;
}

:root {
--home-icon: url('https://r2.e-z.host/b4a4c775-45ca-4ccf-9e8b-a6e14f598ee1/sxa6o56y.png');
}

I found another class with a similar name, but I'm not sure how to eliminate this conflict childWrapper-1j_1ub acronym-2zrAHN. I'd appreciate any help since I have almost no knowledge when it comes to CSS.

[finnjosten]

I will look into this soon! Thank you for opening an FR.

[finnjosten]

I fixed your code for you :)

/* Change Home Screen Discord Logo */
.wrapper_d281dd[ data-list-item-id="guildsnav___home"] .childWrapper__01b9c path {
    fill: transparent;
}

.wrapper_d281dd[ data-list-item-id="guildsnav___home"] .childWrapper__01b9c {
    --home-icon: url('https://r2.e-z.host/b4a4c775-45ca-4ccf-9e8b-a6e14f598ee1/sxa6o56y.png');
    background: var(--home-icon) center/contain no-repeat;
    width: 38px;
    height: 38px;
}

I will add this as an addon later