Mindfang/cardconjurer
1
0
Fork 0
forked from GithubMirrors/cardconjurer
Code Pull Requests Actions Packages Activity

update

Browse Source
This commit is contained in:
Kyle
2020-05-24 11:18:46 -07:00
parent af3465df59
commit bc4e9d9553
10 changed files with 266 additions and 167 deletions
Download Patch File Download Diff File Expand all files Collapse all files

60
askscryfall.html
View File

@@ -51,34 +51,46 @@
</div>
<script defer src="data/site/other/askScryfall/askScryfall.js"></script>
</body>
<footer class='footer'>
<div>
<div>Card Conjurer by Kyle Burton</div>
<footer>
<div class='footer'>
<div>
<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>
</div>
</div>
<div>
<div>Navigation</div>
<div>
<a href='index.html'>Card Creator</a><br>
<a href='life.html'>Life Counter</a><br>
<a href='askscryfall.html'>Ask Scryfall</a>
<div>Theme</div>
<hr>
<div>
<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>
</div>
</div>
</div>
<div>
<div>Legal</div>
<div>
<a href='termsofuse.html'>Terms of Use</a><br>
<a href='disclaimer.html'>Disclaimer</a>
<div>Navigation</div>
<hr>
<div>
<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>
<div>
<div>Legal</div>
<hr>
<div>
<a href='termsofuse.html'>Terms of Use</a><br>
<a href='disclaimer.html'>Disclaimer</a>
</div>
</div>
<div>
<div>Contact</div>
<hr>
<div>
<label class="truncate"><a href="https://mail.google.com/mail/u/0/?view=cm&fs=1&to=CardConjurerMTG@gmail.com&su=Card%20Conjurer&tf=1" target="_blank">CardConjurerMTG@gmail.com</a></label>
</div>
</div>
<script defer src="data/scripts/animations.js"></script>
</div>
<script defer src="data/scripts/animations.js"></script>
</footer>
<html>

70
boxGenerator.html
View File

@@ -53,34 +53,46 @@
</div>
<script defer src="data/site/other/boxGenerator/boxGenerator.js"></script>
</body>
<footer class='footer'>
<div>
<div>Card Conjurer by Kyle Burton</div>
<div>
<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>
</div>
</div>
<div>
<div>Navigation</div>
<div>
<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>
<div>
<div>Legal</div>
<div>
<a href='termsofuse.html'>Terms of Use</a><br>
<a href='disclaimer.html'>Disclaimer</a>
</div>
</div>
<script defer src="data/scripts/animations.js"></script>
<footer>
<div class='footer'>
<div>
<div>Theme</div>
<hr>
<div>
<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>
</div>
</div>
<div>
<div>Navigation</div>
<hr>
<div>
<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>
<div>
<div>Legal</div>
<hr>
<div>
<a href='termsofuse.html'>Terms of Use</a><br>
<a href='disclaimer.html'>Disclaimer</a>
</div>
</div>
<div>
<div>Contact</div>
<hr>
<div>
<label class="truncate"><a href="https://mail.google.com/mail/u/0/?view=cm&fs=1&to=CardConjurerMTG@gmail.com&su=Card%20Conjurer&tf=1" target="_blank">CardConjurerMTG@gmail.com</a></label>
</div>
</div>
<script defer src="data/scripts/animations.js"></script>
</div>
</footer>
<html>

2
data/scripts/lazyLoadSamples.js
View File

@@ -18,4 +18,4 @@ function lazyLoad(imageList = []) {
}
tempSampleImage.src = imageList[i][0]
}
}
}

12
data/scripts/palettes/darkMode.js
View File

@@ -1,10 +1,10 @@
rootStyles.setProperty('--background-color', '#141315')
rootStyles.setProperty('--background-color-contrast', '#0a0a0a')
rootStyles.setProperty('--interactable-color', '#202020')
rootStyles.setProperty('--interactable-selected-color', '#2f2f2f')
rootStyles.setProperty('--input-color', '#282828')
rootStyles.setProperty('--background-color', '#3a3838')
rootStyles.setProperty('--background-color-contrast', '#242424')
rootStyles.setProperty('--interactable-color', '#2b2b2b')
rootStyles.setProperty('--interactable-selected-color', '#1d1d1d')
rootStyles.setProperty('--input-color', '#2b2b2b')
rootStyles.setProperty('--input-font-color', '#efefef')
rootStyles.setProperty('--font-color', '#efefef')
rootStyles.setProperty('--font-color-contrast', '#efefef')
rootStyles.setProperty('--body-background', 'none')
setCookie('colorPalette', 'darkMode')
setCookie('colorPalette', 'darkMode')

4
data/scripts/palettes/lightMode.js
View File

@@ -1,5 +1,5 @@
rootStyles.setProperty('--background-color', '#f5f5f5')
rootStyles.setProperty('--background-color-contrast', '#e4e4e4')
rootStyles.setProperty('--background-color-contrast', '#d0d0d0')
rootStyles.setProperty('--interactable-color', '#dfdfdf')
rootStyles.setProperty('--interactable-selected-color', '#cccccc')
rootStyles.setProperty('--input-color', '#dadada')
@@ -7,4 +7,4 @@ rootStyles.setProperty('--input-font-color', '#000')
rootStyles.setProperty('--font-color', '#000')
rootStyles.setProperty('--font-color-contrast', '#000')
rootStyles.setProperty('--body-background', 'none')
setCookie('colorPalette', 'lightMode')
setCookie('colorPalette', 'lightMode')

