var left = document.querySelector(".section.left")
var middle = document.querySelector(".section.middle")
var shades = document.querySelector(".shades")
var weapon = document.querySelector(".Weapon")
var table = document.querySelector(".StatsTable")
var image = document.querySelector(".card-host .DraggableCanvas")
var canvas = document.querySelector(".DraggableCanvas")
var host = document.querySelector(".card-host")
var canvas_style = document.querySelector(".DraggableCanvas .svelte-n94jxx")
var substats = document.querySelectorAll(".section.right .Artifact .substats")
var defense = document.querySelector(".StatsTable .row.DEFENSE")
var background_card = document.querySelector(".svelte-2v73sg")

// Default value is false, change to true if you want to hidden your data
let hideArtifactSubstats = false
let hideDef = false
let imageResizeMax = false
let exportAsBlankPNG = true
let exportAsGreenScreen = false

shades.remove()
if(hideArtifactSubstats) {substats.forEach(e => e.remove())} 
if(hideDef) {defense.remove()}
if(imageResizeMax) {canvas_style.style.width = "100%"; canvas_style.style.height = "100%"}
if(exportAsBlankPNG) {canvas.remove(); background_card.remove(); host.style.backgroundColor = "rgba(0, 0, 0, 0)"}
if(exportAsGreenScreen) {canvas.remove(); background_card.remove(); host.style.backgroundColor = "rgba(9, 255, 0, 0.8)"}
middle.style.width = "28%"
left.style.left = "26%"
left.style.width = "44%"
var classL = left.className
var classM = middle.className
left.className = classM
middle.className = classL
table.style.paddingLeft = "inherit"
table.style.paddingBottom = "inherit"
table.style.borderRadius = "0 0 0.3em 0.3em"
table.style.background = "rgba(0,0,0,.26)"
weapon.style.paddingTop = "inherit"
weapon.style.paddingLeft = "inherit"
weapon.style.paddingBottom = "inherit"
weapon.style.borderRadius = "0.3em 0.3em 0 0"
weapon.style.background = "rgba(0,0,0,.26)"
image.style.width = "100%"