@antv/dumi-theme-antv 0.8.1 → 0.8.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.
@@ -32,4 +32,24 @@
32
32
  margin: 0;
33
33
  font-size: 16px;
34
34
  }
35
+
36
+ @media only screen and (max-width: 767.99px) {
37
+ .sage {
38
+ width: 80px;
39
+ }
40
+
41
+ h1 {
42
+ font-size: 22px;
43
+ line-height: 28px;
44
+ }
45
+
46
+ .desc {
47
+ font-size: 14px;
48
+ line-height: 22px;
49
+ }
50
+
51
+ .slogan {
52
+ font-size: 13px;
53
+ }
54
+ }
35
55
  }
@@ -99,6 +99,23 @@
99
99
  font-size: 14px;
100
100
  }
101
101
  }
102
+
103
+ @media only screen and (max-width: 767.99px) {
104
+ width: 100%;
105
+ height: auto;
106
+ min-height: 120px;
107
+
108
+ &.withDatasource {
109
+ height: auto;
110
+ min-height: 160px;
111
+ }
112
+
113
+ .header {
114
+ > div {
115
+ max-width: 100%;
116
+ }
117
+ }
118
+ }
102
119
  }
103
120
 
104
121
  .datasourceBtn {
@@ -43,3 +43,18 @@
43
43
  grid-template-columns: repeat(4, 1fr);
44
44
  gap: 16px;
45
45
  }
46
+
47
+ @media only screen and (max-width: 767.99px) {
48
+ .title {
49
+ width: 100%;
50
+
51
+ .quickStart {
52
+ font-size: 16px;
53
+ }
54
+ }
55
+
56
+ .list {
57
+ grid-template-columns: repeat(2, 1fr);
58
+ gap: 12px;
59
+ }
60
+ }
@@ -1,3 +1,8 @@
1
1
  .content {
2
2
  height: 500px;
3
+ isolation: isolate;
4
+
5
+ @media only screen and (max-width: 767.99px) {
6
+ height: auto;
7
+ }
3
8
  }
@@ -13,7 +13,7 @@ var GlobalLayout = function GlobalLayout() {
13
13
  if (typeof window !== 'undefined') {
14
14
  window.antd = antd;
15
15
  }
16
- console.log("%c @antv/dumi-theme-antv %c ".concat("0.8.1", " %c"), 'background:#35495e; padding: 1px; border-radius: 3px 0 0 3px; color: #fff;', 'background:#41b883; padding: 1px; border-radius: 0 3px 3px 0; color: #fff;', 'background:transparent;');
16
+ console.log("%c @antv/dumi-theme-antv %c ".concat("0.8.2", " %c"), 'background:#35495e; padding: 1px; border-radius: 3px 0 0 3px; color: #fff;', 'background:#41b883; padding: 1px; border-radius: 0 3px 3px 0; color: #fff;', 'background:transparent;');
17
17
  }, []);
