File: test.mss.dark.html

package info (click to toggle)
kf6-syntax-highlighting 6.13.0-1
  • links: PTS, VCS
  • area: main
  • in suites: forky, trixie
  • size: 47,568 kB
  • sloc: xml: 197,750; cpp: 12,850; python: 3,023; sh: 955; perl: 546; ruby: 488; pascal: 393; javascript: 161; php: 150; jsp: 132; lisp: 131; haskell: 124; ada: 119; ansic: 107; makefile: 96; f90: 94; ml: 85; cobol: 81; yacc: 71; csh: 62; erlang: 54; sql: 51; java: 47; objc: 37; awk: 31; asm: 30; tcl: 29; fortran: 18; cs: 10
file content (121 lines) | stat: -rw-r--r-- 23,265 bytes parent folder | download | duplicates (2) 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
 
<!DOCTYPE html>
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>test.mss</title>
<meta name="generator" content="KF5::SyntaxHighlighting - Definition (CartoCSS MSS) - Theme (Breeze Dark)"/>
</head><body style="background-color:#232629;color:#cfcfc2"><pre>
<span style="color:#7a7c7d">/* </span><span style="color:#3f8058">kate:</span><span style="color:#7a7c7d"> </span><span style="color:#7f8c8d">hl</span><span style="color:#f44f4f"> CartoCSS</span>
<span style="color:#7a7c7d">   This file contains some content coming from</span>
<span style="color:#7a7c7d">   https://github.com/gravitystorm/openstreetmap-carto</span>
<span style="color:#7a7c7d">   with CC0 license. This file is just for testing</span>
<span style="color:#7a7c7d">   katepart highlighting engine.</span>
<span style="color:#7a7c7d">   */</span>

<span style="color:#7a7c7d">/* This is</span>
<span style="color:#7a7c7d">a multiline comment. */</span>

<span style="color:#7a7c7d">// This is a single-line comment.</span>

#world <span style="color:#3f8058">{</span>
    <span style="color:#7a7c7d">// various styles to define colors (all except the color function are rendered the same way):</span>
    <span style="color:#7a7c7d">// Numbers are always treated as floating-point and highlighted. This syntax</span>
    polygon-opacity<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#f67400">50%</span><span style="color:#3f8058">;</span>
    <span style="color:#7a7c7d">// is equivalent to</span>
    polygon-opacity<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#f67400">0.5</span><span style="color:#3f8058">;</span>
    <span style="color:#7a7c7d">// This is a coma-separated list of numbers:</span>
    line-dasharray<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#f67400">6</span><span style="color:#3f8058">,</span><span style="color:#f67400">3</span><span style="color:#3f8058">,</span><span style="color:#f67400">2</span><span style="color:#3f8058">,</span><span style="color:#f67400">3</span><span style="color:#3f8058">,</span><span style="color:#f67400">2</span><span style="color:#3f8058">,</span><span style="color:#f67400">3</span><span style="color:#3f8058">;</span>
    <span style="color:#7a7c7d">// Also function calls are possible. Function calls like “url” get special highlighting:</span>
    shield-file<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#8e44ad">url</span><span style="color:#3f8058">(</span><span style="color:#da4453">"myfile.svg"</span><span style="color:#3f8058">);</span>
    <span style="color:#7a7c7d">// Within function calls, strings can contains fields like [width] which get special highlighting:</span>
    shield-file<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#8e44ad">url</span><span style="color:#3f8058">(</span><span style="color:#da4453">"symbols/shields/motorway_</span><span style="color:#27aeae">[width]</span><span style="color:#da4453">x</span><span style="color:#27aeae">[height]</span><span style="color:#da4453">.svg"</span><span style="color:#3f8058">);</span>
    polygon-fill<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#27aeae;font-weight:bold">white</span><span style="color:#3f8058">;</span> <span style="color:#7a7c7d">// List of known colors</span>
    polygon-fill<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#27aeae;font-weight:bold">#ffffff</span><span style="color:#3f8058">;</span> <span style="color:#7a7c7d">// Six-digit hex color</span>
    polygon-fill<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#27aeae;font-weight:bold">#fff</span><span style="color:#3f8058">;</span> <span style="color:#7a7c7d">// Three-digit hex color</span>
    polygon-fill<span style="color:#3f8058">:</span><span style="font-weight:bold"> #ffff</span><span style="color:#3f8058">;</span> <span style="color:#7a7c7d">// Invalid hex color</span>
    polygon-fill<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#8e44ad">rgba</span><span style="color:#3f8058">(</span><span style="color:#f67400">255</span><span style="color:#3f8058">,</span><span style="color:#f67400">255</span><span style="color:#3f8058">,</span><span style="color:#f67400">255</span><span style="color:#3f8058">,</span><span style="color:#f67400">1</span><span style="color:#3f8058">);</span> <span style="color:#7a7c7d">// define a color by a special function</span>
    <span style="color:#7a7c7d">// everything else is simply interpreted as keyword:</span>
    line-clip<span style="color:#3f8058">:</span><span style="font-weight:bold"> false</span><span style="color:#3f8058">;</span>
    line-clip<span style="color:#3f8058">:</span><span style="font-weight:bold"> abcdef</span><span style="color:#3f8058">;</span>