60
disclaimer.html
View File

@@ -37,34 +37,46 @@
</div>
</div>
</body>
<footer class='footer'>
<div>
<div>Card Conjurer by Kyle Burton</div>
<footer>
<div class='footer'>
<div>
<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>
</div>
</div>
<div>
<div>Navigation</div>
<div>
<a href='index.html'>Card Creator</a><br>
<a href='life.html'>Life Counter</a><br>
<a href='askscryfall.html'>Ask Scryfall</a>
<div>Theme</div>
<hr>
<div>
<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>
</div>
</div>
</div>
<div>
<div>Legal</div>
<div>
<a href='termsofuse.html'>Terms of Use</a><br>
<a href='disclaimer.html'>Disclaimer</a>
<div>Navigation</div>
<hr>
<div>
<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>
<div>
<div>Legal</div>
<hr>
<div>
<a href='termsofuse.html'>Terms of Use</a><br>
<a href='disclaimer.html'>Disclaimer</a>
</div>
</div>
<div>
<div>Contact</div>
<hr>
<div>
<label class="truncate"><a href="https://mail.google.com/mail/u/0/?view=cm&fs=1&to=CardConjurerMTG@gmail.com&su=Card%20Conjurer&tf=1" target="_blank">CardConjurerMTG@gmail.com</a></label>
</div>
</div>
<script defer src="data/scripts/animations.js"></script>
</div>
<script defer src="data/scripts/animations.js"></script>
</footer>
<html>

91
index.html
View File

@@ -249,58 +249,83 @@
<div>
<div>
<div class='layerTitle'>
Have Any Questions?
Share Your Cards!
</div>
<div class='justify'>
If you have a question, a request, or even just want to share a cool card you made, please don't hesitate to email me at <label class="truncate"><a href="https://mail.google.com/mail/u/0/?view=cm&fs=1&to=CardConjurerMTG@gmail.com&su=Card%20Conjurer&tf=1" target="_blank">CardConjurerMTG@gmail.com</a></label>!
I'd love to see what custom cards you're making, and I'm sure others would too! Post a picture on Twitter with <a style='color: #00aced;' href="https://twitter.com/search?q=%23CardConjurer&src=typed_query&f=live" target='_blank'>#CardConjurer</a>, or just check out what others have made!
</div>
</div>
</div>
</div>
<div class='layer slideFromLeft'>
<div class='layer slideFromLeft'>
<div class='cardLayerGrid'>
<div>
<div class='layerTitle'>
How You Can Help
</div>
<div class="justify">
Playing magic can be expensive for students, so if you've enjoyed using Card Conjurer and would like to help me out, you can make a small donatation via <a style='color: #3b7bbf;' href="https://www.paypal.me/kyleburtondonate" target='_blank'>PayPal</a>.
</div>
</div>
<!-- <img src='data/site/images/samples/sampleBling.png' id='sampleBling'>-->
</div>
</div>
<!--<div class='layer slideFromLeft'>
<div>
<div class='layerTitle'>
The Proxy Factory
</div>
<div class="justify">
If you'd like to delve deeper into making custom Magic: The Gathering cards, check out The Proxy Factory! They're a community full of individuals interested in creating custom cards, and are very welcoming to new members. Take a look at their <a style='color: #ff4500;' href='https://www.reddit.com/r/TheProxyFactory/' target='_blank'>Reddit</a><!-- , or join their <a style='color: #738adb;' href='https://discordapp.com/invite/xBCQprM' target='_blank'>Discord</a> -->, and happy proxying!
If you'd like to delve deeper into making custom Magic: The Gathering cards, check out The Proxy Factory! They're a community full of individuals interested in creating custom cards, and are very welcoming to new members. Take a look at their <a style='color: #ff4500;' href="https://www.reddit.com/r/TheProxyFactory/" target='_blank'>Reddit</a>, and happy proxying!
</div>
</div>
</div>
</div>-->
<script defer src="data/scripts/sortable.js"></script>
<script defer src="data/scripts/main.js"></script>
<script defer src="data/scripts/versions/m15/version.js"></script>
<script defer src="data/scripts/lazyLoadSamples.js"></script>
<!-- <script async src="data/scripts/palettes/darkMode.js"></script> -->
</body>
<footer class='footer'>
<div>
<div>Card Conjurer by Kyle Burton</div>
<div>
<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>
</div>
<footer>
<div class='footer'>
<div>
<div>Theme</div>
<hr>
<div>
<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>
</div>
</div>
<div>
<div>Navigation</div>
<hr>
<div>
<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>
<div>
<div>Legal</div>
<hr>
<div>
<a href='termsofuse.html'>Terms of Use</a><br>
<a href='disclaimer.html'>Disclaimer</a>
</div>
</div>
<div>
<div>Contact</div>
<hr>
<div>
<label class="truncate"><a href="https://mail.google.com/mail/u/0/?view=cm&fs=1&to=CardConjurerMTG@gmail.com&su=Card%20Conjurer&tf=1" target="_blank">CardConjurerMTG@gmail.com</a></label>
</div>
</div>
<script defer src="data/scripts/animations.js"></script>
</div>
<div>
<div>Navigation</div>
<div>
<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>
<div>
<div>Legal</div>
<div>
<a href='termsofuse.html'>Terms of Use</a><br>
<a href='disclaimer.html'>Disclaimer</a>
</div>
</div>
<script defer src="data/scripts/animations.js"></script>
</footer>
<html>

