readme.md

RTL Support for Slack

Installation

• You have the Stylish plugin to be installed in your browser (Chrome, Firefox).
• Install the css file into Stylish plugin, go to style page and click + Install with Stylish button.

Features

• flip the direction of the message box and the messages.
• flip user avatar position.
• change timestamp and star icon.
• allow the code/pre to be LTR inside the RTL content.

slack-rtl.css

/**
 * Slack RTL
 * ---------
 *
 * Ammar Alakkad <[email protected]>
 * http://aalakkad.me 
 */

#message-input, .message {
    direction: rtl;
    font-family: "Droid Arabic Kufi", Tahoma, Arial !important;
    font-size: 15px !important;
}

code, pre {
    direction: ltr;
    text-align: left;
    unicode-bidi: embed;
}
.message .member_image {
    left: auto !important;
    right: 0;
    float: right !important;
}

.message {
    padding: .25rem 3rem .1rem 2rem !important;
}

.message .msg_actions {
    right: auto !important;
    left: 0;
}

.message .message_star_holder {
    left: auto !important;
    right: 27px;
}

.message .timestamp {
    right: 2px;
    left: auto !important;
}