--- /dev/null
+<!DOCTYPE html>
+<html manifest=heroik.appcache>
+ <!--
+ The person who associated a work with this deed has dedicated the work
+ to the public domain by waiving all of his or her rights to the work
+ worldwide under copyright law, including all related and neighboring
+ rights, to the extent allowed by law.
+
+ You can copy, modify, distribute and perform the work, even for
+ commercial purposes, all without asking permission.
+
+ See https://creativecommons.org/publicdomain/zero/1.0/ for details.
+ -->
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">
+ <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
+ <meta name="apple-mobile-web-app-capable" content="yes">
+ <meta name="apple-mobile-web-app-title" content="Hero: IK">
+ <meta name="mobile-web-app-capable" content="yes">
+ <link rel="apple-touch-icon" href="favicon_192.png">
+ <link rel=icon type="image/png" sizes="32x32" href="favicon_32.png">
+ <link rel=icon type="image/png" sizes="192x192" href="favicon_192.png">
+ <link rel=icon type="image/png" sizes="256x256" href="favicon_256.png">
+ <link rel=stylesheet href="heroik.css" type="text/css">
+ <script src="fastclick.js" type="text/javascript"></script>
+ <script src="heroik.js" type="text/javascript"></script>
+ <script src="names.js" type="text/javascript"></script>
+ <script src="scenarios.js" type="text/javascript"></script>
+ <title>Expansion Cards - Hero: Immortal King</title>
+ </head>
+ <body>
+ <div id=statusbar></div>
+ <main>
+ <div style="height: 3em" class="no-print">
+ <a class=button style="float: left; text-align: left"
+ href="heroik.html">
+ ◄ Finished!
+ </a>
+ </div>
+ <h1>Promotional Cards</h1>
+ <div class='card adventurer'>
+ <div class=name>Phœnix</div>
+ <div class=type>Warrior</div>
+ <div class=flavor>Ashes to ashes...</div>
+ <div class=code>Promo 4</div>
+ <div class=gender><img src=male.png></div>
+ <div class=abilities>
+ <div class=skill>
+ +2 to combat rolls against dragons. If the adventurers lose
+ their last Courage token, remove a Tenacity token from
+ Phoenix and immediately gain 3 Courage tokens and 1 Mana
+ token.
+ </div>
+ <div class=temporary>
+ +2 to combat rolls for each Tenacity token on Phoenix.
+ </div>
+ <div class=ultimate>
+ Place 1 Tenacity token on Phoenix and 1 Mana on any
+ adventurer.
+ </div>
+ </div>
+ </div>
+ <div class='card adventurer'>
+ <div class=name>Ykesha</div>
+ <div class=type>Warrior</div>
+ <div class=code>Promo 1</div>
+ <div class=gender><img src=male.png></div>
+ <div class=abilities>
+ <div class=skill>
+ At the start of the game, take a weapon from your collection
+ and put it into play face-up for free.
+ </div>
+ <div class=temporary>
+ +X to your combat die, where X is the number of face-up
+ weapons you have.
+ </div>
+ <div class=ultimate>
+ Roll 3d6. For each 6, destroy one face-up dungeon card, and
+ gain 1 Mana token and 1 Courage token.
+ </div>
+ </div>
+ </div>
+
+ <div class='card object'>
+ <div class=name>Conqueror's Sword</div>
+ <div class=type>Weapon - Unique</div>
+ <div class=effect>
+ <div class=cost><span class=r></span><span class=r></span><span class=r></span><span class=g></span><span class=g></span></div>
+ Once per combat, you may re-roll a combat die showing a 1. At
+ the end of each round, if you lost at least one Courage token,
+ you may place a Mana token on an adventurer.
+ </div>
+ <div class=code>Promo 2</div>
+ </main>
+ </body>
+</html>
color: white;
}
+.card {
+ display: block;
+
+ position: relative;
+ width: 20em;
+ height: 27.1875em;
+ font-size: 88.275%;
+/* width: 64mm;
+ height: 87mm;
+ font-size: 9pt;*/
+ margin: auto;
+ background-image: url(card.png);
+ background-size: cover;
+ margin: 0.5em auto;
+}
+
+.card.adventurer .name, .card.adventurer .type {
+ background-color: #4ba12f;
+}
+
+.card.object .name, .card.object .type {
+ background-color: #cdab4c;
+}
+
+.card .name {
+ position: absolute;
+ color: white;
+ text-align: center;
+ width: 76%;
+ border: solid white 0.06em;
+ border-radius: 0.4em;
+ line-height: 1.6em;
+ height: 4.75%;
+ font-size: 0.8em;
+ font-weight: bold;
+ left: 12%;
+ right: 12%;
+ top: 3.65%;
+ text-shadow: 0 0 0.333em black;
+}
+
+.card .type {
+ color: black;
+ letter-spacing: 0.05em;
+ font-weight: bold;
+ text-shadow: -0.0354em -0.0354em white,
+ 0.0354em -0.0354em white,
+ -0.0354em 0.0354em white,
+ 0.0354em 0.0354em white,
+ 0.05em 0 white,
+ -0.05em 0 white,
+ 0 0.05em white,
+ 0 -0.05em white;
+ text-align: left;
+ margin: auto;
+ position: absolute;
+ height: 2.55%;
+ width: 84%;
+ left: 8%;
+ top: 52.3333%;
+ box-sizing: border-box;
+ padding-left: 0.6667em;
+ font-size: 0.575em;
+ line-height: 1.25em;
+ box-shadow: inset 0 0 0.25em black;
+}
+
+.card .gender {
+ position: absolute;
+ height: 9%;
+ top: 47.5%;
+ right: 8.5%;
+}
+
+.card .gender img {
+ float: right;
+ height: 100%;
+}
+
+.card .abilities {
+ text-align: left;
+ position: absolute;
+ top: 57%;
+ bottom: 8%;
+ left: 10%;
+ right: 10%;
+ font-size: 0.8em;
+ line-height: 1.05em;
+ padding-left: 1em;
+}
+
+.card .cost span {
+ position: relative;
+ content: ' ';
+ width: 1.5em;
+ height: 1.5em;
+ border-radius: 0.75em;
+ border: solid black 0.75em;
+ display: inline-block;
+ box-sizing: border-box;
+ margin: 0.5em 0.05em;
+ box-shadow: 0 0 0.05em 0.04em black;
+}
+
+.card .cost span:before {
+ position: absolute;
+ text-align: center;
+ left: -0.75em;
+ top: -0.75em;
+ color: black;
+ line-height: 1.333em;
+ opacity: 0.5;
+ width: 1.5em;
+ height: 1.5em;
+}
+
+
+.card .cost .r:before { content: 'r'; }
+.card .cost .g:before { content: 'g'; }
+
+.card .cost .r {
+
+ border-color: #e4573c;
+}
+.card .cost .g {
+ border-color: #abbc45;
+}
+
+.card .abilities .skill:before {
+ content: "Skill: ";
+ font-weight: bold;
+ margin-left: -1em;
+}
+
+.card .abilities .temporary:before {
+ content: "Temporary power: ";
+ font-weight: bold;
+ margin-left: -1em;
+}
+
+.card .abilities .ultimate:before {
+ content: "Ultimate power: ";
+ font-weight: bold;
+ margin-left: -1em;
+}
+
+.card .effect {
+ text-align: center;
+ position: absolute;
+ top: 59%;
+ bottom: 8%;
+ left: 15%;
+ width: 70%;
+ font-size: 0.8em;
+ line-height: 1.05em;
+}
+
+.card .flavor {
+ position: absolute;
+ bottom: 9%;
+ width: 80%;
+ left: 10%;
+ font-style: italic;
+ color: black;
+ font-size: 0.6em;
+}
+
+.card .code {
+ position: absolute;
+ color: white;
+ bottom: 3.5%;
+ right: 12%;
+ font-size: 0.65em;
+ text-shadow: -0.0433em -0.0433em black,
+ 0.0433em -0.0433em black,
+ -0.0433em 0.0433em black,
+ 0.0433em 0.0433em black,
+ 0.06667em 0 black,
+ -0.06667em 0 black,
+ 0 0.06667em black,
+ 0 -0.06667em black;
+}
+
#statusbar {
display: none;
position: fixed;
projects / heroik.git / commitdiff
