mirror of
https://github.com/Investigamer/cardconjurer.git
synced 2025-07-27 05:14:53 -05:00
css fixes
This commit is contained in:
@@ -2,6 +2,8 @@
|
||||
//card size
|
||||
var cardWidth = 749
|
||||
var cardHeight = 1044
|
||||
document.getElementsByClassName("column-1")[0].classList.remove("wide")
|
||||
document.getElementsByClassName("column-2")[0].classList.remove("wide")
|
||||
//Sets the correct values to anything that may have been changed from an out of the ordinary border
|
||||
var eighthInfo = false
|
||||
var m15Info = false
|
||||
|
@@ -3,6 +3,8 @@
|
||||
//Card Size
|
||||
cardWidth = 1074
|
||||
cardHeight = 749
|
||||
document.getElementsByClassName("column-1")[0].classList.add("wide")
|
||||
document.getElementsByClassName("column-2")[0].classList.add("wide")
|
||||
//Card Title
|
||||
var titleFont = cardHeight * 0.0454 + "px belerenb" //34
|
||||
var titleFontSpacing = cardWidth * 0.00014 + "px" //0.15
|
||||
|
@@ -80,7 +80,6 @@ var imgListStatic = ["artistBrush", "foil", "stampGradient", "multiGradient", "r
|
||||
for (i = 0; i < imgListStatic.length; i ++) {
|
||||
var imgName = "img" + imgListStatic[i].charAt(0).toUpperCase() + imgListStatic[i].slice(1)
|
||||
window[imgName] = new Image()
|
||||
window[imgName].crossOrigin = "anonymous"
|
||||
window[imgName].src = "data/borders/" + imgListStatic[i] + ".png"
|
||||
}
|
||||
|
||||
@@ -89,8 +88,11 @@ var manaSymbolCode = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "1
|
||||
var manaSymbolImages = new Array()
|
||||
for (var i = 0; i < manaSymbolCode.length; i++) {
|
||||
manaSymbolImages[i] = new Image()
|
||||
window[imgName].crossOrigin = "anonymous"
|
||||
manaSymbolImages[i].src = "data/manaSymbols/" + i + ".png"
|
||||
manaSymbolImages[i].name = i
|
||||
manaSymbolImages[i].onload = function() {
|
||||
document.getElementById(this.name).src = this.src
|
||||
}
|
||||
}
|
||||
|
||||
//Go ahead and load the first border
|
||||
@@ -108,7 +110,7 @@ var cardClockInterval = setInterval(cardClock, 1000 / document.getElementById("i
|
||||
//It's easier to generate the mana symbol list via js, so do it here
|
||||
var symbolList = ""
|
||||
for (var i = 0; i < manaSymbolCode.length; i++) {
|
||||
symbolList += "<div class='column-4'>" + manaSymbolCode[i] + "\u2192" + "<img src=" + manaSymbolImages[i].src + "></img></div>"
|
||||
symbolList += "<div class='column-4' alt='...'>" + manaSymbolCode[i] + "\u2192" + "<img id='" + i + "'></img></div>"
|
||||
}
|
||||
document.getElementById("symbolList").innerHTML = symbolList
|
||||
|
||||
@@ -691,7 +693,7 @@ function drawText(text, xCoord, yCoord) {
|
||||
textXShift += textSize * 1
|
||||
} else if (megaSplit[0] == "plane") {
|
||||
//This draws the large chaos symbol found on planar cards and permenantly shifts the text over
|
||||
card.drawImage(manaSymbolImages[56], x, y + 6, 48, 42)
|
||||
card.drawImage(manaSymbolImages[57], x, y + 6, 48, 42)
|
||||
x += 58
|
||||
} else {
|
||||
//It's an image (mana symbol, tap, etc...)
|
||||
@@ -755,10 +757,19 @@ function randomizeSampleCards(count) {
|
||||
continue
|
||||
}
|
||||
cardNumbers[cardNumbers.length] = randomNumber
|
||||
var imgName = "sampleCard" + cardNumbers.length
|
||||
window[imgName] = new Image()
|
||||
window[imgName].src = "sampleCards/sample-card-" + randomNumber + ".png"
|
||||
}
|
||||
sampleCard1.onload = function() {
|
||||
document.getElementById("sampleCardA").src = sampleCard1.src
|
||||
}
|
||||
sampleCard2.onload = function() {
|
||||
document.getElementById("sampleCardB").src = sampleCard2.src
|
||||
}
|
||||
sampleCard3.onload = function() {
|
||||
document.getElementById("sampleCardC").src = sampleCard3.src
|
||||
}
|
||||
document.getElementById("sampleCardA").src = "sampleCards/sample-card-" + cardNumbers[0] + ".png"
|
||||
document.getElementById("sampleCardB").src = "sampleCards/sample-card-" + cardNumbers[1] + ".png"
|
||||
document.getElementById("sampleCardC").src = "sampleCards/sample-card-" + cardNumbers[2] + ".png"
|
||||
}
|
||||
|
||||
|
||||
|
25
index.html
25
index.html
@@ -368,7 +368,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row info" style="">For Terms of Use and Disclaimer, see <a href="https://github.com/ImKyle4815/CardConjurer" target="_blank" class="info">the Github page</a>.</div>
|
||||
<footer class="row info" style="">For Terms of Use and Disclaimer, see <a href="https://github.com/ImKyle4815/CardConjurer" target="_blank" class="info">the Github page</a>.</footer>
|
||||
</body>
|
||||
|
||||
|
||||
@@ -580,19 +580,25 @@ a:active {
|
||||
}
|
||||
/*Adjustments For Desktop*/
|
||||
@media only screen and (orientation: landscape) {
|
||||
* {
|
||||
font-size: 25px;
|
||||
}
|
||||
.column-3 {width: 33.33%;}
|
||||
}
|
||||
@media only screen and (min-width: 1130px) {
|
||||
/*The card manipulator menu can be side-by-side with the card*/
|
||||
.column-1 {width: 769px;}
|
||||
.column-2 {
|
||||
width: calc(100% - 769px);
|
||||
/*The card manipulator menu can be side-by-side with the regular card*/
|
||||
.column-1:not(.wide) {width: auto;}
|
||||
.column-2:not(.wide) {
|
||||
width: calc(100% - 759px);
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
}
|
||||
@media only screen and (min-width: 1455px) {
|
||||
/*The card manipulator menu can be side-by-side with the wide card*/
|
||||
.column-1.wide {width: auto; cursor: crosshair;}
|
||||
.column-2.wide {
|
||||
width: calc(100% - 1084px);
|
||||
margin-bottom: 0px;
|
||||
cursor: crosshair;
|
||||
}
|
||||
}
|
||||
@media only screen and (min-width: 801px) {
|
||||
html {
|
||||
background:url(data/background.png) no-repeat center center fixed;
|
||||
@@ -601,6 +607,9 @@ a:active {
|
||||
-o-background-size: cover;
|
||||
background-size: cover;
|
||||
}
|
||||
* {
|
||||
font-size: 25px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<script src="data/scripts/loadScript.js"></script>
|
||||
|
Reference in New Issue
Block a user