Titulo
Enlace permanente
Contenido
Old | New |
---|
1 | | 1 | # Stylesheets
|
---|
| | 2 |
|
---|
| | 3 | Stylesheets are visually related components located in the template folders of LiteCart (`includes/templates/`).
|
---|
| | 4 |
|
---|
| | 5 | LiteCart comes with both a set of **LESS** and **CSS** files of stylesheets.
|
---|
| | 6 |
|
---|
| | 7 |
|
---|
| | 8 | ## Do I Use LESS or CSS?
|
---|
| | 9 |
|
---|
| | 10 | When installing LiteCart you can choose between ".css" or ".less + .min.css". This is simply just what you prefer.
|
---|
| | 11 |
|
---|
| | 12 | LESS simply makes the work with stylesheets better organized. Wikipedia has an article about the benefits of LESS. But LESS requires a compiler to generate .css files, because browsers do not understand the LESS format. A web compiler for LESS to CSS is available in the add-ons store, called Developer Kit.
|
---|
| | 13 |
|
---|
| | 14 | If you don't want to work with LESS, you can simply select CSS when installing LiteCart.
|
---|
| | 15 |
|
---|
| | 16 | ## How Do I Know Which LESS or CSS File To Edit?
|
---|
| | 17 |
|
---|
| | 18 | 1. Press F12 to open the developer console window in your browser and reload the page. (This is for .less users to resolve map files content.)
|
---|
| | 19 | 2. Right click an element and select Inspect Element.
|
---|
| | 20 | 3. On the right side the developer tools will show you the current stylings of an element and in which .css file (or .less) and line number it can be found. E.g. app.css:123 means line 123 in app.css.
|
---|
| | 21 |
|
---|
| | 22 | Please note: If you are a ".less + .min.css" user. Browsers need a .map file for cross referencing a compiled .min.css back to the source .less file. For your best convenience, make sure your LESS to CSS compiler generates .map files. |
---|
Editado por tim el 28 dic. 2023 a las 05:59