@blocklet/launcher-layout 1.5.62 → 1.5.65
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/lib/content.js +1 -1
- package/lib/header.js +7 -7
- package/lib/index.js +8 -3
- package/lib/locale.js +2 -2
- package/package.json +5 -5
package/lib/content.js
CHANGED
|
@@ -27,4 +27,4 @@ Content.propTypes = {
|
|
|
27
27
|
const Container = _styledComponents.default.div.withConfig({
|
|
28
28
|
displayName: "content__Container",
|
|
29
29
|
componentId: "sc-1b9ey7-0"
|
|
30
|
-
})(["display:flex;flex-direction:column;height:100%;width:100%;.center{display:flex;justify-content:center;}.page-title{text-align:center;}.toolbar{display:flex;justify-content:space-between;align-items:center;.toolbar_title{color:", ";font-size:16px;}}.page-footer{display:flex;justify-content:center;align-items:center;width:100%;background
|
|
30
|
+
})(["display:flex;flex-direction:column;height:100%;width:100%;.center{display:flex;justify-content:center;}.page-title{text-align:center;}.toolbar{display:flex;justify-content:space-between;align-items:center;.toolbar_title{color:", ";font-size:16px;}}.page-footer{display:flex;justify-content:center;align-items:center;width:100%;background:", ";.create-button{margin-right:32px;}& > button,.button{margin:0 8px;}", "{padding:24px;& > button,.button{margin:0 12px;min-width:200px;}}", "{margin-top:auto;padding:16px;}}"], props => props.theme.palette.grey['900'], props => props.theme.palette.common.white, props => props.theme.breakpoints.up('md'), props => props.theme.breakpoints.down('sm'));
|
package/lib/header.js
CHANGED
|
@@ -36,7 +36,7 @@ function AppHeader(_ref) {
|
|
|
36
36
|
locale
|
|
37
37
|
} = _ref;
|
|
38
38
|
const isMobile = (0, _useMediaQuery.default)(theme => theme.breakpoints.down('sm'));
|
|
39
|
-
const size = isMobile ?
|
|
39
|
+
const size = isMobile ? 32 : 48;
|
|
40
40
|
const appNameRef = (0, _react.useRef)(null);
|
|
41
41
|
const [appNameSize, setAppNameSize] = (0, _react.useState)('');
|
|
42
42
|
|
|
@@ -74,16 +74,16 @@ function AppHeader(_ref) {
|
|
|
74
74
|
className: "app-icon"
|
|
75
75
|
}, icon), /*#__PURE__*/_react.default.createElement("div", {
|
|
76
76
|
className: "header-title"
|
|
77
|
-
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
77
|
+
}, subTitle && /*#__PURE__*/_react.default.createElement("div", {
|
|
78
|
+
className: "header-title-sub"
|
|
79
|
+
}, subTitle), /*#__PURE__*/_react.default.createElement("div", {
|
|
78
80
|
className: "app-name-content"
|
|
79
|
-
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
81
|
+
}, !isMobile && /*#__PURE__*/_react.default.createElement("div", {
|
|
80
82
|
className: "launching-context"
|
|
81
83
|
}, (0, _locale.getLaunchingText)(locale)), title && /*#__PURE__*/_react.default.createElement("div", {
|
|
82
84
|
className: "header-title-name ".concat(appNameSize === 'middle' || appNameSize === 'small' ? 'middle-size' : ''),
|
|
83
85
|
ref: appNameRef
|
|
84
|
-
}, title))
|
|
85
|
-
className: "header-title-sub"
|
|
86
|
-
}, subTitle)));
|
|
86
|
+
}, title))));
|
|
87
87
|
}
|
|
88
88
|
|
|
89
89
|
AppHeader.propTypes = {
|
|
@@ -104,4 +104,4 @@ AppHeader.defaultProps = {
|
|
|
104
104
|
const Container = _styledComponents.default.div.withConfig({
|
|
105
105
|
displayName: "header__Container",
|
|
106
106
|
componentId: "sc-1twhts3-0"
|
|
107
|
-
})(["display:flex;justify-content:flex-start;align-items:flex-start;width:100%;", "{min-height:70px;}", "{align-items:center;}.app-name-content{width:100%;display:flex;align-items:center;justify-content:center;", "{align-items:flex-start;flex-direction:column;}", "{height:22px;}}.launching-context{flex-shrink:0;font-size:
|
|
107
|
+
})(["display:flex;justify-content:flex-start;align-items:flex-start;width:100%;", "{min-height:70px;}", "{align-items:center;}.app-name-content{width:100%;display:flex;align-items:center;justify-content:center;", "{align-items:flex-start;flex-direction:column;}", "{height:22px;}}.launching-context{flex-shrink:0;font-size:14px;font-weight:600;color:", ";", "{margin-bottom:4px;}", "{font-size:14px;line-height:15px;&:after{display:inline-block;margin:0 4px;content:':';}}}&.center-mode{align-items:flex-start;.launching-context{", "{margin-bottom:0;}}}.app-icon{flex-shrink:0;> *{display:block;vertical-align:middle;}}.header-title{flex:1;display:flex;flex-direction:column;justify-content:space-around;align-items:flex-start;margin-left:24px;", "{margin-left:16px;}.header-title-name{position:relative;display:flex;justify-content:center;align-items:center;flex:1;height:100%;color:", ";font-weight:700;", "{font-size:18px;line-height:1.2em;&.middle-size{font-size:16px;}}", "{display:block;max-width:calc(100vw - 100px);font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}}.header-title-sub{color:", ";font-size:12px;line-height:16px;", "{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}}}"], props => props.theme.breakpoints.up('md'), props => props.theme.breakpoints.down('sm'), props => props.theme.breakpoints.up('md'), props => props.theme.breakpoints.down('sm'), props => props.theme.palette.grey[500], props => props.theme.breakpoints.up('md'), props => props.theme.breakpoints.down('sm'), props => props.theme.breakpoints.up('sm'), props => props.theme.breakpoints.down('sm'), props => props.theme.palette.common.black, props => props.theme.breakpoints.up('sm'), props => props.theme.breakpoints.down('sm'), props => props.theme.palette.grey[700], props => props.theme.breakpoints.down('sm'));
|
package/lib/index.js
CHANGED
|
@@ -19,6 +19,8 @@ var _Hidden = _interopRequireDefault(require("@material-ui/core/Hidden"));
|
|
|
19
19
|
|
|
20
20
|
var _useMediaQuery = _interopRequireDefault(require("@material-ui/core/useMediaQuery"));
|
|
21
21
|
|
|
22
|
+
var _Skeleton = _interopRequireDefault(require("@material-ui/lab/Skeleton"));
|
|
23
|
+
|
|
22
24
|
var _step = require("./context/step");
|
|
23
25
|
|
|
24
26
|
var _locale = require("./locale");
|
|
@@ -74,9 +76,12 @@ function Layout(_ref) {
|
|
|
74
76
|
onClick: () => toggleNav(true),
|
|
75
77
|
className: "menu__icon"
|
|
76
78
|
}), /*#__PURE__*/_react.default.createElement(_header.default, {
|
|
77
|
-
title: /*#__PURE__*/_react.default.createElement("span", {
|
|
79
|
+
title: blockletMeta.title ? /*#__PURE__*/_react.default.createElement("span", {
|
|
78
80
|
className: "ellipsis-title"
|
|
79
|
-
}, blockletMeta.title),
|
|
81
|
+
}, blockletMeta.title) : /*#__PURE__*/_react.default.createElement(_Skeleton.default, {
|
|
82
|
+
variant: "text",
|
|
83
|
+
width: 100
|
|
84
|
+
}),
|
|
80
85
|
subTitle: "".concat(translations.stepTip, " ").concat(activeStep + 1, "/").concat(totalStepsCount),
|
|
81
86
|
logoUrl: logoUrl,
|
|
82
87
|
did: blockletMeta.did,
|
|
@@ -134,7 +139,7 @@ if (ua.includes('iphone os') && ua.includes('crios')) {
|
|
|
134
139
|
const Root = _styledComponents.default.div.withConfig({
|
|
135
140
|
displayName: "src__Root",
|
|
136
141
|
componentId: "sc-11nbl7p-2"
|
|
137
|
-
})(["display:flex;flex-direction:column;justify-content:center;align-items:center;height:100vh;", " .ellipsis-title{flex:1;position:absolute;left:0;top:0;width:100%;height:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}", "{background:#
|
|
142
|
+
})(["display:flex;flex-direction:column;justify-content:center;align-items:center;height:100vh;", " .ellipsis-title{flex:1;position:absolute;left:0;top:0;width:100%;height:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}", "{background:#e7ebea;}", "{background:", ";}.root-header{position:fixed;z-index:200;top:0;display:flex;width:100%;height:56px;align-items:center;", "{box-shadow:0px 1px 1px 0px rgba(168,180,197,0.12);}", "{padding:24px;justify-content:flex-end;}", "{padding:14px 16px;justify-content:space-between;background:", ";}.left{flex:1;display:flex;align-items:center;.menu__icon{margin-right:16px;color:", ";}}.right{display:flex;align-items:center;", "{button,a{padding-left:8px;padding-right:8px;}}}}"], injectStyle, props => props.theme.breakpoints.up('sm'), props => props.theme.breakpoints.down('sm'), props => props.theme.palette.common.white, props => props.theme.breakpoints.down('sm'), props => props.theme.breakpoints.up('sm'), props => props.theme.breakpoints.down('sm'), props => props.theme.palette.common.white, props => props.theme.palette.grey[500], props => props.theme.breakpoints.down('sm'));
|
|
138
143
|
|
|
139
144
|
const Center = _styledComponents.default.div.withConfig({
|
|
140
145
|
displayName: "src__Center",
|
package/lib/locale.js
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@blocklet/launcher-layout",
|
|
3
|
-
"version": "1.5.
|
|
3
|
+
"version": "1.5.65",
|
|
4
4
|
"description": "Common ux components of launcher",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
@@ -37,9 +37,9 @@
|
|
|
37
37
|
"react": ">=16.12.0"
|
|
38
38
|
},
|
|
39
39
|
"dependencies": {
|
|
40
|
-
"@arcblock/did-connect": "^1.16.
|
|
41
|
-
"@arcblock/icons": "^1.16.
|
|
42
|
-
"@arcblock/ux": "^1.16.
|
|
40
|
+
"@arcblock/did-connect": "^1.16.49",
|
|
41
|
+
"@arcblock/icons": "^1.16.49",
|
|
42
|
+
"@arcblock/ux": "^1.16.49",
|
|
43
43
|
"@material-ui/core": "^4.12.3",
|
|
44
44
|
"@material-ui/icons": "^4.11.2",
|
|
45
45
|
"@material-ui/lab": "^4.0.0-alpha.60",
|
|
@@ -56,5 +56,5 @@
|
|
|
56
56
|
"babel-plugin-inline-react-svg": "^2.0.1",
|
|
57
57
|
"babel-plugin-styled-components": "^1.10.7"
|
|
58
58
|
},
|
|
59
|
-
"gitHead": "
|
|
59
|
+
"gitHead": "f0d418d80249fc4d18fe2fd8481bd64a1010d4f4"
|
|
60
60
|
}
|