funuicss 2.6.20 → 2.7.0

package/css/fun.css

@@ -70,7 +70,7 @@
   --page-bg: #FFFFFF ; /* Page background color */
   --text-color: #000000; /* Text color */
   --raiseThemes:rgba(255, 255, 255 , 0.7); /* Raised element color */
-  --raiseOpaque:rgba(255, 255, 255 , 0.98); /* Raised element color */
+  --raiseOpaque:rgba(255, 255, 255 , 0.9); /* Raised element color */
   --raiseBackdrop:blur(20px); /* Raised element color */
   --borderRgb: 204, 204, 204; /* i want to chnage the opacity for someplaces*/
   --borderColor:rgb(var(--borderRgb)); /* Border color */
@@ -79,8 +79,8 @@
   --muted: #78716c;
   --dark: #121212;
   --cardBg: var(--raiseOpaque);
-  --card: 8px 8px 16px #d1d9e6,  /* soft shadow */
-           -8px -8px 16px #ffffff; /* soft highlight */
+  --card: 8px 8px 10rem -2rem rgba(0, 0 , 0 , 0.1),  /* soft shadow */
+           -8px -8px 4rem 0rem #F2F2F2; /* soft highlight */
   --linkColor:rgb(58, 58, 58);
 
     /* Primary Colors */
@@ -414,18 +414,13 @@ link:hover {
   background-color: var(--danger) !important;
   color: var(--white);
 }
-.light-danger,
-.hover-lightdanger:hover {
-  background-color: var(--dangerLight) !important;
-  color:var(--danger);
-}
 
 /* ui 3 */
 /* Primary Color */
 .primary,
 .hover-primary:hover {
   background-color: var(--primary) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--primary);
 }
 
