Web Dev Solutions

Catalin Mititiuc

polygon { fill: inherit; stroke: inherit; stroke-width: 0.25px; } svg { border: 1px solid slategray; fill: none; } use[href="#hex"] { stroke: #666; /* fill: wheat; */ /* fill: navajowhite; */ /* fill: url(#asterisk); */ } .building .doors { display: inline; fill: none; fill-opacity: 1; stroke: white; stroke-width: 2.25px; stroke-linecap: square; stroke-dasharray: none; stroke-opacity: 1; } .building .door-edges, .building .windows { display: inline; stroke: #ff9900; stroke-width: 2.5px; } .building .floor, .terrain .floor { display: inline; opacity: 1; /* fill: #ffffff; */ /* fill-opacity: 0.5; */ /* fill: url(#asterisk); */ stroke: none; } .building .inner-wall { display: inline; fill: none; stroke: #ffffff; stroke-width: 1; stroke-linecap: square; } .building .outer-wall { display: inline; fill: none; stroke: #000000; stroke-width: 2; stroke-linecap: square; } .building [class*="elevation-"] { display: none; } .building use.floor { fill: gray; display: inline; } [data-view-elevation="-1"] [class*="elevation"] { display: none; } [data-view-elevation="-1"] #background { fill: #999; } [data-view-elevation="-1"] .building .elevation-basement, [data-view-elevation="-1"] .elevation-basement + text.elevation { display: inline; } [data-view-elevation="-1"] .terrain { display: none; } [data-view-elevation="0"] .building .elevation-0 { display: inline; } [data-view-elevation="-1"] .building use.floor { display: none; } [data-view-elevation="-1"] .building use.floor.elevation-basement { fill: white; display: inline; } [data-view-elevation="0"] .building use.floor.elevation-0 { fill: white; } [data-view-elevation="1"] .building .elevation-1 { display: inline; } [data-view-elevation="1"] .building use.floor.elevation-1 { fill: white; } [data-view-elevation="2"] .building .elevation-2 { display: inline; } [data-view-elevation="2"] .building use.floor.elevation-2 { fill: white; } [data-view-elevation="3"] .building .elevation-3 { display: inline; } [data-view-elevation="3"] .building use.floor.elevation-3 { fill: white; } #tree .trunk { fill: brown; } #tree .branches { fill: rgb(141, 202, 141); stroke: green; } #bush { fill: rgb(141, 202, 141); stroke: green; stroke-width: 0.5px; transform: scale(0.9); }