SCSS Configurations

Important

Please note in order to change template configurations through config.scss file, you must have knowledge of SASS compilation. A SASS compiler must be installed and running in order to save the changes in .scss file. If you need any support regarding this, please contact us.

If you want to change the configurations for the template you can do it just by changing values in config.scss file.

Location: lib/scss/config.scss

Righbar settings

1. Righbar

Line no: 300

$rightbar-bg                                            :#FFFFFF;
$rightbar-border-color                                  :#DEE5E7;
$rightbar-header-bg                                     :#FFFFFF;
$rightbar-tabs-color                                    :$text-color;
$rightbar-active-tabs-color                             :lighten($rightbar-tabs-color,40%);
$rightbar-subtitle-text-color                           :lighten($rightbar-tabs-color,40%);

2. Chatbox

Line no: 307

// Chatbox
$chat-friendlist-bg                                     :#FFFFFF;
$chat-friendlist-hover-color                            :darken($chat-friendlist-bg,3%);
$chat-friendlist-bottom-border-color                    :#FFFFFF;
$chat-friendlist-text-color                             :$text-color;
$chat-friendlist-time-color                             :lighten($chat-friendlist-text-color,40%);
$chat-searchbar-bg                                      :#FFFFFF;
$chat-searchbar-bottom-border-color                     :darken($chat-searchbar-bg,3%);
$chat-searchbar-text-color                              :$text-color;
$chat-conversation-header-bg                            :#4FC5EA;
$chat-conversation-header-bottom-border-color           :#4FC5EA;
$chat-conversation-header-text-clor                     :#FFFFFF;
$conversation-bg                                        :#FFFFFF;
$conversation-sender-bg                                 :#B7EEFF;
$conversation-recipient-bg                              :#F6F8F8;
$conversation-text-color                                :$text-color;
$conversation-time-color                                :$text-color;
$conversation-send-circle-bg                            :#4FC5EA;
$conversation-send-circle-icon-color                    :#FFFFFF;

3. Notifications

Line no: 327

// Notifications
$notification-name-color                                :$text-color;
$notification-text-color                                :$text-color;
$notification-time-color                                :#999999;
$notification-border-bottom-color                       :darken($rightbar-bg,3%);
$notification-new-bg                                    :darken($rightbar-bg,3%);
$notification-hover-bg                                  :darken($rightbar-bg,3%);

4. Activities

Line no: 335

// Activities
$activities-border-color                                :$text-color;
$activities-default-icon-color                          :$text-color;
$activities-bubble-header-color                         :darken(#B7EEFF,10%);
$activities-bubble-header-text-color                    :$text-color;
$activities-bubble-color                                :#B7EEFF;
$activities-bubble-text-color                           :$text-color;
$activities-time-color                                  :#FFFFFF;

5. Settings

Line no: 344

// Settings
$settings-text-color                                    :#111111;
To change righbar settings:
  1. Change the values.
  2. SAVE the file and compile it to CSS