funuicss 1.9.9 → 1.9.10

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 (18) hide show
  1. package/component/Alert.jsx +11 -5
  2. package/component/DarkMode.jsx +83 -0
  3. package/component/Div.jsx +4 -1
  4. package/component/FunLoader.jsx +5 -5
  5. package/component/LinkWrapper.jsx +3 -2
  6. package/component/NavBar.jsx +4 -2
  7. package/component/Notification.jsx +82 -0
  8. package/component/NotificationContent.jsx +71 -0
  9. package/component/NotificationFooter.jsx +71 -0
  10. package/component/NotificationHeader.jsx +71 -0
  11. package/component/Step.jsx +72 -0
  12. package/component/StepContainer.jsx +75 -0
  13. package/component/StepHeader.jsx +72 -0
  14. package/component/StepLine.jsx +72 -0
  15. package/css/fun.css +184 -71
  16. package/package.json +1 -1
  17. /package/component/pages/{404.jsx → NotFound.jsx} +0 -0
  18. /package/component/pages/{401.jsx → UnAuthotorized.jsx} +0 -0
package/component/Alert.jsx CHANGED
@@ -64,15 +64,17 @@ function Alert(_ref) {
64
64
  funcss = _ref.funcss,
65
65
  type = _ref.type,
66
66
  outlined = _ref.outlined,
67
- fixed = _ref.fixed;
67
+ fixed = _ref.fixed,
68
+ fullWidth = _ref.fullWidth,
69
+ isLoading = _ref.isLoading;
68
70
  return /*#__PURE__*/external_react_default().createElement("div", null, outlined ? /*#__PURE__*/external_react_default().createElement("div", {
69
71
  style: {
70
72
  animation: " ".concat(0.3, "s ", "ScaleUp")
71
73
  },
72
- className: "alert ".concat(type, "-outline\n ").concat(fixed == "top-left" ? "top-left" : "", "\n ").concat(fixed == "top-right" ? "top-right" : "", "\n ").concat(fixed == "bottom-left" ? "bottom-left" : "", "\n ").concat(fixed == "bottom-right" ? "bottom-right" : "", " \n \n ")
74
+ className: "alert ".concat(type, "-outline\n ").concat(fixed == "top-left" ? "top-left" : "", "\n ").concat(fixed == "top-right" ? "top-right" : "", "\n ").concat(fixed == "bottom-left" ? "bottom-left" : "", "\n ").concat(fixed == "bottom-right" ? "bottom-right" : "", " \n ").concat(fixed == "top-middle" ? "top-middle" : "", " \n ").concat(fixed == "bottom-middle" ? "bottom-middle" : "", " \n ").concat(fullWidth ? "width-100-p" : "", "\n ")
73
75
  }, /*#__PURE__*/external_react_default().createElement("div", {
74
76
  className: "alert-icon"
75
- }, type === "success" && /*#__PURE__*/external_react_default().createElement("i", {
77
+ }, !isLoading ? /*#__PURE__*/external_react_default().createElement("div", null, type === "success" && /*#__PURE__*/external_react_default().createElement("i", {
76
78
  className: "fa fa-check"
77
79
  }), type === "info" && /*#__PURE__*/external_react_default().createElement("i", {
78
80
  className: "fa fa-info-circle"
@@ -80,16 +82,18 @@ function Alert(_ref) {
80
82
  className: "fa fa-exclamation-triangle"
81
83
  }), type === "danger" && /*#__PURE__*/external_react_default().createElement("i", {
82
84
  className: "far fa-times-circle"
85
+ })) : /*#__PURE__*/external_react_default().createElement("i", {
86
+ className: "fas fa-spinner fa-spin"
83
87
  })), /*#__PURE__*/external_react_default().createElement("div", {
84
88
  className: "alert-text"
85
89
  }, message)) : "", !outlined ? /*#__PURE__*/external_react_default().createElement("div", {
86
90
  style: {
87
91
  animation: " ".concat(0.3, "s ", "ScaleUp")
88
92
  },
89
- className: "alert ".concat(funcss, " ").concat(type, " \n").concat(fixed == "top-left" ? "top-left" : "", "\n ").concat(fixed == "top-right" ? "top-right" : "", "\n ").concat(fixed == "bottom-left" ? "bottom-left" : "", "\n ").concat(fixed == "bottom-right" ? "bottom-right" : "", " ")
93
+ className: "alert ".concat(funcss, " ").concat(type, " \n").concat(fixed == "top-left" ? "top-left" : "", "\n ").concat(fixed == "top-right" ? "top-right" : "", "\n ").concat(fixed == "bottom-left" ? "bottom-left" : "", "\n ").concat(fixed == "bottom-right" ? "bottom-right" : "", " \n ").concat(fixed == "top-middle" ? "top-middle" : "", " \n ").concat(fixed == "bottom-middle" ? "bottom-middle" : "", " \n ").concat(fullWidth ? "width-100-p" : "", "\n \n ")
90
94
  }, /*#__PURE__*/external_react_default().createElement("div", {
91
95
  className: "alert-icon"
92
- }, type === "success" && /*#__PURE__*/external_react_default().createElement("i", {
96
+ }, !isLoading ? /*#__PURE__*/external_react_default().createElement("div", null, type === "success" && /*#__PURE__*/external_react_default().createElement("i", {
93
97
  className: "fa fa-check"
94
98
  }), type === "info" && /*#__PURE__*/external_react_default().createElement("i", {
95
99
  className: "fa fa-info-circle"
@@ -97,6 +101,8 @@ function Alert(_ref) {
97
101
  className: "fa fa-exclamation-triangle"
98
102
  }), type === "danger" && /*#__PURE__*/external_react_default().createElement("i", {
99
103
  className: "far fa-times-circle"
104
+ })) : /*#__PURE__*/external_react_default().createElement("i", {
105
+ className: "fas fa-spinner fa-spin"
100
106
  })), /*#__PURE__*/external_react_default().createElement("div", {
101
107
  className: "alert-text"
102
108
  }, message)) : "");
package/component/DarkMode.jsx ADDED
@@ -0,0 +1,83 @@
1
+ /******/ (() => { // webpackBootstrap
2
+ /******/ "use strict";
3
+ /******/ // The require scope
4
+ /******/ var __webpack_require__ = {};
5
+ /******/
6
+ /************************************************************************/
7
+ /******/ /* webpack/runtime/define property getters */
8
+ /******/ (() => {
9
+ /******/ // define getter functions for harmony exports
10
+ /******/ __webpack_require__.d = (exports, definition) => {
11
+ /******/ for(var key in definition) {
12
+ /******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
13
+ /******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
14
+ /******/ }
15
+ /******/ }
16
+ /******/ };
17
+ /******/ })();
18
+ /******/
19
+ /******/ /* webpack/runtime/hasOwnProperty shorthand */
20
+ /******/ (() => {
21
+ /******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
22
+ /******/ })();
23
+ /******/
24
+ /******/ /* webpack/runtime/make namespace object */
25
+ /******/ (() => {
26
+ /******/ // define __esModule on exports
27
+ /******/ __webpack_require__.r = (exports) => {
28
+ /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
29
+ /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
30
+ /******/ }
31
+ /******/ Object.defineProperty(exports, '__esModule', { value: true });
32
+ /******/ };
33
+ /******/ })();
34
+ /******/
35
+ /************************************************************************/
36
+ var __webpack_exports__ = {};
37
+ // ESM COMPAT FLAG
38
+ __webpack_require__.r(__webpack_exports__);
39
+
40
+ // EXPORTS
41
+ __webpack_require__.d(__webpack_exports__, {
42
+ "default": () => (/* binding */ DarkMode)
43
+ });
44
+
45
+ ;// CONCATENATED MODULE: external "react"
46
+ const external_react_namespaceObject = require("react");
47
+ ;// CONCATENATED MODULE: ../Funcss/Components/DarkMode.js
48
+
49
+ function DarkMode(state) {
50
+ if (state) {
51
+ var root = document.querySelector(':root');
52
+ var bdColor = "#FFFFFFD9";
53
+ var borderColor, raiseColor;
54
+ borderColor = "#444654";
55
+ raiseColor = "#1e1e1e";
56
+ root.style.setProperty('--bd-theme', "#141414");
57
+ root.style.setProperty('--bd-color', bdColor);
58
+ root.style.setProperty('--borderColor', borderColor);
59
+ root.style.setProperty('--raiseThemes', raiseColor);
60
+ root.style.setProperty('--lighter', "#33333349");
61
+ root.style.setProperty('--inputOutline', "#1e1e1e");
62
+ root.style.setProperty('--lightThemeDark', bdColor);
63
+
64
+ // dark theme for all the colors
65
+ root.style.setProperty('--success', "#1d6640");
66
+ root.style.setProperty('--successLight', " #c7e6c8");
67
+ root.style.setProperty('--info', "#2471a3");
68
+ root.style.setProperty('--infoLight', "#b3d9ed");
69
+ root.style.setProperty('--warning', "#8c3d00");
70
+ root.style.setProperty('--warningLight', "#d8b69c");
71
+ root.style.setProperty('--danger', "#6b0600");
72
+ root.style.setProperty('--dangerLight', "#bfbfbf");
73
+
74
+ // root.style.setProperty('--info', "#2471a3");
75
+ // root.style.setProperty('--infoLight', "#b3d9ed");
76
+
77
+ root.style.setProperty('--light', "#c5d8e0");
78
+ root.style.setProperty('--deepLight', "#154556");
79
+ }
80
+ }
81
+ module.exports = __webpack_exports__;
82
+ /******/ })()
83
+ ;
package/component/Div.jsx CHANGED
@@ -72,11 +72,14 @@ var Div = function Div(_ref) {
72
72
  padding = _ref.padding,
73
73
  margin = _ref.margin,
74
74
  fit = _ref.fit,
75
- customStyle = _ref.customStyle;
75
+ customStyle = _ref.customStyle,
76
+ onClick = _ref.onClick;
76
77
  return /*#__PURE__*/external_react_default().createElement("div", null, customStyle ? /*#__PURE__*/external_react_default().createElement("div", {
78
+ onClick: onClick,
77
79
  className: "".concat(fit ? "width-100-p height-100-p" : "", " ").concat(funcss),
78
80
  style: customStyle
79
81
  }, content ? content : children) : /*#__PURE__*/external_react_default().createElement("div", {
82
+ onClick: onClick,
80
83
  className: "".concat(fit ? "width-100-p height-100-p" : "", " ").concat(funcss),
81
84
  style: {
82
85
  height: height ? height : "",
package/component/FunLoader.jsx CHANGED
@@ -63,14 +63,14 @@ function FunLoader(_ref) {
63
63
  var funcss = _ref.funcss,
64
64
  size = _ref.size,
65
65
  fixed = _ref.fixed,
66
- backdrop = _ref.backdrop;
66
+ backdrop = _ref.backdrop,
67
+ color = _ref.color;
67
68
  return /*#__PURE__*/external_react_default().createElement("div", {
68
69
  className: "".concat(fixed ? "fixedLoader" : "", " ").concat(backdrop && fixed ? "backdropLoader" : "", " ")
69
- }, /*#__PURE__*/external_react_default().createElement("div", {
70
- className: "".concat(funcss ? funcss : "", " funLoading "),
70
+ }, /*#__PURE__*/external_react_default().createElement("i", {
71
+ className: "".concat(funcss ? funcss : "", " fas fa-spinner fa-spin text-").concat(color ? color : ""),
71
72
  style: {
72
- height: size ? size : "",
73
- width: size ? size : ""
73
+ fontSize: size ? size : ""
74
74
  }
75
75
  }));
76
76
  }
package/component/LinkWrapper.jsx CHANGED
@@ -62,9 +62,10 @@ var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_n
62
62
 
63
63
  function LinkWrapper(_ref) {
64
64
  var funcss = _ref.funcss,
65
- children = _ref.children;
65
+ children = _ref.children,
66
+ visibleLinks = _ref.visibleLinks;
66
67
  return /*#__PURE__*/external_react_default().createElement((external_react_default()).Fragment, null, /*#__PURE__*/external_react_default().createElement("div", {
67
- className: "".concat(funcss, " linkWrapper")
68
+ className: "".concat(funcss, " linkWrapper ").concat(visibleLinks ? "visibleLinks" : "")
68
69
  }, children));
69
70
  }
70
71
  module.exports = __webpack_exports__;
package/component/NavBar.jsx CHANGED
@@ -64,11 +64,13 @@ function Navbar(_ref) {
64
64
  fixedTop = _ref.fixedTop,
65
65
  funcss = _ref.funcss,
66
66
  padding = _ref.padding,
67
- fixedBottom = _ref.fixedBottom;
67
+ fixedBottom = _ref.fixedBottom,
68
+ justify = _ref.justify;
68
69
  return /*#__PURE__*/external_react_default().createElement("div", null, /*#__PURE__*/external_react_default().createElement("nav", {
69
70
  className: "\nnavigation-bar ".concat(funcss, " \n").concat(fixedTop ? "fixedTop" : "", "\n").concat(fixedBottom ? "fixedBottom" : ""),
70
71
  style: {
71
- padding: "".concat(padding ? padding : "")
72
+ padding: "".concat(padding ? padding : ""),
73
+ justifyContent: "".concat(justify ? justify : "")
72
74
  }
73
75
  }, children));
74
76
  }
package/component/Notification.jsx ADDED
@@ -0,0 +1,82 @@
1
+ /******/ (() => { // webpackBootstrap
2
+ /******/ "use strict";
3
+ /******/ // The require scope
4
+ /******/ var __webpack_require__ = {};
5
+ /******/
6
+ /************************************************************************/
7
+ /******/ /* webpack/runtime/compat get default export */
8
+ /******/ (() => {
9
+ /******/ // getDefaultExport function for compatibility with non-harmony modules
10
+ /******/ __webpack_require__.n = (module) => {
11
+ /******/ var getter = module && module.__esModule ?
12
+ /******/ () => (module['default']) :
13
+ /******/ () => (module);
14
+ /******/ __webpack_require__.d(getter, { a: getter });
15
+ /******/ return getter;
16
+ /******/ };
17
+ /******/ })();
18
+ /******/
19
+ /******/ /* webpack/runtime/define property getters */
20
+ /******/ (() => {
21
+ /******/ // define getter functions for harmony exports
22
+ /******/ __webpack_require__.d = (exports, definition) => {
23
+ /******/ for(var key in definition) {
24
+ /******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
25
+ /******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
26
+ /******/ }
27
+ /******/ }
28
+ /******/ };
29
+ /******/ })();
30
+ /******/
31
+ /******/ /* webpack/runtime/hasOwnProperty shorthand */
32
+ /******/ (() => {
33
+ /******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
34
+ /******/ })();
35
+ /******/
36
+ /******/ /* webpack/runtime/make namespace object */
37
+ /******/ (() => {
38
+ /******/ // define __esModule on exports
39
+ /******/ __webpack_require__.r = (exports) => {
40
+ /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
41
+ /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
42
+ /******/ }
43
+ /******/ Object.defineProperty(exports, '__esModule', { value: true });
44
+ /******/ };
45
+ /******/ })();
46
+ /******/
47
+ /************************************************************************/
48
+ var __webpack_exports__ = {};
49
+ // ESM COMPAT FLAG
50
+ __webpack_require__.r(__webpack_exports__);
51
+
52
+ // EXPORTS
53
+ __webpack_require__.d(__webpack_exports__, {
54
+ "default": () => (/* binding */ Notification)
55
+ });
56
+
57
+ ;// CONCATENATED MODULE: external "react"
58
+ const external_react_namespaceObject = require("react");
59
+ var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_namespaceObject);
60
+ ;// CONCATENATED MODULE: ../Funcss/Components/Notification.js
61
+
62
+ function Notification(_ref) {
63
+ var position = _ref.position,
64
+ funcss = _ref.funcss,
65
+ animation = _ref.animation,
66
+ duration = _ref.duration,
67
+ children = _ref.children,
68
+ state = _ref.state;
69
+ if (state) {
70
+ return /*#__PURE__*/external_react_default().createElement("div", {
71
+ className: "notification ".concat(position, " ").concat(funcss),
72
+ style: {
73
+ animation: " ".concat(duration ? duration : "0.2", "s ").concat(animation)
74
+ }
75
+ }, children);
76
+ } else {
77
+ return "";
78
+ }
79
+ }
80
+ module.exports = __webpack_exports__;
81
+ /******/ })()
82
+ ;
package/component/NotificationContent.jsx ADDED
@@ -0,0 +1,71 @@
1
+ /******/ (() => { // webpackBootstrap
2
+ /******/ "use strict";
3
+ /******/ // The require scope
4
+ /******/ var __webpack_require__ = {};
5
+ /******/
6
+ /************************************************************************/
7
+ /******/ /* webpack/runtime/compat get default export */
8
+ /******/ (() => {
9
+ /******/ // getDefaultExport function for compatibility with non-harmony modules
10
+ /******/ __webpack_require__.n = (module) => {
11
+ /******/ var getter = module && module.__esModule ?
12
+ /******/ () => (module['default']) :
13
+ /******/ () => (module);
14
+ /******/ __webpack_require__.d(getter, { a: getter });
15
+ /******/ return getter;
16
+ /******/ };
17
+ /******/ })();
18
+ /******/
19
+ /******/ /* webpack/runtime/define property getters */
20
+ /******/ (() => {
21
+ /******/ // define getter functions for harmony exports
22
+ /******/ __webpack_require__.d = (exports, definition) => {
23
+ /******/ for(var key in definition) {
24
+ /******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
25
+ /******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
26
+ /******/ }
27
+ /******/ }
28
+ /******/ };
29
+ /******/ })();
30
+ /******/
31
+ /******/ /* webpack/runtime/hasOwnProperty shorthand */
32
+ /******/ (() => {
33
+ /******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
34
+ /******/ })();
35
+ /******/
36
+ /******/ /* webpack/runtime/make namespace object */
37
+ /******/ (() => {
38
+ /******/ // define __esModule on exports
39
+ /******/ __webpack_require__.r = (exports) => {
40
+ /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
41
+ /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
42
+ /******/ }
43
+ /******/ Object.defineProperty(exports, '__esModule', { value: true });
44
+ /******/ };
45
+ /******/ })();
46
+ /******/
47
+ /************************************************************************/
48
+ var __webpack_exports__ = {};
49
+ // ESM COMPAT FLAG
50
+ __webpack_require__.r(__webpack_exports__);
51
+
52
+ // EXPORTS
53
+ __webpack_require__.d(__webpack_exports__, {
54
+ "default": () => (/* binding */ NotificationContent)
55
+ });
56
+
57
+ ;// CONCATENATED MODULE: external "react"
58
+ const external_react_namespaceObject = require("react");
59
+ var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_namespaceObject);
60
+ ;// CONCATENATED MODULE: ../Funcss/Components/NotificationContent.js
61
+
62
+ function NotificationContent(_ref) {
63
+ var funcss = _ref.funcss,
64
+ children = _ref.children;
65
+ return /*#__PURE__*/external_react_default().createElement("div", {
66
+ className: "notificationContent ".concat(funcss ? funcss : "")
67
+ }, children);
68
+ }
69
+ module.exports = __webpack_exports__;
70
+ /******/ })()
71
+ ;
package/component/NotificationFooter.jsx ADDED
@@ -0,0 +1,71 @@
1
+ /******/ (() => { // webpackBootstrap
2
+ /******/ "use strict";
3
+ /******/ // The require scope
4
+ /******/ var __webpack_require__ = {};
5
+ /******/
6
+ /************************************************************************/
7
+ /******/ /* webpack/runtime/compat get default export */
8
+ /******/ (() => {
9
+ /******/ // getDefaultExport function for compatibility with non-harmony modules
10
+ /******/ __webpack_require__.n = (module) => {
11
+ /******/ var getter = module && module.__esModule ?
12
+ /******/ () => (module['default']) :
13
+ /******/ () => (module);
14
+ /******/ __webpack_require__.d(getter, { a: getter });
15
+ /******/ return getter;
16
+ /******/ };
17
+ /******/ })();
18
+ /******/
19
+ /******/ /* webpack/runtime/define property getters */
20
+ /******/ (() => {
21
+ /******/ // define getter functions for harmony exports
22
+ /******/ __webpack_require__.d = (exports, definition) => {
23
+ /******/ for(var key in definition) {
24
+ /******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
25
+ /******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
26
+ /******/ }
27
+ /******/ }
28
+ /******/ };
29
+ /******/ })();
30
+ /******/
31
+ /******/ /* webpack/runtime/hasOwnProperty shorthand */
32
+ /******/ (() => {
33
+ /******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
34
+ /******/ })();
35
+ /******/
36
+ /******/ /* webpack/runtime/make namespace object */
37
+ /******/ (() => {
38
+ /******/ // define __esModule on exports
39
+ /******/ __webpack_require__.r = (exports) => {
40
+ /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
41
+ /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
42
+ /******/ }
43
+ /******/ Object.defineProperty(exports, '__esModule', { value: true });
44
+ /******/ };
45
+ /******/ })();
46
+ /******/
47
+ /************************************************************************/
48
+ var __webpack_exports__ = {};
49
+ // ESM COMPAT FLAG
50
+ __webpack_require__.r(__webpack_exports__);
51
+
52
+ // EXPORTS
53
+ __webpack_require__.d(__webpack_exports__, {
54
+ "default": () => (/* binding */ NotificationFooter)
55
+ });
56
+
57
+ ;// CONCATENATED MODULE: external "react"
58
+ const external_react_namespaceObject = require("react");
59
+ var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_namespaceObject);
60
+ ;// CONCATENATED MODULE: ../Funcss/Components/NotificationFooter.js
61
+
62
+ function NotificationFooter(_ref) {
63
+ var funcss = _ref.funcss,
64
+ children = _ref.children;
65
+ return /*#__PURE__*/external_react_default().createElement("div", {
66
+ className: "notificationFooter ".concat(funcss ? funcss : "")
67
+ }, children);
68
+ }
69
+ module.exports = __webpack_exports__;
70
+ /******/ })()
71
+ ;
package/component/NotificationHeader.jsx ADDED
@@ -0,0 +1,71 @@
1
+ /******/ (() => { // webpackBootstrap
2
+ /******/ "use strict";
3
+ /******/ // The require scope
4
+ /******/ var __webpack_require__ = {};
5
+ /******/
6
+ /************************************************************************/
7
+ /******/ /* webpack/runtime/compat get default export */
8
+ /******/ (() => {
9
+ /******/ // getDefaultExport function for compatibility with non-harmony modules
10
+ /******/ __webpack_require__.n = (module) => {
11
+ /******/ var getter = module && module.__esModule ?
12
+ /******/ () => (module['default']) :
13
+ /******/ () => (module);
14
+ /******/ __webpack_require__.d(getter, { a: getter });
15
+ /******/ return getter;
16
+ /******/ };
17
+ /******/ })();
18
+ /******/
19
+ /******/ /* webpack/runtime/define property getters */
20
+ /******/ (() => {
21
+ /******/ // define getter functions for harmony exports
22
+ /******/ __webpack_require__.d = (exports, definition) => {
23
+ /******/ for(var key in definition) {
24
+ /******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
25
+ /******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
26
+ /******/ }
27
+ /******/ }
28
+ /******/ };
29
+ /******/ })();
30
+ /******/
31
+ /******/ /* webpack/runtime/hasOwnProperty shorthand */
32
+ /******/ (() => {
33
+ /******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
34
+ /******/ })();
35
+ /******/
36
+ /******/ /* webpack/runtime/make namespace object */
37
+ /******/ (() => {
38
+ /******/ // define __esModule on exports
39
+ /******/ __webpack_require__.r = (exports) => {
40
+ /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
41
+ /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
42
+ /******/ }
43
+ /******/ Object.defineProperty(exports, '__esModule', { value: true });
44
+ /******/ };
45
+ /******/ })();
46
+ /******/
47
+ /************************************************************************/
48
+ var __webpack_exports__ = {};
49
+ // ESM COMPAT FLAG
50
+ __webpack_require__.r(__webpack_exports__);
51
+
52
+ // EXPORTS
53
+ __webpack_require__.d(__webpack_exports__, {
54
+ "default": () => (/* binding */ NotificationHeader)
55
+ });
56
+
57
+ ;// CONCATENATED MODULE: external "react"
58
+ const external_react_namespaceObject = require("react");
59
+ var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_namespaceObject);
60
+ ;// CONCATENATED MODULE: ../Funcss/Components/NotificationHeader.js
61
+
62
+ function NotificationHeader(_ref) {
63
+ var funcss = _ref.funcss,
64
+ children = _ref.children;
65
+ return /*#__PURE__*/external_react_default().createElement("div", {
66
+ className: "notificationHeader ".concat(funcss ? funcss : "")
67
+ }, children);
68
+ }
69
+ module.exports = __webpack_exports__;
70
+ /******/ })()
71
+ ;
package/component/Step.jsx ADDED
@@ -0,0 +1,72 @@
1
+ /******/ (() => { // webpackBootstrap
2
+ /******/ "use strict";
3
+ /******/ // The require scope
4
+ /******/ var __webpack_require__ = {};
5
+ /******/
6
+ /************************************************************************/
7
+ /******/ /* webpack/runtime/compat get default export */
8
+ /******/ (() => {
9
+ /******/ // getDefaultExport function for compatibility with non-harmony modules
10
+ /******/ __webpack_require__.n = (module) => {
11
+ /******/ var getter = module && module.__esModule ?
12
+ /******/ () => (module['default']) :
13
+ /******/ () => (module);
14
+ /******/ __webpack_require__.d(getter, { a: getter });
15
+ /******/ return getter;
16
+ /******/ };
17
+ /******/ })();
18
+ /******/
19
+ /******/ /* webpack/runtime/define property getters */
20
+ /******/ (() => {
21
+ /******/ // define getter functions for harmony exports
22
+ /******/ __webpack_require__.d = (exports, definition) => {
23
+ /******/ for(var key in definition) {
24
+ /******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
25
+ /******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
26
+ /******/ }
27
+ /******/ }
28
+ /******/ };
29
+ /******/ })();
30
+ /******/
31
+ /******/ /* webpack/runtime/hasOwnProperty shorthand */
32
+ /******/ (() => {
33
+ /******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
34
+ /******/ })();
35
+ /******/
36
+ /******/ /* webpack/runtime/make namespace object */
37
+ /******/ (() => {
38
+ /******/ // define __esModule on exports
39
+ /******/ __webpack_require__.r = (exports) => {
40
+ /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
41
+ /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
42
+ /******/ }
43
+ /******/ Object.defineProperty(exports, '__esModule', { value: true });
44
+ /******/ };
45
+ /******/ })();
46
+ /******/
47
+ /************************************************************************/
48
+ var __webpack_exports__ = {};
49
+ // ESM COMPAT FLAG
50
+ __webpack_require__.r(__webpack_exports__);
51
+
52
+ // EXPORTS
53
+ __webpack_require__.d(__webpack_exports__, {
54
+ "default": () => (/* binding */ Components_Step)
55
+ });
56
+
57
+ ;// CONCATENATED MODULE: external "react"
58
+ const external_react_namespaceObject = require("react");
59
+ var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_namespaceObject);
60
+ ;// CONCATENATED MODULE: ../Funcss/Components/Step.js
61
+
62
+ var Step = function Step(_ref) {
63
+ var children = _ref.children,
64
+ funcss = _ref.funcss;
65
+ return /*#__PURE__*/external_react_default().createElement("div", {
66
+ className: "step ".concat(funcss ? funcss : "")
67
+ }, children);
68
+ };
69
+ /* harmony default export */ const Components_Step = (Step);
70
+ module.exports = __webpack_exports__;
71
+ /******/ })()
72
+ ;
package/component/StepContainer.jsx ADDED
@@ -0,0 +1,75 @@
1
+ /******/ (() => { // webpackBootstrap
2
+ /******/ "use strict";
3
+ /******/ // The require scope
4
+ /******/ var __webpack_require__ = {};
5
+ /******/
6
+ /************************************************************************/
7
+ /******/ /* webpack/runtime/compat get default export */
8
+ /******/ (() => {
9
+ /******/ // getDefaultExport function for compatibility with non-harmony modules
10
+ /******/ __webpack_require__.n = (module) => {
11
+ /******/ var getter = module && module.__esModule ?
12
+ /******/ () => (module['default']) :
13
+ /******/ () => (module);
14
+ /******/ __webpack_require__.d(getter, { a: getter });
15
+ /******/ return getter;
16
+ /******/ };
17
+ /******/ })();
18
+ /******/
19
+ /******/ /* webpack/runtime/define property getters */
20
+ /******/ (() => {
21
+ /******/ // define getter functions for harmony exports
22
+ /******/ __webpack_require__.d = (exports, definition) => {
23
+ /******/ for(var key in definition) {
24
+ /******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
25
+ /******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
26
+ /******/ }
27
+ /******/ }
28
+ /******/ };
29
+ /******/ })();
30
+ /******/
31
+ /******/ /* webpack/runtime/hasOwnProperty shorthand */
32
+ /******/ (() => {
33
+ /******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
34
+ /******/ })();
35
+ /******/
36
+ /******/ /* webpack/runtime/make namespace object */
37
+ /******/ (() => {
38
+ /******/ // define __esModule on exports
39
+ /******/ __webpack_require__.r = (exports) => {
40
+ /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
41
+ /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
42
+ /******/ }
43
+ /******/ Object.defineProperty(exports, '__esModule', { value: true });
44
+ /******/ };
45
+ /******/ })();
46
+ /******/
47
+ /************************************************************************/
48
+ var __webpack_exports__ = {};
49
+ // ESM COMPAT FLAG
50
+ __webpack_require__.r(__webpack_exports__);
51
+
52
+ // EXPORTS
53
+ __webpack_require__.d(__webpack_exports__, {
54
+ "default": () => (/* binding */ Components_StepContainer)
55
+ });
56
+
57
+ ;// CONCATENATED MODULE: external "react"
58
+ const external_react_namespaceObject = require("react");
59
+ var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_namespaceObject);
60
+ ;// CONCATENATED MODULE: ../Funcss/Components/StepContainer.js
61
+
62
+ var StepContainer = function StepContainer(_ref) {
63
+ var children = _ref.children,
64
+ funcss = _ref.funcss,
65
+ responsiveMedium = _ref.responsiveMedium,
66
+ responsiveSmall = _ref.responsiveSmall,
67
+ lined = _ref.lined;
68
+ return /*#__PURE__*/external_react_default().createElement("div", {
69
+ className: "".concat(funcss ? funcss : "", " stepContainer\n ").concat(responsiveMedium ? "stepResponsiveMedium" : responsiveSmall ? "stepResponsiveSmall" : "")
70
+ }, children);
71
+ };
72
+ /* harmony default export */ const Components_StepContainer = (StepContainer);
73
+ module.exports = __webpack_exports__;
74
+ /******/ })()
75
+ ;
package/component/StepHeader.jsx ADDED
@@ -0,0 +1,72 @@
1
+ /******/ (() => { // webpackBootstrap
2
+ /******/ "use strict";
3
+ /******/ // The require scope
4
+ /******/ var __webpack_require__ = {};
5
+ /******/
6
+ /************************************************************************/
7
+ /******/ /* webpack/runtime/compat get default export */
8
+ /******/ (() => {
9
+ /******/ // getDefaultExport function for compatibility with non-harmony modules
10
+ /******/ __webpack_require__.n = (module) => {
11
+ /******/ var getter = module && module.__esModule ?
12
+ /******/ () => (module['default']) :
13
+ /******/ () => (module);
14
+ /******/ __webpack_require__.d(getter, { a: getter });
15
+ /******/ return getter;
16
+ /******/ };
17
+ /******/ })();
18
+ /******/
19
+ /******/ /* webpack/runtime/define property getters */
20
+ /******/ (() => {
21
+ /******/ // define getter functions for harmony exports
22
+ /******/ __webpack_require__.d = (exports, definition) => {
23
+ /******/ for(var key in definition) {
24
+ /******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
25
+ /******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
26
+ /******/ }
27
+ /******/ }
28
+ /******/ };
29
+ /******/ })();
30
+ /******/
31
+ /******/ /* webpack/runtime/hasOwnProperty shorthand */
32
+ /******/ (() => {
33
+ /******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
34
+ /******/ })();
35
+ /******/
36
+ /******/ /* webpack/runtime/make namespace object */
37
+ /******/ (() => {
38
+ /******/ // define __esModule on exports
39
+ /******/ __webpack_require__.r = (exports) => {
40
+ /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
41
+ /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
42
+ /******/ }
43
+ /******/ Object.defineProperty(exports, '__esModule', { value: true });
44
+ /******/ };
45
+ /******/ })();
46
+ /******/
47
+ /************************************************************************/
48
+ var __webpack_exports__ = {};
49
+ // ESM COMPAT FLAG
50
+ __webpack_require__.r(__webpack_exports__);
51
+
52
+ // EXPORTS
53
+ __webpack_require__.d(__webpack_exports__, {
54
+ "default": () => (/* binding */ StepHeader)
55
+ });
56
+
57
+ ;// CONCATENATED MODULE: external "react"
58
+ const external_react_namespaceObject = require("react");
59
+ var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_namespaceObject);
60
+ ;// CONCATENATED MODULE: ../Funcss/Components/StepHeader.js
61
+
62
+ var StepTitle = function StepTitle(_ref) {
63
+ var children = _ref.children,
64
+ funcss = _ref.funcss;
65
+ return /*#__PURE__*/external_react_default().createElement("div", {
66
+ className: "stepHeader ".concat(funcss ? funcss : "")
67
+ }, children);
68
+ };
69
+ /* harmony default export */ const StepHeader = (StepTitle);
70
+ module.exports = __webpack_exports__;
71
+ /******/ })()
72
+ ;
package/component/StepLine.jsx ADDED
@@ -0,0 +1,72 @@
1
+ /******/ (() => { // webpackBootstrap
2
+ /******/ "use strict";
3
+ /******/ // The require scope
4
+ /******/ var __webpack_require__ = {};
5
+ /******/
6
+ /************************************************************************/
7
+ /******/ /* webpack/runtime/compat get default export */
8
+ /******/ (() => {
9
+ /******/ // getDefaultExport function for compatibility with non-harmony modules
10
+ /******/ __webpack_require__.n = (module) => {
11
+ /******/ var getter = module && module.__esModule ?
12
+ /******/ () => (module['default']) :
13
+ /******/ () => (module);
14
+ /******/ __webpack_require__.d(getter, { a: getter });
15
+ /******/ return getter;
16
+ /******/ };
17
+ /******/ })();
18
+ /******/
19
+ /******/ /* webpack/runtime/define property getters */
20
+ /******/ (() => {
21
+ /******/ // define getter functions for harmony exports
22
+ /******/ __webpack_require__.d = (exports, definition) => {
23
+ /******/ for(var key in definition) {
24
+ /******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
25
+ /******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
26
+ /******/ }
27
+ /******/ }
28
+ /******/ };
29
+ /******/ })();
30
+ /******/
31
+ /******/ /* webpack/runtime/hasOwnProperty shorthand */
32
+ /******/ (() => {
33
+ /******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
34
+ /******/ })();
35
+ /******/
36
+ /******/ /* webpack/runtime/make namespace object */
37
+ /******/ (() => {
38
+ /******/ // define __esModule on exports
39
+ /******/ __webpack_require__.r = (exports) => {
40
+ /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
41
+ /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
42
+ /******/ }
43
+ /******/ Object.defineProperty(exports, '__esModule', { value: true });
44
+ /******/ };
45
+ /******/ })();
46
+ /******/
47
+ /************************************************************************/
48
+ var __webpack_exports__ = {};
49
+ // ESM COMPAT FLAG
50
+ __webpack_require__.r(__webpack_exports__);
51
+
52
+ // EXPORTS
53
+ __webpack_require__.d(__webpack_exports__, {
54
+ "default": () => (/* binding */ StepLine)
55
+ });
56
+
57
+ ;// CONCATENATED MODULE: external "react"
58
+ const external_react_namespaceObject = require("react");
59
+ var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_namespaceObject);
60
+ ;// CONCATENATED MODULE: ../Funcss/Components/StepLine.js
61
+
62
+ var StepLined = function StepLined(_ref) {
63
+ var children = _ref.children,
64
+ funcss = _ref.funcss;
65
+ return /*#__PURE__*/external_react_default().createElement("div", {
66
+ className: "stepLined ".concat(funcss ? funcss : "")
67
+ }, children);
68
+ };
69
+ /* harmony default export */ const StepLine = (StepLined);
70
+ module.exports = __webpack_exports__;
71
+ /******/ })()
72
+ ;
package/css/fun.css CHANGED
@@ -1,19 +1,6 @@
1
1
  /* Imports */
