@visns-studio/visns-components 4.4.8 → 4.4.9

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.
@@ -1,6 +1,6 @@
1
1
  import '../../styles/global.css';
2
2
 
3
- import React, { useState } from 'react';
3
+ import React, { useEffect, useState } from 'react';
4
4
  import { Link, useLocation } from 'react-router-dom';
5
5
  import Reveal from 'react-reveal/Reveal';
6
6
  import { toast } from 'react-toastify';
@@ -10,7 +10,7 @@ import CustomFetch from '../Fetch';
10
10
 
11
11
  import styles from './styles/Login.module.css';
12
12
 
13
- const Login = ({ logo, providers, setSystemAuth, setUserProfile }) => {
13
+ const Login = ({ loginBg, logo, providers, setSystemAuth, setUserProfile }) => {
14
14
  const location = useLocation();
15
15
 
16
16
  const [auth, setAuth] = useState({
@@ -135,10 +135,20 @@ const Login = ({ logo, providers, setSystemAuth, setUserProfile }) => {
135
135
  }
136
136
  };
137
137
 
138
+ useEffect(() => {
139
+ console.info(loginBg, 'test111');
140
+ }, [loginBg]);
141
+
138
142
  return (
139
143
  <div className={styles.lcontainer}>
140
144
  <div className={styles.lwrap}>
141
- <aside className={styles.aside}></aside>
145
+ <aside
146
+ className={styles.aside}
147
+ style={{
148
+ backgroundImage: `url(${loginBg})`,
149
+ backgroundSize: 'cover',
150
+ }}
151
+ ></aside>
142
152
  <div className={styles.logincontainer}>
143
153
  <form onSubmit={handleSubmit}>
144
154
  <Reveal effect="fadeInUp">
@@ -44,7 +44,13 @@ const Reset = ({ logo }) => {
44
44
  return (
45
45
  <div className={styles.lcontainer}>
46
46
  <div className={styles.lwrap}>
47
- <aside className={styles.aside}></aside>
47
+ <aside
48
+ className={styles.aside}
49
+ style={{
50
+ backgroundImage: `url(${loginBg})`,
51
+ backgroundSize: 'cover',
52
+ }}
53
+ ></aside>
48
54
  <div className={styles.logincontainer}>
49
55
  <form onSubmit={handleSubmit}>
50
56
  <Reveal effect="fadeInUp">
@@ -96,7 +96,13 @@ const Verify = ({ logo }) => {
96
96
  return (
97
97
  <div className={styles.lcontainer}>
98
98
  <div className={styles.lwrap}>
99
- <aside className={styles.aside}></aside>
99
+ <aside
100
+ className={styles.aside}
101
+ style={{
102
+ backgroundImage: `url(${loginBg})`,
103
+ backgroundSize: 'cover',
104
+ }}
105
+ ></aside>
100
106
  <div className={styles.logincontainer}>
101
107
  <form onSubmit={handleSubmit}>
102
108
  <Reveal effect="fadeInUp">
@@ -133,8 +133,6 @@
133
133
  }
134
134
 
135
135
  .aside {
136
- background: url('../../images/loginbg.jpg') no-repeat;
137
- background-size: cover;
138
136
  opacity: 1;
139
137
  position: fixed;
140
138
  overflow: hidden;
@@ -133,8 +133,6 @@
133
133
  }
134
134
 
135
135
  .aside {
136
- background: url('../images/loginbg.jpg') no-repeat;
137
- background-size: cover;
138
136
  opacity: 1;
139
137
  position: fixed;
140
138
  overflow: hidden;
@@ -133,8 +133,6 @@
133
133
  }
134
134
 
135
135
  .aside {
136
- background: url('../images/loginbg.jpg') no-repeat;
137
- background-size: cover;
138
136
  opacity: 1;
139
137
  position: fixed;
140
138
  overflow: hidden;
@@ -34,6 +34,7 @@ const ProtectedRoute = ({ user, loading, redirectPath = '/login' }) => {
34
34
 
35
35
  const GenericAuth = ({
36
36
  layout = 'full',
37
+ loginBg,
37
38
  logo,
38
39
  headerLogo,
39
40
  providers,
@@ -70,6 +71,7 @@ const GenericAuth = ({
70
71
 
71
72
  useEffect(() => {
72
73
  updateAuthStatus();
74
+ console.info(loginBg, 'test222');
73
75
  }, [isAuthenticated]);
74
76
 
75
77
  return (
@@ -79,6 +81,7 @@ const GenericAuth = ({
79
81
  path="login"
80
82
  element={
81
83
  <LoginComponent
84
+ loginBg={loginBg}
82
85
  logo={logo}
83
86
  providers={providers}
84
87
  setIsAuthenticated={setIsAuthenticated}
@@ -90,6 +93,7 @@ const GenericAuth = ({
90
93
  path="reset"
91
94
  element={
92
95
  <ResetComponent
96
+ loginBg={loginBg}
93
97
  logo={logo}
94
98
  setIsAuthenticated={setIsAuthenticated}
95
99
  />
@@ -99,6 +103,7 @@ const GenericAuth = ({
99
103
  path="verify/:code"
100
104
  element={
101
105
  <VerifyComponent
106
+ loginBg={loginBg}
102
107
  logo={logo}
103
108
  setIsAuthenticated={setIsAuthenticated}
104
109
  />
@@ -140,8 +145,9 @@ const GenericAuth = ({
140
145
  };
141
146
 
142
147
  const LoginComponent = React.memo(
143
- ({ logo, providers, setIsAuthenticated, setUserProfile }) => (
148
+ ({ loginBg, logo, providers, setIsAuthenticated, setUserProfile }) => (
144
149
  <Login
150
+ loginBg={loginBg}
145
151
  logo={logo}
146
152
  providers={providers}
147
153
  setSystemAuth={setIsAuthenticated}
@@ -150,12 +156,12 @@ const LoginComponent = React.memo(
150
156
  )
151
157
  );
152
158
 
153
- const ResetComponent = React.memo(({ logo, setIsAuthenticated }) => (
154
- <Reset logo={logo} setSystemAuth={setIsAuthenticated} />
159
+ const ResetComponent = React.memo(({ loginBg, logo, setIsAuthenticated }) => (
160
+ <Reset loginBg={loginBg} logo={logo} setSystemAuth={setIsAuthenticated} />
155
161
  ));
156
162
 
157
- const VerifyComponent = React.memo(({ logo, setIsAuthenticated }) => (
158
- <Verify logo={logo} setSystemAuth={setIsAuthenticated} />
163
+ const VerifyComponent = React.memo(({ loginBg, logo, setIsAuthenticated }) => (
164
+ <Verify loginBg={loginBg} logo={logo} setSystemAuth={setIsAuthenticated} />
159
165
  ));
160
166
 
161
167
  export default GenericAuth;
@@ -181,12 +181,10 @@ select::-ms-expand {
181
181
  }
182
182
 
183
183
  .aside {
184
- background: url(../images/loginbg.jpg) no-repeat var(--background-color);
185
- background-size: cover;
186
184
  opacity: 1;
187
185
  position: fixed;
188
186
  overflow: hidden;
189
- height: 100%;
187
+ height: 101%;
190
188
  width: var(--sidebar-width);
191
189
  }
192
190
 
package/package.json CHANGED
@@ -58,7 +58,7 @@
58
58
  "react-dom": "^17.0.1"
59
59
  },
60
60
  "name": "@visns-studio/visns-components",
61
- "version": "4.4.8",
61
+ "version": "4.4.9",
62
62
  "description": "Various packages to assist in the development of our Custom Applications.",
63
63
  "main": "index.js",
64
64
  "scripts": {