diff options
Diffstat (limited to 'info/units.html')
-rw-r--r-- | info/units.html | 244 |
1 files changed, 244 insertions, 0 deletions
diff --git a/info/units.html b/info/units.html new file mode 100644 index 0000000..26ec186 --- /dev/null +++ b/info/units.html @@ -0,0 +1,244 @@ +<!DOCTYPE html> +<style> +body { + background-color: slategray; + margin: 40px; +} +.row { + width: 620px; + display: flex; + flex-wrap: wrap; + gap: 10px; + margin: 10px auto; +} +.unit { + width: 51px; + height: 51px; + background-repeat: no-repeat; + border-style: solid; + border-width: 3px; + box-shadow: 0 0 3px 0 rgba(0,0,0,0.5); + background-image: url(../units.svg); +} +.unit.italian { + background-color: #f9e3b3; + border-color: dimgray; +} +.unit.german { + background-color: #abba8e; + border-color: dimgray; +} +.unit.allied { + background-color: #e4d1ab; + border-color: tan; +} + +.unit.u0{background-position:-0px -0px} +.unit.u1{background-position:-51px -0px} +.unit.u2{background-position:-102px -0px} +.unit.u3{background-position:-153px -0px} +.unit.u4{background-position:-204px -0px} +.unit.u5{background-position:-255px -0px} +.unit.u6{background-position:-306px -0px} +.unit.u7{background-position:-357px -0px} +.unit.u8{background-position:-408px -0px} +.unit.u9{background-position:-459px -0px} +.unit.u10{background-position:-0px -51px} +.unit.u11{background-position:-51px -51px} +.unit.u12{background-position:-102px -51px} +.unit.u13{background-position:-153px -51px} +.unit.u14{background-position:-204px -51px} +.unit.u15{background-position:-255px -51px} +.unit.u16{background-position:-306px -51px} +.unit.u17{background-position:-357px -51px} +.unit.u18{background-position:-408px -51px} +.unit.u19{background-position:-459px -51px} +.unit.u20{background-position:-0px -102px} +.unit.u21{background-position:-51px -102px} +.unit.u22{background-position:-102px -102px} +.unit.u23{background-position:-153px -102px} +.unit.u24{background-position:-204px -102px} +.unit.u25{background-position:-255px -102px} +.unit.u26{background-position:-306px -102px} +.unit.u27{background-position:-357px -102px} +.unit.u28{background-position:-408px -102px} +.unit.u29{background-position:-459px -102px} +.unit.u30{background-position:-0px -153px} +.unit.u31{background-position:-51px -153px} +.unit.u32{background-position:-102px -153px} +.unit.u33{background-position:-153px -153px} +.unit.u34{background-position:-204px -153px} +.unit.u35{background-position:-255px -153px} +.unit.u36{background-position:-306px -153px} +.unit.u37{background-position:-357px -153px} +.unit.u38{background-position:-408px -153px} +.unit.u39{background-position:-459px -153px} +.unit.u40{background-position:-0px -204px} +.unit.u41{background-position:-51px -204px} +.unit.u42{background-position:-102px -204px} +.unit.u43{background-position:-153px -204px} +.unit.u44{background-position:-204px -204px} +.unit.u45{background-position:-255px -204px} +.unit.u46{background-position:-306px -204px} +.unit.u47{background-position:-357px -204px} +.unit.u48{background-position:-408px -204px} +.unit.u49{background-position:-459px -204px} +.unit.u50{background-position:-0px -255px} +.unit.u51{background-position:-51px -255px} +.unit.u52{background-position:-102px -255px} +.unit.u53{background-position:-153px -255px} +.unit.u54{background-position:-204px -255px} +.unit.u55{background-position:-255px -255px} +.unit.u56{background-position:-306px -255px} +.unit.u57{background-position:-357px -255px} +.unit.u58{background-position:-408px -255px} +.unit.u59{background-position:-459px -255px} +.unit.u60{background-position:-0px -306px} +.unit.u61{background-position:-51px -306px} +.unit.u62{background-position:-102px -306px} +.unit.u63{background-position:-153px -306px} +.unit.u64{background-position:-204px -306px} +.unit.u65{background-position:-255px -306px} +.unit.u66{background-position:-306px -306px} +.unit.u67{background-position:-357px -306px} +.unit.u68{background-position:-408px -306px} +.unit.u69{background-position:-459px -306px} +.unit.u70{background-position:-0px -357px} +.unit.u71{background-position:-51px -357px} +.unit.u72{background-position:-102px -357px} +.unit.u73{background-position:-153px -357px} +.unit.u74{background-position:-204px -357px} +.unit.u75{background-position:-255px -357px} +.unit.u76{background-position:-306px -357px} +.unit.u77{background-position:-357px -357px} +.unit.u78{background-position:-408px -357px} +.unit.u79{background-position:-459px -357px} +.unit.u80{background-position:-0px -408px} +.unit.u81{background-position:-51px -408px} +.unit.u82{background-position:-102px -408px} +.unit.u83{background-position:-153px -408px} +.unit.u84{background-position:-204px -408px} +.unit.u85{background-position:-255px -408px} +.unit.u86{background-position:-306px -408px} +.unit.u87{background-position:-357px -408px} +.unit.u88{background-position:-408px -408px} +.unit.u89{background-position:-459px -408px} +.unit.u90{background-position:-0px -459px} +.unit.u91{background-position:-51px -459px} +.unit.u92{background-position:-102px -459px} +.unit.u93{background-position:-153px -459px} + +</style> +<html> +<body> + +<div id="units"> + +<div class="row"> +<div class="unit italian u0"></div> +<div class="unit italian u1"></div> +<div class="unit italian u2"></div> +<div class="unit italian u3"></div> +<div class="unit italian u4"></div> +</div><div class="row"> +<div class="unit italian u5"></div> +<div class="unit italian u6"></div> +<div class="unit italian u7"></div> +<div class="unit italian u8"></div> +<div class="unit italian u9"></div> +<div class="unit italian u10"></div> +<div class="unit italian u11"></div> +<div class="unit italian u12"></div> +<div class="unit italian u13"></div> +</div><div class="row"> +<div class="unit german u14"></div> +<div class="unit german u15"></div> +<div class="unit german u16"></div> +<div class="unit german u17"></div> +<div class="unit german u18"></div> +<div class="unit german u19"></div> +</div><div class="row"> +<div class="unit german u20"></div> +<div class="unit german u21"></div> +<div class="unit german u22"></div> +<div class="unit german u23"></div> +<div class="unit german u24"></div> +<div class="unit german u25"></div> +<div class="unit german u26"></div> +<div class="unit german u27"></div> +<div class="unit german u28"></div> +</div><div class="row"> +<div class="unit german u29"></div> +<div class="unit german u30"></div> +<div class="unit german u31"></div> +<div class="unit german u32"></div> +<div class="unit german u33"></div> +</div> +<div class="row"> +<div class="unit allied u34"></div> +<div class="unit allied u35"></div> +<div class="unit allied u36"></div> +<div class="unit allied u37"></div> +<div class="unit allied u38"></div> +<div class="unit allied u39"></div> +</div><div class="row"> +<div class="unit allied u40"></div> +<div class="unit allied u41"></div> +<div class="unit allied u42"></div> +<div class="unit allied u43"></div> +<div class="unit allied u44"></div> +<div class="unit allied u45"></div> +<div class="unit allied u46"></div> +<div class="unit allied u47"></div> +<div class="unit allied u48"></div> +</div><div class="row"> +<div class="unit allied u49"></div> +<div class="unit allied u50"></div> +<div class="unit allied u51"></div> +<div class="unit allied u52"></div> +<div class="unit allied u53"></div> +<div class="unit allied u54"></div> +<div class="unit allied u55"></div> +<div class="unit allied u56"></div> +<div class="unit allied u57"></div> +</div><div class="row"> +<div class="unit allied u58"></div> +<div class="unit allied u59"></div> +<div class="unit allied u60"></div> +<div class="unit allied u61"></div> +<div class="unit allied u62"></div> +<div class="unit allied u63"></div> +<div class="unit allied u64"></div> +<div class="unit allied u65"></div> +<div class="unit allied u66"></div> +</div><div class="row"> +<div class="unit allied u67"></div> +<div class="unit allied u68"></div> +<div class="unit allied u69"></div> +<div class="unit allied u70"></div> +<div class="unit allied u71"></div> +<div class="unit allied u72"></div> +<div class="unit allied u73"></div> +<div class="unit allied u74"></div> +<div class="unit allied u75"></div> +</div><div class="row"> +<div class="unit allied u76"></div> +<div class="unit allied u77"></div> +<div class="unit allied u78"></div> +<div class="unit allied u79"></div> +<div class="unit allied u80"></div> +<div class="unit allied u81"></div> +<div class="unit allied u82"></div> +<div class="unit allied u83"></div> +<div class="unit allied u84"></div> +</div><div class="row"> +<div class="unit allied u85"></div> +<div class="unit allied u86"></div> +<div class="unit allied u87"></div> +<div class="unit allied u88"></div> +<div class="unit allied u89"></div> +<div class="unit allied u90"></div> +<div class="unit allied u91"></div> +<div class="unit allied u92"></div> +<div class="unit allied u93"></div> +</div> |