44
setSymbol.html
View File

@@ -83,23 +83,45 @@
</div>
</body>
<footer>
<div class="footerGrid">
<div class='footer'>
<div>
<div class="visitorCountTrigger">Card Conjurer By Kyle Burton</div>
<div class="visitorCount"></div>
<div>Theme</div>
<hr>
<div>
<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>
</div>
</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><br>
<a href="setsymbol.html">Set Symbol Creator</a>
<div>Navigation</div>
<hr>
<div>
<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>
<div>
Legal:<br>
<a href="disclaimer.html">Disclaimer</a><br>
<a href="termsofuse.html">Terms of Use</a>
<div>Legal</div>
<hr>
<div>
<a href='termsofuse.html'>Terms of Use</a><br>
<a href='disclaimer.html'>Disclaimer</a>
</div>
</div>
<div>
<div>Contact</div>
<hr>
<div>
<label class="truncate"><a href="https://mail.google.com/mail/u/0/?view=cm&fs=1&to=CardConjurerMTG@gmail.com&su=Card%20Conjurer&tf=1" target="_blank">CardConjurerMTG@gmail.com</a></label>
</div>
</div>
<script defer src="data/scripts/animations.js"></script>
</div>
</footer>
<script async src="data/scripts/setCodeList.js"></script>

30
styles.css
View File

@@ -411,23 +411,26 @@ input[type='checkbox'], select, option, input[type='file'], button {
canvas {
width: 100%;
}
footer {
background: var(--background-color-contrast);
color: var(--font-color-contrast);
font: 0.6rem arial;
}
.footer {
padding: 1rem;
background: var(--background-color-contrast);
color: var(--font-color-contrast);
font: 0.6rem arial;
width: 10rem;
padding: 1rem 0;
margin: 0 auto;
display: grid;
grid-template-columns: auto;
grid-row-gap: 1rem;
text-align: center;
grid-gap: 2rem;
}
.footer > div > div:first-child {
margin-bottom: 0.2rem;
}
.footer > div > div:not(:first-child) {
font-weight: bold;
/* font-weight: bold;*/
}
.footer > div > select {
.footer > div > div > select {
width: auto !important;
}
@media screen and (min-width: 909pt) { /*Screen is wide enough to show the card next to the editor menu*/
@@ -454,10 +457,11 @@ canvas {
width: 750px;
}
}
@media screen and (min-width: 450pt) { /*Screen is wide enough for the footer to display horizontally*/
.footer {
padding: 2rem;
grid-template-columns: 1fr 1fr 1fr;
@media screen and (min-width: 30rem) { /*Screen is wide enough for the footer to display horizontally*/
.footer {
width: 30rem;
padding: 2rem 0;
grid-template-columns: repeat(4, 6rem);
}
}
@media screen and (min-width: 392pt) { /*Screen is wide enough for the samples to be a constant size*/
@@ -469,4 +473,4 @@ canvas {
html {
font: 20pt georgia;
}
}
}

60
termsofuse.html
View File

@@ -29,34 +29,46 @@
</div>
</div>
</body>
<footer class='footer'>
<div>
<div>Card Conjurer by Kyle Burton</div>
<footer>
<div class='footer'>
<div>
<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>
</div>
</div>
<div>
<div>Navigation</div>
<div>
<a href='index.html'>Card Creator</a><br>
<a href='life.html'>Life Counter</a><br>
<a href='askscryfall.html'>Ask Scryfall</a>
<div>Theme</div>
<hr>
<div>
<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>
</div>
</div>
</div>
<div>
<div>Legal</div>
<div>
<a href='termsofuse.html'>Terms of Use</a><br>
<a href='disclaimer.html'>Disclaimer</a>
<div>Navigation</div>
<hr>
<div>
<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>
<div>
<div>Legal</div>
<hr>
<div>
<a href='termsofuse.html'>Terms of Use</a><br>
<a href='disclaimer.html'>Disclaimer</a>
</div>
</div>
<div>
<div>Contact</div>
<hr>
<div>
<label class="truncate"><a href="https://mail.google.com/mail/u/0/?view=cm&fs=1&to=CardConjurerMTG@gmail.com&su=Card%20Conjurer&tf=1" target="_blank">CardConjurerMTG@gmail.com</a></label>
</div>
</div>
<script defer src="data/scripts/animations.js"></script>
</div>
<script defer src="data/scripts/animations.js"></script>
</footer>
<html>