News

Widgets updated to CSS grid

Widgets updated to CSS grid

This product update is to announce that we are planning to release some small updates on the CSS of several widgets.

The changes will be live on the 23rd of February. 

 

What will change:

We rewrote the CSS for 5 widgets to achieve a more consistent behavior and look-n-feel. The following widgets are concerned:

  • Knowledge Base

  • Community Category

  • Quick Links

  • Featured Topics

  • Featured Topics (This is a very old widget that features topics using moderator tags, most of you are not using this widget)

We modified the following classes. The classes stay the same, only the CSS rules have been changed to use CSS grid technology. We didn't make any changes HTML mark up. 

See below the list of modified classes:

  1. community-category-list

    1. community-category__card

    2. community-category__card-small-card

  2. knowledge-base-category-list

    1. knowledge-base__card

    2. knowledge-base__card-small-card

  3. featured-topics__list

    1. featured-topic

    2. featured-topic--full-width

    3. featured-topic--half-width

  4. widget--featured-topics

    1. featured-topic

  5. featured-topics__heading

  6. quicklink__container

    1. quicklink__container--knowledgeBase

    2. quicklink__box

 

Why did we make those changes:

The first reason is for some UI consistency:

  • We aligned the paddings and margins to be consistent. 

  • We implemented clear edges and vertical alignment

The second reason is more technical:

  • We implemented a CSS Grid with 12 columns grid which allows us to customize the appearance of cards much more easily and with the same approach

  • We reduced the number of CSS rules have been reduced, no more "!important" notations

 

 

What does this mean for you?

For the majority of you these changes will have no impact on the look and feel of your community. 

However if you use custom CSS specifically on the listed widgets, the look and feel of your community might be impacted. There can be minor issues of spacing or width. You will need to update your custom CSS to solve those issues once the changes are released. 

 

Feel free to contact our support team at support@insided.com if you need any help.

 

Thanks for the heads up @Marion Frecaut this is very handy info. It would be awesome to visualize the changes - before and after type of thing - before they go live. 

I think this is one of the widgets in play ?

 

It’s the KB quick links widget. I’m tempted to use because it’s useful but it looks like it doesn’t belong in there so in the end upI always hide it. !

Terms & ConditionsCookie settings