18
18
  return outlet && /*#__PURE__*/React.createElement(QueryClientProvider, {
19
19
  client: queryClient
@@ -77,12 +77,12 @@
77
77
 
78
78
  50% {
79
79
  opacity: 0;
80
- top: -30px;
80
+ top: -44px;
81
81
  }
82
82
 
83
83
  83.3% {
84
84
  opacity: 0;
85
- top: 30px;
85
+ top: 44px;
86
86
  }
87
87
 
88
88
  100% {
@@ -95,12 +95,12 @@
95
95
  @keyframes showAndHide1 {
96
96
  0% {
97
97
  opacity: 0;
98
- top: 30px;
98
+ top: 44px;
99
99
  }
100
100
 
101
101
  33.3% {
102
102
  opacity: 0;
103
- top: 30px;
103
+ top: 44px;
104
104
  }
105
105
 
106
106
  50% {
@@ -115,6 +115,6 @@
115
115
 
116
116
  100% {
117
117
  opacity: 0;
118
- top: -30px;
118
+ top: -44px;
119
119
  }
120
120
  }
@@ -359,7 +359,9 @@
359
359
  }
360
360
 
361
361
  .notifications {
362
- width: 100%;
362
+ left: 4.5%;
363
+ width: calc(100% - 9%);
364
+ margin-left: 0;
363
365
  display: block;
364
366
  bottom: 20px;
365
367
  height: 48px;
@@ -1,10 +1,4 @@
1
- function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
2
1
  var _excluded = ["className", "style", "title", "engine", "description", "image", "imageStyle", "githubUrl", "showGithubStars", "buttons", "news"];
3
- function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
4
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
5
- function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
6
- function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
7
- function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
8
2
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
9
3
  function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
10
4
  function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -86,9 +80,7 @@ export var Detail = function Detail(_ref) {
86
80
  namespace: githubObj.owner,
87
81
  repo: githubObj.name
88
82
  }))))), /*#__PURE__*/React.createElement(HomeDialog, {
89
- style: {
90
- margin: "140px auto"
91
- }
83
+ className: styles.homeDialog
92
84
  }), /*#__PURE__*/React.createElement("div", {
93
85
  className: cx(styles.news, 'news')
94
86
  }, (news || remoteNews).slice(0, 3).map(function (n, i) {
@@ -101,11 +93,9 @@ export var Detail = function Detail(_ref) {
101
93
  }, /*#__PURE__*/React.createElement("div", {
102
94
  className: cx(styles.teaserimg, 'teaser-img')
103
95
  }, /*#__PURE__*/React.createElement("img", {
96
+ className: styles.teaserImage,
104
97
  width: "100%",
105
- style: _objectSpread({
106
- marginLeft: '100px',
107
- marginTop: '40px'
108
- }, imageStyle),
98
+ style: imageStyle,
109
99
  src: image
110
100
  }))), /*#__PURE__*/React.createElement("img", {
111
101
  className: styles.backLeftBottom,
@@ -28,8 +28,8 @@
28
28
  }
29
29
 
30
30
  .title {
31
- font-size: 3.4em; //2.875em;
32
- color: rgba(0, 0, 0, 100%);
31
+ font-size: 3.4em;
32
+ color: #000;
33
33
  position: relative;
34
34
  font-family: AlibabaPuHuiTiRHeavy;
35
35
 
@@ -38,80 +38,10 @@
38
38
  }
39
39
  }
40
40
 
41
- .description {
42
- margin-top: 0.83%; //12px;
43
- margin-bottom: 0;
44
- font-weight: 200;
45
- position: relative;
46
- width: 40%;
47
- max-width: 700px;
48
- font-family: AlibabaPuHuiTiR;
49
- font-size: 18px;
50
- color: #424e66;
51
- max-height: 145px;
52
- overflow: hidden;
53
- text-overflow: ellipsis;
54
- -webkit-line-clamp: 4;
55
- display: box;
56
- -webkit-box-orient: vertical;
57
- }
58
-
59
41
  .buttons {
60
42
  display: flex;
61
43
  margin-top: 10px;
62
44
 
63
- .buttonLink {
64
- display: flex;
65
- align-items: center;
66
- justify-content: center;
67
- border-radius: 12px;
68
- z-index: 10;
69
- position: relative;
70
- transition: all 0.3s;
71
- text-align: center;
72
- height: 54px;
73
- min-width: 166px;
74
- padding: 0 10px;
75
- background-color: #691eff;
76
- font-size: 18px;
77
- cursor: pointer;
78
- box-shadow: 0 8px 28px 0 #f2f2f2;
79
- margin-right: 20px;
80
- color: #fff;
81
- overflow: hidden;
82
-
83
- .icon {
84
- width: 20px;
85
- height: 20px;
86
- background-image: url(https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*lo_5RYdqKLsAAAAAAAAAAAAADmJ7AQ/original);
87
- margin-right: 6px;
88
- }
89
-
90
- &:hover {
91
- opacity: 0.8;
92
- }
93
-
94
- &.primary {
95
- background-color: #fff;
96
- color: #000;
97
- border: 1px solid #e8e8e8;
98
-
99
- .icon {
100
- position: relative;
101
- background-image: url(https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*_xFsQbWE_AYAAAAAAAAAAAAADmJ7AQ/original);
102
- }
103
-
104
- &:hover {
105
- color: #691eff;
106
-
107
- .icon {
108
- left: -80px;
109
- filter: drop-shadow(#691eff 80px 0);
110
- }
111
- }
112
- }
113
- }
114
-
115
45
  .githubWrapper {
116
46
  display: flex;
117
47
 
@@ -187,6 +117,7 @@
187
117
  height: 128px;
188
118
  box-sizing: border-box;
189
119
  padding: 0 4.5%;
120
+ overflow: hidden;
190
121
  }
191
122
 
192
123
  .teaser {
@@ -205,6 +136,12 @@
205
136
  width: 100%;
206
137
  height: auto;
207
138
  position: relative;
139
+
140
+ .teaserImage {
141
+ width: 100%;
142
+ margin-left: 100px;
143
+ margin-top: 40px;
144
+ }
208
145
  }
209
146
  }
210
147
 
@@ -215,18 +152,6 @@
215
152
  }
216
153
  }
217
154
 
218
- @media (max-width: 1144px) {
219
- .wrapper {
220
- .teaser {
221
- transition: 0.3s all;
222
- margin: auto;
223
- margin-top: 0;
224
- top: 0;
225
- bottom: 0;
226
- }
227
- }
228
- }
229
-
230
155
  @media (max-width: 900px) {
231
156
  .wrapper {
232
157
  .content {
@@ -241,33 +166,19 @@
241
166
  text-align: center;
242
167
  margin-left: 0;
243
168
 
244
- .title {
245
- font-size: 2.857em;
246
- margin-left: 0;
169
+ .titleButtons {
170
+ display: block;
247
171
  }
248
172
 
249
- .description {
250
- width: 100%;
251
- max-width: 100%;
173
+ .title {
174
+ font-size: 2.857em;
252
175
  margin-left: 0;
253
- font-size: 1em;
176
+ word-break: break-word;
177
+ overflow-wrap: break-word;
254
178
  }
255
179
 
256
180
  .buttons {
257
181
  display: inline-flex;
258
-
259
- .more {
260
- font-size: 1em;
261
- }
262
-
263
- .githubIframe {
264
- height: 40px;
265
- }
266
-
267
- .videoButtonWrapper {
268
- width: fit-content;
269
- height: fit-content;
270
- }
271
182
  }
272
183
  }
273
184
 
@@ -275,7 +186,7 @@
275
186
  width: 91%;
276
187
  padding: 0;
277
188
  display: block;
278
- bottom: 10x;
189
+ bottom: 10px;
279
190
  left: 4.5%;
280
191
  }
281
192
 
@@ -299,63 +210,113 @@
299
210
  }
300
211
  }
301
212
 
302
- @media (max-width: 786px) {
213
+ @media only screen and (max-width: 767.99px) {
303
214
  .wrapper {
304
- .text {
305
- .buttons {
306
- .videoButtonWrapper {
307
- display: none;
308
- }
309
- }
215
+ height: auto;
216
+ min-height: unset;
217
+ max-height: unset;
218
+ overflow: visible;
219
+ padding-bottom: 80px;
220
+
221
+ .content {
222
+ height: auto;
223
+ display: flex;
224
+ flex-direction: column;
225
+ width: 100%;
226
+ max-width: 100%;
227
+ margin-left: 0;
228
+ margin-right: 0;
229
+ margin-bottom: 0;
230
+ box-sizing: border-box;
310
231
  }
311
- }
312
- }
313
232
 
314
- @media (max-width: 510px) {
315
- .wrapper {
316
233
  .text {
317
- .buttons {
318
- margin-top: 70%;
319
- position: relative;
320
- top: -170px;
234
+ top: 0;
235
+ padding: 80px 4.5% 0;
236
+ margin-left: 0;
237
+ order: 1;
321
238
 
322
- .githubWrapper {
323
- display: none;
324
- }
239
+ .titleButtons {
240
+ display: block;
241
+ }
325
242
 
326
- .buttonLink:nth-child(2) {
327
- margin-right: 0;
328
- }
243
+ .title {
244
+ font-size: 2em;
245
+ text-align: center;
246
+ word-break: break-word;
247
+ overflow-wrap: break-word;
248
+ }
249
+
250
+ .buttons {
251
+ text-align: center;
252
+ margin-top: 12px;
329
253
  }
330
254
  }
331
255
 
332
256
  .teaser {
333
- width: 100%;
334
- top: 5%;
257
+ order: 2;
258
+ position: relative;
259
+ width: 70%;
260
+ height: auto;
261
+ max-width: none;
262
+ right: auto;
263
+ top: auto;
264
+ bottom: auto;
265
+ margin: 16px auto 0;
266
+ justify-content: center;
335
267
 
336
268
  .teaserimg {
337
269
  width: 100%;
270
+
271
+ .teaserImage {
272
+ margin-left: 0;
273
+ margin-top: 0;
274
+ }
338
275
  }
339
276
  }
340
277
 
278
+ .homeDialog {
279
+ order: 3;
280
+ margin: 16px auto;
281
+ }
282
+
283
+ .news {
284
+ order: 4;
285
+ position: relative;
286
+ bottom: auto;
287
+ left: auto;
288
+ width: 100%;
289
+ padding: 0 4.5%;
290
+ box-sizing: border-box;
291
+ }
292
+
341
293
  .backLeftBottom {
342
294
  display: none;
343
295
  }
344
296
  }
345
297
  }
346
298
 
347
- @media (max-width: 480px) {
299
+ @media only screen and (max-width: 480px) {
348
300
  .wrapper {
301
+ .teaser {
302
+ width: 90%;
303
+ }
304
+
349
305
  .text {
350
- height: 70%;
306
+ .buttons {
307
+ .githubWrapper {
308
+ display: none;
309
+ }
310
+ }
351
311
  }
352
312
 
353
313
  .news {
354
314
  height: 160px;
355
315
  }
356
-
357
- .teaser {
358
- top: 10%;
359
- }
360
316
  }
361
317
  }
318
+
319
+ .homeDialog {
320
+ margin: 140px auto;
321
+ }
322
+
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@antv/dumi-theme-antv",
3
- "version": "0.8.1",
3
+ "version": "0.8.2",
4
4
  "description": "AntV website theme based on dumi2.",
5
5
  "keywords": [
6
6
  "dumi",