Skip to content

Customizing the user interface

Gaute Hope edited this page Jan 15, 2016 · 10 revisions

Thread view

You can copy the original HTML and SCSS file from the ui/ directory to ~/.config/astroid/ui/ and then customize them to your own needs. Astroid will check if the version is correct (do not change it yourself), in case a new version is released upstream.

SCSS works much like CSS, but we preprocess it using libsass.

You can change font-size, font-family and some other variables by setting the SCSS variables at the top of thread-view.scss.

If you only want to change the variables, but still use the default theme, following any updates made upstream the recommended way of customizing the standard variables is to create a ~/.config/astroid/ui/thread-view.scss file, set the variables, and then include the standard file:

/* ui-version: 2 (do not change when modifying theme for yourself) */
/* Variables */
/* Background colors associated with received emails: */
$recv-normal: #ffffff;
$recv-quoted: #e8e8e8;
$recv-collapsed: #f5f5f5;
/* Background colors associated with sent emails: */
$sent-normal: #ffffff;
$sent-quoted: #e8e8e8;
$sent-collapsed: #f5f5f5;
/* Fonts */
$font-base-size: 13px !global;
$font-mono: "Input Mono", "Inconsolata", monospace;
$font-sans: "Input Sans", "Roboto", sans-serif;
$font-family-default: $font-mono;
/* Colours */
$email-solid: #d8d8d8;
$focused-solid: #4a90d9;

@import '/path/to/upstream/astroid/ui/thread-view.scss';

Thread index

Check the configuration options in ~/.config/astroid/config

Clone this wiki locally