@edu-tosel/design 1.0.345 → 1.0.346

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 (3) hide show
  1. package/layout/template/home/Shortcut.js +8 -11
  2. package/package.json +1 -1
  3. package/version.txt +1 -1
package/layout/template/home/Shortcut.js CHANGED
@@ -10,10 +10,7 @@ export default function ShortcutBanner({ shortcuts, }) {
10
10
  displays: "flex flex-col justify-start justify-start xs:justify-center xs:items-center",
11
11
  spacings: "pt-10 pb-15",
12
12
  };
13
- return (_jsxs("div", { className: cn(container), children: [_jsx("div", { className: "w-full flex justify-center items-center mb-5", children: _jsx(ModeToggle, { state: [isExpanded, setIsExpanded], selectOptions: [
14
- [true, "스크롤"],
15
- [false, "그리드"],
16
- ] }) }), !isExpanded ? (_jsx(ScrollMode, { shortcuts: shortcuts })) : (_jsx(GridMode, { shortcuts: shortcuts }))] }));
13
+ return (_jsx("div", { className: cn(container), children: !isExpanded ? (_jsx(ScrollMode, { shortcuts: shortcuts })) : (_jsx(GridMode, { shortcuts: shortcuts })) }));
17
14
  }
18
15
  function ScrollMode({ shortcuts, }) {
19
16
  const scrollWrapper = {
@@ -37,13 +34,13 @@ function ScrollMode({ shortcuts, }) {
37
34
  };
38
35
  const buttonSet = {
39
36
  displays: "group flex flex-col justify-center items-center",
40
- sizes: "w-16",
37
+ sizes: "w-18",
41
38
  spacings: "gap-2",
42
39
  };
43
40
  const tagBox = {
44
41
  displays: "flex justify-center items-center",
45
42
  sizes: "w-full h-6.25 ",
46
- fonts: "text-xs md:text-sm font-pretendard-var font-medium text-gray-dark group-hover:text-green-dark",
43
+ fonts: "text-xs md:text-sm font-pretendard-var font-bold text-gray-dark group-hover:text-green-dark",
47
44
  animation: "duration-100",
48
45
  };
49
46
  const iconContainer = {
@@ -52,7 +49,7 @@ function ScrollMode({ shortcuts, }) {
52
49
  animation: "duration-100",
53
50
  hoveraction: "group-hover:shadow-icon-hover group-hover:scale-103",
54
51
  };
55
- return (_jsx("div", { className: cn(scrollWrapper), children: _jsxs("div", { className: cn(buttonWrapper), children: [_jsxs("div", { className: cn(headerButton), children: [_jsx("div", { children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", className: "size-6", children: _jsx("path", { "fill-rule": "evenodd", d: "M14.615 1.595a.75.75 0 0 1 .359.852L12.982 9.75h7.268a.75.75 0 0 1 .548 1.262l-10.5 11.25a.75.75 0 0 1-1.272-.71l1.992-7.302H3.75a.75.75 0 0 1-.548-1.262l10.5-11.25a.75.75 0 0 1 .913-.143Z", "clip-rule": "evenodd" }) }) }), _jsx("div", { className: "font-bold text-sm xs:text-base", children: "\uBE60\uB978 \uBA54\uB274" })] }), shortcuts.map((shortcut) => (_jsxs("button", { onClick: shortcut.onClick, className: cn(buttonSet), children: [_jsx("div", { className: cn(iconContainer, shortcut.background ?? "bg-gray-100"), children: _jsx("img", { src: shortcut.icon, alt: shortcut.title }) }), _jsx("div", { className: cn(tagBox), children: shortcut.title })] }, shortcut.title)))] }) }));
52
+ return (_jsx("div", { className: cn(scrollWrapper), children: _jsx("div", { className: cn(buttonWrapper), children: shortcuts.map((shortcut) => (_jsxs("button", { onClick: shortcut.onClick, className: cn(buttonSet), children: [_jsx("div", { className: cn(iconContainer, shortcut.background ?? "bg-gray-100"), children: _jsx("img", { src: shortcut.icon, alt: shortcut.title }) }), _jsx("div", { className: cn(tagBox), children: shortcut.title })] }, shortcut.title))) }) }));
56
53
  }
57
54
  function GridMode({ shortcuts, }) {
58
55
  const container = {
@@ -73,17 +70,17 @@ function GridMode({ shortcuts, }) {
73
70
  };
74
71
  const buttonSet = {
75
72
  displays: "group flex flex-col justify-center items-center",
76
- sizes: "w-16",
73
+ sizes: "w-20",
77
74
  spacings: "gap-2",
78
75
  };
79
76
  const tagBox = {
80
77
  displays: "flex justify-center items-center",
81
- sizes: "w-full h-6.25 ",
82
- fonts: "text-xs md:text-sm font-pretendard-var font-medium text-gray-dark group-hover:text-green-dark",
78
+ sizes: "w-full min-w-fit h-7 ",
79
+ fonts: "text-sm md:text-base font-pretendard-var font-medium text-gray-dark group-hover:text-green-dark",
83
80
  animation: "duration-100",
84
81
  };
85
82
  const iconContainer = {
86
- sizes: "size-14 xs:size-16 rounded-lg overflow-hidden",
83
+ sizes: "size-16 xs:size-18 rounded-lg overflow-hidden",
87
84
  shadows: "shadow-none",
88
85
  animation: "duration-100",
89
86
  hoveraction: "group-hover:shadow-icon-hover group-hover:scale-103",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@edu-tosel/design",
3
- "version": "1.0.345",
3
+ "version": "1.0.346",
4
4
  "description": "UI components for International TOSEL Committee",
5
5
  "keywords": [
6
6
  "jsx",
package/version.txt CHANGED
@@ -1 +1 @@
1
- 1.0.345
1
+ 1.0.346