I'm having trouble with image resize in my Forum. Extra.less is not working, apparently (NOVA/XF 2.1)

[palhanow]

Hello guys, I'm sorry, but it's me again.

I hate bugs and your support is so much better than the XF and I'm thinking this is theme related.

So, basically the history of the problem is in this thread:

https://xenforo.com/community/threads/problems-on-unfurling-urls-in-my-xf.160177/

Basically the Unfur URL system was doing ok after the change (remove minimum img size), because the images are showing so much bigger than usual, specially in the Unfur URL system.

After that, i did removed the minimum img size and was working fine.

Now, the problem is back. The images are bigger again.

You can see in the thread.

The code for my extraless is this:

/* Resize Image */
.message-body img {
    max-width: 450px !important;
    max-height: 450px !important;
}
/* Resize Image */
/* Node Icons */
#XF{
    .node--id2 .node-icon i::before{
        content: '\f0a1';
    }
.node--id3 .node-icon i::before{
        content: '\f257';
    }
.node--id4 .node-icon i::before{
        content: '\f19c';
    }
.node--id5 .node-icon i::before{
        content: '\f19c';
    }
.node--id7 .node-icon i::before{
        content: '\f21b';
    }
.node--id10 .node-icon i::before{
        content: '\f109';
    }
.node--id9 .node-icon i::before{
        content: '\f26c';
    }
.node--id8 .node-icon i::before{
        content: '\f21e';
    }
.node--id11 .node-icon i::before{
        content: '\f0d6';
    }
.node--id12 .node-icon i::before{
        content: '\f05a';
    }
.node--id16 .node-icon i::before{
        content: '\f1ea';
    }
.node--id17 .node-icon i::before{
        content: '\f041';
    }
    .node--id18 .node-icon i::before{
        content: '\f0ac';
    }
    .node--id19 .node-icon i::before{
        content: '\f258';
    }
    .node--id20 .node-icon i::before{
        content: '\f02d';
    }
    .node--id21 .node-icon i::before{
        content: '\f11b';
    }
    .node--id22 .node-icon i::before{
        content: '\f1e3';
    }
    .node--id27 .node-icon i::before{
        content: '\f132';
    }
}
/* Node Icons */

/* Signature Image Size */
.message-signature
{
    .bbWrapper
    {
        .bbImage
        {
            max-width: 300px;
            max-height: 150px;
            overflow-x: auto;
            overflow-y: auto;
        }
    }
}
/* Signature Image Size */

/* Jump Button */
#scrolldownhere
{position:relative;top:-500px}
/* Jump Button */

/* Donations Icon */
.p-nav-list .p-navEl a.p-navEl-link[data-nav-id="doacoes"]:before { content: "\f0d6"; }
/* Donations Icon */

/*Invert Button */
.formButtonGroup .formButtonGroup-primary .button--icon--reply
{
  float: right;
  margin-left: 7px;
}
/*Invert Button */

/*Action Bar*/
.actionBar-action:before {
    margin-right: 5px;
}
.actionBar-action--edit:before {.m-faContent("\f040");}
.actionBar-action--report:before {.m-faContent("\f071");}
.actionBar-action--ip:before {.m-faContent("\f002");}
.actionBar-action--delete:before {.m-faContent("\f00d");}
.actionBar-action--spam:before {.m-faContent("\f024");}
.actionBar-action--warn:before {.m-faContent("\f12a");}
.actionBar-action--history:before {.m-faContent("\f1da");}
/*Action Bar*/

If i enter in the Forum using the ("DO NOT EDIT" Parent Style) the problem is solved, but my childs is not working. The extra.less in the Parent Style are empty.

Any thoughts?

Thank you very much.

 

[Russ]

So your css here:

.message-body img {
    max-width: 450px !important;
    max-height: 450px !important;
}

Even though your intention may be to target just regular post images it's targeting the image inside the unfurl preview.

Try adding this to help:

.bbWrapper .bbCodeBlock--unfurl img {
    max-height: 60px;
}

 

[palhanow]

Thanks for your tip...

But unfortunately not worked at all.

Even if i remove all the code, is like the extra.less is not working, or the forum isn't "reading" or following his instructions.

Bizarre.

Should i reinstall the theme and make the modifications again?

 

[Russ]

The only way your CSS wouldn't be updated usually comes down to:

• Bad CSS somewhere above
• Cache

If you want to submit a ticket I can take a closer look with an admin login.

 

[palhanow]

I'm going to open a ticket.

Thanks for you support.

 

[palhanow]

Hello again.

I’m here again because I’m having a new issue with images on my board.

The images are “overlapping”, breaking the layout on mobile.

That’s why I’m using the image limiter, but is not working.

Like in this thread for example

 

[Russ]

It's probably your CSS above, try this so the images have a max-width in mobile.

@media (max-width:@xf-responsiveNarrow) { .message-body img { max-width: 100% !important; max-height: 100%; } }

 

[palhanow]

Worked very well!

Thanks!

Now, another question, is a custom job.

I don't know if you guys make plugins, but I'm needing one.

Is basically a plugin that let me (admin) switch on and off the Ads in determined threads. Just a button in the top with a ON/OFF switch off when i need it.

I'm geting a lot of flags from AdSense and I'm a little worried.

If you guys can make this, how much will cost?

Thanks again.