@visns-studio/visns-components 5.8.0 → 5.8.1

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 (2) hide show
  1. package/package.json +1 -1
  2. package/src/components/crm/auth/styles/Login.module.scss +80 -74
package/package.json CHANGED
@@ -82,7 +82,7 @@
82
82
  "react-dom": "^17.0.0 || ^18.0.0"
83
83
  },
84
84
  "name": "@visns-studio/visns-components",
85
- "version": "5.8.0",
85
+ "version": "5.8.1",
86
86
  "description": "Various packages to assist in the development of our Custom Applications.",
87
87
  "main": "src/index.js",
88
88
  "files": [
package/src/components/crm/auth/styles/Login.module.scss CHANGED
@@ -226,91 +226,97 @@
226
226
  }
227
227
  }
228
228
 
229
- input:not(:placeholder-shown) + .fi__span,
230
- textarea:not(:placeholder-shown) + .fi__span,
231
- select:not(:placeholder-shown) + .fi__span {
232
- transform: translateY(-135%) translateX(10px) scale(0.85);
233
- opacity: 1;
234
- padding: 0;
235
- background: white;
236
- font-weight: 500;
237
- transition: all 0.3s ease;
238
- color: var(--primary-color, #4f46e5) !important;
239
- }
229
+ /* Login component wrapper for all scoped styles */
230
+ .login,
231
+ .logincontainer,
232
+ .lcontainer {
233
+ /* Input, textarea, and select styling */
234
+ input:not(:placeholder-shown) + .fi__span,
235
+ textarea:not(:placeholder-shown) + .fi__span,
236
+ select:not(:placeholder-shown) + .fi__span {
237
+ transform: translateY(-135%) translateX(10px) scale(0.85);
238
+ opacity: 1;
239
+ padding: 0;
240
+ background: white;
241
+ font-weight: 500;
242
+ transition: all 0.3s ease;
243
+ color: var(--primary-color, #4f46e5) !important;
244
+ }
240
245
 
241
- input:focus + .fi__span,
242
- textarea:focus + .fi__span,
243
- select:focus + .fi__span {
244
- color: var(--primary-color, #4f46e5) !important;
245
- }
246
+ input:focus + .fi__span,
247
+ textarea:focus + .fi__span,
248
+ select:focus + .fi__span {
249
+ color: var(--primary-color, #4f46e5) !important;
250
+ }
246
251
 
247
- input:focus,
248
- textarea:focus,
249
- select:focus {
250
- border-color: var(--primary-color, #4f46e5) !important;
251
- outline: none;
252
- box-shadow: 0 0 0 2px rgba(var(--primary-rgb), 0.25);
253
- }
252
+ input:focus,
253
+ textarea:focus,
254
+ select:focus {
255
+ border-color: var(--primary-color, #4f46e5) !important;
256
+ outline: none;
257
+ box-shadow: 0 0 0 2px rgba(var(--primary-rgb), 0.25);
258
+ }
254
259
 
255
- /* Add divider styling for the OR section */
256
- .divider {
257
- display: flex;
258
- align-items: center;
259
- text-align: center;
260
- margin: 1rem 0;
261
- color: #9ca3af;
262
- font-size: 0.875rem;
263
- }
260
+ /* Divider styling for the OR section */
261
+ .divider {
262
+ display: flex;
263
+ align-items: center;
264
+ text-align: center;
265
+ margin: 1rem 0;
266
+ color: #9ca3af;
267
+ font-size: 0.875rem;
268
+ }
264
269
 
265
- .divider::before,
266
- .divider::after {
267
- content: '';
268
- flex: 1;
269
- border-bottom: 1px solid #e5e7eb;
270
- }
270
+ .divider::before,
271
+ .divider::after {
272
+ content: '';
273
+ flex: 1;
274
+ border-bottom: 1px solid #e5e7eb;
275
+ }
271
276
 
272
- .divider::before {
273
- margin-right: 1rem;
274
- }
277
+ .divider::before {
278
+ margin-right: 1rem;
279
+ }
275
280
 
276
- .divider::after {
277
- margin-left: 1rem;
278
- }
281
+ .divider::after {
282
+ margin-left: 1rem;
283
+ }
279
284
 
280
- /* SSO button styling */
281
- .ssoButton {
282
- display: flex;
283
- align-items: center;
284
- justify-content: center;
285
- width: 100%;
286
- padding: 0.75rem 1rem;
287
- background-color: white;
288
- border: 1px solid #e5e7eb;
289
- border-radius: 0.5rem;
290
- font-size: 0.875rem;
291
- font-weight: 500;
292
- color: #374151;
293
- transition: all 0.2s ease;
294
- box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
285
+ /* SSO button styling */
286
+ .ssoButton {
287
+ display: flex;
288
+ align-items: center;
289
+ justify-content: center;
290
+ width: 100%;
291
+ padding: 0.75rem 1rem;
292
+ background-color: white;
293
+ border: 1px solid #e5e7eb;
294
+ border-radius: 0.5rem;
295
+ font-size: 0.875rem;
296
+ font-weight: 500;
297
+ color: #374151;
298
+ transition: all 0.2s ease;
299
+ box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
295
300
 
296
- &:hover {
297
- background-color: var(--bg-color, #f5f3ef);
298
- border-color: var(--border-color, #e1e1e1);
299
- }
301
+ &:hover {
302
+ background-color: var(--bg-color, #f5f3ef);
303
+ border-color: var(--border-color, #e1e1e1);
304
+ }
300
305
 
301
- img {
302
- margin-right: 0.5rem;
306
+ img {
307
+ margin-right: 0.5rem;
308
+ }
303
309
  }
304
- }
305
310
 
306
- .forgotPasswordLink {
307
- &:hover {
308
- color: var(--secondary-color, #3cbf7d) !important;
309
- text-decoration: underline !important;
310
- }
311
+ .forgotPasswordLink {
312
+ &:hover {
313
+ color: var(--secondary-color, #3cbf7d) !important;
314
+ text-decoration: underline !important;
315
+ }
311
316
 
312
- &:focus {
313
- outline: 2px solid rgba(var(--primary-rgb), 0.25) !important;
314
- outline-offset: 2px !important;
317
+ &:focus {
318
+ outline: 2px solid rgba(var(--primary-rgb), 0.25) !important;
319
+ outline-offset: 2px !important;
320
+ }
315
321
  }
316
322
  }