- added background image to navbar
- emlarged navbar buttons - changed some of the icons
@ -5,6 +5,18 @@
|
||||
display: table-row;
|
||||
}
|
||||
|
||||
|
||||
|
||||
header.navbar {
|
||||
background-image: url("../img/horizon.png");
|
||||
}
|
||||
|
||||
span.navbar-brand {
|
||||
position: absolute;
|
||||
right: 110px;
|
||||
text-shadow: 2px 0 0 #fff, -2px 0 0 #fff, 0 2px 0 #fff, 0 -2px 0 #fff, 1px 1px #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff;
|
||||
}
|
||||
|
||||
input:invalid {
|
||||
border: 2px solid red;
|
||||
}
|
||||
@ -63,7 +75,3 @@ input:invalid {
|
||||
.damage-monitor button.active {
|
||||
filter: brightness(91%);
|
||||
}
|
||||
|
||||
/*$light: steelblue;
|
||||
@import "bootstrap";
|
||||
*/
|
||||
|
||||
BIN
img/act.png
Normal file
|
After Width: | Height: | Size: 795 B |
BIN
img/add.png
|
Before Width: | Height: | Size: 576 B After Width: | Height: | Size: 981 B |
BIN
img/check.png
|
Before Width: | Height: | Size: 411 B |
BIN
img/damage.png
Normal file
|
After Width: | Height: | Size: 565 B |
|
Before Width: | Height: | Size: 735 B |
BIN
img/horizon.png
Normal file
|
After Width: | Height: | Size: 47 KiB |
BIN
img/newround.png
Normal file
|
After Width: | Height: | Size: 846 B |
BIN
img/refresh.png
|
Before Width: | Height: | Size: 646 B |
@ -24,14 +24,13 @@
|
||||
|
||||
<body>
|
||||
<div class="container">
|
||||
<header class="navbar navbar-expand bg-success bg-opacity-25">
|
||||
<header class="navbar navbar-expand">
|
||||
<span class="navbar-brand text-bold ps-4">SR2 Initiative Tracker</span>
|
||||
<nav class="container-fluid justify-content-end" aria-label="Main navigation">
|
||||
<button type="submit" class="btn btn-light btn-rounded mx-1 p-1" id="addCombatantButton" title="Add combatant"><img src="img/add.png" /></button>
|
||||
<button type="submit" class="btn btn-light btn-rounded mx-1 p-1" id="newRoundButton" data-bs-toggle="modal" data-bs-target="#confirmModal" title="Start new round"><img src="img/refresh.png" /></button>
|
||||
<button type="submit" class="btn btn-light btn-rounded mx-1 p-1" id="newRoundButton" data-bs-toggle="modal" data-bs-target="#confirmModal" title="Start new round"><img src="img/newround.png" /></button>
|
||||
</nav>
|
||||
</header>
|
||||
</br>
|
||||
<div class="table-responsive overflow-visible">
|
||||
<table class="table table-sm" id="combatantsTable">
|
||||
<thead>
|
||||
|
||||
35
js/sr2ini.js
@ -9,9 +9,9 @@ const COMBATANT_TABLE_ROW = [
|
||||
'<td class="text-end">\n',
|
||||
'<div class="btn-group">\n',
|
||||
'<button type="button" class="btn btn-light btn-rounded mx-1 p-1 edit-button" title="Edit combatant\'s values"><img src="img/edit.png" /></button>\n',
|
||||
'<button type="button" class="btn btn-light btn-rounded mx-1 p-1 act-button" title="Act and reduce ini by 10"><img src="img/check.png" /></button>\n',
|
||||
'<button type="button" class="btn btn-light btn-rounded mx-1 p-1 act-button" title="Act and reduce ini by 10"><img src="img/act.png" /></button>\n',
|
||||
'<div class="damage-dropdown">\n',
|
||||
'<button type="button" class="btn btn-light btn-rounded mx-1 p-1 damage-button" title="Take damage"><img src="img/explosion.png" /></button>\n',
|
||||
'<button type="button" class="btn btn-light btn-rounded mx-1 p-1 damage-button" title="Take damage"><img src="img/damage.png" /></button>\n',
|
||||
'</div>\n',
|
||||
'</div>\n',
|
||||
'</td>\n',
|
||||
@ -398,27 +398,7 @@ function addCombatant (e) {
|
||||
$tr.find(".combatantDice").text($("#combatantModalDice").val().trim());
|
||||
$tr.find(".combatantRea").text($("#combatantModalRea").val().trim());
|
||||
|
||||
//TODO: retrieve initial damage levels
|
||||
|
||||
// construct jQuery object for table row
|
||||
/* let $tr = $($.parseHTML( [
|
||||
'<tr class="combatantRow align-middle" data-true-ini="', ini, '">\n', //TODO: add data-damage-* attributes with initial damage levels
|
||||
'<td class="combatantName" title="Combatant\'s name">', name, '</td>\n',
|
||||
'<td class="combatantIni text-center" title="Effective initiative (w/ wound penalties)">', effectiveIni, '</td>\n',
|
||||
'<td class="text-center combatantDiceAndRea" title="Iniative dice and reaction"><span class="combatantDice">', dice, '</span>D+<span class="combatantRea">', rea, '</span></td>\n',
|
||||
'<td class="text-end">\n',
|
||||
'<div class="btn-group">\n',
|
||||
'<button type="button" class="btn btn-light btn-rounded mx-1 p-1 edit-button" title="Edit combatant\'s values"><img src="img/edit.png" /></button>\n',
|
||||
'<button type="button" class="btn btn-light btn-rounded mx-1 p-1 act-button" title="Act and reduce ini by 10"><img src="img/check.png" /></button>\n',
|
||||
'<div class="damage-dropdown">\n',
|
||||
'<button type="button" class="btn btn-light btn-rounded mx-1 p-1 damage-button" title="Take damage"><img src="img/explosion.png" /></button>\n',
|
||||
DAMAGE_MONITOR_HTML + "\n",
|
||||
'</div>\n',
|
||||
'</div>\n',
|
||||
'</td>\n',
|
||||
'</tr>'].join("")
|
||||
));*/
|
||||
|
||||
//TODO: retrieve initial damage levels
|
||||
//TODO: mark initial damage levels with active class -> what? don't know what this means
|
||||
|
||||
// add handler to table cells (click to edit)
|
||||
@ -525,17 +505,17 @@ function startNewRound (e) {
|
||||
|
||||
// add test combatant for testing purposes (duh)
|
||||
function addTestCombatant() {
|
||||
// Eclipse
|
||||
$("#addCombatantButton").click();
|
||||
$("#combatantModalName").val("Goon1");
|
||||
$("#combatantModalDice").val(2);
|
||||
$("#combatantModalName").val("Eclipse");
|
||||
$("#combatantModalDice").val(3);
|
||||
$("#combatantModalRea").val(6);
|
||||
$("#combatantModalIni").val(12);
|
||||
// $("#combatantModalIni").val(12);
|
||||
setTimeout(function(){
|
||||
$("#combatantModalAddOkButton").click();
|
||||
},500);
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Initialize document
|
||||
*/
|
||||
@ -570,5 +550,4 @@ $(document).ready(function(){
|
||||
});
|
||||
|
||||
addTestCombatant();
|
||||
|
||||
});
|
||||
|
||||