<span style="color:#3f8058">}</span>

<span style="color:#7a7c7d">// You can define macros called “CartoCSS variables” with arbitrary values and types.</span>
<span style="color:#7a7c7d">// They do not behave much like variable, but more like macros.</span>
<span style="color:#27ae60">@myvariable</span><span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#f67400">15</span><span style="color:#3f8058">;</span>
<span style="color:#27ae60">@myvariable</span><span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#27aeae;font-weight:bold">#123456</span><span style="color:#3f8058">;</span>
<span style="color:#27ae60">@myvariable</span><span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#27aeae;font-weight:bold">white</span><span style="color:#3f8058">;</span>
<span style="color:#27ae60">@myothervariable</span><span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#27ae60">@myvariable</span><span style="color:#3f8058">;</span> <span style="color:#7a7c7d">// this variable gets defined by the value of another variable</span>
<span style="color:#27ae60">@myvariable</span><span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#8e44ad">darken</span><span style="color:#3f8058">(</span><span style="color:#27aeae;font-weight:bold">white</span><span style="color:#3f8058">,</span><span style="font-weight:bold"> </span><span style="color:#f67400">5%</span><span style="color:#3f8058">);</span> <span style="color:#7a7c7d">// A variable defined by the result of a function. The function “darken” gets special highlighting.</span>
<span style="color:#7a7c7d">// Variables can also contain strings:</span>
<span style="color:#27ae60">@myvariable</span><span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#da4453">'abc'</span><span style="color:#3f8058">;</span>

<span style="color:#7a7c7d">// These variables can be used later as values</span>
#world <span style="color:#3f8058">{</span>
    polygon-fill<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#27ae60">@myvariable</span><span style="color:#3f8058">;</span>
<span style="color:#3f8058">}</span>

<span style="color:#7a7c7d">/* Typically, in MSS files you declare filters like “#world[zoom >= 17]”</span>
<span style="color:#7a7c7d">followed by curly braces with parameters like “size” for Mapnik symbolizers like “text”. */</span>

<span style="color:#7a7c7d">// Each Mapnik symbolizer parameter can be on its own line:</span>
#world<span style="color:#3f8058">[</span><span style="font-weight:bold">zoom</span><span style="color:#27aeae"> </span><span style="color:#3f8058">>=</span><span style="font-weight:bold"> </span><span style="color:#f67400">17</span><span style="color:#3f8058">]</span> <span style="color:#3f8058">{</span>
  text-wrap-width<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#f67400">20</span><span style="color:#3f8058">;</span>
  text-size<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#f67400">11</span><span style="color:#3f8058">;</span>
<span style="color:#3f8058">}</span>
<span style="color:#7a7c7d">// Or you can put various of them into the same line:</span>
#world<span style="color:#3f8058">[</span><span style="font-weight:bold">zoom</span><span style="color:#27aeae"> </span><span style="color:#3f8058">>=</span><span style="font-weight:bold"> </span><span style="color:#f67400">19</span><span style="color:#3f8058">]</span> <span style="color:#3f8058">{</span> text-wrap-width<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#f67400">20</span><span style="color:#3f8058">;</span> text-size<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#f67400">11</span><span style="color:#3f8058">;</span> <span style="color:#3f8058">}</span>

