funuicss 2.5.4 → 2.5.5

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 (13) hide show
  1. package/css/fun.css +321 -132
  2. package/package.json +3 -2
  3. package/tsconfig.tsbuildinfo +1 -1
  4. package/ui/alert/Alert.d.ts +1 -1
  5. package/ui/alert/Alert.js +5 -5
  6. package/ui/alert/Alert.tsx +6 -6
  7. package/ui/button/Button.d.ts +0 -346
  8. package/ui/button/Button.js +15 -349
  9. package/ui/button/Button.tsx +17 -700
  10. package/ui/progress/Bar.js +1 -1
  11. package/ui/progress/Bar.tsx +1 -1
  12. package/ui/theme/theme.js +6 -2
  13. package/ui/theme/theme.tsx +10 -3
package/ui/progress/Bar.js CHANGED
@@ -59,7 +59,7 @@ function ProgressBar(_a) {
59
59
  justifyContent: 'center',
60
60
  width: size,
61
61
  height: size,
62
- } }, isComplete ? React.createElement(pi_1.PiCheck, { className: "text-success800", size: size / 2.1 }) : renderContent())));
62
+ } }, isComplete ? React.createElement(pi_1.PiCheck, { className: "text-success800", size: size / 2.2 }) : renderContent())));
63
63
  }
64
64
  // Linear bar
65
65
  return (React.createElement("div", { className: "progressBar ".concat(raised ? 'raised' : '', " ").concat(rounded ? 'rounded' : '', " ").concat(funcss || '') },
package/ui/progress/Bar.tsx CHANGED
@@ -81,7 +81,7 @@ export default function ProgressBar({
81
81
  height: size,
82
82
  }}
83
83
  >
84
- {isComplete ? <PiCheck className="text-success800" size={size / 2.1} /> : renderContent()}
84
+ {isComplete ? <PiCheck className="text-success800" size={size / 2.2} /> : renderContent()}
85
85
  </div>
86
86
  </div>
87
87
  );
package/ui/theme/theme.js CHANGED
@@ -33,13 +33,13 @@ var ThemeProvider = function (_a) {
33
33
  '--page-bg': '#FFFFFF',
34
34
  '--text-color': '#000000',
35
35
  '--raiseThemes': '#FFFFFF',
36
- '--borderColor': '#CCCCCC',
37
36
  };
38
37
  var darkTheme = {
39
38
  '--page-bg': '#121212',
40
39
  '--text-color': '#FFFFFF',
41
40
  '--raiseThemes': '#202020',
42
41
  '--borderColor': '#333333',
42
+ '--lighter': '#202020',
43
43
  };
44
44
  var selectedTheme = theme === 'dark' ? darkTheme : lightTheme;
45
45
  Object.entries(selectedTheme).forEach(function (_a) {
@@ -47,6 +47,10 @@ var ThemeProvider = function (_a) {
47
47
  root.style.setProperty(key, value);
48
48
  });
49
49
  }, [theme]);
50
- return (react_1.default.createElement("div", { className: "theme-".concat(theme), style: { backgroundColor: 'var(--page-bg)', color: 'var(--text-color)', minHeight: '100vh' } }, children));
50
+ return (react_1.default.createElement("div", { className: "theme-".concat(theme), style: {
51
+ backgroundColor: 'var(--page-bg)',
52
+ color: 'var(--text-color)',
53
+ minHeight: '100vh',
54
+ } }, children));
51
55
  };
52
56
  exports.default = ThemeProvider;
package/ui/theme/theme.tsx CHANGED
@@ -1,4 +1,4 @@
1
- 'use client'
1
+ 'use client';
2
2
  import React, { useEffect } from 'react';
3
3
 
4
4
  interface ThemeProviderProps {
@@ -14,7 +14,6 @@ const ThemeProvider: React.FC<ThemeProviderProps> = ({ theme, children }) => {
14
14
  '--page-bg': '#FFFFFF',
15
15
  '--text-color': '#000000',
16
16
  '--raiseThemes': '#FFFFFF',
17
- '--borderColor': '#CCCCCC',
18
17
  };
19
18
 
20
19
  const darkTheme = {
@@ -22,6 +21,7 @@ const ThemeProvider: React.FC<ThemeProviderProps> = ({ theme, children }) => {
22
21
  '--text-color': '#FFFFFF',
23
22
  '--raiseThemes': '#202020',
24
23
  '--borderColor': '#333333',
24
+ '--lighter': '#202020',
25
25
  };
26
26
 
27
27
  const selectedTheme = theme === 'dark' ? darkTheme : lightTheme;
@@ -32,7 +32,14 @@ const ThemeProvider: React.FC<ThemeProviderProps> = ({ theme, children }) => {
32
32
  }, [theme]);
33
33
 
34
34
  return (
35
- <div className={`theme-${theme}`} style={{ backgroundColor: 'var(--page-bg)', color: 'var(--text-color)', minHeight: '100vh' }}>
35
+ <div
36
+ className={`theme-${theme}`}
37
+ style={{
38
+ backgroundColor: 'var(--page-bg)',
39
+ color: 'var(--text-color)',
40
+ minHeight: '100vh',
41
+ }}
42
+ >
36
43
  {children}
37
44
  </div>
38
45
  );