- added background image to navbar
- emlarged navbar buttons - changed some of the icons
@ -5,6 +5,18 @@
|
|||||||
display: table-row;
|
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 {
|
input:invalid {
|
||||||
border: 2px solid red;
|
border: 2px solid red;
|
||||||
}
|
}
|
||||||
@ -63,7 +75,3 @@ input:invalid {
|
|||||||
.damage-monitor button.active {
|
.damage-monitor button.active {
|
||||||
filter: brightness(91%);
|
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>
|
<body>
|
||||||
<div class="container">
|
<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>
|
<span class="navbar-brand text-bold ps-4">SR2 Initiative Tracker</span>
|
||||||
<nav class="container-fluid justify-content-end" aria-label="Main navigation">
|
<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="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>
|
</nav>
|
||||||
</header>
|
</header>
|
||||||
</br>
|
|
||||||
<div class="table-responsive overflow-visible">
|
<div class="table-responsive overflow-visible">
|
||||||
<table class="table table-sm" id="combatantsTable">
|
<table class="table table-sm" id="combatantsTable">
|
||||||
<thead>
|
<thead>
|
||||||
|
|||||||
35
js/sr2ini.js
@ -9,9 +9,9 @@ const COMBATANT_TABLE_ROW = [
|
|||||||
'<td class="text-end">\n',
|
'<td class="text-end">\n',
|
||||||
'<div class="btn-group">\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 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',
|
'<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',
|
||||||
'</div>\n',
|
'</div>\n',
|
||||||
'</td>\n',
|
'</td>\n',
|
||||||
@ -398,27 +398,7 @@ function addCombatant (e) {
|
|||||||
$tr.find(".combatantDice").text($("#combatantModalDice").val().trim());
|
$tr.find(".combatantDice").text($("#combatantModalDice").val().trim());
|
||||||
$tr.find(".combatantRea").text($("#combatantModalRea").val().trim());
|
$tr.find(".combatantRea").text($("#combatantModalRea").val().trim());
|
||||||
|
|
||||||
//TODO: retrieve initial damage levels
|
//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: mark initial damage levels with active class -> what? don't know what this means
|
//TODO: mark initial damage levels with active class -> what? don't know what this means
|
||||||
|
|
||||||
// add handler to table cells (click to edit)
|
// add handler to table cells (click to edit)
|
||||||
@ -525,17 +505,17 @@ function startNewRound (e) {
|
|||||||
|
|
||||||
// add test combatant for testing purposes (duh)
|
// add test combatant for testing purposes (duh)
|
||||||
function addTestCombatant() {
|
function addTestCombatant() {
|
||||||
|
// Eclipse
|
||||||
$("#addCombatantButton").click();
|
$("#addCombatantButton").click();
|
||||||
$("#combatantModalName").val("Goon1");
|
$("#combatantModalName").val("Eclipse");
|
||||||
$("#combatantModalDice").val(2);
|
$("#combatantModalDice").val(3);
|
||||||
$("#combatantModalRea").val(6);
|
$("#combatantModalRea").val(6);
|
||||||
$("#combatantModalIni").val(12);
|
// $("#combatantModalIni").val(12);
|
||||||
setTimeout(function(){
|
setTimeout(function(){
|
||||||
$("#combatantModalAddOkButton").click();
|
$("#combatantModalAddOkButton").click();
|
||||||
},500);
|
},500);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
/*
|
/*
|
||||||
* Initialize document
|
* Initialize document
|
||||||
*/
|
*/
|
||||||
@ -570,5 +550,4 @@ $(document).ready(function(){
|
|||||||
});
|
});
|
||||||
|
|
||||||
addTestCombatant();
|
addTestCombatant();
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|||||||