diff --git a/Heart-the-City-Beneath/Heart.css b/Heart-the-City-Beneath/Heart.css new file mode 100644 index 0000000000..9ffb6b2f65 --- /dev/null +++ b/Heart-the-City-Beneath/Heart.css @@ -0,0 +1,239 @@ +.sheet-container { + background-color: #6D0000; +} + +.sheet-container div { + padding: 2px; + margin: 2px; + vertical-align: top; +} + +.sheet-topSection { +} + +.sheet-middleSection { +} + +.sheet-bottomSection { +} + +.sheet-narrowCol { + display: inline-block; + width: 20%; + margin: 0; + padding: 0; +} + +.sheet-midCol { + display: inline-block; + width: 40%; + margin: 0; + padding: 0; +} + +.sheet-wideCol { + display: inline-block; + width: 50%; + margin: 0; + padding: 0; +} + +.sheet-shortBox { + display: inline-block; +} + +.sheet-tallBox { + display: inline-block; +} + +.sheet-tallBox input[type="text"], .sheet-shortBox input[type="text"] { + width: 100%; +} + +.sheet-narrowBox { + width: 25%; + display: inline-block; +} + +.sheet-middleBox { + width: 45%; + display: inline-block; +} + +.sheet-wideBox { + width: 60%; + display: inline-block; +} + +.sheet-giantBox { + width: 98%; + border: 1px solid orange; +} + +div.sheet-giantBox + div { + + display: inline-block; +} + +div.sheet-giantBox div h2 { + width: 175px; +} + +div.sheet-giantBox div textarea { + width: 780px; + height: 50px; +} + +div.sheet-giantBox div.repcontainer div { + display: inline-block; + margin: 0; + padding: 0; +} + +div.sheet-giantBox div h2 input { + width: 700px; + color: yellow; + background: transparent; + border: 0; + box-shadow: none; + font-size: large; + +} + +div.sheet-giantBox div h2 input:focus { + color: yellow; + background-color: black; + border: 1px solid #ccc; + -webkit-border-radius: 3px; + -moz-border-radius: 3px; + border-radius: 3px; +} + +h3 { + width: 100%; + color: yellow; +} + +h4 { + color: yellow; +} + +span { + color:white; +} + +textarea { + width: 90%; + height: 50px; +} + +button.sheet-spireButton[type="roll"] { + height:75px; + width:75px; + font-size: -webkit-xxx-large; +} + +button.sheet-spireButton[type="roll"]:hover { + box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19); +} + +div.sheet-inlineText { + display: inline-block; + width: 100px; + color: white; +} + +.repcontrol { + min-height: 27px; + display: block; +} + +.repcontrol .btn { + /* visibility: hidden; */ /* Doesn't work in Firefox! */ + border: medium none; + color: transparent !important; + background: none; + box-shadow: none; + float: none; + display: inline-block; + text-shadow: none !important; + + +} + +.repcontrol .btn:focus { + outline: 0; +} + +.repcontrol .repcontrol_edit { + float: none; +} + +.repcontrol .repcontrol_edit:after { + content: '('; + visibility: visible; + font-family: pictos; + background-color: white; + border: 1px solid black; + border-radius: 2px; + font-size: 12px; + height: 12px; + width: 12px; + padding: 2px 4px 2px 4px; + color: black; + margin-left: -10px; +} + +.editmode ~ .repcontrol .repcontrol_edit:after { + content: ')'; +} + +.repcontrol .repcontrol_add:before { + content: '&'; + visibility: visible; + font-family: pictos; + background-color: #fff; + border: 1px solid black; + border-radius: 2px; + font-size: 12px; + height: 12px; + width: 12px; + padding: 2px 4px 2px 4px; + color: black; +} + +.repcontrol .repcontrol_edit:hover:after, +.repcontrol .repcontrol_add:hover:before +{ + background-color: #EFEFEF; +} + +.sheet-resources .repcontrol { + margin-top: -10px; +} + +.itemcontrol { + z-index: 10; +} + +.itemcontrol .repcontrol_del { + font-size: 10px; + margin-top: 3px; + padding: 0px; + height: 18px; + width: 18px; +} + +.itemcontrol .repcontrol_move { + font-size: 10px; + margin-top: 3px; + padding: 0px; + height: 18px; + width: 18px; +} + +.sheet-auto-expand { + position: relative; + cursor: text; + word-wrap: break-word; +} diff --git a/Heart-the-City-Beneath/Heart.html b/Heart-the-City-Beneath/Heart.html new file mode 100644 index 0000000000..63b20e5e35 --- /dev/null +++ b/Heart-the-City-Beneath/Heart.html @@ -0,0 +1,113 @@ +