Comments Widget

This widget displays a list of comments in the side-wide activity. Basically displays the replies/comments of other users on a particular status posted within a group.

Styling Comments

Comments Typography

In this style option you can alter the font settings of the text in the comments. Change the font family, size, weight, style, line height among others.

Comments Color

With this option you can change the color of the comments’ text to your preferred choice.

Background

This setting will allow you to add a background color behind the comments section.

Border Styling

You have an option to add a border from different types like solid, dotted, dashed, double among others. You can also define the width size of your border in the comment section. Choose a preferred color for the border and add a radius size in case you want the borders to have rounded corners.

Padding and Margin

In these options you can increase or decrease the spacing within the comments or within the comment box with the padding and margin options respectively.

Comment Avatar Border Radius

This option allows you to add a border radius around the users’/member’s avatar image in order to make it rounded.

Comment Avatar Margin

This setting allows you to add some spacing between the member’s avatar and the status besides it.

Comment Status Typography

With this option you can alter the font settings of the text in the comments status. Change the font family, size, weight, style, line height among others.

Comment Status Link Typography

With this option you can alter the font settings of the link text in the comments status. Change the font family, size, weight, style, line height among others.

Comment Status Text Color

Under this option you have the option to choose your preferred text color for the comment status.

Comment Status Link Color

Similarly you can change the color for the links in the comment status.

Comment Text Padding & Margin

These options allow you to add padding and margin size spacing to the “actual comment” text.

Sub Comments Margin

This option will enable you to add a margin size to the sub comments sections.

Reply & Delete Buttons Styling

These buttons entail styling options similar to the ones covered above.

To start with you can change the typography of the text in the buttons (i.e REPLY & DELETE text). You can do this by changing the font family, size, weight, style, line height among others.
Next is the background and text color of the buttons of which you can select your preferred option of colors in both hover and normal states.
Additionally you may opt to add the box shadow which adds the blur surrounding the buttons.
Next, you have an option to add a border from different types like solid, dotted, dashed, double among others. You can also define the width size of your border in the comment section. Choose a preferred color for the border and add a radius size in case you want the borders to have rounded corners.
And lastly, add some padding to the buttons to increase spacing between each other.

Comment Form Styling

Comment Form Box Padding

This option adds spacing between the form and the entire comment box.

Content Spacing

This option will add spacing within the various sections of the comment form.

Comment Placeholder Border Styling

In this section you can style the border with the usual settings. Add a border from different types like solid, dotted, dashed, double among others. You can also define the width size of your border in the placeholder section. Choose a preferred color for the border and add a radius size in case you want the placeholder to have rounded corners.

Comment Form Avatar – Border and Box Shadow Style

With this section you can alter the box shadow of the avatar image in the comment form by adding some blur behind the image. Additionally you would then add some dorder styling like adding different border types like solid, dotted, dashed, double among others. Then define the width size of your border in the avatar section. Choose a preferred color for the border and add a radius size in case you want the avatar to have rounded corners.

Comment Form Post Button Styling

Similar to the previous button, these entail styling options similar to the ones covered above.

To start with you can change the typography of the text in the button (i.e POST text). You can do this by changing the font family, size, weight, style, line height among others.
Next is the background and text color of the button of which you can select your preferred option of colors in both hover and normal states.
Additionally you may opt to add the box shadow which adds the blur surrounding the button.
Next, you have an option to add a border from different types like solid, dotted, dashed, double among others. You can also define the width size of your border in the button section. Choose a preferred color for the border and add a radius size in case you want the button to have rounded corners.
And lastly, add some padding to the button and other contents of the form to increase spacing between each other.

Comment Form Cancel Button/Link Styling

Just as in the post button we can use the same styling in the cancel button/link.

To start with you can change the typography of the text in the button (i.e Cancel text). You can do this by changing the font family, size, weight, style, line height among others.
Next is the background and text color of the button of which you can select your preferred option of colors in both hover and normal states.
Additionally you may opt to add the box shadow which adds the blur surrounding the button.
Next, you have an option to add a border from different types like solid, dotted, dashed, double among others. You can also define the width size of your border in the button section. Choose a preferred color for the border and add a radius size in case you want the button to have rounded corners.
And lastly, add some padding to the button and other contents of the form to increase spacing between each other.