<span style="color:#7a7c7d">// It is allowed to omit the final “;” for the last Mapnik symbolizer parameter within a block:</span>
#world<span style="color:#3f8058">[</span><span style="font-weight:bold">zoom</span><span style="color:#27aeae"> </span><span style="color:#3f8058">>=</span><span style="font-weight:bold"> </span><span style="color:#f67400">19</span><span style="color:#3f8058">]</span> <span style="color:#3f8058">{</span> text-wrap-width<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#f67400">20</span><span style="color:#3f8058">;</span> text-size<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#f67400">11</span><span style="font-weight:bold"> </span><span style="color:#3f8058">}</span>
<span style="color:#7a7c7d">// Also after an omitted final “;” the following code is nevertheless highlighted correctly:</span>
#world<span style="color:#3f8058">[</span><span style="font-weight:bold">zoom</span><span style="color:#27aeae"> </span><span style="color:#3f8058">>=</span><span style="font-weight:bold"> </span><span style="color:#f67400">19</span><span style="color:#3f8058">]</span> <span style="color:#3f8058">{</span> text-wrap-width<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#f67400">20</span><span style="color:#3f8058">;</span> text-size<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#f67400">11</span><span style="font-weight:bold"> </span><span style="color:#3f8058">;</span> <span style="color:#3f8058">}</span>
<span style="color:#7a7c7d">// “null” and “zoom” are special keywords within filters, and highlighted as such:</span>
<span style="color:#3f8058">[</span><span style="color:#27aeae">"name" </span><span style="color:#3f8058">!=</span><span style="font-weight:bold"> null</span><span style="color:#3f8058">][</span><span style="color:#27aeae">"ref" </span><span style="color:#3f8058">=</span><span style="font-weight:bold"> null</span><span style="color:#3f8058">][</span><span style="font-weight:bold">zoom</span><span style="color:#27aeae"> </span><span style="color:#3f8058">>=</span><span style="font-weight:bold"> </span><span style="color:#f67400">19</span><span style="color:#3f8058">]</span> <span style="color:#3f8058">{</span> text-wrap-width<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#f67400">20</span><span style="color:#3f8058">;</span> <span style="color:#3f8058">}</span>

#admin-low-zoom<span style="color:#3f8058">[</span><span style="font-weight:bold">zoom</span><span style="color:#27aeae"> </span><span style="color:#3f8058">&lt;</span><span style="font-weight:bold"> </span><span style="color:#f67400">11</span><span style="color:#3f8058">]</span>, <span style="color:#7a7c7d">// You can make coma-separated lists of various filters</span>
#admin-mid-zoom<span style="color:#3f8058">[</span><span style="font-weight:bold">zoom</span><span style="color:#27aeae"> </span><span style="color:#3f8058">>=</span><span style="font-weight:bold"> </span><span style="color:#f67400">11</span><span style="color:#3f8058">][</span><span style="font-weight:bold">zoom</span><span style="color:#27aeae"> </span><span style="color:#3f8058">&lt;</span><span style="font-weight:bold"> </span><span style="color:#f67400">13</span><span style="color:#3f8058">]</span>, <span style="color:#7a7c7d">// like this one.</span>
#admin-high-zoom<span style="color:#3f8058">[</span><span style="font-weight:bold">zoom</span><span style="color:#27aeae"> </span><span style="color:#3f8058">>=</span><span style="font-weight:bold"> </span><span style="color:#f67400">13</span><span style="color:#3f8058">]</span> <span style="color:#3f8058">{</span>
  <span style="color:#3f8058">[</span><span style="font-weight:bold">zoom</span><span style="color:#27aeae"> </span><span style="color:#3f8058">=</span><span style="font-weight:bold"> </span><span style="color:#f67400">15</span><span style="color:#3f8058">]</span> <span style="color:#7a7c7d">// “zoom” has special behaviour within filters and gets its own highlighting</span>
  <span style="color:#3f8058">[</span><span style="color:#27aeae">admin_level </span><span style="color:#3f8058">=</span><span style="font-weight:bold"> </span><span style="color:#f44f4f">'2'</span><span style="color:#3f8058">]</span>, <span style="color:#7a7c7d">// data fields like “admin_level” can be referenced by their name and get highlighting as data fields</span>
  <span style="color:#3f8058">[</span><span style="color:#27aeae">"admin_level" </span><span style="color:#3f8058">=</span><span style="font-weight:bold"> </span><span style="color:#f44f4f">'2'</span><span style="color:#3f8058">]</span>, <span style="color:#7a7c7d">// data fields like “admin_level” can be referenced by their name in quotes and get highlighting as data fields</span>
  <span style="color:#3f8058">[</span><span style="color:#27aeae">admin_level </span><span style="color:#3f8058">=</span><span style="font-weight:bold"> </span><span style="color:#f44f4f">'3'</span><span style="color:#3f8058">]</span> <span style="color:#3f8058">{</span>
    <span style="color:#3f8058">[</span><span style="font-weight:bold">zoom</span><span style="color:#27aeae"> </span><span style="color:#3f8058">>=</span><span style="font-weight:bold"> </span><span style="color:#f67400">4</span><span style="color:#3f8058">]</span> <span style="color:#3f8058">{</span>
      <span style="color:#7a7c7d">// You can create additional “Named instances” of Mapnik symbolizers by adding a “myname/” before the symbolizer.</span>
      <span style="color:#7a7c7d">// The name of the named instance gets special highlighting:</span>
      <span style="color:#2980b9">background/</span>line-color<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#27aeae;font-weight:bold">white</span><span style="color:#3f8058">;</span>
      line-color<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#27ae60">@admin-boundaries</span><span style="color:#3f8058">;</span>
    <span style="color:#3f8058">}</span>
  <span style="color:#3f8058">}</span>
<span style="color:#3f8058">}</span>

