evelearn-theme 1.0.2 → 1.0.3

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.
package/dist/index.d.mts CHANGED
@@ -151,7 +151,7 @@ declare const exerciseEditButton = "w-6 h-6 flex justify-center text-gray-700 da
151
151
  declare const tippyClassname = "p-2 bg-slate-600 dark:bg-slate-900 opacity-90 text-white font-medium font-header rounded-lg";
152
152
  declare const headerTippyClass = "rounded-lg p-2 bg-slate-950 opacity-95 text-white font-medium";
153
153
  declare const headerButtonClass = "w-10 h-10 rounded-full dark:hover:bg-slate-600 hover:bg-slate-200 bg-transparent flex justify-center items-center flex justify-center items-center text-slate-600 dark:text-slate-100 hover:text-primary dark:hover:text-primary transition-colors duration-50";
154
- declare const toolbarExerciseButton = "flex bg-gray-50 bg-opacity-95 items-center sm:justify-between p-4 shadow-sm w-full rounded-xl border-4 border-transparent hover:border-white text-gray-700 hover:text-white hover:bg-indigo-500 transition-colors duration-75";
154
+ declare const toolbarExerciseButton = "flex bg-gray-50/90 items-center sm:justify-between p-4 shadow-sm w-full rounded-xl border-4 border-transparent hover:border-white text-gray-700 hover:text-white hover:bg-indigo-500 transition-colors duration-75";
155
155
 
