|
|
|
|
import os , json
|
|
|
|
|
folder = "./images/"
|
|
|
|
|
#load the json information
|
|
|
|
|
with open ("cards.json", "r") as collage:
|
|
|
|
|
cards = json.load(collage)
|
|
|
|
|
#html
|
|
|
|
|
|
|
|
|
|
all_cards = ""
|
|
|
|
|
|
|
|
|
|
for card in cards["cards"]:
|
|
|
|
|
print(card)
|
|
|
|
|
#html image element
|
|
|
|
|
img = f"<img src='{ folder + card['image'] }'>"
|
|
|
|
|
#img = "<img src="' + image +"'>"
|
|
|
|
|
#define title
|
|
|
|
|
title = card['name']
|
|
|
|
|
|
|
|
|
|
#printing to inspect
|
|
|
|
|
print(img)
|
|
|
|
|
|
|
|
|
|
#mini template for card
|
|
|
|
|
if card['image'] == "":
|
|
|
|
|
card = f"""
|
|
|
|
|
<div class="card">
|
|
|
|
|
<h2>{ title }</h2>
|
|
|
|
|
<p class = 'textnoimage'>{ card['text'] }</p>
|
|
|
|
|
</div>
|
|
|
|
|
"""
|
|
|
|
|
else:
|
|
|
|
|
card = f"""
|
|
|
|
|
<div class="card">
|
|
|
|
|
<h2>{ title }</h2>
|
|
|
|
|
<p class = 'image'>{ img }</p>
|
|
|
|
|
<p class = 'text'>{ card['text'] }</p>
|
|
|
|
|
</div>
|
|
|
|
|
"""
|
|
|
|
|
#printing to inspect mini template
|
|
|
|
|
print(card)
|
|
|
|
|
|
|
|
|
|
#add it to the all cards variable
|
|
|
|
|
all_cards = all_cards + card
|
|
|
|
|
#we add +1 to our counter
|
|
|
|
|
|
|
|
|
|
html = f"""
|
|
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html>
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="utf-8">
|
|
|
|
|
<title>flex card</title>
|
|
|
|
|
<link href="stylesheet.css" rel="stylesheet">
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<h1>cards</h1>
|
|
|
|
|
<section>
|
|
|
|
|
{ all_cards }
|
|
|
|
|
</section>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
|
|
|
|
|
|
|
|
|
"""
|
|
|
|
|
with open("cards.html", "w") as output:
|
|
|
|
|
output.write(html)
|
