summaryrefslogtreecommitdiff |
diff options
Diffstat (limited to 'src/battlemap/www')
-rw-r--r-- | src/battlemap/www/index.html | 201 | ||||
-rw-r--r-- | src/battlemap/www/style.css | 111 |
2 files changed, 115 insertions, 197 deletions
diff --git a/src/battlemap/www/index.html b/src/battlemap/www/index.html index cad620b..d019783 100644 --- a/src/battlemap/www/index.html +++ b/src/battlemap/www/index.html @@ -1,203 +1,10 @@ <!DOCTYPE html> <html> <head> - <style> - html - { - height: 100%; - } - - html, body, .battlemap - { - position: absolute; - top: 0; - bottom: 0; - right: 0; - left: 0; - } - - .battlemap - { - display: flex; - flex-flow: column; - align-content: stretch; - justify-content: stretch; - } - - .battlemap-header - { - text-align: center; - flex: 0; - } - - .battlemap-container - { - overflow: auto; - width: inherit; - flex: 1; - } - - .battlemap-footer - { - display: flex; - flex: 0; - max-height: 30%; - } - - .battlemap-actual - { - display: inline-block; - } - - .battlemap-tiled - { - position: absolute; - height: 32px; - width: 32px; - } - - .battlemap-tile-icon - { - z-index: 0; - } - - .asset-tile-\"0\" - { - background-color: green; - } - - .asset-tile-\"1\" - { - background-color: yellow; - } - - .asset-tile-\"2\" - { - background-color: red; - } - - .battlemap-character-icon - { - z-index: 2; - } - - .asset-character-icon-Icon0 - { - background-color: Aqua; - } - - .asset-character-icon-Icon1 - { - background-color: Aquamarine; - } - - .asset-character-icon-Icon2 - { - background-color: Purple; - } - - .asset-character-icon-Icon3 - { - background-color: RebeccaPurple; - } - - .battlemap-marker-icon - { - z-index: 1; - } - - .asset-marker-icon-can-go-to - { - background-color:rgba(0,0,0,0.5); - } - - .asset-marker-icon-can-attack - { - background-color:rgba(0,0,0,0.7); - } - - .battlemap-path-icon - { - z-index: 3; - color: white; - } - - .asset-path-icon-NR:before, - .asset-path-icon-LR:before, - .asset-path-icon-RR:before, - .asset-path-icon-UR:before, - .asset-path-icon-DR:before - { - content: "}"; - } - - .asset-path-icon-NL:before, - .asset-path-icon-LL:before, - .asset-path-icon-RL:before, - .asset-path-icon-UL:before, - .asset-path-icon-DL:before - { - content: "{"; - } - - .asset-path-icon-NU:before, - .asset-path-icon-LU:before, - .asset-path-icon-RU:before, - .asset-path-icon-UU:before, - .asset-path-icon-DU:before - { - content: "^"; - } - - .asset-path-icon-ND:before, - .asset-path-icon-LD:before, - .asset-path-icon-RD:before, - .asset-path-icon-UD:before, - .asset-path-icon-DD:before - { - content: "v"; - } - - .asset-path-icon-markN:before, - .asset-path-icon-markL:before, - .asset-path-icon-markU:before, - .asset-path-icon-markD:before, - .asset-path-icon-markR:before - { - content: "x"; - } - - - .battlemap-footer-tabmenu - { - flex: 1; - } - - .battlemap-footer-tabmenu-selector - { - display: flex; - flex-direction: row; - justify-content: space-between; - } - - .battlemap-footer-tabmenu-selector button - { - flex: 1; - } - - .battlemap-footer-tabmenu-content - { - flex: initial; - } - - .battlemap-footer-manualcontrols - { - flex: initial; - - display: flex; - flex-direction: column; - } - </style> + <link rel="stylesheet" type="text/css" href="../global/style.css"> + <link rel="stylesheet" type="text/css" href="../battlemap/style.css"> + <link rel="stylesheet" type="text/css" href="../asset/tiles.css"> + <link rel="stylesheet" type="text/css" href="../asset/characters.css"> </head> <body> <script src="script/main.js"></script> diff --git a/src/battlemap/www/style.css b/src/battlemap/www/style.css new file mode 100644 index 0000000..0404e2b --- /dev/null +++ b/src/battlemap/www/style.css @@ -0,0 +1,111 @@ +.battlemap-container +{ + overflow: auto; + width: inherit; + flex: 1; +} + +.battlemap-footer +{ + display: flex; + flex: 0; + max-height: 30%; +} + +.battlemap-actual +{ + display: inline-block; +} + +/** Inside the container ******************************************************/ +.battlemap-tiled +{ + position: absolute; + height: 32px; + width: 32px; +} + +.battlemap-tile-icon {z-index: 0;} +.battlemap-marker-icon {z-index: 1;} +.battlemap-character-icon {z-index: 2;} +.battlemap-path-icon {z-index: 3; color: white;} + +.battlemap-can-go-to-marker {background-color:rgba(0,0,0,0.5);} +.battlemap-can-attack-marker {background-color:rgba(0,0,0,0.7);} + +/**** Path Icons **************************************************************/ +.battlemap-path-icon-NR:before, +.battlemap-path-icon-LR:before, +.battlemap-path-icon-RR:before, +.battlemap-path-icon-UR:before, +.battlemap-path-icon-DR:before +{ + content: "}"; +} + +.battlemap-path-icon-NL:before, +.battlemap-path-icon-LL:before, +.battlemap-path-icon-RL:before, +.battlemap-path-icon-UL:before, +.battlemap-path-icon-DL:before +{ + content: "{"; +} + +.battlemap-path-icon-NU:before, +.battlemap-path-icon-LU:before, +.battlemap-path-icon-RU:before, +.battlemap-path-icon-UU:before, +.battlemap-path-icon-DU:before +{ + content: "^"; +} + +.battlemap-path-icon-ND:before, +.battlemap-path-icon-LD:before, +.battlemap-path-icon-RD:before, +.battlemap-path-icon-UD:before, +.battlemap-path-icon-DD:before +{ + content: "v"; +} + +.battlemap-path-icon-markN:before, +.battlemap-path-icon-markL:before, +.battlemap-path-icon-markU:before, +.battlemap-path-icon-markD:before, +.battlemap-path-icon-markR:before +{ + content: "x"; +} + +/** Footer ********************************************************************/ +.battlemap-tabmenu +{ + flex: 1; +} + +.battlemap-manual-controls +{ + flex: initial; + + display: flex; + flex-direction: column; +} +/**** Tabmenu *****************************************************************/ +.battlemap-tabmenu-selector +{ + display: flex; + flex-direction: row; + justify-content: space-between; +} + +.battlemap-tabmenu-selector button +{ + flex: 1; +} + +.battlemap-tabmenu-content +{ + flex: initial; +} |