STYL

GISBox is a one-stop 3D GIS data editing, conversion and publishing platform that supports editing in multiple GIS formats such as OSGB/GEOTIFF/RVT, converting to 3DTiles/Terrain and publishing.

Introduction

STYL files are the file format used by the Stylus preprocessor, which is a CSS preprocessor designed to improve the readability and maintainability of CSS. It uses a more concise and flexible syntax, supports indented syntax, omits symbols such as braces and semicolons, and makes style sheets clearer and easier to write. STYL files usually have a “.styl” file extension.

File Structure

File header: usually contains some comments to explain the purpose of the file, version information, author, etc.
Style rules: Contains the definition of selectors, attributes and values, as well as Stylus-specific syntax elements such as variables, mixins, and nested rules.
**Import and inheritance: **You can use the @import statement to import other STYL files or CSS files to achieve style reuse and modularization. At the same time, it also supports style inheritance, that is, a selector can inherit the style of another selector.

Pros

1. Concise syntax: The syntax of STYL files is more concise and compact than native CSS, supports indented syntax, omits symbols such as braces and semicolons, and improves the readability and maintainability of the code.

2. Variables and mixins: STYL files support variables and mixins, which can define and reuse some common values and style patterns in style sheets, reduce duplicate code and improve code maintainability.

3. Nested rules: STYL files allow style rules to be nested, which can more clearly express the hierarchical relationship between styles, reduce the nesting level, and improve the readability of the code.

4. Function support: In addition to variables and mixins, STYL files also support functions. Some logic and algorithms can be written in the style sheet to generate styles, making the style sheet more flexible and powerful.

5. Automatically handle compatibility: STYL files can automatically handle compatibility issues such as browser prefixes, reducing the burden on developers.

Cons

1. Relatively weak community support: Since Stylus is a relatively new tool, although it has certain community support, it may not be as mature and complete as preprocessors such as CSS or Sass.

2. Learning curve: For beginners, the concise syntax of STYL files may take some time to adapt and learn.

3. Compilation requirements: STYL files need to be compiled into standard CSS files in order to be understood and rendered by browsers, which requires the use of additional build tools or processes.

Application Scenario

For projects that require rapid iteration and frequent style changes, STYL files provide a more efficient and concise way of writing, which can greatly save development time. For developers who pursue concise and easy-to-read code, the syntax of STYL files is more concise and compact, making the style sheet clearer and easier to understand.

Example

STYL file example.

File Opening Mode

Open the STYL file in VSCode.