@seed-design/lynx-css 0.8.0 → 0.8.1
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/package.json
CHANGED
|
@@ -43,38 +43,38 @@
|
|
|
43
43
|
}
|
|
44
44
|
|
|
45
45
|
.seed-progress-circle__root--tone_neutral {
|
|
46
|
-
background: var(--seed-color-palette-gray-200);
|
|
46
|
+
background-color: var(--seed-color-palette-gray-200);
|
|
47
47
|
}
|
|
48
48
|
|
|
49
49
|
.seed-progress-circle__root--tone_brand {
|
|
50
|
-
background: var(--seed-color-palette-carrot-200);
|
|
50
|
+
background-color: var(--seed-color-palette-carrot-200);
|
|
51
51
|
}
|
|
52
52
|
|
|
53
53
|
.seed-progress-circle__root--tone_staticWhite {
|
|
54
|
-
background: var(--seed-color-palette-static-white-alpha-300);
|
|
54
|
+
background-color: var(--seed-color-palette-static-white-alpha-300);
|
|
55
55
|
}
|
|
56
56
|
|
|
57
57
|
.seed-progress-circle__range--tone_neutral,
|
|
58
58
|
.seed-progress-circle__cap--tone_neutral {
|
|
59
|
-
background: var(--seed-color-palette-gray-500);
|
|
59
|
+
background-color: var(--seed-color-palette-gray-500);
|
|
60
60
|
}
|
|
61
61
|
|
|
62
62
|
.seed-progress-circle__range--tone_brand,
|
|
63
63
|
.seed-progress-circle__cap--tone_brand {
|
|
64
|
-
background: var(--seed-color-bg-brand-solid);
|
|
64
|
+
background-color: var(--seed-color-bg-brand-solid);
|
|
65
65
|
}
|
|
66
66
|
|
|
67
67
|
.seed-progress-circle__range--tone_staticWhite,
|
|
68
68
|
.seed-progress-circle__cap--tone_staticWhite {
|
|
69
|
-
background: var(--seed-color-palette-static-white);
|
|
69
|
+
background-color: var(--seed-color-palette-static-white);
|
|
70
70
|
}
|
|
71
71
|
|
|
72
72
|
/* inherit: inherits --track-color / --range-color from parent (e.g. action-button) */
|
|
73
73
|
.seed-progress-circle__root--tone_inherit {
|
|
74
|
-
background: var(--track-color);
|
|
74
|
+
background-color: var(--track-color);
|
|
75
75
|
}
|
|
76
76
|
|
|
77
77
|
.seed-progress-circle__range--tone_inherit,
|
|
78
78
|
.seed-progress-circle__cap--tone_inherit {
|
|
79
|
-
background: var(--range-color);
|
|
79
|
+
background-color: var(--range-color);
|
|
80
80
|
}
|
package/vars/color/stroke.d.ts
CHANGED
|
@@ -13,13 +13,13 @@ export declare const informativeSolid = "var(--seed-color-stroke-informative-sol
|
|
|
13
13
|
export declare const informativeWeak = "var(--seed-color-stroke-informative-weak)";
|
|
14
14
|
/** 일반적인 콘텐츠에 사용되는 기본 색상입니다. (contrast) */
|
|
15
15
|
export declare const neutralContrast = "var(--seed-color-stroke-neutral-contrast)";
|
|
16
|
-
/**
|
|
16
|
+
/** 의미 단위가 바뀌는 경계를 나누는 선입니다. 섹션과 섹션 사이, 콘텐츠와 액션 영역 사이, 헤더와 본문 경계처럼 한 화면에 한두 번만 등장하는 구분에 사용됩니다. (muted) */
|
|
17
17
|
export declare const neutralMuted = "var(--seed-color-stroke-neutral-muted)";
|
|
18
18
|
/** 일반적인 콘텐츠에 사용되는 기본 색상입니다. (solid) */
|
|
19
19
|
export declare const neutralSolid = "var(--seed-color-stroke-neutral-solid)";
|
|
20
|
-
/**
|
|
20
|
+
/** 반복되는 동일한 성격의 항목 사이를 나누는 선입니다. 리스트 아이템, 테이블 row, 설정 메뉴 항목처럼 한 화면에 여러 번 등장하는 구분에 사용됩니다. (subtle) */
|
|
21
21
|
export declare const neutralSubtle = "var(--seed-color-stroke-neutral-subtle)";
|
|
22
|
-
/**
|
|
22
|
+
/** 요소의 외곽을 그려 형태를 만드는 선입니다. 카드, 인풋 필드, 아웃라인 버튼처럼 선 자체가 요소의 경계를 정의할 때 사용됩니다. (weak) */
|
|
23
23
|
export declare const neutralWeak = "var(--seed-color-stroke-neutral-weak)";
|
|
24
24
|
/** 성공적인 작업, 확인, 또는 긍정적인 상태를 나타내는 데 사용됩니다. (solid) */
|
|
25
25
|
export declare const positiveSolid = "var(--seed-color-stroke-positive-solid)";
|
|
@@ -14,7 +14,9 @@ export declare const vars: {
|
|
|
14
14
|
"exitScale": "1",
|
|
15
15
|
"exitOpacity": "0",
|
|
16
16
|
"exitDuration": "var(--seed-duration-d4)",
|
|
17
|
-
"exitTimingFunction": "var(--seed-timing-function-easing)"
|
|
17
|
+
"exitTimingFunction": "var(--seed-timing-function-easing)",
|
|
18
|
+
/** 말풍선과 뷰포트 경계 사이의 최소 간격을 정의합니다. */
|
|
19
|
+
"overflowPadding": "var(--seed-dimension-x4)"
|
|
18
20
|
},
|
|
19
21
|
"arrow": {
|
|
20
22
|
"color": "var(--seed-color-bg-neutral-inverted)",
|
|
@@ -14,7 +14,8 @@ export const vars = {
|
|
|
14
14
|
"exitScale": "1",
|
|
15
15
|
"exitOpacity": "0",
|
|
16
16
|
"exitDuration": "var(--seed-duration-d4)",
|
|
17
|
-
"exitTimingFunction": "var(--seed-timing-function-easing)"
|
|
17
|
+
"exitTimingFunction": "var(--seed-timing-function-easing)",
|
|
18
|
+
"overflowPadding": "var(--seed-dimension-x4)"
|
|
18
19
|
},
|
|
19
20
|
"arrow": {
|
|
20
21
|
"color": "var(--seed-color-bg-neutral-inverted)",
|