1;(function () {// LICENSE_CODE ZON 2 'use strict'; /*jslint browser:true, es6:true, node:true, react:true*/function _typeof(o) {"@babel/helpers - typeof";return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) {return typeof o;} : function (o) {return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;}, _typeof(o);} 3 var define; 4 var is_node = (typeof module === "undefined" ? "undefined" : _typeof(module)) == 'object' && module.exports; 5 if (is_node) 6 define = require('../../../../util/require_node.js').define(module, '..');else 7 8 define = self.define; 9 define([], function () { 10 var E = {}; 11 E.intro = [['div', 12 [['h1', 13 ["CSS/LESS Coding Convention"], 14 { className: "title" }], 15 16 ['p', 17 [['b', 18 ["Improvements? Suggestions?"]], " email ", 19 20 21 ['a', 22 ["[email protected]"], 23 { href: "mailto:[email protected]" }], " "]]], 24 25 26 27 { className: "head" }]]; 28 29 E.data = [ 30 { 31 id: 'gen', 32 title: "General CSS", 33 tag: 'h2', 34 html: [] 35 }, 36 { 37 id: 'consistent_minimal', 38 title: "Consistent and Minimal", 39 tag: 'h3', 40 html: [['p', 41 [" Most important rules:", 42 ['br'], 43 ['a', 44 ["Be consistent"], 45 { href: "/dna/js_code#overview-consistent" }], ".", 46 47 48 ['br'], 49 ['a', 50 ["Be minimal"], 51 { href: "/dna/js_code#overview-minimal" }], ".", 52 53 54 ['br'], 55 ['a', 56 ["Use tools"], 57 { href: "/dna/js_code#overview-tool" }], ".", 58 59 60 ['br'], " Read these sections carefully. "]]] 61 62 63 }, 64 { 65 id: 'react', 66 title: "React", 67 tag: 'h2', 68 html: [] 69 }, 70 { 71 id: 'react-scope', 72 title: "Scope", 73 tag: 'h3', 74 html: [['p', 75 ["Write CSS per component."]], 76 77 ['pre', 78 ["let Btn = props=><a className=\"main_links\" href={props.href}>\n {props.children}</a>;\nlet Contact_link = props=><a className=\"main_links\" href={props.href}>\n {props.children}</a>;\n"], 79 80 81 82 83 { className: "cm-s-default code bad has-popover", 84 cat: "bad", 85 'data-content': "BAD", 86 'data-original-title': "", 87 title: "" }], 88 89 ['pre', 90 ["let Btn = props=><a className=\"btn\" href={props.href}>{props.children}</a>;\nlet Contact_link = props=><Btn {...props}/>;\n"], 91 92 93 { className: "cm-s-default code good has-popover", 94 cat: "good", 95 'data-content': "GOOD", 96 'data-original-title': "", 97 title: "" }], 98 99 ['pre', 100 [".btn {\n color: @dark_blue;\n}\n"], 101 102 103 104 { className: "cm-s-default code good has-popover", 105 cat: "good", 106 'data-content': "GOOD", 107 'data-original-title': "", 108 title: "" }], 109 110 ['p', 111 ["Keep the same syling wherever the component is used: don't nest\n component CSS inside a different component."]], 112 113 114 ['pre', 115 [".main_page {\n .btn {\n color: @white;\n }\n}\n"], 116 117 118 119 120 121 { className: "cm-s-default code bad has-popover", 122 cat: "bad", 123 'data-content': "BAD", 124 'data-original-title': "", 125 title: "" }], 126 127 ['pre', 128 [".main_page {\n color: @white;\n}\n.btn {\n color: @dark_blue;\n .btn-main {\n color: @white;\n }\n}\n"], 129 130 131 132 133 134 135 136 137 138 { className: "cm-s-default code good has-popover", 139 cat: "good", 140 'data-content': "GOOD", 141 'data-original-title': "", 142 title: "" }]] 143 144 }, 145 { 146 id: 'react-flat', 147 title: "Flat", 148 tag: 'h3', 149 html: [['p', 150 [" Make all component CSS global. A component should look the\n same in on any page in and inside any other component. "]], 151 152 153 ['pre', 154 [".main_page {\n .btn {\n color: @dark_blue;\n }\n}\n"], 155 156 157 158 159 160 { className: "cm-s-default code bad has-popover", 161 cat: "bad", 162 'data-content': "BAD", 163 'data-original-title': "", 164 title: "" }], 165 166 ['pre', 167 [".btn {\n color: @dark_blue;\n}\n"], 168 169 170
171 { className: "cm-s-default code good has-popover", 172 cat: "good", 173 'data-content': "GOOD", 174 'data-original-title': "", 175 title: "" }], 176 177 ['p', 178 [" Nest component sub-classes inside the component less to group\n the definitions together. "]], 179 180 181 ['pre', 182 [".btn {\n padding: 5px;\n}\n.btn-text {\n color: @dark_blue;\n}\n"], 183 184 185 186 187 188 189 { className: "cm-s-default code bad has-popover", 190 cat: "bad", 191 'data-content': "BAD", 192 'data-original-title': "", 193 title: "" }], 194 195 ['pre', 196 [".btn {\n padding: 5px;\n .btn-text {\n color: @dark_blue;\n }\n}\n"], 197 198 199 200 201 202 203 { className: "cm-s-default code good has-popover", 204 cat: "good", 205 'data-content': "GOOD", 206 'data-original-title': "", 207 title: "" }], 208 209 ['p', 210 [" Inside a component's class keep it flat - only one level of\n nesting. "]], 211 212 213 ['pre', 214 [".btn {\n padding: 5px;\n .btn-left {\n float: left;\n .btn-text {\n color: @dark_blue;\n }\n }\n}\n"], 215 216 217 218 219 220 221 222 223 224 { className: "cm-s-default code bad has-popover", 225 cat: "bad", 226 'data-content': "BAD", 227 'data-original-title': "", 228 title: "" }], 229 230 ['pre', 231 [".btn {\n padding: 5px;\n .btn-left {\n float: left;\n\n }\n .btn-text {\n color: @dark_blue;\n }\n}\n"], 232 233 234 235 236 237 238 239 240 241 242 { className: "cm-s-default code good has-popover", 243 cat: "good", 244 'data-content': "GOOD", 245 'data-original-title': "", 246 title: "" }]] 247 248 }, 249 { 250 id: 'react-naming', 251 title: "Naming", 252 tag: 'h3', 253 html: [['p', 254 ["Use ", 255 ['a', 256 ["Unix notation"], 257 { href: "/dna/tree_code#name-unix" }], " for naming"]], 258 259 260 261 ['pre', 262 [".startButton {\n color: @white;\n}\n"], 263 264 265 266 { className: "cm-s-default code bad has-popover", 267 cat: "bad", 268 'data-content': "BAD", 269 'data-original-title': "", 270 title: "" }], 271 272 ['pre', 273 [".start-button {\n color: @white;\n}\n"], 274 275 276 277 { className: "cm-s-default code bad has-popover", 278 cat: "bad", 279 'data-content': "BAD", 280 'data-original-title': "", 281 title: "" }], 282 283 ['pre', 284 [".start_button {\n color: @white;\n}\n"], 285 286 287 288 { className: "cm-s-default code good has-popover", 289 cat: "good", 290 'data-content': "GOOD", 291 'data-original-title': "", 292 title: "" }], 293 294 ['p', 295 ["Use the same name as the react component"]], 296 297 ['pre', 298 ["let Btn = props=><a className=\"button_round\" href={props.href}>\n {props.children}</a>;\n"], 299 300 301 { className: "cm-s-default code bad has-popover", 302 cat: "bad", 303 'data-content': "BAD", 304 'data-original-title': "", 305 title: "" }], 306 307 ['pre', 308 ["let Btn = props=><a className=\"btn\" href={props.href}>\n {props.children}</a>;\n"], 309 310 311 { className: "cm-s-default code good has-popover", 312 cat: "good", 313 'data-content': "GOOD", 314 'data-original-title': "", 315 title: "" }], 316 317 ['p', 318 ["Use parent class name to prefix inner class names to pervent\n collisions."]], 319 320 321 ['pre', 322 [".btn {\n .text {\n color: @white;\n }\n}\n"], 323 324 325 326 327 328 { className: "cm-s-default code bad has-popover", 329 cat: "bad", 330 'data-content': "BAD", 331 'data-original-title': "", 332 title: "" }], 333 334 ['pre', 335 [".btn {\n .btn-text {\n color: @white;\n }\n}\n"], 336 337 338 339 340 341 { className: "cm-s-default code good has-popover", 342 cat: "good", 343 'data-content': "GOOD", 344 'data-original-title': "", 345 title: "" }], 346 347 ['p', 348 ["Use dash \"-\" as a delimiter between prefixes."]], 349 350 ['pre', 351 [".btn {\n .btn_text {\n color: @white;\n }\n}\n"], 352 353 354 355 356 357 { className: "cm-s-default code bad has-popover", 358 cat: "bad", 359 'data-content': "BAD", 360 'data-original-title': "", 361 title: "" }], 362 363 ['pre', 364 [".btn {\n .btn-text {\n color: @white;\n }\n}\n"], 365 366 367 368 369
370 { className: "cm-s-default code good has-popover", 371 cat: "good", 372 'data-content': "GOOD", 373 'data-original-title': "", 374 title: "" }], 375 376 ['p', 377 ["Use \"sc_\" as a prefix for sections."]], 378 379 ['pre', 380 ["let Many_ips = props=><Section className=\"many_ips\">\n <h2>title</h2></Section>;\n"], 381 382 383 { className: "cm-s-default code bad has-popover", 384 cat: "bad", 385 'data-content': "BAD", 386 'data-original-title': "", 387 title: "" }], 388 389 ['pre', 390 ["let Many_ips = props=><Section className=\"sc_many_ips\">\n <h2>title</h2></Section>;\n"], 391 392 393 { className: "cm-s-default code good has-popover", 394 cat: "good", 395 'data-content': "GOOD", 396 'data-original-title': "", 397 title: "" }], 398 399 ['p', 400 ["Do not use \"ad-\" prefix for class names. Such items can be\n removed by ad blockers. Check that your code works with the\n ad blockers enabled."]], 401 402 403 404 ['pre', 405 [".ad-text {\n color: @white;\n}\n"], 406 407 408 409 { className: "cm-s-default code bad has-popover", 410 cat: "bad", 411 'data-content': "BAD", 412 'data-original-title': "", 413 title: "" }], 414 415 ['pre', 416 [".item-text {\n color: @white;\n}\n"], 417 418 419 420 { className: "cm-s-default code good has-popover", 421 cat: "good", 422 'data-content': "GOOD", 423 'data-original-title': "", 424 title: "" }]] 425 426 }, 427 { 428 id: 'html', 429 title: "HTML", 430 tag: 'h2', 431 html: [['p', 432 ["TBD"]]] 433 434 }]; 435 436 return E; 437 });})(); 438//# sourceMappingURL=css_code.js.map
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.