cclkit4svelte 0.2.1 → 0.2.2

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.
@@ -13,6 +13,9 @@ export let label;
13
13
  padding: 15px 45px;
14
14
  background: var(--bgColor);
15
15
  }
16
+ .buttonWrapper:hover {
17
+ cursor: pointer;
18
+ }
16
19
  .btLabel {
17
20
  flex-direction: column;
18
21
  justify-content: center;
package/dist/Card.svelte CHANGED
@@ -1,5 +1,29 @@
1
- <script>export let borderColor;
2
- export let bgColor;
1
+ <script>import { CCLPastelColor, CCLVividColor } from "./const/config";
2
+ export let borderColor;
3
+ let bodyColor;
4
+ switch (borderColor) {
5
+ case CCLVividColor.STRAWBERRY_PINK:
6
+ bodyColor = CCLPastelColor.PEACH_PINK;
7
+ break;
8
+ case CCLVividColor.PINEAPPLE_YELLOW:
9
+ bodyColor = CCLPastelColor.LEMON_YELLOW;
10
+ break;
11
+ case CCLVividColor.SODA_BLUE:
12
+ bodyColor = CCLPastelColor.SUGAR_BLUE;
13
+ break;
14
+ case CCLVividColor.MELON_GREEN:
15
+ bodyColor = CCLPastelColor.MATCHA_GREEN;
16
+ break;
17
+ case CCLVividColor.GRAPE_PURPLE:
18
+ bodyColor = CCLPastelColor.AKEBI_PURPLE;
19
+ break;
20
+ case CCLVividColor.WRAP_GREY:
21
+ bodyColor = CCLPastelColor.CLOUD_GREY;
22
+ break;
23
+ default:
24
+ bodyColor = CCLPastelColor.PEACH_PINK;
25
+ break;
26
+ }
3
27
  export let src;
4
28
  export let altText;
5
29
  export let title;
@@ -8,7 +32,7 @@ export let cardText;
8
32
 
9
33
  <div class="CardWrapper" style="--border-color: var({borderColor})">
10
34
  <img class="CardImage" src={src} alt={altText} />
11
- <div class="CardInfo" style="--background-color: var({bgColor});">
35
+ <div class="CardInfo" style="--background-color: var({bodyColor});">
12
36
  <div class="CardTextWrapper">
13
37
  <h2 class="CardTitle">{title}</h2>
14
38
  <span class="CardText">{cardText}</span>
@@ -6,11 +6,6 @@ declare const __propDef: {
6
6
  * @default --strawberry-pink
7
7
  * @type string
8
8
  */ borderColor: string;
9
- /**
10
- * 説明文の背景色
11
- * @default --peach-pink
12
- * @type string
13
- */ bgColor: string;
14
9
  /**
15
10
  * 画像ソース
16
11
  * @type string
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "cclkit4svelte",
3
- "version": "0.2.1",
3
+ "version": "0.2.2",
4
4
  "author": "reiji1020 <sk@reiji1020.info>",
5
5
  "license": "MIT",
6
6
  "type": "module",
@@ -25,7 +25,8 @@
25
25
  "lint": "prettier --check . && eslint .",
26
26
  "format": "prettier --write .",
27
27
  "storybook": "storybook dev -p 6006",
28
- "build-storybook": "storybook build -o ./public/storybook"
28
+ "build-storybook": "storybook build -o ./public/storybook",
29
+ "chromatic": "chromatic"
29
30
  },
30
31
  "exports": {
31
32
  ".": {
@@ -34,6 +35,7 @@
34
35
  }
35
36
  },
36
37
  "devDependencies": {
38
+ "@chromatic-com/storybook": "^1.2.26",
37
39
  "@semantic-release/changelog": "^6.0.3",
38
40
  "@semantic-release/git": "^10.0.1",
39
41
  "@storybook/addon-actions": "^8.0.5",
@@ -51,6 +53,7 @@
51
53
  "@sveltejs/package": "^2.3.0",
52
54
  "@typescript-eslint/eslint-plugin": "^6.21.0",
53
55
  "@typescript-eslint/parser": "^6.21.0",
56
+ "chromatic": "^11.3.0",
54
57
  "eslint": "^8.57.0",
55
58
  "eslint-config-prettier": "^9.1.0",
56
59
  "eslint-plugin-storybook": "^0.6.15",
@@ -59,14 +62,14 @@
59
62
  "prettier-plugin-svelte": "^3.2.2",
60
63
  "react": "^18.2.0",
61
64
  "react-dom": "^18.2.0",
62
- "semantic-release": "^23.0.4",
65
+ "semantic-release": "^23.0.6",
63
66
  "storybook": "^8.0.5",
64
67
  "svelte": "^4.2.12",
65
- "svelte-check": "^3.6.7",
68
+ "svelte-check": "^3.6.9",
66
69
  "svelte2tsx": "^0.6.27",
67
70
  "tslib": "^2.6.2",
68
- "typescript": "^5.4.2",
69
- "vite": "^4.5.2"
71
+ "typescript": "^5.4.3",
72
+ "vite": "^4.5.3"
70
73
  },
71
74
  "volta": {
72
75
  "node": "20.11.1",