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 [Type, Size, Color and Radius]
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.
