The Stack Overflow podcast is back! Listen to an interview with our new CEO.

Questions tagged [less-css]

The tag has no usage guidance, but it has a tag wiki.

Filter by
Sorted by
Tagged with
21
votes
3answers
9k views

Difference between _module.less and _extend.less

Is there any difference between extending a theme using _module.less and _extend.less? And what is the best practice when extending a module/theme? My first thought was it's better to use _module....
17
votes
2answers
5k views

What is the purpose of the LESS lib-css mixin?

The .lib-css() mixin is used heavily in Magento 2 LESS files. However its purpose is not apparent, and the mixin definitions don't provide any helpful documentation: // // Add any css property // --...
10
votes
6answers
1k views

Magento 2 - Overriding CSS without using !important everywhere

I'm working on a Magento 2 site at the moment for a client. Suppose my client's brand is boofar and the theme I'm trying to extend/override is foobar I've set as the parent theme using frontend/...
9
votes
7answers
4k views

Product image zoom issue on product details page when drop-down menu have overlap area with it

Zoom works fine, But when hovering on category drop-down menu to the overlap area of product image and drop-down menu, The zoom is acting normally, even the mouse is still on the drop-down menu. ...
9
votes
4answers
2k views

Magento 2 How to override vendor/magento/magento2-base/lib/web/css/source/lib/_navigation.less?

How Can I override vendor/magento/magento2-base/lib/web/css/source/lib/_navigation.less file in my custom theme ?
9
votes
1answer
4k views

@media-common - Why do we need to use this?

In the Magento 2 lib documentation it contains the following: @media-common: true|false - sets whether to output common styles. For common styles every time you want to add some styles you should use ...
8
votes
1answer
13k views

Magento2 : How to path for background image in .less file? [closed]

I want to set path for background image in less file app\design\frontend\vendor\theme\web\<lessfile> in magento2.
8
votes
2answers
398 views

Where to place custom UI library

I need to create my own UI library (mostly .less files, but also images and .js) which will be used in multiple custom modules and themes. I thought I will just add my files to Magento UI library ...
7
votes
2answers
2k views

Magento 2. Less to CSS. Very slow building process. How to improve?

