XF 2.2 Is there a way to add padding to Article forums on mobile ?

[gib]

The article forum view looks great on desktop, but it appears in full width mode on mobiles, without any padding.

Is there a way to add CSS to a template to add some padding or a border when viewing Article forums in preview display mode ?

 

[lg19]

I have the same question and hope someone will have an answer for us soon.

EDIT: I don’t know if this is will work for everyone, but I just went to extra.less and added these -

.message--articlePreview .articlePreview-image {
    width: 95%;
    margin-top: 15px;
}
.message--articlePreview .articlePreview-title {margin: 0 5px;}
.message--articlePreview .articlePreview-image + .articlePreview-text .bbWrapper {margin: 0 5px;}
.block--previews .block-body > .message--articlePreview:first-of-type .articlePreview-image {margin: 15px;}

 

[gib]

I have the same question and hope someone will have an answer for us soon.

EDIT: I don’t know if this is will work for everyone, but I just went to extra.less and added these -

.message--articlePreview .articlePreview-image {
    width: 95%;
    margin-top: 15px;
}
.message--articlePreview .articlePreview-title {margin: 0 5px;}
.message--articlePreview .articlePreview-image + .articlePreview-text .bbWrapper {margin: 0 5px;}
.block--previews .block-body > .message--articlePreview:first-of-type .articlePreview-image {margin: 15px;}

many thanks for that @lg19 , that works a treat

 

[lg19]

@gib I’m glad it works for you and thought you might like to know that I changed it slightly:

.message--articlePreview .articlePreview-main {margin: 0 5px;}
.block--previews .block-body > .message--articlePreview:first-of-type .articlePreview-image {margin: 15px;}
.message--articlePreview .articlePreview-image {
    width: 95%;
    margin-top: 15px;
    border: 1px solid lightgrey;
}