Feature Request: Custom theme support / IRC style layout (example attached)

[basvdijk]

Are there any plans to implement custom themes support?

I am a user of IRC in the terminal. The advantage for me:

• More messages fit in one screen
• One message per line e.g.

10:02 <John> Hi!
10:05 <Alice> Hi John, how are you?
10:06 <John> I'm fine!

• Monospaced font

My guess it that allow loading a custom css file would already makes this possible. Would love to make on IRC/IRSSI styled.

[basvdijk]

I've quickly made a proof of concept of how this could look. This SCSS overrides some stuff to give the message view a look like IRC.

Please note that this is quickly made and is not meant for production.

To test, just add the code below at the bottom of manifest.scss

$color-irssi-background: black;


.timeline-wrapper {
    border: 0;
    background: $color-irssi-background;
}

.module-message__container {
    border-radius: 0;
    padding: 0;
}

.module-message__metadata__date, 
.module-message__text {
    font-family: monospace;
}

.module-message {
    max-width: 100%;
    background: transparent;
}

.module-message__metadata {
    float: left;
    position: absolute;
    left: -125px;
    top: 1px;
}


.module-message__container,
.module-timeline__message-container {
    border: 0;
}

.module-message__container--incoming-teal {
    background-color: transparent;
    color: green;
}

.module-message--incoming,
.module-message--outgoing {
    margin-left: 135px;
    float: left;
}

.module-message__text--incoming {
    color: #06BEC0;

    &:before {
        content: '> ';        
    }
}

.module-message__text--outgoing {
    color: #B8B8B8;
}

.module-message__container--outgoing {
    background-color: transparent;
}

.module-message__metadata--outgoing {
    justify-content: flex-start;

    .module-message__text {
        color: pink;
    }
}

.module-message__attachment-container {
    border-radius: 0;
    margin-left: 0;
    margin-top: 0;
    background-color: #333;
}

.module-quote-container {
    margin-left: 0;
}

.module-quote {
    border-radius: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.module-message__container--incoming-indigo {
    background-color: transparent;
}

[hani4k]

Where can i find the file?

[basvdijk]

@hani4k What kind of file do you mean?

[hani4k]

I don't fide the manifest.scss

[basvdijk]

@hani4k Looks like it is called https://github.com/signalapp/Signal-Desktop/blob/development/stylesheets/manifest.scss now

[CapnSparrow]

I've created a theme that makes Signal Desktop look like WhatsApp. You can check it and implement your own theme using the same approach. See it here: https://github.com/CapnSparrow/signal-desktop-themes

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.