#admin-mid-zoom<span style="color:#3f8058">[</span><span style="font-weight:bold">zoom</span><span style="color:#27aeae"> </span><span style="color:#3f8058">>=</span><span style="font-weight:bold"> </span><span style="color:#f67400">11</span><span style="color:#3f8058">][</span><span style="font-weight:bold">zoom</span><span style="color:#27aeae"> </span><span style="color:#3f8058">&lt;</span><span style="font-weight:bold"> </span><span style="color:#f67400">13</span><span style="color:#3f8058">]</span> <span style="color:#3f8058">{</span>
  <span style="color:#3f8058">[</span><span style="color:#27aeae">admin_level </span><span style="color:#3f8058">=</span><span style="font-weight:bold"> </span><span style="color:#f44f4f">'abc'</span><span style="color:#3f8058">]</span> <span style="color:#3f8058">{</span> <span style="color:#7a7c7d">// The string 'abc' is highlighted as a verbatim string, not as an expression string.</span>
    <span style="color:#3f8058">[</span><span style="font-weight:bold">zoom</span><span style="color:#27aeae"> </span><span style="color:#3f8058">>=</span><span style="font-weight:bold"> </span><span style="color:#f67400">4</span><span style="color:#3f8058">]</span> <span style="color:#3f8058">{</span>
      text-name<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#27aeae">[test]</span><span style="color:#3f8058">;</span> <span style="color:#7a7c7d">// simplified reference to the value of the data field “test”</span>
      text-name<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#da4453">"</span><span style="color:#27aeae">[test]</span><span style="color:#da4453">"</span><span style="color:#3f8058">;</span> <span style="color:#7a7c7d">// another reference to the data field “test”, this time within an expression string</span>
      <span style="color:#7a7c7d">// A rather complex expression string that will do some math; @zoom is a special runtime value (in spite</span>
      <span style="color:#7a7c7d">// of the @ it has nothing to do with ordinary variables):</span>
      text-size<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#da4453">"(</span><span style="color:#27aeae">[way_area]</span><span style="color:#da4453">*pow(4,</span><span style="color:#3daee9">@zoom</span><span style="color:#da4453">)/24505740000)"</span><span style="color:#3f8058">;</span>
      <span style="color:#7a7c7d">// Here the same thing as simple expression:</span>
      <span style="color:#7a7c7d">// Note that @zoom now is highlighted in another color, because in this context it does not reference to a</span>
      <span style="color:#7a7c7d">// runtime variable anymore, but to an ordinary CartoCSS variable:</span>
      text-size<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#3f8058">(</span><span style="color:#27aeae">[way_area]</span><span style="color:#3f8058">*</span><span style="color:#8e44ad">pow</span><span style="color:#3f8058">(</span><span style="color:#f67400">4</span><span style="color:#3f8058">,</span><span style="color:#27ae60">@zoom</span><span style="color:#3f8058">)/</span><span style="color:#f67400">24505740000</span><span style="color:#3f8058">);</span>
      text-name<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#da4453">"</span><span style="color:#f44f4f">'Value: '</span><span style="color:#27aeae">[test]</span><span style="color:#da4453">"</span><span style="color:#3f8058">;</span> <span style="color:#7a7c7d">// A verbatim string 'Value: ' as part of an expression string.</span>
      text-name<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#da4453">'</span><span style="color:#f44f4f">"Value: "</span><span style="color:#27aeae">[test]</span><span style="color:#da4453">'</span><span style="color:#3f8058">;</span> <span style="color:#7a7c7d">// " and ' are interchangeable. The outer is always the expression string and the inner the verbatim string.</span>
      text-name<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#da4453">"</span><span style="color:#27aeae">[field]</span><span style="color:#da4453">\n"</span><span style="color:#3f8058">;</span> <span style="color:#7a7c7d">// Expression strings however do not have escape sequences, so \n gets no special highlighting here. [field] however is highlighted as data field.</span>
      text-name<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#da4453">"</span><span style="color:#27aeae">[field]</span><span style="color:#da4453">+</span><span style="color:#f44f4f">'</span><span style="color:#3daee9">\n</span><span style="color:#f44f4f">'</span><span style="color:#da4453">+</span><span style="color:#27aeae">[otherfield]</span><span style="color:#da4453">"</span><span style="color:#3f8058">;</span> <span style="color:#7a7c7d">// Inner strings, here the single-quoted string, are normal strings and highlight escape sequences like \n.</span>
      text-name<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#da4453">"</span><span style="color:#27aeae">[field]</span><span style="color:#da4453">+</span><span style="color:#f44f4f">'[testfield]'</span><span style="color:#da4453">+</span><span style="color:#27aeae">[otherfield]</span><span style="color:#da4453">"</span><span style="color:#3f8058">;</span> <span style="color:#7a7c7d">// Inner strings, here the single-quoted string, are normal strings and do not highlight any fields like [testfield].</span>
      text-name<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#27aeae">[name]</span><span style="font-weight:bold"> </span><span style="color:#3f8058">+</span><span style="font-weight:bold"> </span><span style="color:#3f8058">/*</span><span style="font-weight:bold"> Comments are not allowed within expressions</span><span style="color:#3f8058">,</span><span style="font-weight:bold"> so no special comment highlighting here. </span><span style="color:#3f8058">*/</span><span style="font-weight:bold"> </span><span style="color:#da4453">"\n"</span><span style="font-weight:bold"> </span><span style="color:#3f8058">+</span><span style="font-weight:bold"> </span><span style="color:#27aeae">[ref]</span><span style="color:#3f8058">;</span>
    <span style="color:#3f8058">}</span>
  <span style="color:#3f8058">}</span>
<span style="color:#3f8058">}</span>

.nature <span style="color:#3f8058">{</span> <span style="color:#7a7c7d">// .nature references a class, which is similar to a layer like #nature, so both are rendered the same way</span>
    <span style="color:#fdbc4b;font-weight:bold">::fill</span> <span style="color:#3f8058">{</span>
        <span style="color:#7a7c7d">/* The :: syntax defined “attachments” (a sort of sub-layer within normal layers), here “::fill”.</span>
<span style="color:#7a7c7d">        Everything that is defined within an attachment is applied in the order of the first occurrence</span>
<span style="color:#7a7c7d">        of the attachment, instead of following the normal appliance order. Therefore attachments are</span>
<span style="color:#7a7c7d">        highlighted as dsControlFlow by default. */</span>
        opacity<span style="color:#3f8058">:</span><span style="font-weight:bold"> </span><span style="color:#f67400">0.05</span><span style="color:#3f8058">;</span>
    <span style="color:#3f8058">}</span>
<span style="color:#3f8058">}</span>
</pre></body></html>