@@ -433,7 +428,7 @@ link:hover {
 .primary50,
 .hover-primary50:hover {
   background-color: var(--primary50) !important;
-  color: var(--primary);
+  color: var(--primary)  !important;
   stroke: var(--primary50);
 }
 
@@ -441,7 +436,7 @@ link:hover {
 .primary100,
 .hover-primary100:hover {
   background-color: var(--primary100) !important;
-  color: var(--primary);
+  color: var(--primary)  !important;
   stroke: var(--primary100);
 }
 
@@ -449,7 +444,7 @@ link:hover {
 .primary200,
 .hover-primary200:hover {
   background-color: var(--primary200) !important;
-  color: var(--primary);
+  color: var(--primary)  !important;
   stroke: var(--primary200);
 }
 
@@ -457,7 +452,7 @@ link:hover {
 .primary300,
 .hover-primary300:hover {
   background-color: var(--primary300) !important;
-  color: var(--primary);
+  color: var(--primary)  !important;
   stroke: var(--primary300);
 }
 
@@ -465,7 +460,7 @@ link:hover {
 .primary400,
 .hover-primary400:hover {
   background-color: var(--primary400) !important;
-  color: var(--white);
+  color: var(--white)  !important;
   stroke: var(--primary400);
 }
 
@@ -473,7 +468,7 @@ link:hover {
 .primary500,
 .hover-primary500:hover {
   background-color: var(--primary500) !important;
-  color: var(--white);
+  color: var(--white)  !important;
   stroke: var(--primary500);
 }
 
@@ -481,7 +476,7 @@ link:hover {
 .primary600,
 .hover-primary600:hover {
   background-color: var(--primary600) !important;
-  color: var(--white);
+  color: var(--white)  !important;
   stroke: var(--primary600);
 }
 
@@ -489,7 +484,7 @@ link:hover {
 .primary700,
 .hover-primary700:hover {
   background-color: var(--primary700) !important;
-  color: var(--white);
+  color: var(--white)  !important;
   stroke: var(--primary700);
 }
 
@@ -497,7 +492,7 @@ link:hover {
 .primary800,
 .hover-primary800:hover {
   background-color: var(--primary800) !important;
-  color: var(--white);
+  color: var(--white)  !important;
   stroke: var(--primary800);
 }
 
@@ -505,7 +500,7 @@ link:hover {
 .primary900,
 .hover-primary900:hover {
   background-color: var(--primary900) !important;
-  color: var(--white);
+  color: var(--white)  !important;
   stroke: var(--primary900);
 }
 
@@ -514,7 +509,7 @@ link:hover {
 .secondary,
 .hover-secondary:hover {
   background-color: var(--secondary) !important;
-  color: var(--white);
+  color: var(--white)  !important;
   stroke: var(--secondary);
 }
 
@@ -522,7 +517,7 @@ link:hover {
 .secondary50,
 .hover-secondary50:hover {
   background-color: var(--secondary50) !important;
-  color: var(--secondary);
+  color: var(--secondary)  !important;
   stroke: var(--secondary50);
 }
 
@@ -530,7 +525,7 @@ link:hover {
 .secondary100,
 .hover-secondary100:hover {
   background-color: var(--secondary100) !important;
-  color: var(--secondary);
+  color: var(--secondary)  !important;
   stroke: var(--secondary100);
 }
 
@@ -538,7 +533,7 @@ link:hover {
 .secondary200,
 .hover-secondary200:hover {
   background-color: var(--secondary200) !important;
-  color: var(--secondary);
+  color: var(--secondary)  !important;
   stroke: var(--secondary200);
 }
 
@@ -546,7 +541,7 @@ link:hover {
 .secondary300,
 .hover-secondary300:hover {
   background-color: var(--secondary300) !important;
-  color: var(--secondary);
+  color: var(--secondary)  !important;
   stroke: var(--secondary300);
 }
 
@@ -554,7 +549,7 @@ link:hover {
 .secondary400,
 .hover-secondary400:hover {
   background-color: var(--secondary400) !important;
-  color: var(--white);
+  color: var(--white)  !important;
   stroke: var(--secondary400);
 }
 
@@ -562,7 +557,7 @@ link:hover {
 .secondary500,
 .hover-secondary500:hover {
   background-color: var(--secondary500) !important;
-  color: var(--white);
+  color: var(--white)  !important;
   stroke: var(--secondary500);
 }
 
@@ -578,7 +573,7 @@ link:hover {
 .secondary700,
 .hover-secondary700:hover {
   background-color: var(--secondary700) !important;
-  color: var(--white);
+  color: var(--white)  !important;
   stroke: var(--secondary700);
 }
 
@@ -586,7 +581,7 @@ link:hover {
 .secondary800,
 .hover-secondary800:hover {
   background-color: var(--secondary800) !important;
-  color: var(--white);
+  color: var(--white)  !important;
   stroke: var(--secondary800);
 }
 
@@ -601,42 +596,42 @@ link:hover {
 .accent,
 .hover-accent:hover {
   background-color: var(--accent) !important;
-  color: var(--white);
+  color: var(--white)  !important;
   stroke: var(--accent);
 }
 
 .accent50,
 .hover-accent50:hover {
   background-color: var(--accent50) !important;
-  color: var(--accent900);
+  color: var(--accent900)  !important;
   stroke: var(--accent50);
 }
 
 .accent100,
 .hover-accent100:hover {
   background-color: var(--accent100) !important;
-  color: var(--accent900);
+  color: var(--accent900)  !important;
   stroke: var(--accent100);
 }
 
 .accent200,
 .hover-accent200:hover {
   background-color: var(--accent200) !important;
-  color: var(--accent800);
+  color: var(--accent800)  !important;
   stroke: var(--accent200);
 }
 
 .accent300,
 .hover-accent300:hover {
   background-color: var(--accent300) !important;
-  color: var(--accent700);
+  color: var(--accent700)  !important;
   stroke: var(--accent300);
 }
 
 .accent400,
 .hover-accent400:hover {
   background-color: var(--accent400) !important;
-  color: var(--white);
+  color: var(--white)  !important;
   stroke: var(--accent400);
 }
 
@@ -650,7 +645,7 @@ link:hover {
 .accent600,
 .hover-accent600:hover {
   background-color: var(--accent600) !important;
-  color: var(--white);
+  color: var(--white)  !important;
   stroke: var(--accent600);
 }
 
@@ -664,14 +659,14 @@ link:hover {
 .accent800,
 .hover-accent800:hover {
   background-color: var(--accent800) !important;
-  color: var(--white);
+  color: var(--white)  !important;
   stroke: var(--accent800);
 }
 
 .accent900,
 .hover-accent900:hover {
   background-color: var(--accent900) !important;
-  color: var(--white);
+  color: var(--white)  !important;
   stroke: var(--accent900);
 }
 
@@ -679,7 +674,7 @@ link:hover {
 .error,
 .hover-error:hover {
   background-color: var(--error) !important;
-  color: var(--white);
+  color: var(--white)  !important;
   stroke: var(--error);
 }
 
@@ -687,7 +682,7 @@ link:hover {
 .error50,
 .hover-error50:hover {
   background-color: var(--error50) !important;
-  color: var(--error);
+  color: var(--error)  !important;
   stroke: var(--error50);
 }
 
@@ -695,7 +690,7 @@ link:hover {
 .error100,
 .hover-error100:hover {
   background-color: var(--error100) !important;
-  color: var(--error);
+  color: var(--error)  !important;
   stroke: var(--error100);
 }
 
@@ -703,7 +698,7 @@ link:hover {
 .error200,
 .hover-error200:hover {
   background-color: var(--error200) !important;
-  color: var(--error);
+  color: var(--error)  !important;
   stroke: var(--error200);
 }
 
@@ -711,7 +706,7 @@ link:hover {
 .error300,
 .hover-error300:hover {
   background-color: var(--error300) !important;
-  color: var(--error);
+  color: var(--error)  !important;
   stroke: var(--error300);
 }
 
@@ -719,7 +714,7 @@ link:hover {
 .error400,
 .hover-error400:hover {
   background-color: var(--error400) !important;
-  color: var(--white);
+  color: var(--white)  !important;
   stroke: var(--error400);
 }
 
@@ -727,7 +722,7 @@ link:hover {
 .error500,
 .hover-error500:hover {
   background-color: var(--error500) !important;
-  color: var(--white);
+  color: var(--white)  !important;
   stroke: var(--error500);
 }
 
@@ -735,7 +730,7 @@ link:hover {
 .error600,
 .hover-error600:hover {
   background-color: var(--error600) !important;
-  color: var(--white);
+  color: var(--white)  !important;
   stroke: var(--error600);
 }
 
@@ -743,7 +738,7 @@ link:hover {
 .error700,
 .hover-error700:hover {
   background-color: var(--error700) !important;
-  color: var(--white);
+  color: var(--white)  !important;
   stroke: var(--error700);
 }
 
@@ -751,7 +746,7 @@ link:hover {
 .error800,
 .hover-error800:hover {
   background-color: var(--error800) !important;
-  color: var(--white);
+  color: var(--white)  !important;
   stroke: var(--error800);
 }
 
@@ -767,7 +762,7 @@ link:hover {
 .success,
 .hover-success:hover {
   background-color: var(--success) !important;
-  color: var(--white);
+  color: var(--white)  !important;
   stroke: var(--success);
 }
 
@@ -775,7 +770,7 @@ link:hover {
 .success50,
 .hover-success50:hover {
   background-color: var(--success50) !important;
-  color: var(--success);
+  color: var(--success)  !important;
   stroke: var(--success50);
 }
 
@@ -783,7 +778,7 @@ link:hover {
 .success100,
 .hover-success100:hover {
   background-color: var(--success100) !important;
-  color: var(--success);
+  color: var(--success)  !important;
   stroke: var(--success100);
 }
 
@@ -791,7 +786,7 @@ link:hover {
 .success200,
 .hover-success200:hover {
   background-color: var(--success200) !important;
-  color: var(--success);
+  color: var(--success)  !important;
   stroke: var(--success200);
 }
 
@@ -799,7 +794,7 @@ link:hover {
 .success300,
 .hover-success300:hover {
   background-color: var(--success300) !important;
-  color: var(--success);
+  color: var(--success)  !important;
   stroke: var(--success300);
 }
 
@@ -807,7 +802,7 @@ link:hover {
 .success400,
 .hover-success400:hover {
   background-color: var(--success400) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--success400);
 }
 
@@ -823,7 +818,7 @@ link:hover {
 .success600,
 .hover-success600:hover {
   background-color: var(--success600) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--success600);
 }
 
@@ -839,7 +834,7 @@ link:hover {
 .success800,
 .hover-success800:hover {
   background-color: var(--success800) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--success800);
 }
 
@@ -847,7 +842,7 @@ link:hover {
 .success900,
 .hover-success900:hover {
   background-color: var(--success900) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--success900);
 }
 
@@ -855,7 +850,7 @@ link:hover {
 .warning,
 .hover-warning:hover {
   background-color: var(--warning) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--warning);
 }
 
@@ -863,7 +858,7 @@ link:hover {
 .warning50,
 .hover-warning50:hover {
   background-color: var(--warning50) !important;
-  color: var(--warning);
+  color: var(--warning) !important;
   stroke: var(--warning50);
 }
 
@@ -871,7 +866,7 @@ link:hover {
 .warning100,
 .hover-warning100:hover {
   background-color: var(--warning100) !important;
-  color: var(--warning);
+  color: var(--warning) !important;
   stroke: var(--warning100);
 }
 
@@ -887,7 +882,7 @@ link:hover {
 .warning300,
 .hover-warning300:hover {
   background-color: var(--warning300) !important;
-  color: var(--warning);
+  color: var(--warning) !important;
   stroke: var(--warning300);
 }
 
@@ -895,7 +890,7 @@ link:hover {
 .warning400,
 .hover-warning400:hover {
   background-color: var(--warning400) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--warning400);
 }
 
@@ -903,7 +898,7 @@ link:hover {
 .warning500,
 .hover-warning500:hover {
   background-color: var(--warning500) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--warning500);
 }
 
@@ -919,7 +914,7 @@ link:hover {
 .warning700,
 .hover-warning700:hover {
   background-color: var(--warning700) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--warning700);
 }
 
@@ -935,7 +930,7 @@ link:hover {
 .warning900,
 .hover-warning900:hover {
   background-color: var(--warning900) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--warning900);
 }
 
@@ -951,7 +946,7 @@ link:hover {
 .muted50,
 .hover-muted50:hover {
   background-color: var(--muted50) !important;
-  color: var(--muted);
+  color: var(--muted) !important;
   stroke: var(--muted50);
 }
 
@@ -975,7 +970,7 @@ link:hover {
 .muted300,
 .hover-muted300:hover {
   background-color: var(--muted300) !important;
-  color: var(--muted);
+  color: var(--muted) !important;
   stroke: var(--muted300);
 }
 
@@ -983,7 +978,7 @@ link:hover {
 .muted400,
 .hover-muted400:hover {
   background-color: var(--muted400) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--muted400);
 }
 
@@ -991,7 +986,7 @@ link:hover {
 .muted500,
 .hover-muted500:hover {
   background-color: var(--muted500) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--muted500);
 }
 
@@ -999,7 +994,7 @@ link:hover {
 .muted600,
 .hover-muted600:hover {
   background-color: var(--muted600) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--muted600);
 }
 
@@ -1008,14 +1003,14 @@ link:hover {
 .hover-muted700:hover {
   background-color: var(--muted700) !important;
   color: var(--white);
-  stroke: var(--muted700);
+  stroke: var(--muted700) !important;
 }
 
 /* Muted 800 */
 .muted800,
 .hover-muted800:hover {
   background-color: var(--muted800) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--muted800);
 }
 
@@ -1023,7 +1018,7 @@ link:hover {
 .muted900,
 .hover-muted900:hover {
   background-color: var(--muted900) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--muted900);
 }
 
@@ -1031,7 +1026,7 @@ link:hover {
 .info,
 .hover-info:hover {
   background-color: var(--info) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--info);
 }
 
@@ -1039,7 +1034,7 @@ link:hover {
 .info50,
 .hover-info50:hover {
   background-color: var(--info50) !important;
-  color: var(--info);
+  color: var(--info) !important;
   stroke: var(--info50);
 }
 
@@ -1047,7 +1042,7 @@ link:hover {
 .info100,
 .hover-info100:hover {
   background-color: var(--info100) !important;
-  color: var(--info);
+  color: var(--info) !important;
   stroke: var(--info100);
 }
 
@@ -1055,7 +1050,7 @@ link:hover {
 .info200,
 .hover-info200:hover {
   background-color: var(--info200) !important;
-  color: var(--info);
+  color: var(--info) !important;
   stroke: var(--info200);
 }
 
@@ -1071,7 +1066,7 @@ link:hover {
 .info400,
 .hover-info400:hover {
   background-color: var(--info400) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--info400);
 }
 
@@ -1079,7 +1074,7 @@ link:hover {
 .info500,
 .hover-info500:hover {
   background-color: var(--info500) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--info500);
 }
 
@@ -1087,7 +1082,7 @@ link:hover {
 .info600,
 .hover-info600:hover {
   background-color: var(--info600) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--info600);
 }
 
@@ -1095,7 +1090,7 @@ link:hover {
 .info700,
 .hover-info700:hover {
   background-color: var(--info700) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--info700);
 }
 
@@ -1103,7 +1098,7 @@ link:hover {
 .info800,
 .hover-info800:hover {
   background-color: var(--info800) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--info800);
 }
 
@@ -1111,7 +1106,7 @@ link:hover {
 .info900,
 .hover-info900:hover {
   background-color: var(--info900) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--info900);
 }
 
@@ -1119,20 +1114,21 @@ link:hover {
 .dark,
 .hover-dark:hover {
   background-color: var(--dark) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--dark);
 }
 
 .black,
 .hover-black:hover {
   background-color: var(--black) !important;
-  color: var(--white);
+  color: var(--white) !important;
   stroke: var(--black);
 }
 .white,
 .hover-white:hover {
   background-color: var(--white) !important;
-  stroke: var(--white);
+  color: var(--dark)  !important;
+  stroke: var(--white) !important;
 }
 
 
@@ -3300,17 +3296,18 @@ color: var(--text-color);
   position: absolute;
   box-shadow: var(--card);
   transition: 0.5s;
-  z-index: 1;
+  z-index: 999; /* Higher to sit above everything */
   width: 100%;
   min-width: max-content !important;
-  overflow: hidden;
+  overflow: visible; /* allow overflow! */
   border-radius: 0.5rem;
   background-color: var(--raiseOpaque) !important;
-  backdrop-filter: var(--raiseBackdrop) !important ;
+  backdrop-filter: var(--raiseBackdrop) !important;
   display: none;
 }
 
 
+
 .dropup:hover .drop-menu {
   display: block;
   z-index: 1;

package/index.d.ts

@@ -41,3 +41,5 @@ export { default as Lines } from "./ui/chart/Line";
 export { default as ChartPie } from "./ui/chart/Pie";
 export { default as SideBar } from "./ui/sidebar/SideBar";
 export { default as Video } from "./ui/video/Video";
+export { default as Cookie } from "./js/Cookie";
+export { FunGet } from "./js/Fun";