Currently magento2/grunt is very slow in transforming less to css (with a few locales it can take up to a minute to rebuild everything. Any tips how to improve development speed?
7
votes
1answer
987 views

Magento 2 - LESS debuging

I have read Styles debugging guide for M2 and can't seem to find the correct way to start debugging LESS. I have setup Grunt and browser to show original sources for less. But the original source ...
6
votes
2answers
3k views

Where to place Magento 2 Theme customizations?

I installed Magento 2 via Composer and it does not have a directory for theme in frontend. I tried to create a new theme in app/design, every time I create registration.php I get an error. Question ...
6
votes
1answer
2k views

magento 2 add/call css file in email template of custom module

I am trying to add inline css in email template in my custom module. Example <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport" ...
5
votes
5answers
4k views

Magento 2 less compilation error while setup:static-content:deploy

After updating to Magento 2.1.16 on my staging server with nginx server and php7.0 I am facing issue in compiling less and css files. The files styles-l.css and styles-m.css are missing - not ...
5
votes
2answers
4k views

How can I add custom less file and in a particular theme compile less file in Magento 2

How can I add custom less file and in a particular theme compile less file in Magento 2 ?
5
votes
2answers
3k views

Magento 2.2 LESS not compiling locally on Ubuntu

I'm using Ubuntu with Magento 2.2 installed locally for development. I'm updating my LESS, but it's just not compiling for some reason. I have all caching turned off in Cache Management, and I run ...
5
votes
2answers
4k views

Magento 2: How to use Grunt properly for CSS changes

I'm trying to figure out the clusterf-ck which is the Magento 2 front-end theming workflow. And I've read and understood all documentation, read all the blogs about it and are up to date on the latest ...
5
votes
1answer
1k views

Magento 2 - How to change the less variables based on admin configurations?

I'm working with Magento 2 - beta. I want to set the colors and other less variables in the extension's block, controller, or module, eg: @primary__color. Anyone know how to do this? I want to set ...
4
votes
3answers
7k views

Magento 2 grunt exec does not actually create symlinks

I am following: http://devdocs.magento.com/guides/v2.0/frontend-dev-guide/css-topics/css_debug.html#grunt_prereq it says grunt exec:<theme> does: Republishes symlinks to the source files to ...
4
votes
1answer
282 views

Magento 2 1.0.0-beta creating a new vendor/theme from Magento/luma breaks FE

I created a new Vendor/theme where, in the theme.xml, i referenced the Magento/luma theme. As i understand it right, the fallback should now grap styles from the luma theme and my new theme should ...
3
votes
1answer
4k views

How do you change the color of buttons to a custom color?

I've tried to define a custom color in my custom less stylesheet in my theme css/source folder and pulling it in with _styles.less but it doesn't seem to work although it is seeing the custom text ...
3
votes
4answers
5k views

Magento 2 and change CSS styles - in LUMA - as a child theme

We have created a Luma child theme, and trying to figure out, how to make some CSS-changes?! For instance, change the footer and header background color? The _extend.less doesn't work, and adding a ...
3
votes
2answers
6k views

how to fix error after deploy:mode: developer?

In Magento2, after I created custom.less in myTheme, it does not render file less. so I tried run cli php bin/magento deploy:mode:set developer then in the admin panel, I get the error: SyntaxError: ...
3
votes
2answers
2k views

Magento 2 add custom css to custom theme file

I created a custom less file in \app\design\frontend\Vendor\theme\web\css\source I don't know how to compile it and how to imports this file in style-l.css please give your suggestions
3
votes
1answer
89 views

Is there a fast way to flush cache and empty static folders using putty commands?

Is there a fast way to flush cache and empty static folders using putty commands? I am in developer mode and sometimes I dont know what I need to do so that the site updates my edits. Can one combine ...
3
votes
2answers
3k views

Grunt less:theme fails @media-common is undefined

I am using a theme that I have created based on a third party theme 'Optimus' and I am trying to use Grunt to compile the LESS. However, when I run grunt less:theme it fails with the following error: ...
3
votes
1answer
2k views

CSS files not update with _extend.less rules

I has installed magento 2 version 2.0.7-0, I trying to create my own theme but I can get archive that styles in _extend.less work correctly. This is my path theme: /app/design/frontend/<vendor>...
3
votes
3answers
5k views

How to update/customize/override Magento 2 css styles

So I followed the Magento 2 Docs to create my theme for the store. Step 1: I have created directories app/design/frontend/<Vendor>/<theme>/ ├── web/ │ ├── css/ │ │ ├── source/ │ ├── ...
2
votes
4answers
6k views

Magento2 - pub static css not found

In developer mode I been getting the error FileError: '/pub/static/frontend/theme/theme_name/en_GB/css/styles-m.css' wasn't found (404) I've taken the following steps to try and resolve this: Used ...
2
votes
2answers
2k views

Theme CSS not updating on media/css_secure

Recently my CSS files not updating to media/css_secure folder. I'm tried to kill cache but still its showing old CSS data. How to overcome to update my CSS. I am using Magento 1.9.2.2
2
votes
1answer
598 views

Magento 2 static content deploy error less

I Got this error in compilation [Magento\Framework\View\Asset\ContentProcessorException] Warning: Division by zero in /var/www/html/saaf/vendor/oyejorge/less.php/li b/Less/Functions.php on line ...
2
votes
3answers
2k views

Magento 2 CSS .less files with @variables

I'm having trouble changing the max-width of a theme in Magento 2. I've found the CSS in: <THEME>/web/css/source/_layout.less max-width: @layout__max-width; Then in the Magento Lib folder ...
2
votes
1answer
129 views

Magento 2 CSS - Trying to target home page only with .cms-home but styling affects other pages too

I am using the Magento 2.1.6 blank theme as a base for my own theme which is working correctly. However, I want to add CSS code to target the home page only and not affect any other pages. I have ...
2
votes
1answer
52 views

How to hide these 2 element in css / less?

In Magento2 I want to hide the price-notice and the qty-holder from the bundle product page. I want to edit the _custom.less page but not sure what to write in it. Any help would help. Thanks!
2
votes
1answer
22 views

What does it really mean to “extend” a style?

If the purpose of _extend.less in a custom theme is to "extend" a style, what does this really mean? Should it be used in the following cases: Change the value of an existing attribute of an existing ...
2
votes
2answers
627 views

Inline CSS file for custom email template in custom module not loading

I'm using Magento version 2.2.0 to create a custom email template for my custom extension, I need to add inline CSS to the email template, I've followed the instruction here , so my email template ...
2
votes
1answer
192 views

How to edit custom css and java script In Magento 2

How to change the less, css and java script In Magento 2? in check the style located in pub folder?. where i edit the styles?
2
votes
1answer
133 views

How to properly edit Magento 2 stylesheets? And what to do next to see it in the frontend?

I'm new to Magento 2.0. I purchased a theme and I want to edit some styles. I checked in the firebug it's showing url/pub/static/frontend/vendor_name/theme_name/en_US/css/styles-l.css I made some ...
2
votes
1answer
22 views

Magento 2.2.6 overriding css or less files or locating the actual file to edit

Not sure why i'm finding this so difficult but I have a file that has some css that needs to be fixed. The file and code are in these files: pub/static/frontend/website/mywebsite/en_US/css/styles-l....
2
votes
1answer
571 views

How to have the changes made in .less file be reflected on the website?

I'm trying to make some style changes to a .less file in a custom module. But even after making and saving the changes to the .less file, those changes are not being reflected on the website. I'm ...
2
votes
1answer
105 views

How to ad background image on header-panel

so, i am trying to customise my header-panel! i want add background image insted of background color!! inside my _theme.less file .page-header { .panel.wrapper { position: fixed; width: 100%...
2
votes
0answers
33 views

Magento2: css file modification does not apply

I am using Magento 2.2.4 and I need to design my website with the size of 70%. I am trying to override the css by a theme /custom_theme/web/css/style.css file as follows. But it didn't work. How to ...
2
votes
2answers
307 views

CSS Conflict in Megamenu and default Magento navigation menu

In my project, there is Megamenu implemented and to customization of Megamenu, I have used custom _module.less in my theme folder By overriding the Megamenu Folder. app->code->RB->Megamenu (...
2
votes
0answers
47 views

Adminthtml failing to compile

We have an ongoing issue with our styles.less file that prevents the css being generated for the Magento 2.1.8 back end. Whe i run the command bin/magento setup:static-content:deploy It throws ...
2
votes
0answers
179 views

2.2 Faster way to regenerate css in developer mode

In developer mode, static files are mostly symlinked so making changes is immediately visible in frontend. However, when making changes to CSS this is not the case. The minimal files I have to ...
2
votes
0answers
397 views

Disable hover on listing page on Magento-2

I have my custom theme using Luma as parent. I want to disable hover effect and show only "out of stock" message. How can I achieve this?
2
votes
1answer
317 views

Unable to fetch css in magento2 after magento2 upgrade [duplicate]

I update my Magento 2.0.1 to 2.1.6 and it updates successfully. The problem is from frontside CSS are not working correctly but in admin side, it is working good. What i do to update magento is ...
2
votes
4answers
123 views

Custom theme magento 2

I'm beginer and I want to custom my theme in sample data. But i can not find the class I want to custom css on source code. You can help me to check it. For example: I want to custom css for class ...
2
votes
1answer
956 views

How to remove lib-font-face from Magento 2

I've created a theme in Magento2 which inherits from the Luma theme. So it has inherited it's lib-font-face, which can be found in the styles-m.css @font-face { font-family: 'luma-icons'; src: ...
2
votes
2answers
682 views

How to Override my admin phtml and css file in my theme

How to Override my Admin PHTML, XML and LESS/CSS file in my theme. Any one have Idea ?
2
votes
2answers
1k views

Magento 2 and Client Side Less Compilation

I have stock Magento 2 installed and running with a custom theme that uses the 'blank' theme as its parent. My custom theme is active on my store and it works, I can create my own styles and template ...