gatsby-theme-q3 3.2.2 → 3.2.3

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/CHANGELOG.md CHANGED
@@ -3,6 +3,14 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [3.2.3](https://github.com/3merge/q/compare/v3.2.2...v3.2.3) (2022-02-10)
7
+
8
+ **Note:** Version bump only for package gatsby-theme-q3
9
+
10
+
11
+
12
+
13
+
6
14
  ## [3.2.2](https://github.com/3merge/q/compare/v3.2.1...v3.2.2) (2022-02-10)
7
15
 
8
16
  **Note:** Version bump only for package gatsby-theme-q3
@@ -23,7 +23,8 @@ const FormBoxContent = ({
23
23
  t
24
24
  } = (0, _q3UiLocale.useTranslation)();
25
25
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
26
- variant: "h1",
26
+ component: "h1",
27
+ variant: "h2",
27
28
  gutterBottom: true
28
29
  }, t(`titles:${title}`)), /*#__PURE__*/_react.default.createElement(_Typography.default, {
29
30
  gutterBottom: true
@@ -15,6 +15,8 @@ var _gatsby = require("gatsby");
15
15
 
16
16
  var _q3UiLocale = require("q3-ui-locale");
17
17
 
18
+ var _lodash = require("lodash");
19
+
18
20
  var _AdminPublicGateway = _interopRequireDefault(require("./AdminPublicGateway"));
19
21
 
20
22
  var _useSiteMetaData = _interopRequireDefault(require("./useSiteMetaData"));
@@ -46,12 +48,14 @@ const useStyle = (0, _core.makeStyles)(theme => ({
46
48
  photo
47
49
  }) => ({
48
50
  backgroundColor: theme.palette.secondary.light,
49
- backgroundImage: `url(${photo})`,
51
+ backgroundImage: (0, _lodash.isString)(photo) ? `url("${String(photo).replace(/\s/gi, '%20')}")` : undefined,
50
52
  backgroundSize: 'contain',
51
53
  backgroundPosition: 'center',
52
54
  backgroundRepeat: 'no-repeat',
53
55
  width: '100%',
54
- height: '100%'
56
+ height: '100%',
57
+ backgroundBlendMode: 'multiply',
58
+ minHeight: '55vh'
55
59
  })
56
60
  }));
57
61
 
@@ -79,7 +83,7 @@ const TextLink = ({
79
83
  }, /*#__PURE__*/_react.default.createElement(_core.Link, {
80
84
  href: href,
81
85
  target: "_blank"
82
- }, t(text)), ' ') : null;
86
+ }, t(text))) : null;
83
87
  };
84
88
 
