@azuro-org/images-generator 1.3.0 → 1.3.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/templates/trendle-social/images/bg-business.png +0 -0
- package/dist/templates/trendle-social/images/bg-crypto.png +0 -0
- package/dist/templates/trendle-social/images/bg-culture.png +0 -0
- package/dist/templates/trendle-social/images/bg-fomo.png +0 -0
- package/dist/templates/trendle-social/images/bg-politics.png +0 -0
- package/dist/templates/trendle-social/images/business.png +0 -0
- package/dist/templates/trendle-social/images/crypto.png +0 -0
- package/dist/templates/trendle-social/images/culture.png +0 -0
- package/dist/templates/trendle-social/images/fomo.png +0 -0
- package/dist/templates/trendle-social/images/politics.png +0 -0
- package/dist/templates/trendle-social/images/stamp.png +0 -0
- package/dist/templates/trendle-social/index.d.ts +5 -10
- package/dist/templates/trendle-social/index.html +17 -25
- package/dist/templates/trendle-social/index.js +11 -18
- package/dist/templates/trendle-trading/images/bg.png +0 -0
- package/dist/templates/trendle-trading/images/crash.png +0 -0
- package/dist/templates/trendle-trading/images/drake.png +0 -0
- package/dist/templates/trendle-trading/images/elon.png +0 -0
- package/dist/templates/trendle-trading/images/lewis.png +0 -0
- package/dist/templates/trendle-trading/images/loss.png +0 -0
- package/dist/templates/trendle-trading/images/mark.png +0 -0
- package/dist/templates/trendle-trading/images/obama.png +0 -0
- package/dist/templates/trendle-trading/images/profit.png +0 -0
- package/dist/templates/trendle-trading/images/sydney.png +0 -0
- package/dist/templates/trendle-trading/images/tramp.png +0 -0
- package/dist/templates/trendle-trading/index.d.ts +1 -0
- package/dist/templates/trendle-trading/index.html +18 -2
- package/dist/templates/trendle-trading/index.js +11 -7
- package/lib/templates/trendle-social/images/bg-business.png +0 -0
- package/lib/templates/trendle-social/images/bg-crypto.png +0 -0
- package/lib/templates/trendle-social/images/bg-culture.png +0 -0
- package/lib/templates/trendle-social/images/bg-fomo.png +0 -0
- package/lib/templates/trendle-social/images/bg-politics.png +0 -0
- package/lib/templates/trendle-social/images/business.png +0 -0
- package/lib/templates/trendle-social/images/crypto.png +0 -0
- package/lib/templates/trendle-social/images/culture.png +0 -0
- package/lib/templates/trendle-social/images/fomo.png +0 -0
- package/lib/templates/trendle-social/images/politics.png +0 -0
- package/lib/templates/trendle-social/images/stamp.png +0 -0
- package/lib/templates/trendle-social/index.d.ts +5 -10
- package/lib/templates/trendle-social/index.html +17 -25
- package/lib/templates/trendle-social/index.js +11 -18
- package/lib/templates/trendle-trading/images/bg.png +0 -0
- package/lib/templates/trendle-trading/images/crash.png +0 -0
- package/lib/templates/trendle-trading/images/drake.png +0 -0
- package/lib/templates/trendle-trading/images/elon.png +0 -0
- package/lib/templates/trendle-trading/images/lewis.png +0 -0
- package/lib/templates/trendle-trading/images/loss.png +0 -0
- package/lib/templates/trendle-trading/images/mark.png +0 -0
- package/lib/templates/trendle-trading/images/obama.png +0 -0
- package/lib/templates/trendle-trading/images/profit.png +0 -0
- package/lib/templates/trendle-trading/images/sydney.png +0 -0
- package/lib/templates/trendle-trading/images/tramp.png +0 -0
- package/lib/templates/trendle-trading/index.d.ts +1 -0
- package/lib/templates/trendle-trading/index.html +18 -2
- package/lib/templates/trendle-trading/index.js +11 -7
- package/package.json +1 -1
- package/dist/templates/trendle-social/images/bg.png +0 -0
- package/dist/templates/trendle-social/images/logo.png +0 -0
- package/lib/templates/trendle-social/images/bg.png +0 -0
- package/lib/templates/trendle-social/images/logo.png +0 -0
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
@@ -1,29 +1,24 @@
|
|
|
1
1
|
import { type Template } from '../../utils';
|
|
2
2
|
declare const cardTypes: {
|
|
3
3
|
readonly business: {
|
|
4
|
-
readonly title: "Long chaos,</br> short compliance";
|
|
5
4
|
readonly bottomImg: "images/business.png";
|
|
6
|
-
readonly
|
|
5
|
+
readonly bgImg: "images/bg-business.png";
|
|
7
6
|
};
|
|
8
7
|
readonly culture: {
|
|
9
|
-
readonly title: "Trendlines?</br> I trade punchlines";
|
|
10
8
|
readonly bottomImg: "images/culture.png";
|
|
11
|
-
readonly
|
|
9
|
+
readonly bgImg: "images/bg-culture.png";
|
|
12
10
|
};
|
|
13
11
|
readonly crypto: {
|
|
14
|
-
readonly title: "The Market</br> Whisperer";
|
|
15
12
|
readonly bottomImg: "images/crypto.png";
|
|
16
|
-
readonly
|
|
13
|
+
readonly bgImg: "images/bg-crypto.png";
|
|
17
14
|
};
|
|
18
15
|
readonly politics: {
|
|
19
|
-
readonly title: "The Geopolitical</br> Degen";
|
|
20
16
|
readonly bottomImg: "images/politics.png";
|
|
21
|
-
readonly
|
|
17
|
+
readonly bgImg: "images/bg-politics.png";
|
|
22
18
|
};
|
|
23
19
|
readonly fomo: {
|
|
24
|
-
readonly title: "FOMO Forward";
|
|
25
20
|
readonly bottomImg: "images/fomo.png";
|
|
26
|
-
readonly
|
|
21
|
+
readonly bgImg: "images/bg-fomo.png";
|
|
27
22
|
};
|
|
28
23
|
};
|
|
29
24
|
export type Props = {
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
<head>
|
|
4
4
|
<meta charset="UTF-8">
|
|
5
5
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
-
<link href="https://fonts.googleapis.com/css2?family=Geist+Mono&family=Mona+Sans:
|
|
6
|
+
<link href="https://fonts.googleapis.com/css2?family=Geist+Mono&family=Mona+Sans:ital,wght@75..125,700&display=swap" rel="stylesheet">
|
|
7
7
|
<style>
|
|
8
8
|
html {
|
|
9
9
|
font-family: 'Inter', sans-serif;
|
|
@@ -135,9 +135,8 @@
|
|
|
135
135
|
.card {
|
|
136
136
|
width: 850px;
|
|
137
137
|
height: 1060px;
|
|
138
|
-
padding-top:
|
|
138
|
+
padding-top: 260px;
|
|
139
139
|
position: relative;
|
|
140
|
-
background: --card-bg-color;
|
|
141
140
|
}
|
|
142
141
|
|
|
143
142
|
.bg {
|
|
@@ -157,24 +156,9 @@
|
|
|
157
156
|
width: 100%;
|
|
158
157
|
}
|
|
159
158
|
|
|
160
|
-
.logo {
|
|
161
|
-
display: block;
|
|
162
|
-
height: 28px;
|
|
163
|
-
margin: 0 auto;
|
|
164
|
-
}
|
|
165
|
-
|
|
166
|
-
.title {
|
|
167
|
-
margin: 50px auto 0;
|
|
168
|
-
font-size: 63px;
|
|
169
|
-
font-weight: 700;
|
|
170
|
-
line-height: 100%;
|
|
171
|
-
height: 128px;
|
|
172
|
-
width: fit-content;
|
|
173
|
-
}
|
|
174
|
-
|
|
175
159
|
.avatar {
|
|
176
|
-
width:
|
|
177
|
-
height:
|
|
160
|
+
width: 300px;
|
|
161
|
+
height: 300px;
|
|
178
162
|
border-radius: 100%;
|
|
179
163
|
border: 3.5px solid white;
|
|
180
164
|
overflow: hidden;
|
|
@@ -190,9 +174,8 @@
|
|
|
190
174
|
.username {
|
|
191
175
|
background-color: #111;
|
|
192
176
|
color: #fff;
|
|
193
|
-
padding:
|
|
194
|
-
|
|
195
|
-
margin: -20px auto 0;
|
|
177
|
+
padding: 8px 20px 13px;
|
|
178
|
+
margin: -14px auto 0;
|
|
196
179
|
width: fit-content;
|
|
197
180
|
position: relative;
|
|
198
181
|
z-index: 10;
|
|
@@ -200,17 +183,26 @@
|
|
|
200
183
|
line-height: 100%;
|
|
201
184
|
font-weight: 400;
|
|
202
185
|
}
|
|
186
|
+
|
|
187
|
+
.stamp-img {
|
|
188
|
+
width: 240px;
|
|
189
|
+
height: 240px;
|
|
190
|
+
position: absolute;
|
|
191
|
+
top: 270px;
|
|
192
|
+
right: 140px;
|
|
193
|
+
z-index: 20;
|
|
194
|
+
}
|
|
203
195
|
</style>
|
|
204
196
|
</head>
|
|
205
197
|
<body>
|
|
206
198
|
<div class="card">
|
|
207
199
|
<img src="{bgImg}" alt="" class="bg">
|
|
208
200
|
<img src="{bottomImg}" alt="" class="bottom-img">
|
|
209
|
-
<img src="{
|
|
210
|
-
<div class="title text-center mona-sans flex items-center justify-center">{title}</div>
|
|
201
|
+
<img src="{titleImg}" alt="" class="title-img">
|
|
211
202
|
<div class="avatar flex items-center justify-center">
|
|
212
203
|
<img src="{avatar}" alt="">
|
|
213
204
|
</div>
|
|
205
|
+
<img src="{stampImg}" alt="" class="stamp-img">
|
|
214
206
|
<div class="username geist-mono">{username}</div>
|
|
215
207
|
</div>
|
|
216
208
|
</body>
|
|
@@ -1,28 +1,23 @@
|
|
|
1
1
|
import {_ as __awaiter,a as __generator,g as getFile,b as getBase64Image,d as downloadImage}from'../../index-82868da9.js';import path from'path';import'fs';import'util';import'stream';import'http';import'https';import'url';import'crypto';import'assert';import'tty';import'zlib';import'events';var cardTypes = {
|
|
2
2
|
'business': {
|
|
3
|
-
title: 'Long chaos,</br> short compliance',
|
|
4
3
|
bottomImg: 'images/business.png',
|
|
5
|
-
|
|
4
|
+
bgImg: 'images/bg-business.png',
|
|
6
5
|
},
|
|
7
6
|
'culture': {
|
|
8
|
-
title: 'Trendlines?</br> I trade punchlines',
|
|
9
7
|
bottomImg: 'images/culture.png',
|
|
10
|
-
|
|
8
|
+
bgImg: 'images/bg-culture.png',
|
|
11
9
|
},
|
|
12
10
|
'crypto': {
|
|
13
|
-
title: 'The Market</br> Whisperer',
|
|
14
11
|
bottomImg: 'images/crypto.png',
|
|
15
|
-
|
|
12
|
+
bgImg: 'images/bg-crypto.png',
|
|
16
13
|
},
|
|
17
14
|
'politics': {
|
|
18
|
-
title: 'The Geopolitical</br> Degen',
|
|
19
15
|
bottomImg: 'images/politics.png',
|
|
20
|
-
|
|
16
|
+
bgImg: 'images/bg-politics.png',
|
|
21
17
|
},
|
|
22
18
|
'fomo': {
|
|
23
|
-
title: 'FOMO Forward',
|
|
24
19
|
bottomImg: 'images/fomo.png',
|
|
25
|
-
|
|
20
|
+
bgImg: 'images/bg-fomo.png',
|
|
26
21
|
},
|
|
27
22
|
};
|
|
28
23
|
var template = {
|
|
@@ -30,27 +25,25 @@ var template = {
|
|
|
30
25
|
height: 1060,
|
|
31
26
|
type: 'jpeg',
|
|
32
27
|
html: function (props) { return __awaiter(void 0, void 0, void 0, function () {
|
|
33
|
-
var type, avatarUrl, username, _a, bottomImg,
|
|
28
|
+
var type, avatarUrl, username, _a, bottomImg, bgImg, html, stampImage, bottomImage, bgImage, avatarImage;
|
|
34
29
|
return __generator(this, function (_b) {
|
|
35
30
|
switch (_b.label) {
|
|
36
31
|
case 0:
|
|
37
32
|
type = props.type, avatarUrl = props.avatarUrl, username = props.username;
|
|
38
|
-
_a = cardTypes[type], bottomImg = _a.bottomImg,
|
|
33
|
+
_a = cardTypes[type], bottomImg = _a.bottomImg, bgImg = _a.bgImg;
|
|
39
34
|
html = getFile(path.join(__dirname, 'index.html'));
|
|
40
|
-
|
|
41
|
-
bgImage = getBase64Image(path.resolve(__dirname, 'images/bg.png'));
|
|
35
|
+
stampImage = getBase64Image(path.resolve(__dirname, 'images/stamp.png'));
|
|
42
36
|
bottomImage = getBase64Image(path.resolve(__dirname, bottomImg));
|
|
37
|
+
bgImage = getBase64Image(path.resolve(__dirname, bgImg));
|
|
43
38
|
return [4 /*yield*/, downloadImage(avatarUrl)];
|
|
44
39
|
case 1:
|
|
45
40
|
avatarImage = _b.sent();
|
|
46
41
|
return [2 /*return*/, html
|
|
47
|
-
.replace('{title}', title)
|
|
48
|
-
.replace('{logo}', logo)
|
|
49
42
|
.replace('{bgImg}', bgImage)
|
|
50
43
|
.replace('{bottomImg}', bottomImage)
|
|
44
|
+
.replace('{stampImg}', stampImage)
|
|
51
45
|
.replace('{avatar}', avatarImage)
|
|
52
|
-
.replace('{username}', username)
|
|
53
|
-
.replace('--card-bg-color', bgColor)];
|
|
46
|
+
.replace('{username}', username)];
|
|
54
47
|
}
|
|
55
48
|
});
|
|
56
49
|
}); }
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
@@ -190,7 +190,7 @@
|
|
|
190
190
|
line-height: 37px;
|
|
191
191
|
}
|
|
192
192
|
|
|
193
|
-
.
|
|
193
|
+
.right-img {
|
|
194
194
|
position: absolute;
|
|
195
195
|
top: 0px;
|
|
196
196
|
right: 0px;
|
|
@@ -203,11 +203,27 @@
|
|
|
203
203
|
margin-top: 2px;
|
|
204
204
|
margin-bottom: -3px;
|
|
205
205
|
}
|
|
206
|
+
|
|
207
|
+
.person-img {
|
|
208
|
+
position: absolute;
|
|
209
|
+
height: 100%;
|
|
210
|
+
top: 0px;
|
|
211
|
+
right: 0px;
|
|
212
|
+
mix-blend-mode: multiply;
|
|
213
|
+
}
|
|
214
|
+
|
|
215
|
+
.bg-img {
|
|
216
|
+
position: absolute;
|
|
217
|
+
top: 0px;
|
|
218
|
+
width: 100%;
|
|
219
|
+
}
|
|
206
220
|
</style>
|
|
207
221
|
</head>
|
|
208
222
|
<body>
|
|
209
223
|
<div class="card flex flex-col justify-between">
|
|
210
|
-
<img class="bg" src={
|
|
224
|
+
<img class="bg-img" src={bgImg} alt="">
|
|
225
|
+
<img class="right-img" src={rightImg} alt="">
|
|
226
|
+
<img class="person-img" src={personImg} alt="">
|
|
211
227
|
<img src="{logo}" class="logo" alt="">
|
|
212
228
|
<div>
|
|
213
229
|
<div class="trend flex items-center">
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import {_ as __awaiter,a as __generator,g as getFile,b as getBase64Image,d as downloadImage}from'../../index-82868da9.js';import path from'path';import'fs';import'util';import'stream';import'http';import'https';import'url';import'crypto';import'assert';import'tty';import'zlib';import'events';var cardTypes = {
|
|
2
2
|
'profit': {
|
|
3
|
-
|
|
3
|
+
rightImg: 'images/profit.png',
|
|
4
4
|
arrow: 'images/arrow-up.png',
|
|
5
5
|
bgColor: '#72FF4B',
|
|
6
6
|
},
|
|
7
7
|
'loss': {
|
|
8
|
-
|
|
8
|
+
rightImg: 'images/loss.png',
|
|
9
9
|
arrow: 'images/arrow-down.png',
|
|
10
10
|
bgColor: '#FF604B',
|
|
11
11
|
}
|
|
@@ -15,17 +15,19 @@ var template = {
|
|
|
15
15
|
height: 445,
|
|
16
16
|
type: 'jpeg',
|
|
17
17
|
html: function (props) { return __awaiter(void 0, void 0, void 0, function () {
|
|
18
|
-
var trend, pnl, position, referralUrl, isProfit, _a,
|
|
18
|
+
var type, trend, pnl, position, referralUrl, isProfit, _a, rightImg, arrow, bgColor, leverage, isLong, html, logo, bgImage, rightImage, personImage, arrowImage, trendImage, positionInfo;
|
|
19
19
|
return __generator(this, function (_b) {
|
|
20
20
|
switch (_b.label) {
|
|
21
21
|
case 0:
|
|
22
|
-
trend = props.trend, pnl = props.pnl, position = props.position, referralUrl = props.referralUrl;
|
|
22
|
+
type = props.type, trend = props.trend, pnl = props.pnl, position = props.position, referralUrl = props.referralUrl;
|
|
23
23
|
isProfit = pnl > 0;
|
|
24
|
-
_a = isProfit ? cardTypes.profit : cardTypes.loss,
|
|
24
|
+
_a = isProfit ? cardTypes.profit : cardTypes.loss, rightImg = _a.rightImg, arrow = _a.arrow, bgColor = _a.bgColor;
|
|
25
25
|
leverage = position.leverage, isLong = position.isLong;
|
|
26
26
|
html = getFile(path.join(__dirname, 'index.html'));
|
|
27
27
|
logo = getBase64Image(path.resolve(__dirname, 'images/logo.png'));
|
|
28
|
-
bgImage = getBase64Image(path.resolve(__dirname, bg));
|
|
28
|
+
bgImage = getBase64Image(path.resolve(__dirname, 'images/bg.png'));
|
|
29
|
+
rightImage = getBase64Image(path.resolve(__dirname, rightImg));
|
|
30
|
+
personImage = getBase64Image(path.resolve(__dirname, "images/".concat(type, ".png")));
|
|
29
31
|
arrowImage = getBase64Image(path.resolve(__dirname, arrow));
|
|
30
32
|
return [4 /*yield*/, downloadImage(trend.image)];
|
|
31
33
|
case 1:
|
|
@@ -34,7 +36,9 @@ var template = {
|
|
|
34
36
|
return [2 /*return*/, html
|
|
35
37
|
.replace('{logo}', logo)
|
|
36
38
|
.replace('--card-bg-color', bgColor)
|
|
37
|
-
.replace('{
|
|
39
|
+
.replace('{bgImg}', bgImage)
|
|
40
|
+
.replace('{rightImg}', rightImage)
|
|
41
|
+
.replace('{personImg}', personImage)
|
|
38
42
|
.replace('{trendImage}', trendImage)
|
|
39
43
|
.replace('{trendTitle}', trend.title)
|
|
40
44
|
.replace('{positionInfo}', positionInfo)
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
@@ -1,29 +1,24 @@
|
|
|
1
1
|
import { type Template } from '../../utils';
|
|
2
2
|
declare const cardTypes: {
|
|
3
3
|
readonly business: {
|
|
4
|
-
readonly title: "Long chaos,</br> short compliance";
|
|
5
4
|
readonly bottomImg: "images/business.png";
|
|
6
|
-
readonly
|
|
5
|
+
readonly bgImg: "images/bg-business.png";
|
|
7
6
|
};
|
|
8
7
|
readonly culture: {
|
|
9
|
-
readonly title: "Trendlines?</br> I trade punchlines";
|
|
10
8
|
readonly bottomImg: "images/culture.png";
|
|
11
|
-
readonly
|
|
9
|
+
readonly bgImg: "images/bg-culture.png";
|
|
12
10
|
};
|
|
13
11
|
readonly crypto: {
|
|
14
|
-
readonly title: "The Market</br> Whisperer";
|
|
15
12
|
readonly bottomImg: "images/crypto.png";
|
|
16
|
-
readonly
|
|
13
|
+
readonly bgImg: "images/bg-crypto.png";
|
|
17
14
|
};
|
|
18
15
|
readonly politics: {
|
|
19
|
-
readonly title: "The Geopolitical</br> Degen";
|
|
20
16
|
readonly bottomImg: "images/politics.png";
|
|
21
|
-
readonly
|
|
17
|
+
readonly bgImg: "images/bg-politics.png";
|
|
22
18
|
};
|
|
23
19
|
readonly fomo: {
|
|
24
|
-
readonly title: "FOMO Forward";
|
|
25
20
|
readonly bottomImg: "images/fomo.png";
|
|
26
|
-
readonly
|
|
21
|
+
readonly bgImg: "images/bg-fomo.png";
|
|
27
22
|
};
|
|
28
23
|
};
|
|
29
24
|
export type Props = {
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
<head>
|
|
4
4
|
<meta charset="UTF-8">
|
|
5
5
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
-
<link href="https://fonts.googleapis.com/css2?family=Geist+Mono&family=Mona+Sans:
|
|
6
|
+
<link href="https://fonts.googleapis.com/css2?family=Geist+Mono&family=Mona+Sans:ital,wght@75..125,700&display=swap" rel="stylesheet">
|
|
7
7
|
<style>
|
|
8
8
|
html {
|
|
9
9
|
font-family: 'Inter', sans-serif;
|
|
@@ -135,9 +135,8 @@
|
|
|
135
135
|
.card {
|
|
136
136
|
width: 850px;
|
|
137
137
|
height: 1060px;
|
|
138
|
-
padding-top:
|
|
138
|
+
padding-top: 260px;
|
|
139
139
|
position: relative;
|
|
140
|
-
background: --card-bg-color;
|
|
141
140
|
}
|
|
142
141
|
|
|
143
142
|
.bg {
|
|
@@ -157,24 +156,9 @@
|
|
|
157
156
|
width: 100%;
|
|
158
157
|
}
|
|
159
158
|
|
|
160
|
-
.logo {
|
|
161
|
-
display: block;
|
|
162
|
-
height: 28px;
|
|
163
|
-
margin: 0 auto;
|
|
164
|
-
}
|
|
165
|
-
|
|
166
|
-
.title {
|
|
167
|
-
margin: 50px auto 0;
|
|
168
|
-
font-size: 63px;
|
|
169
|
-
font-weight: 700;
|
|
170
|
-
line-height: 100%;
|
|
171
|
-
height: 128px;
|
|
172
|
-
width: fit-content;
|
|
173
|
-
}
|
|
174
|
-
|
|
175
159
|
.avatar {
|
|
176
|
-
width:
|
|
177
|
-
height:
|
|
160
|
+
width: 300px;
|
|
161
|
+
height: 300px;
|
|
178
162
|
border-radius: 100%;
|
|
179
163
|
border: 3.5px solid white;
|
|
180
164
|
overflow: hidden;
|
|
@@ -190,9 +174,8 @@
|
|
|
190
174
|
.username {
|
|
191
175
|
background-color: #111;
|
|
192
176
|
color: #fff;
|
|
193
|
-
padding:
|
|
194
|
-
|
|
195
|
-
margin: -20px auto 0;
|
|
177
|
+
padding: 8px 20px 13px;
|
|
178
|
+
margin: -14px auto 0;
|
|
196
179
|
width: fit-content;
|
|
197
180
|
position: relative;
|
|
198
181
|
z-index: 10;
|
|
@@ -200,17 +183,26 @@
|
|
|
200
183
|
line-height: 100%;
|
|
201
184
|
font-weight: 400;
|
|
202
185
|
}
|
|
186
|
+
|
|
187
|
+
.stamp-img {
|
|
188
|
+
width: 240px;
|
|
189
|
+
height: 240px;
|
|
190
|
+
position: absolute;
|
|
191
|
+
top: 270px;
|
|
192
|
+
right: 140px;
|
|
193
|
+
z-index: 20;
|
|
194
|
+
}
|
|
203
195
|
</style>
|
|
204
196
|
</head>
|
|
205
197
|
<body>
|
|
206
198
|
<div class="card">
|
|
207
199
|
<img src="{bgImg}" alt="" class="bg">
|
|
208
200
|
<img src="{bottomImg}" alt="" class="bottom-img">
|
|
209
|
-
<img src="{
|
|
210
|
-
<div class="title text-center mona-sans flex items-center justify-center">{title}</div>
|
|
201
|
+
<img src="{titleImg}" alt="" class="title-img">
|
|
211
202
|
<div class="avatar flex items-center justify-center">
|
|
212
203
|
<img src="{avatar}" alt="">
|
|
213
204
|
</div>
|
|
205
|
+
<img src="{stampImg}" alt="" class="stamp-img">
|
|
214
206
|
<div class="username geist-mono">{username}</div>
|
|
215
207
|
</div>
|
|
216
208
|
</body>
|
|
@@ -1,28 +1,23 @@
|
|
|
1
1
|
'use strict';var index=require('../../index-de0b52f4.js'),path=require('path');require('fs'),require('util'),require('stream'),require('http'),require('https'),require('url'),require('crypto'),require('assert'),require('tty'),require('zlib'),require('events');function _interopDefaultLegacy(e){return e&&typeof e==='object'&&'default'in e?e:{'default':e}}var path__default=/*#__PURE__*/_interopDefaultLegacy(path);var cardTypes = {
|
|
2
2
|
'business': {
|
|
3
|
-
title: 'Long chaos,</br> short compliance',
|
|
4
3
|
bottomImg: 'images/business.png',
|
|
5
|
-
|
|
4
|
+
bgImg: 'images/bg-business.png',
|
|
6
5
|
},
|
|
7
6
|
'culture': {
|
|
8
|
-
title: 'Trendlines?</br> I trade punchlines',
|
|
9
7
|
bottomImg: 'images/culture.png',
|
|
10
|
-
|
|
8
|
+
bgImg: 'images/bg-culture.png',
|
|
11
9
|
},
|
|
12
10
|
'crypto': {
|
|
13
|
-
title: 'The Market</br> Whisperer',
|
|
14
11
|
bottomImg: 'images/crypto.png',
|
|
15
|
-
|
|
12
|
+
bgImg: 'images/bg-crypto.png',
|
|
16
13
|
},
|
|
17
14
|
'politics': {
|
|
18
|
-
title: 'The Geopolitical</br> Degen',
|
|
19
15
|
bottomImg: 'images/politics.png',
|
|
20
|
-
|
|
16
|
+
bgImg: 'images/bg-politics.png',
|
|
21
17
|
},
|
|
22
18
|
'fomo': {
|
|
23
|
-
title: 'FOMO Forward',
|
|
24
19
|
bottomImg: 'images/fomo.png',
|
|
25
|
-
|
|
20
|
+
bgImg: 'images/bg-fomo.png',
|
|
26
21
|
},
|
|
27
22
|
};
|
|
28
23
|
var template = {
|
|
@@ -30,27 +25,25 @@ var template = {
|
|
|
30
25
|
height: 1060,
|
|
31
26
|
type: 'jpeg',
|
|
32
27
|
html: function (props) { return index._(void 0, void 0, void 0, function () {
|
|
33
|
-
var type, avatarUrl, username, _a, bottomImg,
|
|
28
|
+
var type, avatarUrl, username, _a, bottomImg, bgImg, html, stampImage, bottomImage, bgImage, avatarImage;
|
|
34
29
|
return index.a(this, function (_b) {
|
|
35
30
|
switch (_b.label) {
|
|
36
31
|
case 0:
|
|
37
32
|
type = props.type, avatarUrl = props.avatarUrl, username = props.username;
|
|
38
|
-
_a = cardTypes[type], bottomImg = _a.bottomImg,
|
|
33
|
+
_a = cardTypes[type], bottomImg = _a.bottomImg, bgImg = _a.bgImg;
|
|
39
34
|
html = index.g(path__default["default"].join(__dirname, 'index.html'));
|
|
40
|
-
|
|
41
|
-
bgImage = index.b(path__default["default"].resolve(__dirname, 'images/bg.png'));
|
|
35
|
+
stampImage = index.b(path__default["default"].resolve(__dirname, 'images/stamp.png'));
|
|
42
36
|
bottomImage = index.b(path__default["default"].resolve(__dirname, bottomImg));
|
|
37
|
+
bgImage = index.b(path__default["default"].resolve(__dirname, bgImg));
|
|
43
38
|
return [4 /*yield*/, index.d(avatarUrl)];
|
|
44
39
|
case 1:
|
|
45
40
|
avatarImage = _b.sent();
|
|
46
41
|
return [2 /*return*/, html
|
|
47
|
-
.replace('{title}', title)
|
|
48
|
-
.replace('{logo}', logo)
|
|
49
42
|
.replace('{bgImg}', bgImage)
|
|
50
43
|
.replace('{bottomImg}', bottomImage)
|
|
44
|
+
.replace('{stampImg}', stampImage)
|
|
51
45
|
.replace('{avatar}', avatarImage)
|
|
52
|
-
.replace('{username}', username)
|
|
53
|
-
.replace('--card-bg-color', bgColor)];
|
|
46
|
+
.replace('{username}', username)];
|
|
54
47
|
}
|
|
55
48
|
});
|
|
56
49
|
}); }
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
@@ -190,7 +190,7 @@
|
|
|
190
190
|
line-height: 37px;
|
|
191
191
|
}
|
|
192
192
|
|
|
193
|
-
.
|
|
193
|
+
.right-img {
|
|
194
194
|
position: absolute;
|
|
195
195
|
top: 0px;
|
|
196
196
|
right: 0px;
|
|
@@ -203,11 +203,27 @@
|
|
|
203
203
|
margin-top: 2px;
|
|
204
204
|
margin-bottom: -3px;
|
|
205
205
|
}
|
|
206
|
+
|
|
207
|
+
.person-img {
|
|
208
|
+
position: absolute;
|
|
209
|
+
height: 100%;
|
|
210
|
+
top: 0px;
|
|
211
|
+
right: 0px;
|
|
212
|
+
mix-blend-mode: multiply;
|
|
213
|
+
}
|
|
214
|
+
|
|
215
|
+
.bg-img {
|
|
216
|
+
position: absolute;
|
|
217
|
+
top: 0px;
|
|
218
|
+
width: 100%;
|
|
219
|
+
}
|
|
206
220
|
</style>
|
|
207
221
|
</head>
|
|
208
222
|
<body>
|
|
209
223
|
<div class="card flex flex-col justify-between">
|
|
210
|
-
<img class="bg" src={
|
|
224
|
+
<img class="bg-img" src={bgImg} alt="">
|
|
225
|
+
<img class="right-img" src={rightImg} alt="">
|
|
226
|
+
<img class="person-img" src={personImg} alt="">
|
|
211
227
|
<img src="{logo}" class="logo" alt="">
|
|
212
228
|
<div>
|
|
213
229
|
<div class="trend flex items-center">
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
'use strict';var index=require('../../index-de0b52f4.js'),path=require('path');require('fs'),require('util'),require('stream'),require('http'),require('https'),require('url'),require('crypto'),require('assert'),require('tty'),require('zlib'),require('events');function _interopDefaultLegacy(e){return e&&typeof e==='object'&&'default'in e?e:{'default':e}}var path__default=/*#__PURE__*/_interopDefaultLegacy(path);var cardTypes = {
|
|
2
2
|
'profit': {
|
|
3
|
-
|
|
3
|
+
rightImg: 'images/profit.png',
|
|
4
4
|
arrow: 'images/arrow-up.png',
|
|
5
5
|
bgColor: '#72FF4B',
|
|
6
6
|
},
|
|
7
7
|
'loss': {
|
|
8
|
-
|
|
8
|
+
rightImg: 'images/loss.png',
|
|
9
9
|
arrow: 'images/arrow-down.png',
|
|
10
10
|
bgColor: '#FF604B',
|
|
11
11
|
}
|
|
@@ -15,17 +15,19 @@ var template = {
|
|
|
15
15
|
height: 445,
|
|
16
16
|
type: 'jpeg',
|
|
17
17
|
html: function (props) { return index._(void 0, void 0, void 0, function () {
|
|
18
|
-
var trend, pnl, position, referralUrl, isProfit, _a,
|
|
18
|
+
var type, trend, pnl, position, referralUrl, isProfit, _a, rightImg, arrow, bgColor, leverage, isLong, html, logo, bgImage, rightImage, personImage, arrowImage, trendImage, positionInfo;
|
|
19
19
|
return index.a(this, function (_b) {
|
|
20
20
|
switch (_b.label) {
|
|
21
21
|
case 0:
|
|
22
|
-
trend = props.trend, pnl = props.pnl, position = props.position, referralUrl = props.referralUrl;
|
|
22
|
+
type = props.type, trend = props.trend, pnl = props.pnl, position = props.position, referralUrl = props.referralUrl;
|
|
23
23
|
isProfit = pnl > 0;
|
|
24
|
-
_a = isProfit ? cardTypes.profit : cardTypes.loss,
|
|
24
|
+
_a = isProfit ? cardTypes.profit : cardTypes.loss, rightImg = _a.rightImg, arrow = _a.arrow, bgColor = _a.bgColor;
|
|
25
25
|
leverage = position.leverage, isLong = position.isLong;
|
|
26
26
|
html = index.g(path__default["default"].join(__dirname, 'index.html'));
|
|
27
27
|
logo = index.b(path__default["default"].resolve(__dirname, 'images/logo.png'));
|
|
28
|
-
bgImage = index.b(path__default["default"].resolve(__dirname, bg));
|
|
28
|
+
bgImage = index.b(path__default["default"].resolve(__dirname, 'images/bg.png'));
|
|
29
|
+
rightImage = index.b(path__default["default"].resolve(__dirname, rightImg));
|
|
30
|
+
personImage = index.b(path__default["default"].resolve(__dirname, "images/".concat(type, ".png")));
|
|
29
31
|
arrowImage = index.b(path__default["default"].resolve(__dirname, arrow));
|
|
30
32
|
return [4 /*yield*/, index.d(trend.image)];
|
|
31
33
|
case 1:
|
|
@@ -34,7 +36,9 @@ var template = {
|
|
|
34
36
|
return [2 /*return*/, html
|
|
35
37
|
.replace('{logo}', logo)
|
|
36
38
|
.replace('--card-bg-color', bgColor)
|
|
37
|
-
.replace('{
|
|
39
|
+
.replace('{bgImg}', bgImage)
|
|
40
|
+
.replace('{rightImg}', rightImage)
|
|
41
|
+
.replace('{personImg}', personImage)
|
|
38
42
|
.replace('{trendImage}', trendImage)
|
|
39
43
|
.replace('{trendTitle}', trend.title)
|
|
40
44
|
.replace('{positionInfo}', positionInfo)
|
package/package.json
CHANGED
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|