2
2
  @import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css");
3
- @import url('https://fonts.googleapis.com/css2?family=Maven+Pro:wght@400;500;600;700;800;900&display=swap');
4
3
  @import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
5
-
6
- /* @font-face {
7
- font-family: "bold";
8
- src: url(./font);
9
- }
10
- @font-face {
11
- font-family: "bold";
12
- src: url(./font);
13
- } */
14
-
15
-
16
-
17
4
  :root {
18
5
  /* Colors */
19
6
  --primaryColor: #0d6dfc;
@@ -36,13 +23,12 @@
36
23
  --lighter:#FAFAFA;
37
24
  --gradient:linear-gradient(90deg, var(--secondaryColor) 0%, var(--primaryColor) 100%);
38
25
  --gradientColors:90deg, var(--secondaryColor) 0%, var(--primaryColor) 100%;
39
- --linkColor:rgb(110, 168, 254);
26
+ --linkColor:rgb(124, 124, 124);
40
27
  /* Body and font */
41
28
  --bd-font-weight: 400;
42
- --bdfontSize: 0.95em;
29
+ --bdfontSize: 0.9em;
43
30
  --bd-line-height: normal;
44
31
  --fontFamily: 'Poppins', sans-serif;
45
- /* --logoFont: 'Maven Pro', sans-serif; */
46
32
  --smallFont: 0.8em;
47
33
  --smallerFont: 0.7em;
48
34
  --navHeight: 50px !important ;
@@ -57,19 +43,22 @@
57
43
  --modalZIndex:15;
58
44
  --loaderZindex:100;
59
45
  --snackBarZindex:20;
60
- --inputHeight:2.1rem;
46
+ --notificationZindex:21;
47
+ --inputHeight:2.3rem;
61
48
  --inputPadding:0.5rem 0;
62
49
  --smallScreens:600px;
63
50
  --mediumScreen:1000px;
64
51
  --largeScreen: calc(var(var(--mediumScreen)) + 1px);
65
52
  --shadowMedium:0 0.8rem 2rem 0 rgba(0, 0, 0, 0.1);
66
53
 
54
+ /* Darktheme effects */
55
+ --raiseThemes:"#FFFFFF";
56
+ --inputOutline:var(--successLight);
57
+ --lightThemeDark: var(--dark)
67
58
 
68
59
  }
