XF 2.1 Extra.less not taking

[Rushster]

Hi

I have setup a forum on my local machine to test templates on my local machine and everything is working fine as far as the forum is concerned. However, as soon as I add some custom css to the Extra.less template, none the css changes are showing at all. Any ideas?

Thanks in advance.

 

[sbj]

Are you making sure that you are using the correct style? Each style has its own extra.less template.



So, if you are applying customization on the default style extra.less but on the forum side you are using another style, you won't see the changes.

 

[Rushster]

Yes, it's the right style. I am not changing the default. I know the style is working because any style changes I make using the usual settings are applying.

 

[Paul B]

Difficult to say what the issue is without seeing the site first hand.

It's possible the CSS is invalid or is being overridden by the core CSS.

Try it on a demo and link to the demo here.

 

[Rushster]

When I check the source and click the link...

<link rel="stylesheet" href="/wordpress/forums/css.php?css=public%3Anode_list.less%2Cpublic%3Ashare_controls.less%2Cpublic%3Aextra.less&amp;s=2&amp;l=1&amp;d=1576783116&amp;k=b05daa783826eef971bb737ac19714740693ecd0" />

and check where the extra.less is being called. Others seem to come up like so...

/********* public:node_list.less ********/
.node+.node{border-top:1px solid #280001}.node-body{display:table;table-layout:fixed;width:100%}.node-icon{display:table-cell;vertical-align:middle;text-align:center;width:46px;padding:10px 0 10px 10px}.node-icon i{display:block;line-height:1.125;font-size:32px}.node-icon i:before{font-family:'Font Awesome 5 Pro';font-size:inherit;font-style:normal;font-weight:400;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#610103}.node--unread .node-icon i:before{opacity:1;color:#ab0003}.node--forum .node-icon i:before,.node--category .node-icon i:before{content:"\f086"}.node--page .node-icon i:before{content:"\f15c"}.node--link .node-icon i:before{content:"\f0c1"}.node-main{display:table-cell;vertical-align:middle;padding:10px}.node-stats{display:table-cell;width:140px;vertical-align:middle;text-align:center;padding:10px 0}.node-stats>dl.pairs.pairs--rows{width:50%;float:left;margin:0;padding:0 3px}.node-stats>dl.pairs.pairs--rows:first-child{padding-left:0}.node-stats>dl.pairs.pairs--rows:last-child{padding-right:0}.node-stats.node-stats--single{width:100px}.node-stats.node-stats--single>dl.pairs.pairs--rows{width:100%;float:none}.node-stats.node-stats--triple{width:240px}.node-stats.node-stats--triple>dl.pairs.pairs--rows{width:33.333%}@media (max-width:1000px){.node-stats{display:none}}.node-extra{display:table-cell;vertical-align:middle;width:280px;padding:10px;font-size:13px}.node-extra-row{overflow:hidden;white-space:nowrap;word-wrap:normal;text-overflow:ellipsis;color:#bebebe}.node-extra-icon{padding-right:10px;float:left}.node-extra-icon .avatar{width:36px;height:36px;font-size:22px}.node-extra-placeholder{font-style:italic}.node-title{margin:0;padding:0;font-size:17px;font-weight:400}.node--unread .node-title{font-weight:700}.node-description{font-size:13px;color:#dfdfdf}.has-js:not(.has-touchevents) .node-description.node-description--tooltip{display:none}.node-meta{font-size:13px}.node-statsMeta{display:none}@media (max-width:1000px){.node-statsMeta{display:inline}}.node-bonus{font-size:13px;color:#bebebe;text-align:right}.node-subNodesFlat{font-size:13px;margin-top:.3em}.node-subNodesFlat .node-subNodesLabel{display:none}.node-subNodeMenu{display:inline}.node-subNodeMenu .menuTrigger{color:#bebebe}@media (max-width:650px){.node-main{display:block;width:auto}.node--link .node-main,.node--page .node-main{display:table-cell}.node-extra{display:block;width:auto;margin-top:-4px;padding-top:0}.node-extra-row{display:inline-block;vertical-align:top;max-width:100%}.node-extra-icon{display:none}.node-description,.node-stats,.node-subNodesFlat{display:none}}@media (max-width:480px){.node-subNodeMenu{display:none}}.subNodeLink:before{display:inline-block;font-family:'Font Awesome 5 Pro';font-size:inherit;font-style:normal;font-weight:400;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;width:1em;padding-right:.3em;text-decoration:none;color:#610103}.subNodeLink:hover:before{text-decoration:none}.subNodeLink.subNodeLink--unread{font-weight:700}.subNodeLink.subNodeLink--unread:before{color:#ab0003}.subNodeLink.subNodeLink--forum:before,.subNodeLink.subNodeLink--category:before{content:"\f086"}.subNodeLink.subNodeLink--page:before{content:"\f15c"}.subNodeLink.subNodeLink--link:before{content:"\f0c1"}.node-subNodeFlatList{list-style:none;margin:0;padding:0}.node-subNodeFlatList:before,.node-subNodeFlatList:after{content:" ";display:table}.node-subNodeFlatList:after{clear:both}.node-subNodeFlatList>li{display:inline-block;margin-right:1em}.node-subNodeFlatList>li:last-child{margin-right:0}.node-subNodeFlatList ol,.node-subNodeFlatList ul,.node-subNodeFlatList .node-subNodes{display:none}.subNodeMenu{list-style:none;margin:0;padding:0}.subNodeMenu ol,.subNodeMenu ul{list-style:none;margin:0;padding:0}.subNodeMenu .subNodeLink{display:block;padding:6px 10px;text-decoration:none;cursorointer}.subNodeMenu .subNodeLink:hover{text-decoration:none;background:#490001}.subNodeMenu li li .subNodeLink{padding-left:1.5em}.subNodeMenu li li li .subNodeLink{padding-left:3em}.subNodeMenu li li li li .subNodeLink{padding-left:4.5em}.subNodeMenu li li li li li .subNodeLink{padding-left:6em}.subNodeMenu li li li li li li .subNodeLink{padding-left:7.5em}

/********* public:share_controls.less ********/
.shareButtons:before,.shareButtons:after{content:" ";display:table}.shareButtons:after{clear:both}.shareButtons--iconic .shareButtons-buttons{display:grid;grid-template-columns:repeat(auto-fill, minmax(35px, 1fr))}.shareButtons-label{float:left;margin-right:3px;color:#bebebe;min-height:35px;line-height:35px}.shareButtons-button{float:left;margin-right:3px;padding:6px;color:#bebebe;font-size:20px;line-height:20px;white-space:nowrap;min-width:35px;border-radius:2px;background-color:transparent;-webkit-transition: all .25s ease;transition: all .25s ease}.shareButtons-button:last-of-type{margin-right:0}.shareButtons-button:hover{text-decoration:none;color:white}.shareButtons-button>i{display:inline-block;vertical-align:middle;font-family:'Font Awesome 5 Pro';font-size:inherit;font-style:normal;font-weight:400;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.shareButtons-button.shareButtons-button--brand>i{font-family:'Font Awesome 5 Brands';font-size:inherit;font-style:normal;font-weight:400;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.shareButtons-button>span{font-weight:400;font-size:15px}.shareButtons--iconic .shareButtons-button{text-align:center}.shareButtons--iconic .shareButtons-button>i{min-width:20px}.shareButtons--iconic .shareButtons-button>span{position:absolute;height:1px;width:1px;margin:-1px;padding:0;border:0;clip:rect(0 0 0 0);overflow:hidden}.shareButtons-button.shareButtons-button--facebook:hover{background-color:#3B5998}.shareButtons-button.shareButtons-button--facebook>i:before{content:"\f39e"}.shareButtons-button.shareButtons-button--twitter:hover{background-color:#1DA1F3}.shareButtons-button.shareButtons-button--twitter>i:before{content:"\f099"}.shareButtons-button.shareButtons-button--pinterest:hover{background-color:#bd081c}.shareButtons-button.shareButtons-button--pinterest>i:before{content:"\f231"}.shareButtons-button.shareButtons-button--tumblr:hover{background-color:#35465c}.shareButtons-button.shareButtons-button--tumblr>i:before{content:"\f173"}.shareButtons-button.shareButtons-button--reddit:hover{background-color:#FF4500}.shareButtons-button.shareButtons-button--reddit>i:before{content:"\f281"}.shareButtons-button.shareButtons-button--whatsApp:hover{background-color:#25D366}.shareButtons-button.shareButtons-button--whatsApp>i:before{content:"\f232"}.shareButtons-button.shareButtons-button--email:hover{background-color:#1289ff}.shareButtons-button.shareButtons-button--email>i:before{content:"\f0e0"}.shareButtons-button.shareButtons-button--link{cursorointer}.shareButtons-button.shareButtons-button--link:hover{background-color:#787878}.shareButtons-button.shareButtons-button--link>i:before{content:"\f0c1"}.shareButtons-button.is-hidden{display:none}.shareInput{margin-bottom:5px}.shareInput:last-child{margin-bottom:0}.shareInput-label{font-size:13px}.shareInput-label:after{content:":"}.shareInput-label.is-sentence:after{content:""}.shareInput-button{color:#e64006;cursorointer}.shareInput-button>i{display:inline-block;vertical-align:middle;font-family:'Font Awesome 5 Pro';font-size:inherit;font-style:normal;font-weight:400;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.shareInput-button>i:before{content:"\f0c5"}.shareInput-button.is-hidden{display:none}.shareInput-input{font-size:13px}@media (max-width:568px){.shareInput-input{font-size:16px}}.shareInput-button.is-hidden+.shareInput-input{border-radius:4px}

But there is no extra.css heading there.

 

[Pepelepew]

I'm having this same problem did u fix it?