mirror of
https://github.com/Investigamer/cardconjurer.git
synced 2025-07-27 05:14:53 -05:00
84 lines
4.0 KiB
HTML
84 lines
4.0 KiB
HTML
<!DOCTYPE html5>
|
|
<html>
|
|
<head>
|
|
<script async src="data/scripts/cookies.js"></script>
|
|
<link rel="stylesheet" href="styles.css">
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<link rel="apple-touch-icon" sizes="180x180" href="data/site/favicons/apple-touch-icon.png">
|
|
<link rel="icon" type="image/png" sizes="32x32" href="data/site/favicons/favicon-32x32.png">
|
|
<link rel="icon" type="image/png" sizes="16x16" href="data/site/favicons/favicon-16x16.png">
|
|
<link rel="manifest" href="data/site/favicons/site.webmanifest">
|
|
</head>
|
|
<body>
|
|
<title>CC - Box Generator</title>
|
|
<link rel="stylesheet" href="askScryfallStyles.css">
|
|
<div>
|
|
<div class="title darkLayer">
|
|
Box Generator
|
|
</div>
|
|
<div class="layer slideFromRight">
|
|
Pixels Per Inch:
|
|
<input id='inputPPI' type='number' min='1' step='1' max='1200' value='72'>
|
|
Material thickness:
|
|
<input id='inputMaterialThickness' type='number' min='0.01' step='0.01' max='2' value='0.25'>
|
|
<!-- Number of rows:
|
|
<input id='inputRowCount' type='number' step='1' min='1' max='5' value='1'> --> <!-- WIP -->
|
|
Row length (interior):
|
|
<input id='inputRowLength' type='number' step='0.25' min='1' max='60' value='12'>
|
|
Card width (sleeved):
|
|
<input id='inputCardWidth' type='number' step='0.1' min='1' max='5' value='2.5'>
|
|
Card height (sleeved):
|
|
<input id='inputCardHeight' type='number' step='0.1' min='1' max='7' value='3.5'>
|
|
Wiggle room:
|
|
<input id='inputWiggleRoom' type='number' step='0.01' min='0' max='1' value='0.125'>
|
|
Vertical Tab Count:
|
|
<input id='inputVerticalTabCount' type='number' step='1' min='2' max='20' value='5'>
|
|
Horizontal Tab Count (down the rows):
|
|
<input id='inputHorizontalTabCount1' type='number' step='1' min='2' max='20' value='15'>
|
|
Horizontal Tab Count (across the rows):
|
|
<input id='inputHorizontalTabCount2' type='number' step='1' min='2' max='20' value='5'><br><br>
|
|
<button onclick='generateSVGs()'>Generate & Download SVGs</button>
|
|
</div>
|
|
<div class="layer darkLayer slideFromLeft">
|
|
<div class="paragraph indent">
|
|
Currently this box generator only supports odd numbers of tabs and single-row boxes with sliding lids. Hopefully in the future I'll add more options!
|
|
</div>
|
|
</div>
|
|
<div class="layer slideFromRight">
|
|
<div class="paragraph indent">
|
|
Before laser cutting, you'll have to adjust the stroke width and color, as well as scale SVG correctly. Note down the PPI (default is 72) when you download the SVGs. In case you forget which PPI you used, the margins on the SVG files are one inch.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script defer src="data/site/other/boxGenerator/boxGenerator.js"></script>
|
|
</body>
|
|
<footer class='footer'>
|
|
<div>
|
|
Card Conjurer by Kyle Burton<br>
|
|
<select id='inputColorPalette' onchange='loadScript("data/scripts/palettes/" + this.value + ".js")'>
|
|
<option value='lightMode'>Light Mode</option>
|
|
<option value='darkMode'>Dark Mode</option>
|
|
<option value='dayRave'>Day Rave</option>
|
|
<option value='nightRave'>Night Rave</option>
|
|
<option value='scholarMode'>Scholar Mode</option>
|
|
</select>
|
|
<script>
|
|
document.getElementById('inputColorPalette').value = getCookie('colorPalette')
|
|
</script>
|
|
</div>
|
|
<div>
|
|
Navigation<br>
|
|
<a href='index.html'>Card Creator</a><br>
|
|
<a href='life.html'>Life Counter</a><br>
|
|
<a href='askscryfall.html'>Ask Scryfall</a>
|
|
</div>
|
|
<div>
|
|
Legal<br>
|
|
<a href='termsofuse.html'>Terms of Use</a><br>
|
|
<a href='disclaimer.html'>Disclaimer</a>
|
|
</div>
|
|
<script defer src="data/scripts/animations.js"></script>
|
|
</footer>
|
|
<html>
|