feat(WEB-304): remaning UI from design system primitives

This commit is contained in:
Simon Emanuelsson
2024-06-07 10:36:23 +02:00
parent 6737970f54
commit 7c4b8401e9
228 changed files with 3516 additions and 3237 deletions

View File

@@ -1,25 +1,26 @@
.phone {
--react-international-phone-border-color: var(--some-black-color, #757575);
--react-international-phone-border-radius: 0.4rem;
--react-international-phone-font-size: 1.6rem;
--react-international-phone-height: 4rem;
--react-international-phone-text-color: color:
var(--some-black-color, #757575);
--react-international-phone-border-color: var(--UI-Grey-60);
--react-international-phone-border-radius: var(--Corner-radius-Small);
--react-international-phone-font-size: var(
--typography-Body-Regular-fontSize
);
--react-international-phone-height: 40px;
--react-international-phone-text-color: var(--UI-Grey-60);
}
.phone :global(.react-international-phone-input-container) {
display: grid;
/* r-i-p sets their width dynamically and doesn't respect the width property of its parent */
grid-template-columns: 4.7rem minmax(20.3rem, 1fr);
width: min(28rem, 100%);
grid-template-columns: 470px minmax(203px, 1fr);
width: min(280px, 100%);
}
/* react-international-phone only exposes variables to change border-color */
.phone :global(.react-international-phone-country-selector-button),
.phone :global(.react-international-phone-input) {
border-width: 0.2rem;
border-width: 2px;
}
.phone :global(.react-international-phone-input) {
padding: 0.8rem 1.6rem;
padding: var(--Spacing-x1) var(--Spacing-x2);
}