finishing the background-image change from yesterday

master
mb 2 years ago
parent 036855c687
commit 311e3b55aa

@ -52,19 +52,17 @@ for folder in materials:
md = file.read()
card = markdown.markdown(md)
#print(card) # the print of all the md files
card = f'<div class="card text">{ card }</div>'
cards[folder][card_folder].append(card)
elif my_file.endswith(('.jpg', '.jpeg', '.png')):
if 'prototype_' in my_file:
my_file= my_file.replace('.jpg', '').replace('.jpeg', '').replace('.png', '').replace('prototype_', '').replace('_', ' ')
image_html = f'<img src="{relative_file_path}" alt="{my_file}" />' + f"<div class='image_titles'>{my_file}</div>"
else:
image_html = f'<img src="{relative_file_path}" alt="{my_file}" />'
mycard = f'<div class="card" style="background-image: url("{relative_file_path}");">{image_html}</div> '
mycard = f'<div class="card img" style="background-image: url(\'{relative_file_path}\');">{image_html}</div> '
cards[folder][card_folder].append(mycard)
#print(my_file)
# print(mycard)
#print(card_folder)
#print(file_path)
@ -97,22 +95,19 @@ for page in range(number_pages):
card_8= choice(cards["4_add_ons"]["make-a-notebook-that"])
cards["4_add_ons"]["make-a-notebook-that"].remove(card_8)
page_html = f'''
<div class="page">
<div class="card left-card">{card_1}</div>
<div class="card right-card">{card_2}</div>
<div class="card left-card">{card_3}</div>
<div class="card right-card">{card_4}</div>
<div class="card left-card">{card_5}</div>
<div class="card right-card">{card_6}</div>
<div class="card left-card">{card_7}</div>
<div class="card right-card">{card_8}</div>
{card_1}
{card_2}
{card_3}
{card_4}
{card_5}
{card_6}
{card_7}
{card_8}
</div>
'''
pages.append(page_html)

@ -20,18 +20,18 @@ body{
.card {
float: left;
width: calc(210mm / 2 - 10mm); /* Adjusted width to fit 2 cards per row with margins */
height: calc(297mm / 4 - 10mm); /* Adjusted height to fit 4 rows per page with margins */
/*border: 1mm solid salmon;*/
margin: 5mm;
width: calc(210mm / 2); /* Adjusted width to fit 2 cards per row with margins */
height: calc(297mm / 4); /* Adjusted height to fit 4 rows per page with margins */
border: 1px solid black;
box-sizing: border-box; /* Includes the border in the width and height calculation */
overflow: hidden;
}
.card.img{
}
.card.text{
padding: 5mm;
}
.card.left-card {
padding-right: 10mm;

Loading…
Cancel
Save