85
89
  const PublicTemplate = ({
@@ -118,6 +122,7 @@ const PublicTemplate = ({
118
122
  }))), /*#__PURE__*/_react.default.createElement(_core.Paper, {
119
123
  className: cls.container
120
124
  }, /*#__PURE__*/_react.default.createElement(_core.Grid, {
125
+ alignItems: "center",
121
126
  container: true,
122
127
  spacing: 1
123
128
  }, /*#__PURE__*/_react.default.createElement(_core.Hidden, {
@@ -66,7 +66,8 @@ const Login = (0, _withPublicTemplate.default)((0, _withAuthenticate.default)(({
66
66
  to: "/reverify"
67
67
  }, t('labels:reverifyLink')))),
68
68
  renderTop: /*#__PURE__*/_react.default.createElement(_Typography.default, {
69
- variant: "h1",
69
+ component: "h1",
70
+ variant: "h2",
70
71
  gutterBottom: true
71
72
  }, t('titles:login'))
72
73
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "gatsby-theme-q3",
3
- "version": "3.2.2",
3
+ "version": "3.2.3",
4
4
  "main": "index.js",
5
5
  "license": "MIT",
6
6
  "peerDependencies": {
@@ -28,7 +28,7 @@
28
28
  "gatsby-plugin-robots-txt": "^1.6.14",
29
29
  "gatsby-plugin-sharp": "^4.2.0",
30
30
  "gatsby-plugin-sitemap": "^5.2.0",
31
- "gatsby-theme-q3-mui": "^3.2.2",
31
+ "gatsby-theme-q3-mui": "^3.2.3",
32
32
  "gatsby-transformer-sharp": "^4.2.0",
33
33
  "lodash": "^4.17.20",
34
34
  "process": "^0.11.10",
@@ -42,5 +42,5 @@
42
42
  "transform-loader": "^0.2.4",
43
43
  "yarn": "^1.22.17"
44
44
  },
45
- "gitHead": "c250a6bd44f4475e85b15057c649c2b6cc584836"
45
+ "gitHead": "d430a77040909c76b680e920a3f2cc7fd3264215"
46
46
  }
@@ -8,7 +8,7 @@ const FormBoxContent = ({ title, description }) => {
8
8
 
9
9
  return (
10
10
  <>
11
- <Typography variant="h1" gutterBottom>
11
+ <Typography component="h1" variant="h2" gutterBottom>
12
12
  {t(`titles:${title}`)}
13
13
  </Typography>
14
14
  <Typography gutterBottom>
@@ -10,6 +10,7 @@ import {
10
10
  } from '@material-ui/core';
11
11
  import { Link as ReachLink } from 'gatsby';
12
12
  import { useTranslation } from 'q3-ui-locale';
13
+ import { isString } from 'lodash';
13
14
  import AdminPublicGateway from './AdminPublicGateway';
14
15
  import useSiteMetaData from './useSiteMetaData';
15
16
 
@@ -39,12 +40,16 @@ const useStyle = makeStyles((theme) => ({
39
40
  },
40
41
  photo: ({ photo }) => ({
41
42
  backgroundColor: theme.palette.secondary.light,
42
- backgroundImage: `url(${photo})`,
43
+ backgroundImage: isString(photo)
44
+ ? `url("${String(photo).replace(/\s/gi, '%20')}")`
45
+ : undefined,
43
46
  backgroundSize: 'contain',
44
47
  backgroundPosition: 'center',
45
48
  backgroundRepeat: 'no-repeat',
46
49
  width: '100%',
47
50
  height: '100%',
51
+ backgroundBlendMode: 'multiply',
52
+ minHeight: '55vh',
48
53
  }),
49
54
  }));
50
55
 
@@ -66,7 +71,7 @@ const TextLink = ({ href, text }) => {
66
71
  <Box display="inline-block" mx={1}>
67
72
  <Link href={href} target="_blank">
68
73
  {t(text)}
69
- </Link>{' '}
74
+ </Link>
70
75
  </Box>
71
76
  ) : null;
72
77
  };
@@ -105,7 +110,7 @@ const PublicTemplate = ({ children, ...rest }) => {
105
110
  </ReachLink>
106
111
  </Box>
107
112
  <Paper className={cls.container}>
108
- <Grid container spacing={1}>
113
+ <Grid alignItems="center" container spacing={1}>
109
114
  <Hidden smDown>
110
115
  <Grid item xs={6}>
111
116
  <Box className={cls.photo} />
@@ -52,7 +52,11 @@ const Login = withPublicTemplate(
52
52
  </>
53
53
  }
54
54
  renderTop={
55
- <Typography variant="h1" gutterBottom>
55
+ <Typography
56
+ component="h1"
57
+ variant="h2"
58
+ gutterBottom
59
+ >
56
60
  {t('titles:login')}
57
61
  </Typography>
58
62
  }
@@ -1,120 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var _react = _interopRequireDefault(require("react"));
9
-
10
- var _core = require("@material-ui/core");
11
-
12
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13
-
14
- const PublicTemplateBackground = () => {
15
- const theme = (0, _core.useTheme)();
16
- return /*#__PURE__*/_react.default.createElement(_core.Box, {
17
- position: "fixed",
18
- top: 0,
19
- right: 0,
20
- left: 0,
21
- bottom: 0,
22
- overflow: "hidden"
23
- }, /*#__PURE__*/_react.default.createElement(_core.Box, {
24
- position: "fixed",
25
- top: 0,
26
- right: 0,
27
- left: 0,
28
- bottom: 0,
29
- style: {
30
- backgroundImage: 'url(https://images.unsplash.com/photo-1523293836414-f04e712e1f3b?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=703&q=80)',
31
- opacity: 0.1
32
- }
33
- }), /*#__PURE__*/_react.default.createElement(_core.Box, {
34
- position: "fixed",
35
- top: 0,
36
- right: 0,
37
- left: 0,
38
- bottom: 0,
39
- style: {
40
- background: `linear-gradient(90deg, ${theme.palette.secondary.dark} 0%, ${theme.palette.secondary.light} 35%, ${theme.palette.secondary.main} 100%)`,
41
- opacity: 0.1
42
- }
43
- }), /*#__PURE__*/_react.default.createElement("svg", {
44
- xmlns: "http://www.w3.org/2000/svg",
45
- style: {
46
- opacity: 0.15,
47
- minHeight: '100vh',
48
- minWidth: '100vw'
49
- }
50
- }, /*#__PURE__*/_react.default.createElement("defs", null, /*#__PURE__*/_react.default.createElement("linearGradient", {
51
- id: "a",
52
- x1: "0",
53
- x2: "0",
54
- y1: "1",
55
- y2: "0"
56
- }, /*#__PURE__*/_react.default.createElement("stop", {
57
- offset: "0",
58
- stopColor: theme.palette.background.muted
59
- }), /*#__PURE__*/_react.default.createElement("stop", {
60
- offset: "1",
61
- stopColor: theme.palette.secondary.dark
62
- })), /*#__PURE__*/_react.default.createElement("linearGradient", {
63
- id: "b",
64
- x1: "0",
65
- x2: "0",
66
- y1: "0",
67
- y2: "1"
68
- }, /*#__PURE__*/_react.default.createElement("stop", {
69
- offset: "0",
70
- stopColor: theme.palette.secondary.light
71
- }), /*#__PURE__*/_react.default.createElement("stop", {
72
- offset: "1",
73
- stopColor: theme.palette.secondary.main
74
- }))), /*#__PURE__*/_react.default.createElement("g", {
75
- fill: theme.palette.background.muted,
76
- fillOpacity: "0",
77
- strokeMiterlimit: "10"
78
- }, /*#__PURE__*/_react.default.createElement("g", {
79
- stroke: "url(#a)",
80
- strokeWidth: "2"
81
- }, /*#__PURE__*/_react.default.createElement("path", {
82
- transform: "translate(0 0)",
83
- d: "M1409 581 1450.35 511 1490 581z"
84
- }), /*#__PURE__*/_react.default.createElement("circle", {
85
- strokeWidth: "4",
86
- transform: "rotate(0 800 450)",
87
- cx: "500",
88
- cy: "100",
89
- r: "40"
90
- }), /*#__PURE__*/_react.default.createElement("path", {
91
- transform: "translate(0 0)",
92
- d: "M400.86 735.5h-83.73c0-23.12 18.74-41.87 41.87-41.87S400.86 712.38 400.86 735.5z"
93
- })), /*#__PURE__*/_react.default.createElement("g", {
94
- stroke: "url(#b)",
95
- strokeWidth: "4"
96
- }, /*#__PURE__*/_react.default.createElement("path", {
97
- transform: "translate(0 0)",
98
- d: "M149.8 345.2 118.4 389.8 149.8 434.4 181.2 389.8z"
99
- }), /*#__PURE__*/_react.default.createElement("rect", {
100
- strokeWidth: "8",
101
- transform: "rotate(0 1089 759)",
102
- x: "1039",
103
- y: "709",
104
- width: "100",
105
- height: "100"
106
- }), /*#__PURE__*/_react.default.createElement("path", {
107
- transform: "rotate(0 1400 132)",
108
- d: "M1426.8 132.4 1405.7 168.8 1363.7 168.8 1342.7 132.4 1363.7 96 1405.7 96z"
109
- })))), /*#__PURE__*/_react.default.createElement(_core.Box, {
110
- position: "fixed",
111
- bottom: "1rem",
112
- right: "1rem",
113
- zIndex: 10
114
- }, /*#__PURE__*/_react.default.createElement("small", null, "Texture made with", ' ', /*#__PURE__*/_react.default.createElement(_core.Link, {
115
- href: "https://www.design.svgbackgrounds.com/"
116
- }, "SVGBackgrounds.com"))));
117
- };
118
-
119
- var _default = PublicTemplateBackground;
120
- exports.default = _default;
@@ -1,140 +0,0 @@
1
- import React from 'react';
2
- import { Box, Link, useTheme } from '@material-ui/core';
3
-
4
- const PublicTemplateBackground = () => {
5
- const theme = useTheme();
6
-
7
- return (
8
- <Box
9
- position="fixed"
10
- top={0}
11
- right={0}
12
- left={0}
13
- bottom={0}
14
- overflow="hidden"
15
- >
16
- <Box
17
- position="fixed"
18
- top={0}
19
- right={0}
20
- left={0}
21
- bottom={0}
22
- style={{
23
- backgroundImage:
24
- 'url(https://images.unsplash.com/photo-1523293836414-f04e712e1f3b?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=703&q=80)',
25
- opacity: 0.1,
26
- }}
27
- />
28
- <Box
29
- position="fixed"
30
- top={0}
31
- right={0}
32
- left={0}
33
- bottom={0}
34
- style={{
35
- background: `linear-gradient(90deg, ${theme.palette.secondary.dark} 0%, ${theme.palette.secondary.light} 35%, ${theme.palette.secondary.main} 100%)`,
36
- opacity: 0.1,
37
- }}
38
- />
39
- <svg
40
- xmlns="http://www.w3.org/2000/svg"
41
- style={{
42
- opacity: 0.15,
43
- minHeight: '100vh',
44
- minWidth: '100vw',
45
- }}
46
- >
47
- <defs>
48
- <linearGradient
49
- id="a"
50
- x1="0"
51
- x2="0"
52
- y1="1"
53
- y2="0"
54
- >
55
- <stop
56
- offset="0"
57
- stopColor={theme.palette.background.muted}
58
- />
59
- <stop
60
- offset="1"
61
- stopColor={theme.palette.secondary.dark}
62
- />
63
- </linearGradient>
64
- <linearGradient
65
- id="b"
66
- x1="0"
67
- x2="0"
68
- y1="0"
69
- y2="1"
70
- >
71
- <stop
72
- offset="0"
73
- stopColor={theme.palette.secondary.light}
74
- />
75
- <stop
76
- offset="1"
77
- stopColor={theme.palette.secondary.main}
78
- />
79
- </linearGradient>
80
- </defs>
81
- <g
82
- fill={theme.palette.background.muted}
83
- fillOpacity="0"
84
- strokeMiterlimit="10"
85
- >
86
- <g stroke="url(#a)" strokeWidth="2">
87
- <path
88
- transform="translate(0 0)"
89
- d="M1409 581 1450.35 511 1490 581z"
90
- />
91
- <circle
92
- strokeWidth="4"
93
- transform="rotate(0 800 450)"
94
- cx="500"
95
- cy="100"
96
- r="40"
97
- />
98
- <path
99
- transform="translate(0 0)"
100
- d="M400.86 735.5h-83.73c0-23.12 18.74-41.87 41.87-41.87S400.86 712.38 400.86 735.5z"
101
- />
102
- </g>
103
- <g stroke="url(#b)" strokeWidth="4">
104
- <path
105
- transform="translate(0 0)"
106
- d="M149.8 345.2 118.4 389.8 149.8 434.4 181.2 389.8z"
107
- />
108
- <rect
109
- strokeWidth="8"
110
- transform="rotate(0 1089 759)"
111
- x="1039"
112
- y="709"
113
- width="100"
114
- height="100"
115
- />
116
- <path
117
- transform="rotate(0 1400 132)"
118
- d="M1426.8 132.4 1405.7 168.8 1363.7 168.8 1342.7 132.4 1363.7 96 1405.7 96z"
119
- />
120
- </g>
121
- </g>
122
- </svg>
123
- <Box
124
- position="fixed"
125
- bottom="1rem"
126
- right="1rem"
127
- zIndex={10}
128
- >
129
- <small>
130
- Texture made with{' '}
131
- <Link href="https://www.design.svgbackgrounds.com/">
132
- SVGBackgrounds.com
133
- </Link>
134
- </small>
135
- </Box>
136
- </Box>
137
- );
138
- };
139
-
140
- export default PublicTemplateBackground;