diff options
-rw-r--r-- | images/d4.1x.png | bin | 0 -> 937 bytes | |||
-rw-r--r-- | images/d4.2x.png | bin | 0 -> 1771 bytes | |||
-rw-r--r-- | images/d6.1x.png | bin | 0 -> 1167 bytes | |||
-rw-r--r-- | images/d6.2x.png | bin | 0 -> 2207 bytes | |||
-rw-r--r-- | images/d8.1x.png | bin | 0 -> 742 bytes | |||
-rw-r--r-- | images/d8.2x.png | bin | 0 -> 1603 bytes | |||
-rw-r--r-- | play.html | 40 | ||||
-rw-r--r-- | play.js | 36 | ||||
-rw-r--r-- | tools/d4.svg | 16 | ||||
-rw-r--r-- | tools/d6.svg | 19 | ||||
-rw-r--r-- | tools/d8.svg | 23 | ||||
-rw-r--r-- | tools/renderdice.sh | 9 |
12 files changed, 112 insertions, 31 deletions
diff --git a/images/d4.1x.png b/images/d4.1x.png Binary files differnew file mode 100644 index 0000000..f3c6b2d --- /dev/null +++ b/images/d4.1x.png diff --git a/images/d4.2x.png b/images/d4.2x.png Binary files differnew file mode 100644 index 0000000..2eada93 --- /dev/null +++ b/images/d4.2x.png diff --git a/images/d6.1x.png b/images/d6.1x.png Binary files differnew file mode 100644 index 0000000..572d2d6 --- /dev/null +++ b/images/d6.1x.png diff --git a/images/d6.2x.png b/images/d6.2x.png Binary files differnew file mode 100644 index 0000000..7dd00fd --- /dev/null +++ b/images/d6.2x.png diff --git a/images/d8.1x.png b/images/d8.1x.png Binary files differnew file mode 100644 index 0000000..ce8ff5b --- /dev/null +++ b/images/d8.1x.png diff --git a/images/d8.2x.png b/images/d8.2x.png Binary files differnew file mode 100644 index 0000000..4099f5d --- /dev/null +++ b/images/d8.2x.png @@ -38,8 +38,8 @@ main { background-color: slategray; } -#role_Suffragist .role_name { background-color: var(--suf-85); } -#role_Opposition .role_name { background-color: var(--opp-85); } +#role_Suffragist { background-color: var(--suf-85); } +#role_Opposition { background-color: var(--opp-85); } .role.active .role_name span { text-decoration: underline; } .role_vp { float: right; height: 24px; color: #000c; } @@ -75,22 +75,36 @@ body.Opposition header.your_turn { background-color: var(--opp-75); } border-radius: 0px; box-shadow: none; border: none; - background-size: 100% 100%; + background-size: contain; + background-position: center; background-repeat: no-repeat; } -#log .die_d4 { - color: #4397D4; - font-weight: bold; -} - -#log .die_d6 { - color: #DE5646; - font-weight: bold; +#log .die_d4, #log .die_d6, #log .die_d8 { + display: inline-block; + vertical-align: -3px; + width: 15px; + height: 15px; + background-size: auto 15px; } -#log .die_d8 { - font-weight: bold; +#log .d1 { background-position: -0px 0px; } +#log .d2 { background-position: -15px 0px; } +#log .d3 { background-position: -30px 0px; } +#log .d4 { background-position: -45px 0px; } +#log .d5 { background-position: -60px 0px; } +#log .d6 { background-position: -75px 0px; } +#log .d7 { background-position: -90px 0px; } +#log .d8 { background-position: -105px 0px; } + +#log .die_d4 { background-image: url(images/d4.1x.png); } +#log .die_d6 { background-image: url(images/d6.1x.png); } +#log .die_d8 { background-image: url(images/d8.1x.png); } + +@media (min-resolution: 97dpi) { +#log .die_d4 { background-image: url(images/d4.2x.png); } +#log .die_d6 { background-image: url(images/d6.2x.png); } +#log .die_d8 { background-image: url(images/d8.2x.png); } } #log .purple_campaigner { @@ -499,24 +499,24 @@ function sub_us_state_name(_match, p1, _offset, _string) { } const ICONS = { - B1: '<span class="die_d4 d1">❶</span>', - B2: '<span class="die_d4 d2">❷</span>', - B3: '<span class="die_d4 d3">❸</span>', - B4: '<span class="die_d4 d4">❹</span>', - D1: '<span class="die_d6 d1">❶</span>', - D2: '<span class="die_d6 d2">❷</span>', - D3: '<span class="die_d6 d3">❸</span>', - D4: '<span class="die_d6 d4">❹</span>', - D5: '<span class="die_d6 d5">❺</span>', - D6: '<span class="die_d6 d6">❻</span>', - W1: '<span class="die_d8 d1">①</span>', - W2: '<span class="die_d8 d2">②</span>', - W3: '<span class="die_d8 d3">③</span>', - W4: '<span class="die_d8 d4">④</span>', - W5: '<span class="die_d8 d5">⑤</span>', - W6: '<span class="die_d8 d6">⑥</span>', - W7: '<span class="die_d8 d7">⑦</span>', - W8: '<span class="die_d8 d8">⑧</span>', + B1: '<span class="die_d4 d1"></span>', + B2: '<span class="die_d4 d2"></span>', + B3: '<span class="die_d4 d3"></span>', + B4: '<span class="die_d4 d4"></span>', + D1: '<span class="die_d6 d1"></span>', + D2: '<span class="die_d6 d2"></span>', + D3: '<span class="die_d6 d3"></span>', + D4: '<span class="die_d6 d4"></span>', + D5: '<span class="die_d6 d5"></span>', + D6: '<span class="die_d6 d6"></span>', + W1: '<span class="die_d8 d1"></span>', + W2: '<span class="die_d8 d2"></span>', + W3: '<span class="die_d8 d3"></span>', + W4: '<span class="die_d8 d4"></span>', + W5: '<span class="die_d8 d5"></span>', + W6: '<span class="die_d8 d6"></span>', + W7: '<span class="die_d8 d7"></span>', + W8: '<span class="die_d8 d8"></span>', PR: '<span class="icon purple_campaigner"></span>', YR: '<span class="icon yellow_campaigner"></span>', RR: '<span class="icon red_campaigner"></span>', diff --git a/tools/d4.svg b/tools/d4.svg new file mode 100644 index 0000000..c54970d --- /dev/null +++ b/tools/d4.svg @@ -0,0 +1,16 @@ +<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="12"> +<defs> +<path id="d4stroke" fill="#4397D4" stroke-linejoin="bevel" x-stroke="#000" d="M 0.5,6 3,1.5 9,1.5 11.5,6 9,10.5 3,10.5 Z" /> +<path id="d4" fill="#4397D4" d="M 0,6 3,1 9,1 12,6 9,11 3,11 Z" /> +</defs> +<use xlink:href="#d4" x="0" y="0" /> +<use xlink:href="#d4" x="12" y="0" /> +<use xlink:href="#d4" x="24" y="0" /> +<use xlink:href="#d4" x="36" y="0" /> +<g font-size="7" fill="#FFF" font-family="B612 Mono" font-weight="bold" text-anchor="middle"> +<text x="6" y="8.5">1</text> +<text x="18" y="8.5">2</text> +<text x="30" y="8.5">3</text> +<text x="42" y="8.5">4</text> +</g> +</svg> diff --git a/tools/d6.svg b/tools/d6.svg new file mode 100644 index 0000000..cc1dc9b --- /dev/null +++ b/tools/d6.svg @@ -0,0 +1,19 @@ +<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="72" height="12"> +<defs> +<rect id="d6" fill="#DE5646" x="1" y="1" width="10" height="10" /> +</defs> +<use xlink:href="#d6" x="0" y="0" /> +<use xlink:href="#d6" x="12" y="0" /> +<use xlink:href="#d6" x="24" y="0" /> +<use xlink:href="#d6" x="36" y="0" /> +<use xlink:href="#d6" x="48" y="0" /> +<use xlink:href="#d6" x="60" y="0" /> +<g font-size="7" fill="#fff" font-family="B612 Mono" font-weight="bold" text-anchor="middle"> +<text x="6" y="8.5">1</text> +<text x="18" y="8.5">2</text> +<text x="30" y="8.5">3</text> +<text x="42" y="8.5">4</text> +<text x="54" y="8.5">5</text> +<text x="66" y="8.5">6</text> +</g> +</svg> diff --git a/tools/d8.svg b/tools/d8.svg new file mode 100644 index 0000000..2ced828 --- /dev/null +++ b/tools/d8.svg @@ -0,0 +1,23 @@ +<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="96" height="12"> +<defs> +<path id="d8" fill="#fff" stroke-width="0.6" stroke-linejoin="bevel" stroke="#222" d="M 6,.5 11.5,6 6,11.5 .5,6 Z" /> +</defs> +<use xlink:href="#d8" x="0" y="0" /> +<use xlink:href="#d8" x="12" y="0" /> +<use xlink:href="#d8" x="24" y="0" /> +<use xlink:href="#d8" x="36" y="0" /> +<use xlink:href="#d8" x="48" y="0" /> +<use xlink:href="#d8" x="60" y="0" /> +<use xlink:href="#d8" x="72" y="0" /> +<use xlink:href="#d8" x="84" y="0" /> +<g font-size="7" fill="#000" font-family="B612 Mono" font-weight="bold" text-anchor="middle"> +<text x="6" y="8.5">1</text> +<text x="18" y="8.5">2</text> +<text x="30" y="8.5">3</text> +<text x="42" y="8.5">4</text> +<text x="54" y="8.5">5</text> +<text x="66" y="8.5">6</text> +<text x="78" y="8.5">7</text> +<text x="90" y="8.5">8</text> +</g> +</svg> diff --git a/tools/renderdice.sh b/tools/renderdice.sh new file mode 100644 index 0000000..d2f91c4 --- /dev/null +++ b/tools/renderdice.sh @@ -0,0 +1,9 @@ +inkscape --export-dpi=1920 -o d4.png tools/d4.svg +inkscape --export-dpi=1920 -o d6.png tools/d6.svg +inkscape --export-dpi=1920 -o d8.png tools/d8.svg +for F in d?.png +do + convert -colorspace RGB -resize 6.25% -colorspace sRGB $F images/${F/.png/.1x.png} + convert -colorspace RGB -resize 12.5% -colorspace sRGB $F images/${F/.png/.2x.png} +done +rm d4.png d6.png d8.png |