156
156
  type IconInfoProps = {
157
157
  content: string;
package/dist/index.d.ts CHANGED
@@ -151,7 +151,7 @@ declare const exerciseEditButton = "w-6 h-6 flex justify-center text-gray-700 da
151
151
  declare const tippyClassname = "p-2 bg-slate-600 dark:bg-slate-900 opacity-90 text-white font-medium font-header rounded-lg";
152
152
  declare const headerTippyClass = "rounded-lg p-2 bg-slate-950 opacity-95 text-white font-medium";
153
153
  declare const headerButtonClass = "w-10 h-10 rounded-full dark:hover:bg-slate-600 hover:bg-slate-200 bg-transparent flex justify-center items-center flex justify-center items-center text-slate-600 dark:text-slate-100 hover:text-primary dark:hover:text-primary transition-colors duration-50";
154
- declare const toolbarExerciseButton = "flex bg-gray-50 bg-opacity-95 items-center sm:justify-between p-4 shadow-sm w-full rounded-xl border-4 border-transparent hover:border-white text-gray-700 hover:text-white hover:bg-indigo-500 transition-colors duration-75";
154
+ declare const toolbarExerciseButton = "flex bg-gray-50/90 items-center sm:justify-between p-4 shadow-sm w-full rounded-xl border-4 border-transparent hover:border-white text-gray-700 hover:text-white hover:bg-indigo-500 transition-colors duration-75";
155
155
 
156
156
  type IconInfoProps = {
157
157
  content: string;
package/dist/index.js CHANGED
@@ -281,23 +281,23 @@ var Button = ({ disabled = false, loading, onClick, kind = "primary", size = "sm
281
281
  const styled = () => {
282
282
  switch (kind) {
283
283
  case "primary":
284
- return `bg-primary font-header text-white font-medium transition-all duration-75 ${disabled ? "bg-opacity-50" : "hover:bg-opacity-90"}`;
284
+ return `bg-primary font-header text-white font-medium transition-all duration-75 ${disabled ? "bg-white/50" : "hover:bg-black/10"}`;
285
285
  case "indigo":
286
- return `bg-indigo-500 font-header text-white font-medium transition-all duration-75 ${disabled ? "bg-opacity-50" : "hover:bg-opacity-90"}`;
286
+ return `bg-indigo-500 font-header text-white font-medium transition-all duration-75 ${disabled ? "bg-white/50" : "hover:bg-black/10"}`;
287
287
  case "green":
288
- return `bg-green-500 font-header text-white font-medium transition-all duration-75 ${disabled ? "bg-opacity-50" : "hover:bg-opacity-90"}`;
288
+ return `bg-green-500 font-header text-white font-medium transition-all duration-75 ${disabled ? "bg-white/50" : "hover:bg-black/10"}`;
289
289
  case "teal":
290
- return `bg-teal-500 font-header text-white font-medium transition-all duration-75 ${disabled ? "bg-opacity-50" : "hover:bg-opacity-90"}`;
290
+ return `bg-teal-500 font-header text-white font-medium transition-all duration-75 ${disabled ? "bg-white/50" : "hover:bg-black/10"}`;
291
291
  case "secondary":
292
- return "bg-secondary text-white font-header font-medium hover:bg-opacity-90 transition-all duration-75";
292
+ return "bg-secondary text-white font-header font-medium hover:bg-black/10 transition-all duration-75";
293
293
  case "base":
294
294
  return "bg-white border-1 font-header border-gray-200 dark:bg-slate-600 dark:text-gray-100 dark:hover:bg-slate-400 hover:bg-slate-100 transition-all duration-75";
295
295
  case "gray":
296
- return "bg-slate-400 dark:bg-slate-700 font-header text-white border-1 font-medium hover:bg-opacity-90 transition-opacity duration-75";
296
+ return "bg-slate-400 dark:bg-slate-700 font-header text-white border-1 font-medium hover:bg-black/10 transition-opacity duration-75";
297
297
  case "alert":
298
- return "bg-amber-500 font-header text-white transition-all hover:bg-opacity-90 duration-75";
298
+ return "bg-amber-500 font-header text-white transition-all hover:bg-black/10 duration-75";
299
299
  case "warning":
300
- return "bg-red-500 font-header text-white font-medium hover:bg-opacity-90 transition-opacity duration-100";
300
+ return "bg-red-500 font-header text-white font-medium hover:bg-black/10 transition-opacity duration-100";
301
301
  default:
302
302
  break;
303
303
  }
@@ -357,24 +357,24 @@ var FunButton = ({
357
357
  const classStyle = (0, import_react2.useMemo)(() => {
358
358
  switch (size) {
359
359
  case "base":
360
- return "relative block px-8 py-3 rounded-lg text-lg text-white font-medium font-header hover:bg-opacity-90";
360
+ return "relative block px-8 py-3 rounded-lg text-lg text-white font-medium font-header hover:bg-slate-900/20";
361
361
  case "big":
362
- return "relative block px-12 py-4 rounded-lg text-lg text-white font-medium font-header hover:bg-opacity-90";
362
+ return "relative block px-12 py-4 rounded-lg text-lg text-white font-medium font-header hover:bg-slate-900/20";
363
363
  case "small":
364
- return "relative block px-6 py-1 rounded-lg text-lg text-white font-medium font-header hover:bg-opacity-90";
364
+ return "relative block px-6 py-1 rounded-lg text-lg text-white font-medium font-header hover:bg-slate-900/20";
365
365
  case "square":
366
- return "relative block h-12 w-12 rounded text-lg flex items-center justify-center text-white font-medium font-header hover:bg-opacity-90";
366
+ return "relative block h-12 w-12 rounded text-lg flex items-center justify-center text-white font-medium font-header hover:bg-slate-900/20";
367
367
  default:
368
- return "relative block px-8 py-3 rounded-lg text-lg text-white font-medium font-header hover:bg-opacity-90";
368
+ return "relative block px-8 py-3 rounded-lg text-lg text-white font-medium font-header hover:bg-slate-900/20";
369
369
  }
370
370
  }, [size]);
371
371
  const computedClassName = (0, import_react2.useMemo)(() => {
372
- const cName = className + " rounded-lg border-none p-0 cursor-pointer opacity-90 hover:bg-opacity-90 transition-opacity";
372
+ const cName = className + " rounded-lg border-none p-0 cursor-pointer opacity-90 hover:bg-black/30 transition-opacity";
373
373
  return cName + (disabled ? " opacity-70 cursor-default" : "");
374
374
  }, [className, disabled]);
375
375
  const computedClassStyle = (0, import_react2.useMemo)(() => {
376
376
  const cName = classStyle;
377
- return cName + (disabled ? " opacity-70 cursor-default hover:bg-opacity-70" : "");
377
+ return cName + (disabled ? " opacity-70 cursor-default hover:bg-black/70" : "");
378
378
  }, [classStyle, disabled]);
379
379
  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
380
380
  import_framer_motion.motion.button,
@@ -582,7 +582,7 @@ var BottomAlert = ({ isDark, setDontShowAgain, dontShowAgain, title, borderColor
582
582
  background: isDark ? "rgba(0, 0, 0, 0.1)" : "rgba(255, 255, 255, 0.1)",
583
583
  zIndex: 9999
584
584
  },
585
- children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "absolute top-0 w-full h-screen flex justify-center bg-gray-200 dark:bg-slate-800 dark:bg-opacity-50 bg-opacity-80", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "absolute sm:w-1/2 w-full mx-auto shadow-xl rounded-md p-6 flex z-50 flex-col top-24 bg-white dark:bg-slate-900 overflow-clip rounded-bl-lg rounded-br-lg border-b-8 border-b-blue-500", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { style: { borderColor: borderColor || import_colors3.default.sky["500"] }, children: [
585
+ children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "absolute top-0 w-full h-screen flex justify-center bg-gray-200/90 dark:bg-slate-800/50", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "absolute sm:w-1/2 w-full mx-auto shadow-xl rounded-md p-6 flex z-50 flex-col top-24 bg-white dark:bg-slate-900 overflow-clip rounded-bl-lg rounded-br-lg border-b-8 border-b-blue-500", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { style: { borderColor: borderColor || import_colors3.default.sky["500"] }, children: [
586
586
  /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("h3", { className: "font-semibold font-header text-gray-700 dark:text-gray-300 text-xl", children: title }),
587
587
  /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "mt-2 text-lg", children }),
588
588
  setDontShowAgain ? /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex items-center space-x-1", children: [
@@ -696,7 +696,7 @@ var exerciseEditButton = "w-6 h-6 flex justify-center text-gray-700 dark:text-gr
696
696
  var tippyClassname = "p-2 bg-slate-600 dark:bg-slate-900 opacity-90 text-white font-medium font-header rounded-lg";
697
697
  var headerTippyClass = "rounded-lg p-2 bg-slate-950 opacity-95 text-white font-medium";
698
698
  var headerButtonClass = "w-10 h-10 rounded-full dark:hover:bg-slate-600 hover:bg-slate-200 bg-transparent flex justify-center items-center flex justify-center items-center text-slate-600 dark:text-slate-100 hover:text-primary dark:hover:text-primary transition-colors duration-50";
699
- var toolbarExerciseButton = "flex bg-gray-50 bg-opacity-95 items-center sm:justify-between p-4 shadow-sm w-full rounded-xl border-4 border-transparent hover:border-white text-gray-700 hover:text-white hover:bg-indigo-500 transition-colors duration-75";
699
+ var toolbarExerciseButton = "flex bg-gray-50/90 items-center sm:justify-between p-4 shadow-sm w-full rounded-xl border-4 border-transparent hover:border-white text-gray-700 hover:text-white hover:bg-indigo-500 transition-colors duration-75";
700
700
 
701
701
  // src/Common/Tippy.tsx
702
702
  var import_react6 = require("react");
package/dist/index.mjs CHANGED
@@ -204,23 +204,23 @@ var Button = ({ disabled = false, loading, onClick, kind = "primary", size = "sm
204
204
  const styled = () => {
205
205
  switch (kind) {
206
206
  case "primary":
207
- return `bg-primary font-header text-white font-medium transition-all duration-75 ${disabled ? "bg-opacity-50" : "hover:bg-opacity-90"}`;
207
+ return `bg-primary font-header text-white font-medium transition-all duration-75 ${disabled ? "bg-white/50" : "hover:bg-black/10"}`;
208
208
  case "indigo":
209
- return `bg-indigo-500 font-header text-white font-medium transition-all duration-75 ${disabled ? "bg-opacity-50" : "hover:bg-opacity-90"}`;
209
+ return `bg-indigo-500 font-header text-white font-medium transition-all duration-75 ${disabled ? "bg-white/50" : "hover:bg-black/10"}`;
210
210
  case "green":
211
- return `bg-green-500 font-header text-white font-medium transition-all duration-75 ${disabled ? "bg-opacity-50" : "hover:bg-opacity-90"}`;
211
+ return `bg-green-500 font-header text-white font-medium transition-all duration-75 ${disabled ? "bg-white/50" : "hover:bg-black/10"}`;
212
212
  case "teal":
213
- return `bg-teal-500 font-header text-white font-medium transition-all duration-75 ${disabled ? "bg-opacity-50" : "hover:bg-opacity-90"}`;
213
+ return `bg-teal-500 font-header text-white font-medium transition-all duration-75 ${disabled ? "bg-white/50" : "hover:bg-black/10"}`;
214
214
  case "secondary":
215
- return "bg-secondary text-white font-header font-medium hover:bg-opacity-90 transition-all duration-75";
215
+ return "bg-secondary text-white font-header font-medium hover:bg-black/10 transition-all duration-75";
216
216
  case "base":
217
217
  return "bg-white border-1 font-header border-gray-200 dark:bg-slate-600 dark:text-gray-100 dark:hover:bg-slate-400 hover:bg-slate-100 transition-all duration-75";
218
218
  case "gray":
219
- return "bg-slate-400 dark:bg-slate-700 font-header text-white border-1 font-medium hover:bg-opacity-90 transition-opacity duration-75";
219
+ return "bg-slate-400 dark:bg-slate-700 font-header text-white border-1 font-medium hover:bg-black/10 transition-opacity duration-75";
220
220
  case "alert":
221
- return "bg-amber-500 font-header text-white transition-all hover:bg-opacity-90 duration-75";
221
+ return "bg-amber-500 font-header text-white transition-all hover:bg-black/10 duration-75";
222
222
  case "warning":
223
- return "bg-red-500 font-header text-white font-medium hover:bg-opacity-90 transition-opacity duration-100";
223
+ return "bg-red-500 font-header text-white font-medium hover:bg-black/10 transition-opacity duration-100";
224
224
  default:
225
225
  break;
226
226
  }
@@ -280,24 +280,24 @@ var FunButton = ({
280
280
  const classStyle = useMemo(() => {
281
281
  switch (size) {
282
282
  case "base":
283
- return "relative block px-8 py-3 rounded-lg text-lg text-white font-medium font-header hover:bg-opacity-90";
283
+ return "relative block px-8 py-3 rounded-lg text-lg text-white font-medium font-header hover:bg-slate-900/20";
284
284
  case "big":
285
- return "relative block px-12 py-4 rounded-lg text-lg text-white font-medium font-header hover:bg-opacity-90";
285
+ return "relative block px-12 py-4 rounded-lg text-lg text-white font-medium font-header hover:bg-slate-900/20";
286
286
  case "small":
287
- return "relative block px-6 py-1 rounded-lg text-lg text-white font-medium font-header hover:bg-opacity-90";
287
+ return "relative block px-6 py-1 rounded-lg text-lg text-white font-medium font-header hover:bg-slate-900/20";
288
288
  case "square":
289
- return "relative block h-12 w-12 rounded text-lg flex items-center justify-center text-white font-medium font-header hover:bg-opacity-90";
289
+ return "relative block h-12 w-12 rounded text-lg flex items-center justify-center text-white font-medium font-header hover:bg-slate-900/20";
290
290
  default:
291
- return "relative block px-8 py-3 rounded-lg text-lg text-white font-medium font-header hover:bg-opacity-90";
291
+ return "relative block px-8 py-3 rounded-lg text-lg text-white font-medium font-header hover:bg-slate-900/20";
292
292
  }
293
293
  }, [size]);
294
294
  const computedClassName = useMemo(() => {
295
- const cName = className + " rounded-lg border-none p-0 cursor-pointer opacity-90 hover:bg-opacity-90 transition-opacity";
295
+ const cName = className + " rounded-lg border-none p-0 cursor-pointer opacity-90 hover:bg-black/30 transition-opacity";
296
296
  return cName + (disabled ? " opacity-70 cursor-default" : "");
297
297
  }, [className, disabled]);
298
298
  const computedClassStyle = useMemo(() => {
299
299
  const cName = classStyle;
300
- return cName + (disabled ? " opacity-70 cursor-default hover:bg-opacity-70" : "");
300
+ return cName + (disabled ? " opacity-70 cursor-default hover:bg-black/70" : "");
301
301
  }, [classStyle, disabled]);
302
302
  return /* @__PURE__ */ jsx6(
303
303
  motion.button,
@@ -505,7 +505,7 @@ var BottomAlert = ({ isDark, setDontShowAgain, dontShowAgain, title, borderColor
505
505
  background: isDark ? "rgba(0, 0, 0, 0.1)" : "rgba(255, 255, 255, 0.1)",
506
506
  zIndex: 9999
507
507
  },
508
- children: /* @__PURE__ */ jsx11("div", { className: "absolute top-0 w-full h-screen flex justify-center bg-gray-200 dark:bg-slate-800 dark:bg-opacity-50 bg-opacity-80", children: /* @__PURE__ */ jsx11("div", { className: "absolute sm:w-1/2 w-full mx-auto shadow-xl rounded-md p-6 flex z-50 flex-col top-24 bg-white dark:bg-slate-900 overflow-clip rounded-bl-lg rounded-br-lg border-b-8 border-b-blue-500", children: /* @__PURE__ */ jsxs4("div", { style: { borderColor: borderColor || colors3.sky["500"] }, children: [
508
+ children: /* @__PURE__ */ jsx11("div", { className: "absolute top-0 w-full h-screen flex justify-center bg-gray-200/90 dark:bg-slate-800/50", children: /* @__PURE__ */ jsx11("div", { className: "absolute sm:w-1/2 w-full mx-auto shadow-xl rounded-md p-6 flex z-50 flex-col top-24 bg-white dark:bg-slate-900 overflow-clip rounded-bl-lg rounded-br-lg border-b-8 border-b-blue-500", children: /* @__PURE__ */ jsxs4("div", { style: { borderColor: borderColor || colors3.sky["500"] }, children: [
509
509
  /* @__PURE__ */ jsx11("h3", { className: "font-semibold font-header text-gray-700 dark:text-gray-300 text-xl", children: title }),
510
510
  /* @__PURE__ */ jsx11("div", { className: "mt-2 text-lg", children }),
511
511
  setDontShowAgain ? /* @__PURE__ */ jsxs4("div", { className: "flex items-center space-x-1", children: [
@@ -619,7 +619,7 @@ var exerciseEditButton = "w-6 h-6 flex justify-center text-gray-700 dark:text-gr
619
619
  var tippyClassname = "p-2 bg-slate-600 dark:bg-slate-900 opacity-90 text-white font-medium font-header rounded-lg";
620
620
  var headerTippyClass = "rounded-lg p-2 bg-slate-950 opacity-95 text-white font-medium";
621
621
  var headerButtonClass = "w-10 h-10 rounded-full dark:hover:bg-slate-600 hover:bg-slate-200 bg-transparent flex justify-center items-center flex justify-center items-center text-slate-600 dark:text-slate-100 hover:text-primary dark:hover:text-primary transition-colors duration-50";
622
- var toolbarExerciseButton = "flex bg-gray-50 bg-opacity-95 items-center sm:justify-between p-4 shadow-sm w-full rounded-xl border-4 border-transparent hover:border-white text-gray-700 hover:text-white hover:bg-indigo-500 transition-colors duration-75";
622
+ var toolbarExerciseButton = "flex bg-gray-50/90 items-center sm:justify-between p-4 shadow-sm w-full rounded-xl border-4 border-transparent hover:border-white text-gray-700 hover:text-white hover:bg-indigo-500 transition-colors duration-75";
623
623
 
624
624
  // src/Common/Tippy.tsx
625
625
  import { useState as useState2, useRef, useEffect as useEffect3 } from "react";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "evelearn-theme",
3
- "version": "1.0.2",
3
+ "version": "1.0.3",
4
4
  "description": "",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",