[Triple A Racing]

Originally Posted by Triple A Racing

...and you can see a media query being "applied" automatically within the browser inspect tool window too...

A clearer example of using Custom CSS to identify / demonstrate changes, before then including the changes within a Custom Module (although some people may be happy just to use Custom CSS and go no further). This example is a simple bottom margin reduction :

.category-description {
  margin-bottom: 0px;
}

Once correctly identified and added, it should just work....like it did in 5.2.* / Normal skin. In 5.3.* / CWS however (....CWS is a module acting on a normal skin) and once this example change is added within Custom CSS, this is what happens on a Desktop Device

@media (min-width: 768px)
.category-description {
    margin-bottom: 0;
}

Note the the Media Query that has been added automatically... This is followed by a line break, then the code below but, with strikeout text used for the value shown inside the { } We can't show strikeout text inside CODE tags on here... Nothing is ever that simple

 .category-description {
    margin-bottom: 40px;
}

Meanwhile....on a mobile device and/or desktop emulation setup and/or any device with a a viewport width of less than 768px... You won't see anything. No changes. Zip. Just the normal view and the default XC code, but... without the strike through text mentioned above i.e.

 .category-description {
    margin-bottom: 40px;
}

The important questions from us now are as follows:

a) Using Custom CSS to alter CSS coding for viewport widths of less than 768px (i.e. non-desktop) appears to not be a viable option currently. Is that correct?

b) If it still IS a viable option, sorry for having missed the glaringly obvious, but what's the correct method for using this now then, with 5.3.* / CWS?

c) If this new limit is a direct result of using a bootstrap base and/or .less files for CSS pre-processing, fine, but how are individuals currently meant to make complete modifications to CWS CSS themselves?

d) If the answer to c) is "....They can't really.... Not yet anyway....Actually not until the process 'rules' order is re-defined with XC Core. The reality is that it's effective only on viewport widths of greater than 768px i.e. desktop only at present..." Well that would at least make sense and would be great to know, but... will this hugely important change be part of the imminent 5.3.2.1 release?

e) We've already asked the question about modified .less files not working, when they form part of a Custom Module in another post ( https://forum.x-cart.com/showthread.php?t=74770 ), this may well be connected we guess, but there's no reply to this question yet. It's bit like asking for an #Area51 pass...

FWIW The only way that we can currently make modified .less files work, without causing serious viewing errors, is to replace the original .less file, in it's exact original location, with the modified .less file version. Nobody wants to go back to this option, because it transforms upgrades into a big record keeping exercise and a long process, mainly because of all the manual steps that are then required...

We're neither XC or software experts, so we've only used trial and error so far to establish things. Information is power and the XC Dev Team will know the real answers... so; we're ready