funuicss 1.9.19 → 1.9.20

package/component/Button.jsx

@@ -87,7 +87,8 @@ function Button(_ref) {
     onChange: onChange,
     style: {
       height: height ? height : "",
-      width: fullWidth ? "100%" : width ? width : ""
+      width: fullWidth ? "100%" : width ? width : "",
+      borderRadius: flat ? "0rem" : ""
     }
   }, startIcon, " \xA0", text, children, " \xA0", endIcon);
 }

package/component/Starter.jsx

@@ -76,12 +76,14 @@ var Starter = function Starter() {
       display: 'block'
     }
   }, "Fun Ui @latest"), /*#__PURE__*/external_react_default().createElement("span", {
-    className: "text-big text-gradient",
+    className: "text-big text-secondary",
     style: {
       display: 'block',
       transition: '0.2s linear'
     }
-  }, "React & Next Js Ui Starter Library"), /*#__PURE__*/external_react_default().createElement("div", {
+  }, "React & Next.Js Ui "), /*#__PURE__*/external_react_default().createElement("div", {
+    className: "text-jumbo text-gradient"
+  }, "Library"), /*#__PURE__*/external_react_default().createElement("div", {
     className: "section"
   }), /*#__PURE__*/external_react_default().createElement("div", {
     className: "section"
@@ -115,7 +117,11 @@ var Starter = function Starter() {
     className: "text-primary text-bold"
   }, "`Tooltips`, "), "and other standard features like", /*#__PURE__*/external_react_default().createElement("span", {
     className: "text-primary text-bold"
-  }, "`helpers` "), "and", /*#__PURE__*/external_react_default().createElement("span", {
+  }, "`helpers` "), /*#__PURE__*/external_react_default().createElement("span", {
+    className: "text-primary text-bold"
+  }, "`requests` "), /*#__PURE__*/external_react_default().createElement("span", {
+    className: "text-primary text-bold"
+  }, "`styling` "), "and", /*#__PURE__*/external_react_default().createElement("span", {
     className: "text-primary text-bold"
   }, " `Blob generator` ")), /*#__PURE__*/external_react_default().createElement("div", {
     className: "section"
@@ -126,8 +132,10 @@ var Starter = function Starter() {
   }, /*#__PURE__*/external_react_default().createElement("div", null, /*#__PURE__*/external_react_default().createElement("div", null, /*#__PURE__*/external_react_default().createElement("a", {
     href: "https://funui.netlify.app"
   }, /*#__PURE__*/external_react_default().createElement("button", {
-    className: "button gradient roundBtn"
-  }, "Visit FunUi")))), /*#__PURE__*/external_react_default().createElement("div", null, /*#__PURE__*/external_react_default().createElement("div", {
+    className: "button gradient"
+  }, "Visit FunUi ", /*#__PURE__*/external_react_default().createElement("i", {
+    className: "fas fa-code-branch"
+  }))))), /*#__PURE__*/external_react_default().createElement("div", null, /*#__PURE__*/external_react_default().createElement("div", {
     className: "icon-container section full-width right"
   }, /*#__PURE__*/external_react_default().createElement("input", {
     className: "input full-width light width-200-min borderedInput",

package/component/Typography.jsx

@@ -80,15 +80,17 @@ function Typography(_ref) {
     underline = _ref.underline,
     align = _ref.align,
     lineHeight = _ref.lineHeight,
-    letterSpacing = _ref.letterSpacing;
+    letterSpacing = _ref.letterSpacing,
+    monospace = _ref.monospace,
+    font = _ref.font;
   return /*#__PURE__*/external_react_default().createElement("span", {
-    className: "\ntext-".concat(size, " \ntext-").concat(color, "\ntext-").concat(align, "\n").concat(align ? "block" : "", "\n").concat(bg, "\nhover-text-").concat(hoverText, "\nhover-").concat(hoverBg, "\n").concat(light ? "lightText" : lighter ? "lighterText" : "", "\n").concat(heading ? heading : "", "\n").concat(italic ? "italicText" : "", "\n").concat(underline ? "underlineText" : "", "\n").concat(body ? "body" : "", "\n").concat(article ? "article" : "", "\n").concat(funcss, "\n").concat(emp ? "emp" : "", "\n").concat(bold ? "bold" : "", "\n"),
+    className: "\n".concat(size ? "text-".concat(size) : "", "\n").concat(color ? "text-".concat(color) : '', "\n").concat(align ? "text-".concat(align) : '', "\n").concat(block ? "block" : "", "\n").concat(monospace ? "monospace" : "", "\n").concat(bg ? bg : "", "\n").concat(hoverText ? "hover-text-".concat(hoverText) : '', "\n").concat(hoverBg ? "hover-".concat(hoverBg) : '', "\n").concat(light ? "lightText" : lighter ? "lighterText" : "", "\n").concat(heading ? heading : "", "\n").concat(italic ? "italicText" : "", "\n").concat(underline ? "underlineText" : "", "\n").concat(body ? "body" : "", "\n").concat(article ? "article" : "", "\n").concat(funcss, "\n").concat(emp ? "emp" : "", "\n").concat(bold ? "bold" : "", "\n"),
     style: {
       display: block ? "block" : "",
-      transition: "0.2s linear",
       fontWeight: "".concat(bold ? "bold" : ""),
       lineHeight: lineHeight ? lineHeight : "",
-      letterSpacing: letterSpacing ? letterSpacing : ""
+      letterSpacing: letterSpacing ? letterSpacing : "",
+      fontFamily: font ? font : ""
     }
   }, children, text);
 }

package/css/fun.css

@@ -52,6 +52,9 @@
   --shadowMedium:0 0.8rem 2rem 0 rgba(0, 0, 0, 0.1);
   --card:0 2rem 3rem 0 rgba(0, 0, 0, 0.2);
 
+  /* medium Screen body */
+  --midBdFontSize:0.8rem;
+
 }
 
 
@@ -90,6 +93,11 @@ body {
   letter-spacing: normal;
 
 }
+@media (max-width:800px){
+body{
+  font-size: var(--midBdFontSize);
+}
+}
 
 .theme{
   background-color: var(--bd-theme);
@@ -320,24 +328,25 @@ link:hover {
   line-height: 1em;
   font-weight: 900;
 }
+.monospace{
+  font-family:monospace !important;
+}
 
 .text-big {
   font-size: calc(1.375rem + 2vw);
 }
 .text-small {
   font-size: var(--smallFont);
-  line-height: normal;
 }
 .text-smaller {
   font-size: var(--smallerFont);
-  line-height: normal;
 }
 .article{
-  line-height: 1.7rem;
+  line-height: 1.6rem;
   letter-spacing: normal;
 }
 .body{
-  line-height: 1.6rem;
+  line-height: 1.5rem;
   letter-spacing: normal;
   font-size: 1em;
 }
@@ -2135,12 +2144,7 @@ th {
   max-height: 70px;
   height: fit-content;
 }
-.modal-action > button,
-Button,
-.button {
-  display: inline-block;
-  margin: 0px 5px;
-}
+
 
 
 .notification{
@@ -2348,6 +2352,8 @@ Button,
   }
 }
 
+
+
 /* Progress bars */
 .progressBar {
   background-color: var(--lighter);
@@ -2556,6 +2562,14 @@ Button,
     transform: scale(1);
   }
 }
+@keyframes ScaleDown {
+  from {
+    transform: scale(1);
+  }
+  to {
+    transform: scale(0);
+  }
+}
 @keyframes Opacity {
   from {
     opacity: 0;
@@ -2564,6 +2578,22 @@ Button,
     opacity: 1;
   }
 }
+@keyframes FadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+@keyframes FadeOut {
+  from {
+    opacity: 1;
+  }
+  to {
+    opacity: 0;
+  }
+}
 
 @keyframes SlideBottom {
   from {

package/js/Fun.jsx

@@ -0,0 +1,235 @@
+/******/ (() => { // webpackBootstrap
+/******/ 	"use strict";
+/******/ 	// The require scope
+/******/ 	var __webpack_require__ = {};
+/******/ 	
+/************************************************************************/
+/******/ 	/* webpack/runtime/define property getters */
+/******/ 	(() => {
+/******/ 		// define getter functions for harmony exports
+/******/ 		__webpack_require__.d = (exports, definition) => {
+/******/ 			for(var key in definition) {
+/******/ 				if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
+/******/ 					Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
+/******/ 				}
+/******/ 			}
+/******/ 		};
+/******/ 	})();
+/******/ 	
+/******/ 	/* webpack/runtime/hasOwnProperty shorthand */
+/******/ 	(() => {
+/******/ 		__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
+/******/ 	})();
+/******/ 	
+/******/ 	/* webpack/runtime/make namespace object */
+/******/ 	(() => {
+/******/ 		// define __esModule on exports
+/******/ 		__webpack_require__.r = (exports) => {
+/******/ 			if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+/******/ 				Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+/******/ 			}
+/******/ 			Object.defineProperty(exports, '__esModule', { value: true });
+/******/ 		};
+/******/ 	})();
+/******/ 	
+/************************************************************************/
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "FunAdd": () => (/* binding */ FunAdd),
+/* harmony export */   "FunClass": () => (/* binding */ FunClass),
+/* harmony export */   "FunEvent": () => (/* binding */ FunEvent),
+/* harmony export */   "FunGet": () => (/* binding */ FunGet),
+/* harmony export */   "FunHide": () => (/* binding */ FunHide),
+/* harmony export */   "FunRequest": () => (/* binding */ FunRequest),
+/* harmony export */   "FunStyle": () => (/* binding */ FunStyle)
+/* harmony export */ });
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+var FunHide = {
+  hide: function hide(selector) {
+    var element = document.querySelector(selector);
+    element.style.display = "none";
+  },
+  show: function show(selector) {
+    var element = document.querySelector(selector);
+    element.style.display = "inline-block";
+  },
+  toggle: function toggle(selector) {
+    var element = document.querySelector(selector);
+    var style = element.style.display;
+    if (style == "none") {
+      element.style.display = "inline-block";
+    } else {
+      element.style.display = "none";
+    }
+  }
+};
+var FunGet = {
+  text: function text(selector, data) {
+    var element = document.querySelector(selector);
+    if (typeof element != 'undefined' && element != null) {
+      var text = element.textContent;
+      if (data) {
+        element.textContent = data;
+      } else {
+        return text ? text : '';
+      }
+    }
+  },
+  html: function html(selector, data) {
+    var element = document.querySelector(selector);
+    if (typeof element != 'undefined' && element != null) {
+      var text = element.innerHTML;
+      if (data) {
+        element.innerHTML = data;
+      } else {
+        return text ? text : "";
+      }
+    }
+  },
+  val: function val(selector, data) {
+    var element = document.querySelector(selector);
+    if (typeof element != 'undefined' && element != null) {
+      var text = element.value;
+      if (data) {
+        element.value = data;
+      } else {
+        return text;
+      }
+    }
+  }
+};
+var FunStyle = {
+  css: function css(selector, _css) {
+    // Get the element you want to style
+    var element = document.querySelector(selector);
+
+    // Define multiple styles using JavaScript objects
+    var styles = _css;
+
+    // Apply the styles to the element
+    Object.assign(element.style, styles);
+  }
+};
+var FunEvent = {
+  event: function event(selector, eventType, callBack) {
+    var element = document.querySelector(selector);
+    if (selector && eventType && callBack) {
+      if (typeof element != 'undefined' && element != null) {
+        document.querySelector(selector).addEventListener(eventType, callBack);
+      }
+    }
+  }
+};
+var FunClass = {
+  add: function add(selector, newClass) {
+    var element = document.querySelector(selector);
+    if (typeof element != 'undefined' && element != null && newClass) {
+      element.classList.add(newClass);
+    }
+  },
+  remove: function remove(selector, newClass) {
+    var element = document.querySelector(selector);
+    if (typeof element != 'undefined' && element != null && newClass) {
+      element.classList.remove(newClass);
+    }
+  }
+};
+var FunAdd = {
+  append: function append(selector, child) {
+    var element = document.querySelector(selector);
+    if (typeof element != 'undefined' && element != null && child) {
+      element.append(child);
+    }
+  },
+  prepend: function prepend(selector, child) {
+    var element = document.querySelector(selector);
+    if (typeof element != 'undefined' && element != null && child) {
+      element.prepend(child);
+    }
+  }
+};
+var FunRequest = {
+  get: function get(url, headers) {
+    return new Promise(function (resolve, reject) {
+      fetch(url, headers ? {
+        headers: headers
+      } : {}).then(function (response) {
+        return response.json();
+      }).then(function (data) {
+        // Handle the received data
+        resolve(data);
+      })["catch"](function (error) {
+        // Handle any errors that occur during the request
+        reject(error);
+      });
+    });
+  },
+  post: function post(url, body, headers) {
+    return new Promise(function (resolve, reject) {
+      fetch(url, {
+        method: 'POST',
+        headers: headers ? _objectSpread(_objectSpread({}, headers), {}, {
+          'Content-Type': 'application/json'
+        }) : {
+          'Content-Type': 'application/json'
+        },
+        body: JSON.stringify(body)
+      }).then(function (response) {
+        return response.json();
+      }).then(function (data) {
+        // Handle the received data
+        resolve(data);
+      })["catch"](function (error) {
+        // Handle any errors that occur during the request
+        reject(error);
+      });
+    });
+  },
+  patch: function patch(url, body, headers) {
+    return new Promise(function (resolve, reject) {
+      fetch(url, {
+        method: 'PATCH',
+        headers: headers ? _objectSpread(_objectSpread({}, headers), {}, {
+          'Content-Type': 'application/json'
+        }) : {
+          'Content-Type': 'application/json'
+        },
+        body: JSON.stringify(body)
+      }).then(function (response) {
+        return response.json();
+      }).then(function (data) {
+        // Handle the received data
+        resolve(data);
+      })["catch"](function (error) {
+        // Handle any errors that occur during the request
+        reject(error);
+      });
+    });
+  },
+  "delete": function _delete(url, headers) {
+    return new Promise(function (resolve, reject) {
+      fetch(url, {
+        method: 'DELETE',
+        headers: headers ? headers : {}
+      }).then(function (response) {
+        if (response.ok) {
+          resolve(); // Resolve with no data for successful DELETE requests
+        } else {
+          reject("Error: ".concat(response.status, " ").concat(response.statusText));
+        }
+      })["catch"](function (error) {
+        // Handle any errors that occur during the request
+        reject(error);
+      });
+    });
+  }
+};
+module.exports = __webpack_exports__;
+/******/ })()
+;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "funuicss",
-  "version": "1.9.19",
+  "version": "1.9.20",
   "description": "React/Next.js component UI Library for creating Easy and good looking websites with fewer lines of code.",
   "main": "index.js",
   "keywords": ["funui" , "React Component", "Next Component", "react" , "react and next component Library"],