| index : btroops | |
| Virtual board game-aid for BattleTroops, an infantry combat simulator wargame published by FASA in 1989. |
| aboutsummaryrefslogtreecommitdiff |
diff options
| author | Catalin Mititiuc <webdevcat@proton.me> | 2024-06-17 18:27:41 -0700 |
|---|---|---|
| committer | Catalin Mititiuc <webdevcat@proton.me> | 2024-06-17 18:27:41 -0700 |
| commit | e627dfc3a9254c4aed5f26bd16aa4647035b5c8a (patch) | |
| tree | fcbdd999e3767bf48d2505823acb9386fa405ea7 /public | |
| parent | 5e05d00197bc617128a596c881e40c117c90055e (diff) | |
Add a building
Diffstat (limited to 'public')
| -rw-r--r-- | public/radial.html | 185 |
1 files changed, 136 insertions, 49 deletions
diff --git a/public/radial.html b/public/radial.html index 9dbee63..784040e 100644 --- a/public/radial.html +++ b/public/radial.html @@ -1,52 +1,139 @@ <!DOCTYPE html> <html> - <head> - <style> - polygon { - fill: inherit; - stroke: black; - stroke-width: 0.5px; - } - - svg { - border: 1px solid slategray; - fill: none; - } - - text { - font-size: 4px; - text-anchor: middle; - user-select: none; - font-family: sans-serif; - fill: black; - } - - .buildings .elevation-basement { - fill: lightgray; - /* display: none; */ - } - - .elevation-1 { - /* display: none; */ - } - - .buildings .elevation-1 { - fill: lightgreen; - /* display: none; */ - } - - .buildings .elevation-2 { - fill: lightpink; - display: none; - } - </style> - </head> - <body> - <svg viewBox="-300 -200 600 400" xmlns="http://www.w3.org/2000/svg"> - <defs> - <polygon id="hex" points="0,10 8.66,5 8.66,-5 0,-10 -8.66,-5 -8.66,5"/> - </defs> - </svg> - <script src="radial.js"></script> - </body> + +<head> + <style> + polygon { + fill: inherit; + stroke: #999; + stroke-width: 0.25px; + } + + svg { + border: 1px solid slategray; + fill: none; + } + + text { + font-size: 4px; + text-anchor: middle; + user-select: none; + font-family: sans-serif; + fill: black; + display: none; + } + + .elevation-basement { + fill: lightgray; + display: none; + } + + .elevation-1 { + /* filter: blur(.5px); + opacity: 0.25; */ + } + + .buildings .elevation-1, + .building .elevation-1 { + /* display: none; */ + fill: lightgreen; + } + + .elevation-2 { + fill: rgb(240, 216, 172); + display: none; + } + + .elevation-roof { + display: none; + } + + .building .doors { + display: inline; + fill: none; + fill-opacity: 1; + stroke: #ff9900; + stroke-width: 2.5; + stroke-linecap: square; + stroke-dasharray: none; + stroke-opacity: 1; + } + + .building .floor { + opacity: 1; + fill: #ffffff; + fill-opacity: 0.5; + stroke: none; + } + + .building .inner-wall { + fill: none; + stroke: #ffffff; + stroke-width: 1; + stroke-linecap: square; + } + + .building .outer-wall { + fill: none; + stroke: #000000; + stroke-width: 2; + stroke-linecap: square; + } + + .building.view-elevation-roof .doors, + .building.view-elevation-roof .inner-wall, + .building.view-elevation-roof .outer-wall { + display: none; + } + + .building .elevation-1 { + display: none; + } + + .building.view-elevation-roof .floor { + fill: darkgray; + } + + .building.view-elevation-1 .elevation-1 { + display: inline; + } + + .building.view-elevation-2 .elevation-2 { + display: inline; + } + + .building.view-elevation-roof .elevation-roof { + display: inline; + } + + .building.view-elevation-basement .elevation-basement { + display: inline; + } + + .building.view-elevation-basement .doors { + display: none; + } + </style> +</head> + +<body> + <svg viewBox="-300 -200 600 400" xmlns="http://www.w3.org/2000/svg"> + <defs> + <polygon id="hex" points="0,10 8.66,5 8.66,-5 0,-10 -8.66,-5 -8.66,5" /> + </defs> + <g id="building2" class="building view-elevation-1" transform="translate(-181.86, 105)"> + <!-- <g id="building2" class=".building"> --> + <path class="floor" + d="m 38.786985,67.5 17.32,-30 v -45 l -17.32,-30 v -30 h -77.94 v 30 l -17.32,30 v 45 l 17.32,30 z" /> + <path class="outer-wall" + d="m -21.833015,67.5 v -60 m 17.3200004,-75 v 30 M 17.136985,15 4.146985,7.5 m 51.96,30 -12.99,-7.5 m -38.97,-67.5 v 45 h -60.62 m 17.32,-45 h 77.94 m -69.28,105 h 69.28 l 17.32,-30 v -45 l -17.32,-30 v -30 h -77.94 v 30 l -17.32,30 v 45 l 17.32,30 z" /> + <path class="inner-wall" + d="m -21.833015,67.5 v -60 m 17.3200004,-75 v 30 M 17.136985,15 4.146985,7.5 m 51.96,30 -12.99,-7.5 m -38.97,-67.5 v 45 h -60.62 m 17.32,-45 h 77.94 m -69.28,105 h 69.28 l 17.32,-30 v -45 l -17.32,-30 v -30 h -77.94 v 30 l -17.32,30 v 45 l 17.32,30 z" /> + <path class="doors" + d="m 3.698745,-67.5 h 9.55648 m 7.76351,30 h 9.55648 M -4.9612546,67.5 H 4.595225 m -18.71725,-60 h 9.5564804 m -35.0357204,0 h 9.55648 m 33.74353,-75 h 9.55648 m -35.53648,30 h 9.55648 m 7.7635204,105 H 4.595225 m -18.71725,-60 h 9.5564804 m -35.0357204,0 h 9.55648" /> + </g> + </svg> + <script src="radial.js"></script> +</body> + </html> |