Skip to content

Commit 2bc7509

Browse files
FoamyGuyFoamyGuy
authored
Merge pull request #3181 from FoamyGuy/fruitjam_card_maker
Fruitjam card maker
2 parents 5029697 + 0f3f74a commit 2bc7509

File tree

5 files changed

+1178
-0
lines changed

5 files changed

+1178
-0
lines changed

‎Fruit_Jam/Fruit_Jam_Card_Maker/project_code/card.template.html‎

Lines changed: 89 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
<!-- SPDX-FileCopyrightText: 2025 Tim Cocks for Adafruit Industries -->
2+
<!-- SPDX-License-Identifier: MIT -->
3+
<!-- quarter fold greeting card template file for Fruit Jam greeting card maker -->
4+
<!DOCTYPE html>
5+
<html lang="en">
6+
<head>
7+
<meta charset="UTF-8">
8+
<title>Card</title>
9+
<style>
10+
:root {
11+
--fold-line-size: 1px;
12+
--fold-line-color: #f5f5f5;
13+
}
14+
15+
.sheet {
16+
height: 11in;
17+
width: 8.5in;
18+
display: grid;
19+
grid-template-columns: 1fr 1fr;
20+
grid-template-rows: 1fr 1fr;
21+
}
22+
23+
p, h1, h3 {
24+
text-align: center;
25+
font-family: sans-serif;
26+
}
27+
28+
#inside-left, #outside-back {
29+
border-right: var(--fold-line-size) dashed var(--fold-line-color);
30+
}
31+
#outside-front, #inside-right {
32+
border-left: var(--fold-line-size) dashed var(--fold-line-color);
33+
}
34+
35+
#outside-back, #outside-front {
36+
border-top: var(--fold-line-size) dashed var(--fold-line-color);
37+
transform: scaleY(-1) scaleX(-1);
38+
}
39+
40+
#inside-left, #inside-right {
41+
border-top: var(--fold-line-size) dashed var(--fold-line-color);
42+
}
43+
44+
#outside-back h3{
45+
font-size: 1.6em;
46+
text-align: center;
47+
margin-bottom: 10px;
48+
margin-top: 200px;
49+
}
50+
51+
img{
52+
display: block;
53+
margin:auto;
54+
}
55+
56+
#outside-front img{
57+
max-width: 317px;
58+
max-height: 360px;
59+
margin-top: 40px;
60+
}
61+
#outside-front h1{
62+
margin-top: 30px;
63+
}
64+
#inside-right{
65+
padding: 160px 30px;
66+
font-size: 1.7em;
67+
}
68+
69+
</style>
70+
</head>
71+
<body>
72+
<div class="sheet">
73+
<div class="quadrant" id="outside-front">
74+
<h1>{% autoescape off %}{{ context["outside_message"] }}{% autoescape on %}</h1>
75+
<img src="{{ context['front_img'] }}?timestamp={{ context['timestamp'] }}">
76+
</div>
77+
<div class="quadrant" id="outside-back">
78+
<h3>made with</h3>
79+
<img src="https://github.com/adafruit/Adafruit_Learning_System_Guides/raw/refs/heads/main/Fruit_Jam/Fruit_Jam_Card_Maker/remote_assets/fruit_jam_logo_invert.png" alt="Adafruit Fruit Jam">
80+
</div>
81+
<div class="quadrant" id="inside-left">
82+
83+
</div>
84+
<div class="quadrant" id="inside-right">
85+
<p>{{ context["inside_message"] }}</p>
86+
</div>
87+
</div>
88+
</body>
89+
</html>

0 commit comments

Comments
 (0)