formal header and footer made, header icons + links added, minor fix to crafted item material tier display
This commit is contained in:
ferricles
parent
57e6a52f9c
commit
ff5bca8276
7 changed files with 123 additions and 33 deletions
2
craft.js
2
craft.js
|
|
@ -93,7 +93,7 @@ class Craft{
|
||||||
|
|
||||||
*/
|
*/
|
||||||
let matmult = 1;
|
let matmult = 1;
|
||||||
let sorted = this.mat_tiers.sort();
|
let sorted = this.mat_tiers.slice().sort();
|
||||||
//TODO - idfk how this works
|
//TODO - idfk how this works
|
||||||
if( sorted[0] == 1 && sorted[1] == 1) {
|
if( sorted[0] == 1 && sorted[1] == 1) {
|
||||||
matmult = 1;
|
matmult = 1;
|
||||||
|
|
|
||||||
46
crafter.html
46
crafter.html
|
|
@ -13,8 +13,32 @@
|
||||||
<title>WynnCrafter</title>
|
<title>WynnCrafter</title>
|
||||||
</head>
|
</head>
|
||||||
<body class="all">
|
<body class="all">
|
||||||
<div class="header" id="header">
|
<div class="center">
|
||||||
WynnBuilder Crafter
|
<header class = "header nomarginp">
|
||||||
|
<div class = "headerleft">
|
||||||
|
<a href = "./" class = "nomarginp iconlink tooltip">
|
||||||
|
<img src = "/media/icons/builder.png" class = "left linkoptions headericon">
|
||||||
|
</img>
|
||||||
|
<div class = "tooltiptext center">WynnBuilder</div>
|
||||||
|
</a>
|
||||||
|
<a href = "./crafter.html" class = "nomarginp iconlink tooltip">
|
||||||
|
<img src = "/media/icons/crafter.png" class = "left linkoptions headericon">
|
||||||
|
</img>
|
||||||
|
<div class = "tooltiptext center">WynnCrafter</div>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class = "headercenter">
|
||||||
|
<div >
|
||||||
|
<p class = "itemp" id = "header">Wynn build calculator</p>
|
||||||
|
<p class="itemp" id="help">
|
||||||
|
<a class = "link" href="https://forums.wynncraft.com/threads/wynnbuilder-release-thread-and-some-damage-calculation-updates.281438">Forum thread (instructions/help)</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class = "headerright">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
</div>
|
</div>
|
||||||
<div class = "container" display = "grid">
|
<div class = "container" display = "grid">
|
||||||
<div class = "crafter center" style = "grid-column:1;grid-row:1" >
|
<div class = "crafter center" style = "grid-column:1;grid-row:1" >
|
||||||
|
|
@ -188,15 +212,17 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class = "center">
|
||||||
<div class="center" id="header2">
|
<footer>
|
||||||
<p>Made by <b class = "hppeng">hppeng</b> and <b class = "ferricles">ferricles</b> with Atlas Inc (JavaScript required to function, nothing works without js)</p>
|
<div class="center" id="header2">
|
||||||
<p>Hard refresh the page (Ctrl+Shift+R on windows/chrome) if it isn't updating correctly.</p>
|
<p>Made by <b class = "hppeng">hppeng</b> and <b class = "ferricles">ferricles</b> with Atlas Inc (JavaScript required to function, nothing works without js)</p>
|
||||||
|
<p>Hard refresh the page (Ctrl+Shift+R on windows/chrome) if it isn't updating correctly.</p>
|
||||||
|
</div>
|
||||||
|
<div class="center" id="credits">
|
||||||
|
<a href="credits.txt" class="link">Additional credits</a>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
<div class="center" id="credits">
|
|
||||||
<a href="credits.txt" class="link">Additional credits</a>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script type="text/javascript" src="utils.js"></script>
|
<script type="text/javascript" src="utils.js"></script>
|
||||||
<script type="text/javascript" src="powders.js"></script>
|
<script type="text/javascript" src="powders.js"></script>
|
||||||
<script type="text/javascript" src="build_utils.js"></script>
|
<script type="text/javascript" src="build_utils.js"></script>
|
||||||
|
|
|
||||||
|
|
@ -9,7 +9,7 @@ console.log(url_tag);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const BUILD_VERSION = "6.9.7";
|
const BUILD_VERSION = "6.9.9";
|
||||||
/*
|
/*
|
||||||
* END testing section
|
* END testing section
|
||||||
*/
|
*/
|
||||||
|
|
|
||||||
47
index.html
47
index.html
|
|
@ -16,12 +16,34 @@
|
||||||
<title>WynnBuilder</title>
|
<title>WynnBuilder</title>
|
||||||
</head>
|
</head>
|
||||||
<body class="all">
|
<body class="all">
|
||||||
<div class="header" id="header">
|
<div class="center">
|
||||||
Wynn build calculator
|
<header class = "header nomarginp">
|
||||||
</div>
|
<div class = "headerleft">
|
||||||
<div class="header" id="help">
|
<a href = "./" class = "nomarginp iconlink tooltip">
|
||||||
<a href="https://forums.wynncraft.com/threads/wynnbuilder-release-thread-and-some-damage-calculation-updates.281438">Forum thread (instructions/help)</a>
|
<img src = "/media/icons/builder.png" class = "left linkoptions headericon">
|
||||||
|
</img>
|
||||||
|
<div class = "tooltiptext center">WynnBuilder</div>
|
||||||
|
</a>
|
||||||
|
<a href = "./crafter.html" class = "nomarginp iconlink tooltip">
|
||||||
|
<img src = "/media/icons/crafter.png" class = "left linkoptions headericon">
|
||||||
|
</img>
|
||||||
|
<div class = "tooltiptext center">WynnCrafter</div>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class = "headercenter">
|
||||||
|
<div >
|
||||||
|
<p class = "itemp" id = "header">Wynn build calculator</p>
|
||||||
|
<p class="itemp" id="help">
|
||||||
|
<a class = "link" href="https://forums.wynncraft.com/threads/wynnbuilder-release-thread-and-some-damage-calculation-updates.281438">Forum thread (instructions/help)</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class = "headerright">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="summary">
|
<div class="summary">
|
||||||
<div class="equipment" style="grid-column:1/span 2;grid-row:1">
|
<div class="equipment" style="grid-column:1/span 2;grid-row:1">
|
||||||
<div style="grid-column:1/span 2;grid-row:1;width: 40vw">
|
<div style="grid-column:1/span 2;grid-row:1;width: 40vw">
|
||||||
|
|
@ -959,11 +981,16 @@
|
||||||
<div class = "center" id = "int-info">Next Spell Costs</div>
|
<div class = "center" id = "int-info">Next Spell Costs</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="center" id="header2">
|
<div class = "center">
|
||||||
<p>Made by <b class = "hppeng">hppeng</b> and <b class = "ferricles">ferricles</b> with Atlas Inc (JavaScript required to function, nothing works without js)</p>
|
<footer>
|
||||||
</div>
|
<div class="center" id="header2">
|
||||||
<div class="center" id="credits">
|
<p>Made by <b class = "hppeng">hppeng</b> and <b class = "ferricles">ferricles</b> with Atlas Inc (JavaScript required to function, nothing works without js)</p>
|
||||||
<a href="credits.txt" class="link">Additional credits</a>
|
<p>Hard refresh the page (Ctrl+Shift+R on windows/chrome) if it isn't updating correctly.</p>
|
||||||
|
</div>
|
||||||
|
<div class="center" id="credits">
|
||||||
|
<a href="credits.txt" class="link">Additional credits</a>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script type="text/javascript" src="utils.js"></script>
|
<script type="text/javascript" src="utils.js"></script>
|
||||||
|
|
|
||||||
BIN
media/icons/builder.png
Normal file
BIN
media/icons/builder.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 934 B |
BIN
media/icons/crafter.png
Normal file
BIN
media/icons/crafter.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 718 B |
59
styles.css
59
styles.css
|
|
@ -1,8 +1,37 @@
|
||||||
.header {
|
.header {
|
||||||
padding: 2% 0% 0%;
|
padding: 2% 0% 0%;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.headericon {
|
||||||
|
/* JANK FIX IF CAN */
|
||||||
|
max-height: 48px;
|
||||||
|
max-width: 48px;
|
||||||
|
}
|
||||||
|
.headerleft {
|
||||||
|
display: inline-block;
|
||||||
|
width: 20%;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
.headercenter {
|
||||||
|
display: inline-block;
|
||||||
|
width: 60%;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.headerright{
|
||||||
|
display: inline-block;
|
||||||
|
width: 20%;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
.iconlink {
|
||||||
|
position: relative;
|
||||||
|
left: 0%;
|
||||||
|
right: 0%;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.all {
|
.all {
|
||||||
font-family: 'Nunito',sans-serif;
|
font-family: 'Nunito',sans-serif;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
|
|
@ -17,7 +46,10 @@ th, td {
|
||||||
padding: 0px;
|
padding: 0px;
|
||||||
}
|
}
|
||||||
.nomarginp {
|
.nomarginp {
|
||||||
margin: 0px;
|
margin-top: 0px;
|
||||||
|
margin-left: 0px;
|
||||||
|
margin-right: 0px;
|
||||||
|
margin-bottom: 0px;
|
||||||
padding: 0px;
|
padding: 0px;
|
||||||
}
|
}
|
||||||
div {
|
div {
|
||||||
|
|
@ -129,6 +161,11 @@ table.center{
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
margin-right: auto;
|
margin-right: auto;
|
||||||
}
|
}
|
||||||
|
.headertable {
|
||||||
|
width: 98%;
|
||||||
|
margin-left: 1%;
|
||||||
|
margin-right: 1%;
|
||||||
|
}
|
||||||
.itemp, .damagep {
|
.itemp, .damagep {
|
||||||
margin: 2px 2%;
|
margin: 2px 2%;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
|
@ -334,7 +371,7 @@ button.toggleOn:hover {
|
||||||
color: transparent;
|
color: transparent;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
transform: translateX(calc(50vw - 50%));
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.Star {
|
.Star {
|
||||||
|
|
@ -403,16 +440,16 @@ button.toggleOn:hover {
|
||||||
background: #110110;
|
background: #110110;
|
||||||
width: min(200%, 75vw);
|
width: min(200%, 75vw);
|
||||||
text-align: center;
|
text-align: center;
|
||||||
border: 5px solid #BCBCBC;
|
border: 3px solid #BCBCBC;
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
padding: 5px 0;
|
padding: 0 0;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
}
|
}
|
||||||
.recipe {
|
.recipe {
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tooltip:hover .tooltiptext {
|
.tooltip:hover .tooltiptext {
|
||||||
visibility: visible;
|
visibility: visible;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue