@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.
Files changed (61) hide show
  1. package/dist/templates/trendle-social/images/bg-business.png +0 -0
  2. package/dist/templates/trendle-social/images/bg-crypto.png +0 -0
  3. package/dist/templates/trendle-social/images/bg-culture.png +0 -0
  4. package/dist/templates/trendle-social/images/bg-fomo.png +0 -0
  5. package/dist/templates/trendle-social/images/bg-politics.png +0 -0
  6. package/dist/templates/trendle-social/images/business.png +0 -0
  7. package/dist/templates/trendle-social/images/crypto.png +0 -0
  8. package/dist/templates/trendle-social/images/culture.png +0 -0
  9. package/dist/templates/trendle-social/images/fomo.png +0 -0
  10. package/dist/templates/trendle-social/images/politics.png +0 -0
  11. package/dist/templates/trendle-social/images/stamp.png +0 -0
  12. package/dist/templates/trendle-social/index.d.ts +5 -10
  13. package/dist/templates/trendle-social/index.html +17 -25
  14. package/dist/templates/trendle-social/index.js +11 -18
  15. package/dist/templates/trendle-trading/images/bg.png +0 -0
  16. package/dist/templates/trendle-trading/images/crash.png +0 -0
  17. package/dist/templates/trendle-trading/images/drake.png +0 -0
  18. package/dist/templates/trendle-trading/images/elon.png +0 -0
  19. package/dist/templates/trendle-trading/images/lewis.png +0 -0
  20. package/dist/templates/trendle-trading/images/loss.png +0 -0
  21. package/dist/templates/trendle-trading/images/mark.png +0 -0
  22. package/dist/templates/trendle-trading/images/obama.png +0 -0
  23. package/dist/templates/trendle-trading/images/profit.png +0 -0
  24. package/dist/templates/trendle-trading/images/sydney.png +0 -0
  25. package/dist/templates/trendle-trading/images/tramp.png +0 -0
  26. package/dist/templates/trendle-trading/index.d.ts +1 -0
  27. package/dist/templates/trendle-trading/index.html +18 -2
  28. package/dist/templates/trendle-trading/index.js +11 -7
  29. package/lib/templates/trendle-social/images/bg-business.png +0 -0
  30. package/lib/templates/trendle-social/images/bg-crypto.png +0 -0
  31. package/lib/templates/trendle-social/images/bg-culture.png +0 -0
  32. package/lib/templates/trendle-social/images/bg-fomo.png +0 -0
  33. package/lib/templates/trendle-social/images/bg-politics.png +0 -0
  34. package/lib/templates/trendle-social/images/business.png +0 -0
  35. package/lib/templates/trendle-social/images/crypto.png +0 -0
  36. package/lib/templates/trendle-social/images/culture.png +0 -0
  37. package/lib/templates/trendle-social/images/fomo.png +0 -0
  38. package/lib/templates/trendle-social/images/politics.png +0 -0
  39. package/lib/templates/trendle-social/images/stamp.png +0 -0
  40. package/lib/templates/trendle-social/index.d.ts +5 -10
  41. package/lib/templates/trendle-social/index.html +17 -25
  42. package/lib/templates/trendle-social/index.js +11 -18
  43. package/lib/templates/trendle-trading/images/bg.png +0 -0
  44. package/lib/templates/trendle-trading/images/crash.png +0 -0
  45. package/lib/templates/trendle-trading/images/drake.png +0 -0
  46. package/lib/templates/trendle-trading/images/elon.png +0 -0
  47. package/lib/templates/trendle-trading/images/lewis.png +0 -0
  48. package/lib/templates/trendle-trading/images/loss.png +0 -0
  49. package/lib/templates/trendle-trading/images/mark.png +0 -0
  50. package/lib/templates/trendle-trading/images/obama.png +0 -0
  51. package/lib/templates/trendle-trading/images/profit.png +0 -0
  52. package/lib/templates/trendle-trading/images/sydney.png +0 -0
  53. package/lib/templates/trendle-trading/images/tramp.png +0 -0
  54. package/lib/templates/trendle-trading/index.d.ts +1 -0
  55. package/lib/templates/trendle-trading/index.html +18 -2
  56. package/lib/templates/trendle-trading/index.js +11 -7
  57. package/package.json +1 -1
  58. package/dist/templates/trendle-social/images/bg.png +0 -0
  59. package/dist/templates/trendle-social/images/logo.png +0 -0
  60. package/lib/templates/trendle-social/images/bg.png +0 -0
  61. package/lib/templates/trendle-social/images/logo.png +0 -0
@@ -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 bgColor: "#DEFF4B";
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 bgColor: "#4BFF51";
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 bgColor: "#FF5188";
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 bgColor: "#51C2FF";
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 bgColor: "#D951FF";
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:wdth,wght@75..125,700&display=swap" rel="stylesheet">
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: 37px;
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: 360px;
177
- height: 360px;
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: 11px 20px 15px;
194
- border-radius: 18px;
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="{logo}" class="logo" alt="">
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
- bgColor: '#DEFF4B'
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
- bgColor: '#4BFF51'
8
+ bgImg: 'images/bg-culture.png',
11
9
  },
12
10
  'crypto': {
13
- title: 'The Market</br> Whisperer',
14
11
  bottomImg: 'images/crypto.png',
15
- bgColor: '#FF5188'
12
+ bgImg: 'images/bg-crypto.png',
16
13
  },
17
14
  'politics': {
18
- title: 'The Geopolitical</br> Degen',
19
15
  bottomImg: 'images/politics.png',
20
- bgColor: '#51C2FF'
16
+ bgImg: 'images/bg-politics.png',
21
17
  },
22
18
  'fomo': {
23
- title: 'FOMO Forward',
24
19
  bottomImg: 'images/fomo.png',
25
- bgColor: '#D951FF'
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, title, bgColor, html, logo, bgImage, bottomImage, avatarImage;
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, title = _a.title, bgColor = _a.bgColor;
33
+ _a = cardTypes[type], bottomImg = _a.bottomImg, bgImg = _a.bgImg;
39
34
  html = getFile(path.join(__dirname, 'index.html'));
40
- logo = getBase64Image(path.resolve(__dirname, 'images/logo.png'));
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
  }); }
@@ -1,5 +1,6 @@
1
1
  import { type Template } from '../../utils';
2
2
  export type Props = {
3
+ type: 'obama' | 'drake' | 'crash' | 'sydney' | 'tramp' | 'elon' | 'lewis' | 'mark';
3
4
  trend: {
4
5
  image: string;
5
6
  title: string;
@@ -190,7 +190,7 @@
190
190
  line-height: 37px;
191
191
  }
192
192
 
193
- .bg {
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={bgImage} alt="">
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
- bg: 'images/profit.png',
3
+ rightImg: 'images/profit.png',
4
4
  arrow: 'images/arrow-up.png',
5
5
  bgColor: '#72FF4B',
6
6
  },
7
7
  'loss': {
8
- bg: 'images/loss.png',
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, bg, arrow, bgColor, leverage, isLong, html, logo, bgImage, arrowImage, trendImage, positionInfo;
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, bg = _a.bg, arrow = _a.arrow, bgColor = _a.bgColor;
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('{bgImage}', bgImage)
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)
@@ -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 bgColor: "#DEFF4B";
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 bgColor: "#4BFF51";
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 bgColor: "#FF5188";
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 bgColor: "#51C2FF";
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 bgColor: "#D951FF";
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:wdth,wght@75..125,700&display=swap" rel="stylesheet">
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: 37px;
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: 360px;
177
- height: 360px;
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: 11px 20px 15px;
194
- border-radius: 18px;
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="{logo}" class="logo" alt="">
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
- bgColor: '#DEFF4B'
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
- bgColor: '#4BFF51'
8
+ bgImg: 'images/bg-culture.png',
11
9
  },
12
10
  'crypto': {
13
- title: 'The Market</br> Whisperer',
14
11
  bottomImg: 'images/crypto.png',
15
- bgColor: '#FF5188'
12
+ bgImg: 'images/bg-crypto.png',
16
13
  },
17
14
  'politics': {
18
- title: 'The Geopolitical</br> Degen',
19
15
  bottomImg: 'images/politics.png',
20
- bgColor: '#51C2FF'
16
+ bgImg: 'images/bg-politics.png',
21
17
  },
22
18
  'fomo': {
23
- title: 'FOMO Forward',
24
19
  bottomImg: 'images/fomo.png',
25
- bgColor: '#D951FF'
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, title, bgColor, html, logo, bgImage, bottomImage, avatarImage;
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, title = _a.title, bgColor = _a.bgColor;
33
+ _a = cardTypes[type], bottomImg = _a.bottomImg, bgImg = _a.bgImg;
39
34
  html = index.g(path__default["default"].join(__dirname, 'index.html'));
40
- logo = index.b(path__default["default"].resolve(__dirname, 'images/logo.png'));
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
  }); }
@@ -1,5 +1,6 @@
1
1
  import { type Template } from '../../utils';
2
2
  export type Props = {
3
+ type: 'obama' | 'drake' | 'crash' | 'sydney' | 'tramp' | 'elon' | 'lewis' | 'mark';
3
4
  trend: {
4
5
  image: string;
5
6
  title: string;
@@ -190,7 +190,7 @@
190
190
  line-height: 37px;
191
191
  }
192
192
 
193
- .bg {
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={bgImage} alt="">
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
- bg: 'images/profit.png',
3
+ rightImg: 'images/profit.png',
4
4
  arrow: 'images/arrow-up.png',
5
5
  bgColor: '#72FF4B',
6
6
  },
7
7
  'loss': {
8
- bg: 'images/loss.png',
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, bg, arrow, bgColor, leverage, isLong, html, logo, bgImage, arrowImage, trendImage, positionInfo;
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, bg = _a.bg, arrow = _a.arrow, bgColor = _a.bgColor;
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('{bgImage}', bgImage)
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
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@azuro-org/images-generator",
3
- "version": "1.3.0",
3
+ "version": "1.3.2",
4
4
  "license": "ISC",
5
5
  "engines": {
6
6
  "node": ">=16.15.1",