maru_design2 2.23.1 → 2.23.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.
- package/CHANGELOG.md +8 -0
- package/dist/index.js +2 -2
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,13 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## [2.23.2](https://github.com/42maru-ai/maru-design2/compare/v2.23.1...v2.23.2) (2025-03-04)
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
### Bug Fixes
|
|
7
|
+
|
|
8
|
+
* :lipstick: Button - UPDATE color-on-focus design ([2b830d5](https://github.com/42maru-ai/maru-design2/commit/2b830d543f22ce0e9cbfbf534a2af7e74512b074))
|
|
9
|
+
* :lipstick: Modal - update border radius [#513](https://github.com/42maru-ai/maru-design2/issues/513) ([e4cf6cf](https://github.com/42maru-ai/maru-design2/commit/e4cf6cfe1e35c1a392868a9c6e099711168f7fd9))
|
|
10
|
+
|
|
3
11
|
## [2.23.1](https://github.com/42maru-ai/maru-design2/compare/v2.23.0...v2.23.1) (2025-02-19)
|
|
4
12
|
|
|
5
13
|
|
package/dist/index.js
CHANGED
|
@@ -6100,7 +6100,7 @@ function Icon(_a) {
|
|
|
6100
6100
|
}));
|
|
6101
6101
|
}
|
|
6102
6102
|
|
|
6103
|
-
var css_248z$j = ".size-small {\n padding: 5px 16px;\n border-radius: 4px;\n font-family: Pretendard;\n font-style: normal;\n line-height: 150%;\n font-size: 14px;\n letter-spacing: -0.56px;\n font-weight: 400;\n}\n\n.size-normal {\n padding: 8px 16px;\n border-radius: 6px;\n font-family: Pretendard;\n font-style: normal;\n line-height: 150%;\n font-size: 14px;\n letter-spacing: -0.56px;\n font-weight: 400;\n}\n\n.size-large {\n padding: 10px 16px;\n border-radius: 6px;\n font-family: Pretendard;\n font-style: normal;\n line-height: 150%;\n font-size: 14px;\n letter-spacing: -0.56px;\n font-weight: 400;\n}\n\n.maru-button {\n display: flex;\n justify-content: center;\n align-items: center;\n flex-direction: row;\n border: 0;\n cursor: pointer;\n gap: 6px;\n}\n.maru-button:focus-within {\n outline: none;\n}\n.maru-button:disabled {\n cursor: default;\n opacity: 0.5;\n pointer-events: none;\n}\n.maru-button-primary-default {\n background-color: var(--p);\n color: white;\n}\n.maru-button-primary-default:hover {\n box-shadow: 0 0 6px var(--p);\n}\n.maru-button-primary-default:focus-visible, .maru-button-primary-default:active {\n box-shadow: none;\n background-color: var(--p-10);\n color: var(--p);\n box-shadow: 0 0 0 1px var(--p) inset;\n}\n.maru-button-primary-default-light {\n background-color: var(--p-10);\n color: var(--p);\n}\n.maru-button-primary-default-light:hover {\n box-shadow: 0 0 6px var(--p-50-per);\n}\n.maru-button-primary-default-light:focus-visible, .maru-button-primary-default-light:active {\n box-shadow: none;\n background-color: var(--p);\n color: white;\n}\n.maru-button-primary-outline {\n background-color: white;\n color: var(--p);\n box-shadow: 0 0 0 1px var(--p) inset;\n}\n.maru-button-primary-outline:hover {\n box-shadow: 0 0 6px var(--p-20);\n}\n.maru-button-primary-outline:focus-visible, .maru-button-primary-outline:active {\n box-shadow: none;\n background-color: var(--p-20);\n box-shadow: 0 0 0 1px var(--p) inset;\n}\n.maru-button-primary-outline:hover {\n box-shadow: 0 0 0 1px var(--p) inset, 0 0 6px var(--p);\n}\n.maru-button-primary-outline:focus-visible, .maru-button-primary-outline:active {\n box-shadow: none;\n background-color: var(--p-10);\n box-shadow: 0 0 0 1px var(--p) inset;\n}\n.maru-button-primary-text {\n background-color: transparent;\n color: var(--p);\n}\n.maru-button-primary-color-on-focus {\n background-color: white;\n color: #5c5c5c;\n box-shadow: 0 0 0 1px #8c8c8c inset;\n padding: 5px 7px 5px 6px !important;\n gap: 4px;\n}\n.maru-button-primary-color-on-focus:hover {\n background-color: var(--p-10);\n}\n.maru-button-primary-color-on-focus:focus-visible, .maru-button-primary-color-on-focus:active {\n background-color: var(--p-10);\n color: var(--p);\n}\n.maru-button-secondary-default {\n background-color: #8c8c8c;\n color: white;\n background-color: #e4e4e4;\n color: #8c8c8c;\n}\n.maru-button-secondary-default:hover {\n box-shadow: 0 0 6px #8c8c8c;\n}\n.maru-button-secondary-default:focus-visible, .maru-button-secondary-default:active {\n box-shadow: none;\n background-color: #fafafa;\n color: #8c8c8c;\n box-shadow: 0 0 0 1px #8c8c8c inset;\n}\n.maru-button-secondary-default:hover {\n box-shadow: 0 0 6px #e4e4e4;\n}\n.maru-button-secondary-default:focus-visible, .maru-button-secondary-default:active {\n box-shadow: none;\n background-color: #e4e4e4;\n color: #8c8c8c;\n box-shadow: 0 0 0 1px #8c8c8c inset;\n}\n.maru-button-secondary-default-light {\n background-color: #fafafa;\n color: #8c8c8c;\n}\n.maru-button-secondary-default-light:hover {\n box-shadow: 0 0 6px;\n}\n.maru-button-secondary-default-light:focus-visible, .maru-button-secondary-default-light:active {\n box-shadow: none;\n background-color: #8c8c8c;\n color: white;\n}\n.maru-button-secondary-outline {\n background-color: white;\n color: #8c8c8c;\n box-shadow: 0 0 0 1px #8c8c8c inset;\n}\n.maru-button-secondary-outline:hover {\n box-shadow: 0 0 6px #e4e4e4;\n}\n.maru-button-secondary-outline:focus-visible, .maru-button-secondary-outline:active {\n box-shadow: none;\n background-color: #e4e4e4;\n box-shadow: 0 0 0 1px #8c8c8c inset;\n}\n.maru-button-secondary-text {\n background-color: transparent;\n color: #8c8c8c;\n}\n.maru-button-secondary-color-on-focus {\n background-color: white;\n color: #5c5c5c;\n box-shadow: 0 0 0 1px #8c8c8c inset;\n padding: 5px 7px 5px 6px !important;\n gap: 4px;\n}\n.maru-button-secondary-color-on-focus:hover {\n background-color: #fafafa;\n}\n.maru-button-secondary-color-on-focus:focus-visible, .maru-button-secondary-color-on-focus:active {\n background-color: #fafafa;\n color: #8c8c8c;\n}\n.maru-button-positive-default {\n background-color: #32a483;\n color: white;\n}\n.maru-button-positive-default:hover {\n box-shadow: 0 0 6px #32a483;\n}\n.maru-button-positive-default:focus-visible, .maru-button-positive-default:active {\n box-shadow: none;\n background-color: #eaf6f3;\n color: #32a483;\n box-shadow: 0 0 0 1px #32a483 inset;\n}\n.maru-button-positive-default-light {\n background-color: #eaf6f3;\n color: #32a483;\n}\n.maru-button-positive-default-light:hover {\n box-shadow: 0 0 6px rgba(50, 164, 131, 0.5019607843);\n}\n.maru-button-positive-default-light:focus-visible, .maru-button-positive-default-light:active {\n box-shadow: none;\n background-color: #32a483;\n color: white;\n}\n.maru-button-positive-outline {\n background-color: white;\n color: #32a483;\n box-shadow: 0 0 0 1px #32a483 inset;\n}\n.maru-button-positive-outline:hover {\n box-shadow: 0 0 6px #d6ede6;\n}\n.maru-button-positive-outline:focus-visible, .maru-button-positive-outline:active {\n box-shadow: none;\n background-color: #d6ede6;\n box-shadow: 0 0 0 1px #32a483 inset;\n}\n.maru-button-positive-text {\n background-color: transparent;\n color: #32a483;\n}\n.maru-button-positive-color-on-focus {\n background-color: white;\n color: #5c5c5c;\n box-shadow: 0 0 0 1px #8c8c8c inset;\n padding: 5px 7px 5px 6px !important;\n gap: 4px;\n}\n.maru-button-positive-color-on-focus:hover {\n background-color: #eaf6f3;\n}\n.maru-button-positive-color-on-focus:focus-visible, .maru-button-positive-color-on-focus:active {\n background-color: #eaf6f3;\n color: #32a483;\n}\n.maru-button-warning-default {\n background-color: #ffb020;\n color: white;\n}\n.maru-button-warning-default:hover {\n box-shadow: 0 0 6px #ffb020;\n}\n.maru-button-warning-default:focus-visible, .maru-button-warning-default:active {\n box-shadow: none;\n background-color: #ffefd2;\n color: #ffb020;\n}\n.maru-button-warning-default-light {\n background-color: #fff7e9;\n color: #ffb020;\n}\n.maru-button-warning-default-light:hover {\n box-shadow: 0 0 6px rgba(255, 177, 32, 0.5019607843);\n}\n.maru-button-warning-default-light:focus-visible, .maru-button-warning-default-light:active {\n box-shadow: none;\n background-color: #ffb020;\n color: white;\n}\n.maru-button-warning-outline {\n background-color: white;\n color: #ffb020;\n box-shadow: 0 0 0 1px #ffb020 inset;\n}\n.maru-button-warning-outline:hover {\n box-shadow: 0 0 6px #ffefd2;\n}\n.maru-button-warning-outline:focus-visible, .maru-button-warning-outline:active {\n box-shadow: none;\n background-color: #ffefd2;\n box-shadow: 0 0 0 1px #ffb020 inset;\n}\n.maru-button-warning-text {\n background-color: transparent;\n color: #ffb020;\n}\n.maru-button-warning-color-on-focus {\n background-color: white;\n color: #5c5c5c;\n box-shadow: 0 0 0 1px #8c8c8c inset;\n padding: 5px 7px 5px 6px !important;\n gap: 4px;\n}\n.maru-button-warning-color-on-focus:hover {\n background-color: #fff7e9;\n}\n.maru-button-warning-color-on-focus:focus-visible, .maru-button-warning-color-on-focus:active {\n background-color: #fff7e9;\n color: #ffb020;\n}\n.maru-button-danger-default {\n background-color: #e53e3e;\n color: white;\n}\n.maru-button-danger-default:hover {\n box-shadow: 0 0 6px #e53e3e;\n}\n.maru-button-danger-default:focus-visible, .maru-button-danger-default:active {\n box-shadow: none;\n background-color: #fcecec;\n color: #e53e3e;\n box-shadow: 0 0 0 1px #e53e3e inset;\n}\n.maru-button-danger-default-light {\n background-color: #fcecec;\n color: #e53e3e;\n}\n.maru-button-danger-default-light:hover {\n box-shadow: 0 0 6px rgba(229, 62, 62, 0.5019607843);\n}\n.maru-button-danger-default-light:focus-visible, .maru-button-danger-default-light:active {\n box-shadow: none;\n background-color: #e53e3e;\n color: white;\n}\n.maru-button-danger-outline {\n background-color: white;\n color: #e53e3e;\n box-shadow: 0 0 0 1px #e53e3e inset;\n}\n.maru-button-danger-outline:hover {\n box-shadow: 0 0 6px #fad8d8;\n}\n.maru-button-danger-outline:focus-visible, .maru-button-danger-outline:active {\n box-shadow: none;\n background-color: #fad8d8;\n box-shadow: 0 0 0 1px #e53e3e inset;\n}\n.maru-button-danger-text {\n background-color: transparent;\n color: #e53e3e;\n}\n.maru-button-danger-color-on-focus {\n background-color: white;\n color: #5c5c5c;\n box-shadow: 0 0 0 1px #8c8c8c inset;\n padding: 5px 7px 5px 6px !important;\n gap: 4px;\n}\n.maru-button-danger-color-on-focus:hover {\n background-color: #fcecec;\n}\n.maru-button-danger-color-on-focus:focus-visible, .maru-button-danger-color-on-focus:active {\n background-color: #fcecec;\n color: #e53e3e;\n}\n.maru-button-success-default {\n background-color: #308acc;\n color: white;\n}\n.maru-button-success-default:hover {\n box-shadow: 0 0 6px #308acc;\n}\n.maru-button-success-default:focus-visible, .maru-button-success-default:active {\n box-shadow: none;\n background-color: #eaf3fa;\n color: #308acc;\n box-shadow: 0 0 0 1px #308acc inset;\n}\n.maru-button-success-default-light {\n background-color: #eaf3fa;\n color: #308acc;\n}\n.maru-button-success-default-light:hover {\n box-shadow: 0 0 6px rgba(48, 138, 204, 0.5019607843);\n}\n.maru-button-success-default-light:focus-visible, .maru-button-success-default-light:active {\n box-shadow: none;\n background-color: #308acc;\n color: white;\n}\n.maru-button-success-outline {\n background-color: white;\n color: #308acc;\n box-shadow: 0 0 0 1px #308acc inset;\n}\n.maru-button-success-outline:hover {\n box-shadow: 0 0 6px #d6e8f5;\n}\n.maru-button-success-outline:focus-visible, .maru-button-success-outline:active {\n box-shadow: none;\n background-color: #d6e8f5;\n box-shadow: 0 0 0 1px #308acc inset;\n}\n.maru-button-success-text {\n background-color: transparent;\n color: #308acc;\n}\n.maru-button-success-color-on-focus {\n background-color: white;\n color: #5c5c5c;\n box-shadow: 0 0 0 1px #8c8c8c inset;\n padding: 5px 7px 5px 6px !important;\n gap: 4px;\n}\n.maru-button-success-color-on-focus:hover {\n background-color: #eaf3fa;\n}\n.maru-button-success-color-on-focus:focus-visible, .maru-button-success-color-on-focus:active {\n background-color: #eaf3fa;\n color: #308acc;\n}\n\n.maru-button-with-start-icon.size-small,\n.maru-button-with-end-icon.size-small {\n padding: 5px 12px;\n}\n.maru-button-with-start-icon.size-small.maru-button-secondary-outline,\n.maru-button-with-end-icon.size-small.maru-button-secondary-outline {\n background-color: white;\n color: #bdbdbd;\n box-shadow: 0 0 0 1px #e4e4e4 inset;\n}\n.maru-button-with-start-icon.size-small.maru-button-secondary-outline:hover,\n.maru-button-with-end-icon.size-small.maru-button-secondary-outline:hover {\n color: var(--p);\n box-shadow: 0 0 0 1px var(--p) inset;\n}\n.maru-button-with-start-icon.size-small.maru-button-secondary-outline:focus-visible, .maru-button-with-start-icon.size-small.maru-button-secondary-outline:active,\n.maru-button-with-end-icon.size-small.maru-button-secondary-outline:focus-visible,\n.maru-button-with-end-icon.size-small.maru-button-secondary-outline:active {\n background-color: var(--p-10);\n color: var(--p);\n box-shadow: 0 0 0 1px var(--p) inset;\n}\n.maru-button-with-start-icon.size-normal,\n.maru-button-with-end-icon.size-normal {\n padding: 8px 12px;\n}\n\n.maru-button-only-icon.size-normal {\n padding: 0;\n justify-content: center;\n background-color: transparent;\n}\n.maru-button-only-icon.size-normal:hover, .maru-button-only-icon.size-normal:focus-visible, .maru-button-only-icon.size-normal:active {\n box-shadow: none;\n background-color: transparent;\n}";
|
|
6103
|
+
var css_248z$j = ".size-small {\n padding: 5px 16px;\n border-radius: 4px;\n font-family: Pretendard;\n font-style: normal;\n line-height: 150%;\n font-size: 14px;\n letter-spacing: -0.56px;\n font-weight: 400;\n}\n\n.size-normal {\n padding: 8px 16px;\n border-radius: 6px;\n font-family: Pretendard;\n font-style: normal;\n line-height: 150%;\n font-size: 14px;\n letter-spacing: -0.56px;\n font-weight: 400;\n}\n\n.size-large {\n padding: 10px 16px;\n border-radius: 6px;\n font-family: Pretendard;\n font-style: normal;\n line-height: 150%;\n font-size: 14px;\n letter-spacing: -0.56px;\n font-weight: 400;\n}\n\n.maru-button {\n display: flex;\n justify-content: center;\n align-items: center;\n flex-direction: row;\n border: 0;\n cursor: pointer;\n gap: 6px;\n}\n.maru-button:focus-within {\n outline: none;\n}\n.maru-button:disabled {\n cursor: default;\n opacity: 0.5;\n pointer-events: none;\n}\n.maru-button-primary-default {\n background-color: var(--p);\n color: white;\n}\n.maru-button-primary-default:hover {\n box-shadow: 0 0 6px var(--p);\n}\n.maru-button-primary-default:focus-visible, .maru-button-primary-default:active {\n box-shadow: none;\n background-color: var(--p-10);\n color: var(--p);\n box-shadow: 0 0 0 1px var(--p) inset;\n}\n.maru-button-primary-default-light {\n background-color: var(--p-10);\n color: var(--p);\n}\n.maru-button-primary-default-light:hover {\n box-shadow: 0 0 6px var(--p-50-per);\n}\n.maru-button-primary-default-light:focus-visible, .maru-button-primary-default-light:active {\n box-shadow: none;\n background-color: var(--p);\n color: white;\n}\n.maru-button-primary-outline {\n background-color: white;\n color: var(--p);\n box-shadow: 0 0 0 1px var(--p) inset;\n}\n.maru-button-primary-outline:hover {\n box-shadow: 0 0 6px var(--p-20);\n}\n.maru-button-primary-outline:focus-visible, .maru-button-primary-outline:active {\n box-shadow: none;\n background-color: var(--p-20);\n box-shadow: 0 0 0 1px var(--p) inset;\n}\n.maru-button-primary-outline:hover {\n box-shadow: 0 0 0 1px var(--p) inset, 0 0 6px var(--p);\n}\n.maru-button-primary-outline:focus-visible, .maru-button-primary-outline:active {\n box-shadow: none;\n background-color: var(--p-10);\n box-shadow: 0 0 0 1px var(--p) inset;\n}\n.maru-button-primary-text {\n background-color: transparent;\n color: var(--p);\n}\n.maru-button-primary-color-on-focus {\n background-color: white;\n color: #5c5c5c;\n box-shadow: 0 0 0 1px #bdbdbd inset;\n padding: 5px 7px 5px 6px !important;\n gap: 4px;\n}\n.maru-button-primary-color-on-focus:hover {\n background-color: var(--p-10);\n}\n.maru-button-primary-color-on-focus:focus-visible, .maru-button-primary-color-on-focus:active {\n background-color: var(--p-10);\n color: var(--p);\n}\n.maru-button-secondary-default {\n background-color: #8c8c8c;\n color: white;\n background-color: #e4e4e4;\n color: #8c8c8c;\n}\n.maru-button-secondary-default:hover {\n box-shadow: 0 0 6px #8c8c8c;\n}\n.maru-button-secondary-default:focus-visible, .maru-button-secondary-default:active {\n box-shadow: none;\n background-color: #fafafa;\n color: #8c8c8c;\n box-shadow: 0 0 0 1px #8c8c8c inset;\n}\n.maru-button-secondary-default:hover {\n box-shadow: 0 0 6px #e4e4e4;\n}\n.maru-button-secondary-default:focus-visible, .maru-button-secondary-default:active {\n box-shadow: none;\n background-color: #e4e4e4;\n color: #8c8c8c;\n box-shadow: 0 0 0 1px #8c8c8c inset;\n}\n.maru-button-secondary-default-light {\n background-color: #fafafa;\n color: #8c8c8c;\n}\n.maru-button-secondary-default-light:hover {\n box-shadow: 0 0 6px;\n}\n.maru-button-secondary-default-light:focus-visible, .maru-button-secondary-default-light:active {\n box-shadow: none;\n background-color: #8c8c8c;\n color: white;\n}\n.maru-button-secondary-outline {\n background-color: white;\n color: #8c8c8c;\n box-shadow: 0 0 0 1px #8c8c8c inset;\n}\n.maru-button-secondary-outline:hover {\n box-shadow: 0 0 6px #e4e4e4;\n}\n.maru-button-secondary-outline:focus-visible, .maru-button-secondary-outline:active {\n box-shadow: none;\n background-color: #e4e4e4;\n box-shadow: 0 0 0 1px #8c8c8c inset;\n}\n.maru-button-secondary-text {\n background-color: transparent;\n color: #8c8c8c;\n}\n.maru-button-secondary-color-on-focus {\n background-color: white;\n color: #5c5c5c;\n box-shadow: 0 0 0 1px #bdbdbd inset;\n padding: 5px 7px 5px 6px !important;\n gap: 4px;\n}\n.maru-button-secondary-color-on-focus:hover {\n background-color: #fafafa;\n}\n.maru-button-secondary-color-on-focus:focus-visible, .maru-button-secondary-color-on-focus:active {\n background-color: #fafafa;\n color: #8c8c8c;\n}\n.maru-button-positive-default {\n background-color: #32a483;\n color: white;\n}\n.maru-button-positive-default:hover {\n box-shadow: 0 0 6px #32a483;\n}\n.maru-button-positive-default:focus-visible, .maru-button-positive-default:active {\n box-shadow: none;\n background-color: #eaf6f3;\n color: #32a483;\n box-shadow: 0 0 0 1px #32a483 inset;\n}\n.maru-button-positive-default-light {\n background-color: #eaf6f3;\n color: #32a483;\n}\n.maru-button-positive-default-light:hover {\n box-shadow: 0 0 6px rgba(50, 164, 131, 0.5019607843);\n}\n.maru-button-positive-default-light:focus-visible, .maru-button-positive-default-light:active {\n box-shadow: none;\n background-color: #32a483;\n color: white;\n}\n.maru-button-positive-outline {\n background-color: white;\n color: #32a483;\n box-shadow: 0 0 0 1px #32a483 inset;\n}\n.maru-button-positive-outline:hover {\n box-shadow: 0 0 6px #d6ede6;\n}\n.maru-button-positive-outline:focus-visible, .maru-button-positive-outline:active {\n box-shadow: none;\n background-color: #d6ede6;\n box-shadow: 0 0 0 1px #32a483 inset;\n}\n.maru-button-positive-text {\n background-color: transparent;\n color: #32a483;\n}\n.maru-button-positive-color-on-focus {\n background-color: white;\n color: #5c5c5c;\n box-shadow: 0 0 0 1px #bdbdbd inset;\n padding: 5px 7px 5px 6px !important;\n gap: 4px;\n}\n.maru-button-positive-color-on-focus:hover {\n background-color: #eaf6f3;\n}\n.maru-button-positive-color-on-focus:focus-visible, .maru-button-positive-color-on-focus:active {\n background-color: #eaf6f3;\n color: #32a483;\n}\n.maru-button-warning-default {\n background-color: #ffb020;\n color: white;\n}\n.maru-button-warning-default:hover {\n box-shadow: 0 0 6px #ffb020;\n}\n.maru-button-warning-default:focus-visible, .maru-button-warning-default:active {\n box-shadow: none;\n background-color: #ffefd2;\n color: #ffb020;\n}\n.maru-button-warning-default-light {\n background-color: #fff7e9;\n color: #ffb020;\n}\n.maru-button-warning-default-light:hover {\n box-shadow: 0 0 6px rgba(255, 177, 32, 0.5019607843);\n}\n.maru-button-warning-default-light:focus-visible, .maru-button-warning-default-light:active {\n box-shadow: none;\n background-color: #ffb020;\n color: white;\n}\n.maru-button-warning-outline {\n background-color: white;\n color: #ffb020;\n box-shadow: 0 0 0 1px #ffb020 inset;\n}\n.maru-button-warning-outline:hover {\n box-shadow: 0 0 6px #ffefd2;\n}\n.maru-button-warning-outline:focus-visible, .maru-button-warning-outline:active {\n box-shadow: none;\n background-color: #ffefd2;\n box-shadow: 0 0 0 1px #ffb020 inset;\n}\n.maru-button-warning-text {\n background-color: transparent;\n color: #ffb020;\n}\n.maru-button-warning-color-on-focus {\n background-color: white;\n color: #5c5c5c;\n box-shadow: 0 0 0 1px #bdbdbd inset;\n padding: 5px 7px 5px 6px !important;\n gap: 4px;\n}\n.maru-button-warning-color-on-focus:hover {\n background-color: #fff7e9;\n}\n.maru-button-warning-color-on-focus:focus-visible, .maru-button-warning-color-on-focus:active {\n background-color: #fff7e9;\n color: #ffb020;\n}\n.maru-button-danger-default {\n background-color: #e53e3e;\n color: white;\n}\n.maru-button-danger-default:hover {\n box-shadow: 0 0 6px #e53e3e;\n}\n.maru-button-danger-default:focus-visible, .maru-button-danger-default:active {\n box-shadow: none;\n background-color: #fcecec;\n color: #e53e3e;\n box-shadow: 0 0 0 1px #e53e3e inset;\n}\n.maru-button-danger-default-light {\n background-color: #fcecec;\n color: #e53e3e;\n}\n.maru-button-danger-default-light:hover {\n box-shadow: 0 0 6px rgba(229, 62, 62, 0.5019607843);\n}\n.maru-button-danger-default-light:focus-visible, .maru-button-danger-default-light:active {\n box-shadow: none;\n background-color: #e53e3e;\n color: white;\n}\n.maru-button-danger-outline {\n background-color: white;\n color: #e53e3e;\n box-shadow: 0 0 0 1px #e53e3e inset;\n}\n.maru-button-danger-outline:hover {\n box-shadow: 0 0 6px #fad8d8;\n}\n.maru-button-danger-outline:focus-visible, .maru-button-danger-outline:active {\n box-shadow: none;\n background-color: #fad8d8;\n box-shadow: 0 0 0 1px #e53e3e inset;\n}\n.maru-button-danger-text {\n background-color: transparent;\n color: #e53e3e;\n}\n.maru-button-danger-color-on-focus {\n background-color: white;\n color: #5c5c5c;\n box-shadow: 0 0 0 1px #bdbdbd inset;\n padding: 5px 7px 5px 6px !important;\n gap: 4px;\n}\n.maru-button-danger-color-on-focus:hover {\n background-color: #fcecec;\n}\n.maru-button-danger-color-on-focus:focus-visible, .maru-button-danger-color-on-focus:active {\n background-color: #fcecec;\n color: #e53e3e;\n}\n.maru-button-success-default {\n background-color: #308acc;\n color: white;\n}\n.maru-button-success-default:hover {\n box-shadow: 0 0 6px #308acc;\n}\n.maru-button-success-default:focus-visible, .maru-button-success-default:active {\n box-shadow: none;\n background-color: #eaf3fa;\n color: #308acc;\n box-shadow: 0 0 0 1px #308acc inset;\n}\n.maru-button-success-default-light {\n background-color: #eaf3fa;\n color: #308acc;\n}\n.maru-button-success-default-light:hover {\n box-shadow: 0 0 6px rgba(48, 138, 204, 0.5019607843);\n}\n.maru-button-success-default-light:focus-visible, .maru-button-success-default-light:active {\n box-shadow: none;\n background-color: #308acc;\n color: white;\n}\n.maru-button-success-outline {\n background-color: white;\n color: #308acc;\n box-shadow: 0 0 0 1px #308acc inset;\n}\n.maru-button-success-outline:hover {\n box-shadow: 0 0 6px #d6e8f5;\n}\n.maru-button-success-outline:focus-visible, .maru-button-success-outline:active {\n box-shadow: none;\n background-color: #d6e8f5;\n box-shadow: 0 0 0 1px #308acc inset;\n}\n.maru-button-success-text {\n background-color: transparent;\n color: #308acc;\n}\n.maru-button-success-color-on-focus {\n background-color: white;\n color: #5c5c5c;\n box-shadow: 0 0 0 1px #bdbdbd inset;\n padding: 5px 7px 5px 6px !important;\n gap: 4px;\n}\n.maru-button-success-color-on-focus:hover {\n background-color: #eaf3fa;\n}\n.maru-button-success-color-on-focus:focus-visible, .maru-button-success-color-on-focus:active {\n background-color: #eaf3fa;\n color: #308acc;\n}\n\n.maru-button-with-start-icon.size-small,\n.maru-button-with-end-icon.size-small {\n padding: 5px 12px;\n}\n.maru-button-with-start-icon.size-small.maru-button-secondary-outline,\n.maru-button-with-end-icon.size-small.maru-button-secondary-outline {\n background-color: white;\n color: #bdbdbd;\n box-shadow: 0 0 0 1px #e4e4e4 inset;\n}\n.maru-button-with-start-icon.size-small.maru-button-secondary-outline:hover,\n.maru-button-with-end-icon.size-small.maru-button-secondary-outline:hover {\n color: var(--p);\n box-shadow: 0 0 0 1px var(--p) inset;\n}\n.maru-button-with-start-icon.size-small.maru-button-secondary-outline:focus-visible, .maru-button-with-start-icon.size-small.maru-button-secondary-outline:active,\n.maru-button-with-end-icon.size-small.maru-button-secondary-outline:focus-visible,\n.maru-button-with-end-icon.size-small.maru-button-secondary-outline:active {\n background-color: var(--p-10);\n color: var(--p);\n box-shadow: 0 0 0 1px var(--p) inset;\n}\n.maru-button-with-start-icon.size-normal,\n.maru-button-with-end-icon.size-normal {\n padding: 8px 12px;\n}\n\n.maru-button-only-icon.size-normal {\n padding: 0;\n justify-content: center;\n background-color: transparent;\n}\n.maru-button-only-icon.size-normal:hover, .maru-button-only-icon.size-normal:focus-visible, .maru-button-only-icon.size-normal:active {\n box-shadow: none;\n background-color: transparent;\n}";
|
|
6104
6104
|
styleInject(css_248z$j);
|
|
6105
6105
|
|
|
6106
6106
|
var Button = /*#__PURE__*/forwardRef(function (_a, ref) {
|
|
@@ -26023,7 +26023,7 @@ function Dropdown(_a) {
|
|
|
26023
26023
|
}));
|
|
26024
26024
|
}
|
|
26025
26025
|
|
|
26026
|
-
var css_248z$5 = ".maru-modal-wrapper {\n width: 100vw;\n height: 100vh;\n position: fixed;\n top: 0;\n left: 0;\n background-color: rgba(92, 92, 92, 0.5019607843);\n z-index: 6006;\n display: block;\n display: flex;\n justify-content: center;\n align-items: center;\n flex-direction: row;\n}\n.maru-modal-wrapper .maru-modal {\n background-color: white;\n
|
|
26026
|
+
var css_248z$5 = ".maru-modal-wrapper {\n width: 100vw;\n height: 100vh;\n position: fixed;\n top: 0;\n left: 0;\n background-color: rgba(92, 92, 92, 0.5019607843);\n z-index: 6006;\n display: block;\n display: flex;\n justify-content: center;\n align-items: center;\n flex-direction: row;\n}\n.maru-modal-wrapper .maru-modal {\n background-color: white;\n box-shadow: 0px 5px 20px 0px #8c8c8c;\n}\n.maru-modal-wrapper .maru-modal.maru-modal-xs {\n width: 300px;\n box-shadow: 0px 2px 8px 1px #8c8c8c;\n padding: 32px;\n border-radius: 10px;\n}\n.maru-modal-wrapper .maru-modal.maru-modal-s {\n width: 400px;\n padding: 32px;\n border-radius: 10px;\n}\n.maru-modal-wrapper .maru-modal.maru-modal-m {\n width: 550px;\n padding: 28px 36px 36px 36px;\n border-radius: 12px;\n}\n.maru-modal-wrapper .maru-modal.maru-modal-l {\n width: 860px;\n padding: 28px 36px 36px 36px;\n border-radius: 12px;\n}\n.maru-modal-wrapper .maru-modal.maru-modal-xl {\n width: 1200px;\n padding: 30px 40px 40px 40px;\n border-radius: 12px;\n}\n.maru-modal-wrapper .maru-modal .maru-modal-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n flex-direction: row;\n margin-bottom: 24px;\n}\n.maru-modal-wrapper .maru-modal .maru-modal-header > div {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n flex-direction: row;\n gap: 8px;\n}\n.maru-modal-wrapper .maru-modal .maru-modal-header > div > h1 {\n font-family: Pretendard;\n font-style: normal;\n line-height: 150%;\n font-size: 16px;\n letter-spacing: -0.64px;\n font-weight: 600;\n color: #5c5c5c;\n}\n.maru-modal-wrapper .maru-modal .maru-modal-header > div .sub-title-wrapper {\n font-family: Pretendard;\n font-style: normal;\n line-height: 150%;\n font-size: 12px;\n letter-spacing: -0.48px;\n font-weight: 400;\n color: #8c8c8c;\n}\n.maru-modal-wrapper .maru-modal .maru-modal-body {\n font-family: Pretendard;\n font-style: normal;\n line-height: 150%;\n font-size: 14px;\n letter-spacing: -0.56px;\n font-weight: 400;\n color: #5c5c5c;\n}\n.maru-modal-wrapper .maru-modal .maru-modal-footer {\n display: flex;\n justify-content: flex-end;\n align-items: center;\n flex-direction: row;\n margin-top: 24px;\n}\n.maru-modal-wrapper .maru-modal .maru-modal-footer button {\n margin: 0 0 0 6px;\n}";
|
|
26027
26027
|
styleInject(css_248z$5);
|
|
26028
26028
|
|
|
26029
26029
|
function Modal(_a) {
|