69
60
 
70
61
 
71
-
72
-
73
62
  /* normalise css */
74
63
  * {
75
64
  font-family: var(--fontFamily);
@@ -98,6 +87,13 @@ body {
98
87
 
99
88
  }
100
89
 
90
+ .theme{
91
+ background-color: var(--bd-theme);
92
+ }
93
+ .raiseTheme{
94
+ background-color: var(--raiseThemes) !important;
95
+ }
96
+
101
97
  /* links and href */
102
98
  a,
103
99
  Link {
@@ -171,7 +167,7 @@ input {
171
167
  .lighter,
172
168
  .hover-lighter:hover {
173
169
  background-color: var(--lighter) !important;
174
- color: var(--dark);
170
+ color: var(--lightThemeDark);
175
171
  }
176
172
  .info,
177
173
  .hover-info:hover {
@@ -323,28 +319,21 @@ input {
323
319
  line-height: 1em;
324
320
  font-weight: 900;
325
321
  }
326
- .h1 ,h1 ,
327
- .h2 ,h2,
328
- .h3 ,h3
329
- {
330
- font-weight: 500;
331
- }
332
- .h4,h4,
333
- .h5,h5,
334
- .h6,h6{
335
- font-weight: 500;
336
- }
337
322
 
338
323
  .text-big {
339
324
  font-size: calc(1.375rem + 2vw);
340
325
  }
341
326
  .text-small {
342
327
  font-size: var(--smallFont);
328
+ line-height: 1.2rem;
329
+ }
330
+ .text-smaller {
331
+ font-size: var(--smallerFont);
332
+ line-height: 1rem;
343
333
  }
344
334
  .article{
345
335
  line-height: 1.7rem;
346
336
  letter-spacing: normal;
347
- font-weight: 300;
348
337
  }
349
338
  .body{
350
339
  line-height: 1.6rem;
@@ -354,9 +343,7 @@ input {
354
343
  .text-bigger {
355
344
  font-size: calc(1.375rem + 2.5vw);
356
345
  }
357
- .text-smaller {
358
- font-size: var(--smallerFont);
359
- }
346
+
360
347
  .text-jumbo {
361
348
  font-size: calc(1.375rem + 3vw);
362
349
  }
@@ -366,7 +353,18 @@ input {
366
353
  .text-bolder {
367
354
  font-weight: 800 !important;
368
355
  }
369
-
356
+ .lightText{
357
+ font-weight: 300;
358
+ }
359
+ .lighterText{
360
+ font-weight: 200;
361
+ }
362
+ .underlineText{
363
+ text-decoration: underline;
364
+ }
365
+ .italicText{
366
+ font-style: italic;
367
+ }
370
368
  h6,
371
369
  .h6,
372
370
  h5,
@@ -722,7 +720,7 @@ h6,
722
720
  }
723
721
  }
724
722
  @media only screen and (max-width:1000px) {
725
- .row-flex.responsiveMedium{
723
+ .row-flex.responsiveMedium {
726
724
  display: column;
727
725
  align-items: stretch;
728
726
  }
@@ -837,9 +835,7 @@ h6,
837
835
  text-decoration: none;
838
836
  overflow: hidden;
839
837
  }
840
- .button:active{
841
- outline: 0.2rem solid var(--light);
842
- }
838
+
843
839
  .button.ripple:active:after {
844
840
  padding: 0;
845
841
  margin: 0;
@@ -873,6 +869,7 @@ h6,
873
869
  .card {
874
870
  box-shadow: var(--shadowMedium);
875
871
  transition: 0.3s;
872
+ background-color: var(--raiseThemes);
876
873
  }
877
874
  .card.lg {
878
875
  box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175);
@@ -948,6 +945,8 @@ h6,
948
945
  align-items: center;
949
946
  padding: 0.5rem 5%;
950
947
  height: var(--navHeight);
948
+ gap: 2rem;
949
+ background-color: var(--raiseThemes);
951
950
  }
952
951
  #funSideBar{
953
952
  position: fixed;
@@ -967,6 +966,7 @@ h6,
967
966
  height: 100vh;
968
967
  box-shadow: 0 2rem 3rem 0 rgba(0, 0, 0, 0.2);
969
968
  animation: showNav 0.3s linear;
969
+ background-color: var(--raiseThemes);
970
970
  }
971
971
 
972
972
  @keyframes showNav {
@@ -1018,7 +1018,7 @@ h6,
1018
1018
  display: flex;
1019
1019
  flex-direction: row;
1020
1020
  align-items: center;
1021
- grid-gap: 0.2rem;
1021
+ grid-gap: 0.3rem;
1022
1022
  }
1023
1023
  .collapse {
1024
1024
  overflow: auto;
@@ -1034,10 +1034,13 @@ h6,
1034
1034
  .sidebar-trigger {
1035
1035
  display: block;
1036
1036
  }
1037
- .link-wrapper,
1037
+
1038
1038
  .linkWrapper {
1039
1039
  display: none;
1040
1040
  }
1041
+ .linkWrapper.visibleLinks{
1042
+ display: flex;
1043
+ }
1041
1044
  }
1042
1045
  .fixedTop {
1043
1046
  position: fixed !important;
@@ -1051,13 +1054,16 @@ h6,
1051
1054
  position: relative;
1052
1055
  display: flex;
1053
1056
  flex-direction: row;
1054
- padding: 1rem;
1057
+ padding: 0.4rem 0.8rem;
1055
1058
  border-radius: 5px;
1056
- font-family: 'semiBold';
1057
1059
  gap: 0.7rem;
1058
1060
  font-size: var(--smallFont);
1061
+ width: fit-content;
1059
1062
  }
1060
- .alert.top-right , .bottom-right , .top-left , .bottom-left{
1063
+ .alert.top-right , .alert.bottom-right ,
1064
+ .alert.top-left , .alert.bottom-left, .alert.top-middle ,
1065
+ .alert.bottom-middle
1066
+ {
1061
1067
  position: fixed;
1062
1068
  z-index: var(--snackBarZindex);
1063
1069
  box-shadow: 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.2);
@@ -1065,6 +1071,16 @@ h6,
1065
1071
  min-width: 250px;
1066
1072
  height: fit-content;
1067
1073
  }
1074
+ .alert.top-middle{
1075
+ top: 1rem;
1076
+ left: 50%;
1077
+ transform: translateX(-50%);
1078
+ }
1079
+ .alert.bottom-middle{
1080
+ bottom: 1rem;
1081
+ left: 50%;
1082
+ transform: translateX(-50%);
1083
+ }
1068
1084
  .alert.top-right{
1069
1085
  top: 1rem;
1070
1086
  right: 1rem;
@@ -1084,7 +1100,7 @@ h6,
1084
1100
  .alert-icon > i {
1085
1101
  cursor: pointer;
1086
1102
  margin: 0;
1087
- font-size: medium !important;
1103
+ font-size: 0.9rem;
1088
1104
  }
1089
1105
  .alert.success {
1090
1106
  background-color: rgb(237, 247, 237) !important;
@@ -1237,6 +1253,8 @@ h6,
1237
1253
  border: var(--inputBorder) transparent;
1238
1254
  border-bottom: var(--inputBorder) solid var(--borderColor);
1239
1255
  transition: 0.1s linear;
1256
+ background-color: var(--raiseThemes);
1257
+ color: var(--bd-color);
1240
1258
  }
1241
1259
  .input.success-input{
1242
1260
  border-bottom:var(--inputBorder) solid var(--success) !important;
@@ -1270,7 +1288,7 @@ input , select{height: var(--inputHeight);}
1270
1288
 
1271
1289
  .input.borderedInput:focus {
1272
1290
  border:var(--inputBorder) solid var(--primaryColor);
1273
- outline: 0.2rem solid var(--successLight);
1291
+ outline: 0.2rem solid var(--inputOutline);
1274
1292
  }
1275
1293
  .input.borderless {
1276
1294
  border: none;
@@ -1338,6 +1356,8 @@ input , select{height: var(--inputHeight);}
1338
1356
  padding-right: 2.2rem;
1339
1357
  }
1340
1358
 
1359
+
1360
+
1341
1361
  /*flex*/
1342
1362
  .flex {
1343
1363
  display: flex;
@@ -1881,8 +1901,7 @@ th {
1881
1901
  border: var(--border);
1882
1902
  }
1883
1903
  .table.stripped tr:nth-child(even) {
1884
- background-color: var(--light);
1885
- color: var(--deepLight);
1904
+ background-color: var(--lighter);
1886
1905
  }
1887
1906
  .table tr,
1888
1907
  th,
@@ -1899,10 +1918,10 @@ th {
1899
1918
  }
1900
1919
  .table.light {
1901
1920
  background-color: var(--light);
1902
- color: var(--dark);
1921
+ color: var(--lightThemeDark);
1903
1922
  }
1904
1923
  .table.dark {
1905
- background-color: var(--dark);
1924
+ background-color: var(--lightThemeDark);
1906
1925
  color: var(--light);
1907
1926
  }
1908
1927
  /*list*/
@@ -1929,7 +1948,7 @@ th {
1929
1948
  border-bottom: var(--border);
1930
1949
  }
1931
1950
  .list.stripped li:nth-child(even) {
1932
- background-color: var(--light);
1951
+ background-color: var(--lighter);
1933
1952
  }
1934
1953
  .list.stripped.dark li:nth-child(even) {
1935
1954
  background-color: var(--lightDark);
@@ -2016,6 +2035,7 @@ th {
2016
2035
  .modal {
2017
2036
  position: fixed;
2018
2037
  top: 0;
2038
+ display: flex;
2019
2039
  justify-content: center;
2020
2040
  align-items: center;
2021
2041
  left: 0;
@@ -2025,13 +2045,15 @@ th {
2025
2045
  height: 100%;
2026
2046
  min-height: 100vh;
2027
2047
  transition: 0.5s;
2048
+ overflow: auto;
2049
+
2028
2050
  }
2029
2051
  .modal.backdrop {
2030
- background-color: rgba(0, 0, 0, 0.4);
2052
+ background-color: rgba(0, 0, 0, 0.5);
2031
2053
  }
2032
- .modal-content {
2054
+ /* .modal-content {
2033
2055
  margin: 100px auto;
2034
- }
2056
+ } */
2035
2057
  .close-modal {
2036
2058
  float: right;
2037
2059
  margin: 30px;
@@ -2060,22 +2082,27 @@ th {
2060
2082
  .modal-title {
2061
2083
  padding: 0.5rem;
2062
2084
  border-bottom: 1.5px solid #ddd;
2085
+ max-height: 70px;
2086
+ height: fit-content;
2063
2087
  }
2064
2088
  .modal-content {
2065
2089
  background-color: var(--white);
2066
2090
  max-width: 700px;
2067
2091
  width: 100%;
2068
2092
  border-radius: 10px;
2069
- box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.1);
2093
+ background-color: var(--raiseThemes);
2070
2094
  }
2071
2095
  .modal-body {
2072
2096
  padding: 0.7rem;
2073
- max-height: 300px;
2097
+ height: 100%;
2098
+ max-height: calc(100vh - 200px) ;
2074
2099
  overflow: auto;
2075
2100
  }
2076
2101
  .modal-action {
2077
2102
  padding: 0.7rem;
2078
2103
  text-align: right;
2104
+ max-height: 70px;
2105
+ height: fit-content;
2079
2106
  }
2080
2107
  .modal-action > button,
2081
2108
  Button,
@@ -2083,6 +2110,42 @@ Button,
2083
2110
  display: inline-block;
2084
2111
  margin: 0px 5px;
2085
2112
  }
2113
+
2114
+
2115
+ .notification{
2116
+ position: fixed;
2117
+ max-width: 400px;
2118
+ background-color: var(--bd-theme);
2119
+ width: fit-content;
2120
+ padding: 1rem;
2121
+ border-radius: 0.3rem;
2122
+ box-shadow: 0 2rem 3rem 0 rgba(0, 0, 0, 0.2);
2123
+ z-index: var(--notificationZindex);
2124
+ display: flex;
2125
+ flex-direction: column;
2126
+ gap: 1rem;
2127
+ }
2128
+ .notificationBody{
2129
+ font-size: var(--smallFont);
2130
+ }
2131
+ .notification.bottom-left{
2132
+ bottom: 2rem;
2133
+ left: 2rem;
2134
+ }
2135
+ .notification.bottom-right{
2136
+ bottom: 2rem;
2137
+ right: 2rem;
2138
+ }
2139
+ .notification.top-left{
2140
+ top: 2rem;
2141
+ left: 2rem;
2142
+ }
2143
+ .notification.top-right{
2144
+ top: 2rem;
2145
+ right: 2rem;
2146
+ }
2147
+
2148
+
2086
2149
  /*background image*/
2087
2150
  .background.no-repeat {
2088
2151
  background-repeat: no-repeat;
@@ -2412,14 +2475,13 @@ Button,
2412
2475
  }
2413
2476
  .snackbar {
2414
2477
  position: fixed;
2415
- background-color: var(--dark);
2478
+ background-color: #1E1E1E;
2416
2479
  border-radius: 3px;
2417
- max-width: 400px;
2480
+ max-width: 90%;
2481
+ width: fit-content;
2418
2482
  color: var(--white);
2419
2483
  box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.5);
2420
2484
  z-index: var(--snackBarZindex);
2421
- display: flex;
2422
- align-items: center;
2423
2485
  font-size: var(--smallFont);
2424
2486
  }
2425
2487
  .snackbar.default {
@@ -2447,20 +2509,17 @@ Button,
2447
2509
  display: flex;
2448
2510
  justify-content: space-between;
2449
2511
  align-items: center;
2450
- padding: 0px 10px;
2451
- }
2452
- .snackbar-content {
2453
- padding: 5px;
2512
+ width: 100%;
2513
+ height: 100%;
2514
+ gap: 1rem;
2515
+ padding: 0.2rem 0.5rem;
2454
2516
  }
2517
+
2455
2518
  .close-snackbar {
2456
- padding: 5px;
2457
2519
  font-size: large;
2458
2520
  font-weight: 600;
2459
2521
  cursor: pointer;
2460
2522
  }
2461
- .snackbar-body {
2462
- padding: 5px;
2463
- }
2464
2523
 
2465
2524
  /* glassmophisiam */
2466
2525
  .glass {
@@ -2533,8 +2592,8 @@ Button,
2533
2592
  border-bottom-color:var(--light);
2534
2593
  border-left-color:var(--primaryColor);
2535
2594
  border-right-color:var(--light);
2536
- -webkit-animation: loader4 1s linear infinite;
2537
- animation: loader4 1s linear infinite;
2595
+ -webkit-animation: loader4 0.5s ease-in-out infinite;
2596
+ animation: loader4 0.5s ease-in-out infinite;
2538
2597
  }
2539
2598
  .fixedLoader{
2540
2599
  position: fixed;
@@ -2560,7 +2619,61 @@ background-color: rgba(0, 0, 0, 0.2);
2560
2619
  }
2561
2620
 
2562
2621
 
2622
+ /* steps */
2623
+ .stepContainer{
2624
+ display: flex;
2625
+ flex-direction: row;
2626
+ gap: 1rem;
2627
+ width: 100%;
2628
+ justify-content: space-evenly;
2629
+ align-items: center;
2630
+ }
2631
+
2632
+
2633
+ .stepLined{
2634
+ padding: 0rem !important;
2635
+ background-color: var(--borderColor);
2636
+ height: 0.02rem;
2637
+ border-radius: 0;
2638
+ max-width: 400px;
2639
+ min-width: 100px;
2640
+ margin-left: 0;
2641
+ }
2642
+ @media (max-width:600px) {
2643
+ .stepResponsiveSmall.stepContainer{
2644
+ align-items: flex-start;
2645
+ }
2646
+ .stepResponsiveSmall{
2647
+ flex-direction: column;
2648
+ }
2649
+ .stepContainer{width: fit-content;}
2650
+ .stepLined{
2651
+ min-height: 50px;
2652
+ width: 0.02rem !important;
2653
+ min-width: 0 !important;
2654
+ max-width: 0.02rem !important;
2655
+ margin: 0rem auto;
2563
2656
 
2657
+ }
2658
+ }
2659
+
2660
+ @media only screen and (max-width:1000px) {
2661
+ .stepResponsiveMedium.stepContainer{
2662
+ align-items: flex-start;
2663
+ }
2664
+ .stepResponsiveMedium{
2665
+ flex-direction: column;
2666
+ }
2667
+ .stepContainer{width: fit-content;}
2668
+ .stepLined{
2669
+ min-height: 50px;
2670
+ width: 0.02rem !important;
2671
+ min-width: 0 !important;
2672
+ max-width: 0.02rem !important;
2673
+ margin: 0rem auto;
2674
+
2675
+ }
2676
+ }
2564
2677
 
2565
2678
  /* grid */
2566
2679
  .row {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "funuicss",
3
- "version": "1.9.9",
3
+ "version": "1.9.10",
4
4
  "description": "React/Next.js component UI Library for creating Easy and good looking websites with fewer lines of code.",
5
5
  "main": "index.js",
6
6
  "scripts": {
/package/component/pages/{404.jsx → NotFound.jsx} RENAMED
File without changes
/package/component/pages/{401.jsx → UnAuthotorized.jsx} RENAMED
File without changes