@axa-fr/design-system-look-and-feel-css 0.2.0-beta.306

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 (112) hide show
  1. package/dist/Accordion/Accordion.css +1 -0
  2. package/dist/Accordion/Accordion.css.map +1 -0
  3. package/dist/Accordion/Accordion.scss +74 -0
  4. package/dist/Alert/Alert.css +1 -0
  5. package/dist/Alert/Alert.css.map +1 -0
  6. package/dist/Alert/Alert.scss +104 -0
  7. package/dist/Button/Button.css +1 -0
  8. package/dist/Button/Button.css.map +1 -0
  9. package/dist/Button/Button.scss +148 -0
  10. package/dist/Card/Card.css +1 -0
  11. package/dist/Card/Card.css.map +1 -0
  12. package/dist/Card/Card.scss +48 -0
  13. package/dist/Form/Checkbox/Checkbox.css +1 -0
  14. package/dist/Form/Checkbox/Checkbox.css.map +1 -0
  15. package/dist/Form/Checkbox/Checkbox.scss +218 -0
  16. package/dist/Form/FileUpload/FileUpload.css +1 -0
  17. package/dist/Form/FileUpload/FileUpload.css.map +1 -0
  18. package/dist/Form/FileUpload/FileUpload.scss +191 -0
  19. package/dist/Form/InputError/InputError.css +1 -0
  20. package/dist/Form/InputError/InputError.css.map +1 -0
  21. package/dist/Form/InputError/InputError.scss +19 -0
  22. package/dist/Form/Radio/Radio.css +1 -0
  23. package/dist/Form/Radio/Radio.css.map +1 -0
  24. package/dist/Form/Radio/Radio.scss +221 -0
  25. package/dist/Form/Select/Select.css +1 -0
  26. package/dist/Form/Select/Select.css.map +1 -0
  27. package/dist/Form/Select/Select.scss +116 -0
  28. package/dist/Form/Text/Text.css +1 -0
  29. package/dist/Form/Text/Text.css.map +1 -0
  30. package/dist/Form/Text/Text.scss +56 -0
  31. package/dist/Form/core/FormCore.css +0 -0
  32. package/dist/Form/core/FormCore.scss +1 -0
  33. package/dist/IconBg/IconBg.css +1 -0
  34. package/dist/IconBg/IconBg.css.map +1 -0
  35. package/dist/IconBg/IconBg.scss +38 -0
  36. package/dist/Layout/Footer/Footer.css +1 -0
  37. package/dist/Layout/Footer/Footer.css.map +1 -0
  38. package/dist/Layout/Footer/Footer.scss +173 -0
  39. package/dist/Layout/Header/Header.css +1 -0
  40. package/dist/Layout/Header/Header.css.map +1 -0
  41. package/dist/Layout/Header/Header.scss +84 -0
  42. package/dist/Layout/Header/NavBar/NavBar.css +1 -0
  43. package/dist/Layout/Header/NavBar/NavBar.css.map +1 -0
  44. package/dist/Layout/Header/NavBar/NavBar.scss +50 -0
  45. package/dist/Layout/Header/PreviousLink/PreviousLink.css +1 -0
  46. package/dist/Layout/Header/PreviousLink/PreviousLink.css.map +1 -0
  47. package/dist/Layout/Header/PreviousLink/PreviousLink.scss +42 -0
  48. package/dist/Link/Link.css +1 -0
  49. package/dist/Link/Link.css.map +1 -0
  50. package/dist/Link/Link.scss +44 -0
  51. package/dist/List/ClickList/ClickList.css +1 -0
  52. package/dist/List/ClickList/ClickList.css.map +1 -0
  53. package/dist/List/ClickList/ClickList.scss +228 -0
  54. package/dist/List/ContentItemDuo/ContentItemDuo.css +1 -0
  55. package/dist/List/ContentItemDuo/ContentItemDuo.css.map +1 -0
  56. package/dist/List/ContentItemDuo/ContentItemDuo.scss +168 -0
  57. package/dist/List/ContentItemMono/ContentItemMono.css +1 -0
  58. package/dist/List/ContentItemMono/ContentItemMono.css.map +1 -0
  59. package/dist/List/ContentItemMono/ContentItemMono.scss +188 -0
  60. package/dist/List/ContentTabList/ContentTabList.css +1 -0
  61. package/dist/List/ContentTabList/ContentTabList.css.map +1 -0
  62. package/dist/List/ContentTabList/ContentTabList.scss +161 -0
  63. package/dist/List/List.css +1 -0
  64. package/dist/List/List.css.map +1 -0
  65. package/dist/List/List.scss +53 -0
  66. package/dist/Loader/Loader.css +1 -0
  67. package/dist/Loader/Loader.css.map +1 -0
  68. package/dist/Loader/Loader.scss +26 -0
  69. package/dist/Modal/Modal.css +1 -0
  70. package/dist/Modal/Modal.css.map +1 -0
  71. package/dist/Modal/Modal.scss +128 -0
  72. package/dist/Pagination/Pagination.css +1 -0
  73. package/dist/Pagination/Pagination.css.map +1 -0
  74. package/dist/Pagination/Pagination.scss +8 -0
  75. package/dist/Pagination/PaginationDesktop.css +1 -0
  76. package/dist/Pagination/PaginationDesktop.css.map +1 -0
  77. package/dist/Pagination/PaginationDesktop.scss +68 -0
  78. package/dist/Pagination/PaginationMobile.css +1 -0
  79. package/dist/Pagination/PaginationMobile.css.map +1 -0
  80. package/dist/Pagination/PaginationMobile.scss +35 -0
  81. package/dist/Stepper/Stepper.css +1 -0
  82. package/dist/Stepper/Stepper.css.map +1 -0
  83. package/dist/Stepper/Stepper.scss +53 -0
  84. package/dist/Tabs/Tabs.css +1 -0
  85. package/dist/Tabs/Tabs.css.map +1 -0
  86. package/dist/Tabs/Tabs.scss +63 -0
  87. package/dist/Tag/Tag.css +1 -0
  88. package/dist/Tag/Tag.css.map +1 -0
  89. package/dist/Tag/Tag.scss +48 -0
  90. package/dist/Title/Title.css +1 -0
  91. package/dist/Title/Title.css.map +1 -0
  92. package/dist/Title/Title.scss +76 -0
  93. package/dist/common/assets/logo-axa.svg +40 -0
  94. package/dist/common/common.css +0 -0
  95. package/dist/common/common.scss +107 -0
  96. package/dist/common/glyphicons/icons.eot +0 -0
  97. package/dist/common/glyphicons/icons.svg +918 -0
  98. package/dist/common/glyphicons/icons.ttf +0 -0
  99. package/dist/common/glyphicons/icons.woff +0 -0
  100. package/dist/common/grid.css +1 -0
  101. package/dist/common/grid.css.map +1 -0
  102. package/dist/common/grid.scss +1029 -0
  103. package/dist/common/icons.css +1 -0
  104. package/dist/common/icons.css.map +1 -0
  105. package/dist/common/icons.scss +1236 -0
  106. package/dist/common/reboot.css +1 -0
  107. package/dist/common/reboot.css.map +1 -0
  108. package/dist/common/reboot.scss +337 -0
  109. package/dist/look-and-feel.css +1 -0
  110. package/dist/look-and-feel.css.map +1 -0
  111. package/dist/look-and-feel.scss +27 -0
  112. package/package.json +108 -0
@@ -0,0 +1,161 @@
1
+ @use "../../common/common" as common;
2
+
3
+ .af-card--content-tab-list {
4
+ .af-list {
5
+ display: flex;
6
+ flex-direction: column;
7
+ justify-content: center;
8
+ }
9
+
10
+ .af-list__item {
11
+ display: flex;
12
+ flex-direction: row;
13
+ align-items: center;
14
+ justify-content: space-between;
15
+ gap: 2.5rem;
16
+
17
+ span {
18
+ display: block;
19
+ margin: 0;
20
+ }
21
+
22
+ .af-list-item {
23
+ &__left-container,
24
+ &__right-container,
25
+ &__additional-data-container {
26
+ all: inherit;
27
+ padding: 0;
28
+ }
29
+
30
+ &__additional-data-container {
31
+ grid-area: content-tab__additional-data-container;
32
+
33
+ .af-tag {
34
+ grid-area: content-tab__tag;
35
+ }
36
+ }
37
+
38
+ &__label {
39
+ grid-area: content-tab__label;
40
+ color: common.$color-gray-900;
41
+ }
42
+
43
+ &-label__title {
44
+ font-size: 1.125rem;
45
+ font-weight: 600;
46
+ line-height: 1.4rem;
47
+ }
48
+
49
+ &-label__subtitle {
50
+ font-size: 1rem;
51
+ font-weight: 400;
52
+ line-height: 1.25rem;
53
+ color: common.$color-gray-700;
54
+ }
55
+
56
+ &__date {
57
+ grid-area: content-tab__date;
58
+ font-size: 1.125rem;
59
+ font-weight: 600;
60
+ line-height: 1.4rem;
61
+ color: common.$color-gray-700;
62
+ }
63
+
64
+ &__value {
65
+ justify-self: end;
66
+ font-size: 1.125rem;
67
+ font-weight: 600;
68
+ line-height: 1.4rem;
69
+ text-align: right;
70
+ color: common.$color-green-600;
71
+ }
72
+
73
+ &__button-container {
74
+ margin: 0 0.625rem;
75
+
76
+ svg {
77
+ width: 1.25rem;
78
+ height: 1.25rem;
79
+ fill: common.$color-axa;
80
+ }
81
+ }
82
+ }
83
+
84
+ &:not(:has(.af-list-item__value)) {
85
+ .af-tag {
86
+ margin: 0 1.34rem;
87
+ }
88
+ }
89
+ }
90
+ }
91
+
92
+ @media (width <= #{common.$breakpoint-sm}) {
93
+ .af-card--content-tab-list .af-list__item {
94
+ gap: 1.5rem;
95
+
96
+ .af-list-item {
97
+ &__left-container {
98
+ display: grid;
99
+ grid-template:
100
+ "content-tab__additional-data-container"
101
+ "content-tab__label";
102
+ align-items: start;
103
+ justify-content: start;
104
+ gap: 0.25rem;
105
+ }
106
+
107
+ &__right-container {
108
+ gap: 1.5rem;
109
+ }
110
+
111
+ &__additional-data-container {
112
+ display: block;
113
+ align-items: center;
114
+
115
+ &:has(.af-list-item__date):has(.af-tag) {
116
+ display: grid;
117
+ grid-template: "content-tab__tag content-tab__date";
118
+ gap: 0.75rem;
119
+ }
120
+
121
+ .af-tag {
122
+ margin: 0;
123
+ }
124
+ }
125
+
126
+ &-label__title {
127
+ font-size: 1rem;
128
+ line-height: 1.25rem;
129
+ }
130
+
131
+ &-label__subtitle {
132
+ font-size: 0.875rem;
133
+ line-height: 1.1rem;
134
+ }
135
+
136
+ &__date {
137
+ font-size: 1rem;
138
+ line-height: 1.25rem;
139
+ }
140
+
141
+ &__value {
142
+ font-size: 1rem;
143
+ line-height: 1.25rem;
144
+ }
145
+
146
+ &__button-container {
147
+ margin: 0;
148
+
149
+ button {
150
+ padding: 0;
151
+ gap: 0;
152
+ font-size: 0;
153
+ }
154
+ }
155
+ }
156
+
157
+ &:has(.af-list-item__value) {
158
+ align-items: start;
159
+ }
160
+ }
161
+ }
@@ -0,0 +1 @@
1
+ .af-list{flex-direction:column;list-style-type:none;padding:0}.af-list__item{padding:1rem 0}.af-list__separator{border:1px solid #e9ecf2;margin:0}.af-card--list{box-shadow:none;padding:0 1rem}.af-card--large{width:100%}.af-card--extra-padding{padding:.5rem 1.5rem}.af-card--first-separator-full-width{padding:0}.af-card--first-separator-full-width .af-list__item{padding:1rem}.af-card--first-separator-full-width .af-list__separator~.af-list__separator{margin:0 1rem}@media (width <= 667px){.af-card--extra-padding{padding:.25rem 1rem}.af-card--extra-padding .af-list__item{padding:.75rem 0}}
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/List/List.scss%23sass","../../src/List/List.scss"],"names":[],"mappings":"AAEA,SCAA,qBAAA,CDGE,oBAAA,CAFA,SCCF,CDGE,eACE,cCDJ,CDIE,oBAEE,wBAAA,CADA,QCDJ,CDOE,eCHF,eAAA,CDII,cCHJ,CDOE,gBACE,UCLJ,CDQE,wBACE,oBCNJ,CDSE,qCACE,SCPJ,CDSI,oDACE,YCPN,CDUI,6EACE,aCRN,CDaA,wBACE,wBACE,mBCVF,CDYE,uCACE,gBCVJ,CACF","file":"List.css","sourcesContent":["@use \"../common/common\" as common;\n\n.af-list {\n padding: 0;\n flex-direction: column;\n list-style-type: none;\n\n &__item {\n padding: 1rem 0;\n }\n\n &__separator {\n margin: 0;\n border: 1px solid common.$color-gray-300;\n }\n}\n\n.af-card {\n &--list {\n padding: 0 1rem;\n box-shadow: none;\n }\n\n &--large {\n width: 100%;\n }\n\n &--extra-padding {\n padding: 0.5rem 1.5rem;\n }\n\n &--first-separator-full-width {\n padding: 0;\n\n .af-list__item {\n padding: 1rem;\n }\n\n .af-list__separator ~ .af-list__separator {\n margin: 0 1rem;\n }\n }\n}\n\n@media (width <= #{common.$breakpoint-sm}) {\n .af-card--extra-padding {\n padding: 0.25rem 1rem;\n\n .af-list__item {\n padding: 0.75rem 0;\n }\n }\n}\n","@use \"../common/common\" as common;\n\n.af-list {\n padding: 0;\n flex-direction: column;\n list-style-type: none;\n\n &__item {\n padding: 1rem 0;\n }\n\n &__separator {\n margin: 0;\n border: 1px solid common.$color-gray-300;\n }\n}\n\n.af-card {\n &--list {\n padding: 0 1rem;\n box-shadow: none;\n }\n\n &--large {\n width: 100%;\n }\n\n &--extra-padding {\n padding: 0.5rem 1.5rem;\n }\n\n &--first-separator-full-width {\n padding: 0;\n\n .af-list__item {\n padding: 1rem;\n }\n\n .af-list__separator ~ .af-list__separator {\n margin: 0 1rem;\n }\n }\n}\n\n@media (width <= #{common.$breakpoint-sm}) {\n .af-card--extra-padding {\n padding: 0.25rem 1rem;\n\n .af-list__item {\n padding: 0.75rem 0;\n }\n }\n}\n"]}
@@ -0,0 +1,53 @@
1
+ @use "../common/common" as common;
2
+
3
+ .af-list {
4
+ padding: 0;
5
+ flex-direction: column;
6
+ list-style-type: none;
7
+
8
+ &__item {
9
+ padding: 1rem 0;
10
+ }
11
+
12
+ &__separator {
13
+ margin: 0;
14
+ border: 1px solid common.$color-gray-300;
15
+ }
16
+ }
17
+
18
+ .af-card {
19
+ &--list {
20
+ padding: 0 1rem;
21
+ box-shadow: none;
22
+ }
23
+
24
+ &--large {
25
+ width: 100%;
26
+ }
27
+
28
+ &--extra-padding {
29
+ padding: 0.5rem 1.5rem;
30
+ }
31
+
32
+ &--first-separator-full-width {
33
+ padding: 0;
34
+
35
+ .af-list__item {
36
+ padding: 1rem;
37
+ }
38
+
39
+ .af-list__separator ~ .af-list__separator {
40
+ margin: 0 1rem;
41
+ }
42
+ }
43
+ }
44
+
45
+ @media (width <= #{common.$breakpoint-sm}) {
46
+ .af-card--extra-padding {
47
+ padding: 0.25rem 1rem;
48
+
49
+ .af-list__item {
50
+ padding: 0.75rem 0;
51
+ }
52
+ }
53
+ }
@@ -0,0 +1 @@
1
+ .af-loader__container{align-items:center;animation:spin 2s linear infinite;border:1px solid #f3f3f3;border-radius:50%;border-top-color:#00008f;container-type:inline-size;display:flex;flex-direction:column;justify-content:center;margin:auto}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/Loader/Loader.scss%23sass","../../src/Loader/Loader.scss"],"names":[],"mappings":"AAGE,sBAQE,kBAAA,CAEA,iCAAA,CALA,wBAAA,CACA,iBAAA,CADA,wBAAA,CCNJ,0BAAA,CDEI,YAAA,CAMA,qBAAA,CAEA,sBAAA,CANA,WCKJ,CDMA,gBACE,GCHF,sBACE,CACF,GACE,uBACA,CACF","file":"Loader.css","sourcesContent":["@use \"../common/common\" as common;\n\n.af-loader {\n &__container {\n display: flex;\n container-type: inline-size;\n margin: auto;\n border: 1px solid common.$color-gray-200;\n border-top: 1px solid common.$color-axa;\n border-radius: 50%;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n animation: spin 2s linear infinite;\n }\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0deg);\n }\n\n 100% {\n transform: rotate(360deg);\n }\n}\n","@use \"../common/common\" as common;\n\n.af-loader {\n &__container {\n display: flex;\n container-type: inline-size;\n margin: auto;\n border: 1px solid common.$color-gray-200;\n border-top: 1px solid common.$color-axa;\n border-radius: 50%;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n animation: spin 2s linear infinite;\n }\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0deg);\n }\n\n 100% {\n transform: rotate(360deg);\n }\n}\n"]}
@@ -0,0 +1,26 @@
1
+ @use "../common/common" as common;
2
+
3
+ .af-loader {
4
+ &__container {
5
+ display: flex;
6
+ container-type: inline-size;
7
+ margin: auto;
8
+ border: 1px solid common.$color-gray-200;
9
+ border-top: 1px solid common.$color-axa;
10
+ border-radius: 50%;
11
+ flex-direction: column;
12
+ align-items: center;
13
+ justify-content: center;
14
+ animation: spin 2s linear infinite;
15
+ }
16
+ }
17
+
18
+ @keyframes spin {
19
+ 0% {
20
+ transform: rotate(0deg);
21
+ }
22
+
23
+ 100% {
24
+ transform: rotate(360deg);
25
+ }
26
+ }
@@ -0,0 +1 @@
1
+ .af-modal{background-color:#fff;border:none;border-radius:.5rem;margin:0 auto;padding:1.5rem 0;position:fixed;width:100%}.af-modal::backdrop{background:#333;opacity:.4}.af-modal__top{align-items:center;background-color:#fff;border-bottom:1px solid #e5e5e5;display:flex;gap:1rem;padding:0 1.5rem 1.5rem;position:sticky;top:0}.af-modal__top-title{align-items:start;color:#333;display:flex;justify-content:space-between;margin:0;width:100%}.af-modal__top-title-text{font-family:Publico Headline;font-size:1.5rem;line-height:1.875rem}.af-modal__top-title-subtitle{color:#5f5f5f;font-family:Source Sans Pro,arial,sans-serif;font-size:1.125rem;font-weight:400;line-height:1.406rem}.af-modal__top-title-close-btn{all:unset;align-items:center;cursor:pointer;display:flex;height:2rem;justify-content:center;width:2rem;fill:#00008f}.af-modal__top-title :hover{background:none}.af-modal__top-title :focus{background:none;border:none}.af-modal__content{display:flex;flex-direction:column;font-family:Source Sans Pro,arial,sans-serif;font-size:1.125rem;font-weight:400;gap:2.5rem;margin-top:2.5rem;padding:0 1.5rem}.af-modal__actions{align-items:flex-end;display:flex;flex-direction:column-reverse;gap:1rem;justify-content:flex-end;padding-top:0}.af-modal__actions *,.af-modal__actions--fullWidth *{flex-grow:1;width:100%}@media only screen and (width >= 1024px){.af-modal{margin:auto;max-width:72rem;min-width:48rem}.af-modal__actions{flex-direction:row-reverse;justify-content:flex-start}.af-modal__actions *{flex-grow:unset;width:auto}.af-modal__actions--fullWidth *{flex-grow:1;width:100%}}
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/Modal/Modal.scss%23sass","../../src/Modal/Modal.scss","../../src/common/common.scss"],"names":[],"mappings":"AAEA,UAOE,qBAAA,CAFA,WAAA,CACA,mBAAA,CAHA,aAAA,CACA,gBAAA,CAHA,cAAA,CCDF,UAMA,CDGE,oBAEE,eAAA,CADA,UCAJ,CDIE,eAME,kBAAA,CAEA,qBAAA,CAHA,+BAAA,CAFA,YAAA,CAIA,QAAA,CAHA,uBAAA,CAHA,eAAA,CACA,KCIJ,CDII,qBAIE,iBAAA,CAEA,UAAA,CALA,YAAA,CAIA,6BAAA,CAFA,QAAA,CADA,UCEN,CDIM,0BACE,4BAAA,CACA,gBAAA,CACA,oBCFR,CDKM,8BAKE,aAAA,CAJA,4CEzCiB,CF0CjB,kBAAA,CACA,eAAA,CACA,oBCFR,CDMM,+BACE,SAAA,CAIA,kBAAA,CAEA,cAAA,CALA,YAAA,CAEA,WAAA,CAEA,sBAAA,CAHA,UAAA,CAKA,YCJR,CDOM,4BACE,eCLR,CDQM,4BAEE,eAAA,CADA,WCLR,CDWE,mBACE,YAAA,CAGA,qBAAA,CAEA,4CAAA,CACA,kBAAA,CACA,eAAA,CAHA,UAAA,CAHA,iBAAA,CACA,gBCJJ,CDYE,mBAIE,oBAAA,CAHA,YAAA,CAEA,6BAAA,CAGA,QAAA,CADA,wBAAA,CAHA,aCLJ,CDkBM,qDAEE,WAAA,CADA,UCXR,CDkBA,yCACE,UAGE,WAAA,CADA,eAAA,CADA,eCbF,CDiBE,mBACE,0BAAA,CACA,0BCfJ,CDiBI,qBAEE,eAAA,CADA,UCdN,CACF,gCAEA,WAAA,CDiBU,UChBR,CACF","file":"Modal.css","sourcesContent":["@use \"../common/common\" as common;\n\n.af-modal {\n position: fixed;\n width: 100%;\n margin: 0 auto;\n padding: 1.5rem 0;\n border: none;\n border-radius: 0.5rem;\n background-color: common.$color-white;\n\n &::backdrop {\n opacity: 0.4;\n background: common.$color-gray-900;\n }\n\n &__top {\n position: sticky;\n top: 0;\n display: flex;\n padding: 0 1.5rem 1.5rem;\n border-bottom: 1px solid common.$color-btn-disabled-border;\n align-items: center;\n gap: 1rem;\n background-color: common.$color-white;\n\n &-title {\n display: flex;\n width: 100%;\n margin: 0;\n align-items: start;\n justify-content: space-between;\n color: common.$color-gray-900;\n\n &-text {\n font-family: common.$font-family-publico;\n font-size: 1.5rem;\n line-height: 1.875rem;\n }\n\n &-subtitle {\n font-family: common.$font-family-sans-serif;\n font-size: 1.125rem;\n font-weight: 400;\n line-height: 1.406rem;\n color: common.$color-gray-700;\n }\n\n &-close-btn {\n all: unset;\n display: flex;\n width: 2rem;\n height: 2rem;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n fill: common.$color-axa;\n }\n\n :hover {\n background: none;\n }\n\n :focus {\n border: none;\n background: none;\n }\n }\n }\n\n &__content {\n display: flex;\n margin-top: 2.5rem;\n padding: 0 1.5rem;\n flex-direction: column;\n gap: 2.5rem;\n font-family: common.$font-family-base;\n font-size: 1.125rem;\n font-weight: 400;\n }\n\n &__actions {\n display: flex;\n padding-top: 0;\n flex-direction: column-reverse;\n align-items: flex-end;\n justify-content: flex-end;\n gap: 1rem;\n\n /* force fullwidth in mobile*/\n & * {\n width: 100%;\n flex-grow: 1;\n }\n\n &--fullWidth {\n & * {\n width: 100%;\n flex-grow: 1;\n }\n }\n }\n}\n\n@media only screen and (width >= #{common.$screen-size-m}) {\n .af-modal {\n min-width: 48rem;\n max-width: 72rem;\n margin: auto;\n\n &__actions {\n flex-direction: row-reverse;\n justify-content: flex-start;\n\n & * {\n width: auto;\n flex-grow: unset;\n }\n\n &--fullWidth {\n & * {\n width: 100%;\n flex-grow: 1;\n }\n }\n }\n }\n}\n","@use \"../common/common\" as common;\n\n.af-modal {\n position: fixed;\n width: 100%;\n margin: 0 auto;\n padding: 1.5rem 0;\n border: none;\n border-radius: 0.5rem;\n background-color: common.$color-white;\n\n &::backdrop {\n opacity: 0.4;\n background: common.$color-gray-900;\n }\n\n &__top {\n position: sticky;\n top: 0;\n display: flex;\n padding: 0 1.5rem 1.5rem;\n border-bottom: 1px solid common.$color-btn-disabled-border;\n align-items: center;\n gap: 1rem;\n background-color: common.$color-white;\n\n &-title {\n display: flex;\n width: 100%;\n margin: 0;\n align-items: start;\n justify-content: space-between;\n color: common.$color-gray-900;\n\n &-text {\n font-family: common.$font-family-publico;\n font-size: 1.5rem;\n line-height: 1.875rem;\n }\n\n &-subtitle {\n font-family: common.$font-family-sans-serif;\n font-size: 1.125rem;\n font-weight: 400;\n line-height: 1.406rem;\n color: common.$color-gray-700;\n }\n\n &-close-btn {\n all: unset;\n display: flex;\n width: 2rem;\n height: 2rem;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n fill: common.$color-axa;\n }\n\n :hover {\n background: none;\n }\n\n :focus {\n border: none;\n background: none;\n }\n }\n }\n\n &__content {\n display: flex;\n margin-top: 2.5rem;\n padding: 0 1.5rem;\n flex-direction: column;\n gap: 2.5rem;\n font-family: common.$font-family-base;\n font-size: 1.125rem;\n font-weight: 400;\n }\n\n &__actions {\n display: flex;\n padding-top: 0;\n flex-direction: column-reverse;\n align-items: flex-end;\n justify-content: flex-end;\n gap: 1rem;\n\n // force fullwidth in mobile\n & * {\n width: 100%;\n flex-grow: 1;\n }\n\n &--fullWidth {\n & * {\n width: 100%;\n flex-grow: 1;\n }\n }\n }\n}\n\n@media only screen and (width >= #{common.$screen-size-m}) {\n .af-modal {\n min-width: 48rem;\n max-width: 72rem;\n margin: auto;\n\n &__actions {\n flex-direction: row-reverse;\n justify-content: flex-start;\n\n & * {\n width: auto;\n flex-grow: unset;\n }\n\n &--fullWidth {\n & * {\n width: 100%;\n flex-grow: 1;\n }\n }\n }\n }\n}\n","$font-family-sans-serif: \"Source Sans Pro\", arial, sans-serif !default;\n$font-family-serif: georgia, times, \"Times New Roman\", serif !default;\n$font-family-base: $font-family-sans-serif !default;\n$font-family-publico-bold: \"Publico Headline Bold\" !default;\n$font-family-publico: \"Publico Headline\" !default;\n// colors\n\n$color-axa: #00008f !default;\n$color-white: #fff !default;\n$color-black: #000 !default;\n$color-red: #ff1721 !default;\n$color-gray: #5f5f5f !default;\n$color-red-700: #c91432 !default;\n$color-blue-1: #000072 !default;\n$color-blue-2: #f8f8ff !default;\n$color-blue-3: #36f !default;\n$color-btn-light: #3333a5 !default;\n$color-btn-business: #c94e14 !default;\n$color-btn-business-dark: #a8391c !default;\n$color-btn-business-light: #df7e65 !default;\n$color-btn-disabled-text: #999 !default;\n$color-btn-disabled-border: #e5e5e5 !default;\n$color-btn-error-text: #a11028 !default;\n$color-btn-error-bg: #fff3f5 !default;\n$color-btn-tertiary-bg: #eef !default;\n$color-btn-tertiary-bg-darker: #e4e4ff !default;\n$color-btn-tertiary-bg-lighter: #f8f8ff !default;\n$color-oceanBlue: #4976ba !default;\n$color-gray-1: #ccc !default;\n$color-gray-200: #f3f3f3;\n$color-gray-300: #e9ecf2;\n$color-gray-400: #e5e5e5;\n$color-gray-500: #999;\n$color-gray-700: #5f5f5f;\n$color-gray-900: #333 !default;\n$color-green-600: #118635 !default;\n$color-border: #f3f3f3 !default;\n$color-focus: #36f !default;\n\n// others\n\n$default-border-radius: 4px !default;\n\n$transition-duration: 0.2s !default;\n\n// spacing\n\n$sizing-u0: 0 !default;\n$sizing-u05: 0.4rem !default;\n$sizing-u1: 0.8rem !default;\n$sizing-u2: 1.6rem !default;\n$sizing-u3: 2.4rem !default;\n$sizing-u4: 3.2rem !default;\n$sizing-u5: 4rem !default;\n$sizing-u6: 4.8rem !default;\n$sizing-u7: 5.6rem !default;\n$sizing-u8: 6.4rem !default;\n$sizing-u9: 7.2rem !default;\n$sizing-u10: 8rem !default;\n$spacing-u0: 0 !default;\n$spacing-u05: 0.4rem !default;\n$spacing-u1: 0.8rem !default;\n$spacing-u2: 1.6rem !default;\n$spacing-u3: 2.4rem !default;\n$spacing-u4: 3.2rem !default;\n$spacing-u5: 4rem !default;\n$spacing-u6: 4.8rem !default;\n$spacing-u7: 5.6rem !default;\n$spacing-u8: 6.4rem !default;\n$spacing-u9: 7.2rem !default;\n$spacing-u10: 8rem !default;\n$spacing-u11: 8.8rem !default;\n$spacing-u12: 9.6rem !default;\n$spacing-u13: 10.4rem !default;\n$spacing-u14: 11.2rem !default;\n$spacing-u15: 12rem !default;\n$spacing-u16: 12.8rem !default;\n$spacing-u17: 13.6rem !default;\n$spacing-u18: 14.4rem !default;\n$spacing-u19: 15.2rem !default;\n$spacing-u20: 16rem !default;\n$screen-size-668: s !default;\n$screen-size-1024: m !default;\n$screen-size-1200: oldl !default;\n$screen-size-1280: l !default;\n$screen-size-1540: oldxl !default;\n$screen-size-1600: xl !default;\n$screen-size-s: 668px !default;\n$screen-size-m: 1024px !default;\n$screen-size-l: 1280px !default;\n$screen-size-xl: 1600px !default;\n$screen-size-oldl: 1200px !default;\n$screen-size-oldxl: 1540px !default;\n\n$error-custom-border: #d18e8e !default;\n$error-custom-bg: #ffbfbf !default;\n\n$color-alertDanger-colorBorder: #c8b282 !default;\n$color-alertDanger-bgColor: #f1d596 !default;\n\n// breakpoints\n\n$breakpoint-xs: 0 !default;\n$breakpoint-sm: 667px !default;\n$breakpoint-md: 1023px !default;\n$breakpoint-lg: 1279px !default;\n$breakpoint-xl: 1599px !default;\n"]}
@@ -0,0 +1,128 @@
1
+ @use "../common/common" as common;
2
+
3
+ .af-modal {
4
+ position: fixed;
5
+ width: 100%;
6
+ margin: 0 auto;
7
+ padding: 1.5rem 0;
8
+ border: none;
9
+ border-radius: 0.5rem;
10
+ background-color: common.$color-white;
11
+
12
+ &::backdrop {
13
+ opacity: 0.4;
14
+ background: common.$color-gray-900;
15
+ }
16
+
17
+ &__top {
18
+ position: sticky;
19
+ top: 0;
20
+ display: flex;
21
+ padding: 0 1.5rem 1.5rem;
22
+ border-bottom: 1px solid common.$color-btn-disabled-border;
23
+ align-items: center;
24
+ gap: 1rem;
25
+ background-color: common.$color-white;
26
+
27
+ &-title {
28
+ display: flex;
29
+ width: 100%;
30
+ margin: 0;
31
+ align-items: start;
32
+ justify-content: space-between;
33
+ color: common.$color-gray-900;
34
+
35
+ &-text {
36
+ font-family: common.$font-family-publico;
37
+ font-size: 1.5rem;
38
+ line-height: 1.875rem;
39
+ }
40
+
41
+ &-subtitle {
42
+ font-family: common.$font-family-sans-serif;
43
+ font-size: 1.125rem;
44
+ font-weight: 400;
45
+ line-height: 1.406rem;
46
+ color: common.$color-gray-700;
47
+ }
48
+
49
+ &-close-btn {
50
+ all: unset;
51
+ display: flex;
52
+ width: 2rem;
53
+ height: 2rem;
54
+ align-items: center;
55
+ justify-content: center;
56
+ cursor: pointer;
57
+ fill: common.$color-axa;
58
+ }
59
+
60
+ :hover {
61
+ background: none;
62
+ }
63
+
64
+ :focus {
65
+ border: none;
66
+ background: none;
67
+ }
68
+ }
69
+ }
70
+
71
+ &__content {
72
+ display: flex;
73
+ margin-top: 2.5rem;
74
+ padding: 0 1.5rem;
75
+ flex-direction: column;
76
+ gap: 2.5rem;
77
+ font-family: common.$font-family-base;
78
+ font-size: 1.125rem;
79
+ font-weight: 400;
80
+ }
81
+
82
+ &__actions {
83
+ display: flex;
84
+ padding-top: 0;
85
+ flex-direction: column-reverse;
86
+ align-items: flex-end;
87
+ justify-content: flex-end;
88
+ gap: 1rem;
89
+
90
+ // force fullwidth in mobile
91
+ & * {
92
+ width: 100%;
93
+ flex-grow: 1;
94
+ }
95
+
96
+ &--fullWidth {
97
+ & * {
98
+ width: 100%;
99
+ flex-grow: 1;
100
+ }
101
+ }
102
+ }
103
+ }
104
+
105
+ @media only screen and (width >= #{common.$screen-size-m}) {
106
+ .af-modal {
107
+ min-width: 48rem;
108
+ max-width: 72rem;
109
+ margin: auto;
110
+
111
+ &__actions {
112
+ flex-direction: row-reverse;
113
+ justify-content: flex-start;
114
+
115
+ & * {
116
+ width: auto;
117
+ flex-grow: unset;
118
+ }
119
+
120
+ &--fullWidth {
121
+ & * {
122
+ width: 100%;
123
+ flex-grow: 1;
124
+ }
125
+ }
126
+ }
127
+ }
128
+ }
@@ -0,0 +1 @@
1
+ .af-container-pagination>div{border:1px solid #f3f3f3;border-radius:41px;display:flex;padding:.5rem}
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/Pagination/Pagination.scss%23sass","../../src/Pagination/Pagination.scss"],"names":[],"mappings":"AAEA,6BAGE,wBAAA,CACA,kBAAA,CAHA,YAAA,CCDF,aAGA","file":"Pagination.css","sourcesContent":["@use \"../common/common\" as common;\n\n.af-container-pagination > div {\n display: flex;\n padding: 0.5rem;\n border: 1px solid common.$color-border;\n border-radius: 41px;\n}\n","@use \"../common/common\" as common;\n\n.af-container-pagination > div {\n display: flex;\n padding: 0.5rem;\n border: 1px solid common.$color-border;\n border-radius: 41px;\n}\n"]}
@@ -0,0 +1,8 @@
1
+ @use "../common/common" as common;
2
+
3
+ .af-container-pagination > div {
4
+ display: flex;
5
+ padding: 0.5rem;
6
+ border: 1px solid common.$color-border;
7
+ border-radius: 41px;
8
+ }
@@ -0,0 +1 @@
1
+ .af-pagination-desktop ul{display:flex;gap:.5rem;justify-content:center;list-style-type:none;margin:0;padding:0}.af-pagination-desktop ul li{align-items:center;border-radius:50%;color:#00008f;display:flex;height:3rem;justify-content:center;width:3rem}.af-pagination-desktop ul li button{all:unset;cursor:pointer}.af-pagination-desktop ul li button:focus-visible{outline:1px solid #00008f}.af-pagination-desktop ul li[aria-current]{background:#00008f;color:#fff}.af-pagination-desktop .first{margin:0 3rem 0 0}.af-pagination-desktop .first li:last-child:before{content:"...";padding:2rem}.af-pagination-desktop .between{margin:0 2rem}.af-pagination-desktop .between li:first-child:after,.af-pagination-desktop .between li:last-child:before{content:"...";padding:2rem}.af-pagination-desktop .last{margin:0 0 0 3rem}.af-pagination-desktop .last li:first-child:after{content:"...";padding:2rem}
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/Pagination/PaginationDesktop.scss%23sass","../../src/Pagination/PaginationDesktop.scss"],"names":[],"mappings":"AAGE,0BACE,YAAA,CAIA,SAAA,CADA,sBAAA,CAEA,oBAAA,CCPJ,QAAA,CDII,SCCJ,CDII,6BAKE,kBAAA,CADA,iBAAA,CAGA,aAAA,CANA,YAAA,CAEA,WAAA,CAGA,sBAAA,CAJA,UCGN,CDIM,oCACE,SAAA,CACA,cCFR,CDIQ,kDACE,yBCFV,CDOI,2CAEE,kBAAA,CADA,UCJN,CDSE,8BACE,iBCPJ,CDSI,mDAEE,aAAA,CADA,YCNN,CDWE,gCACE,aCTJ,CDgBI,0GAEE,aAAA,CADA,YCTN,CDcE,6BACE,iBCZJ,CDcI,kDAEE,aAAA,CADA,YCXN","file":"PaginationDesktop.css","sourcesContent":["@use \"../common/common\" as common;\n\n.af-pagination-desktop {\n ul {\n display: flex;\n margin: 0;\n padding: 0;\n justify-content: center;\n gap: 0.5rem;\n list-style-type: none;\n\n li {\n display: flex;\n width: 3rem;\n height: 3rem;\n border-radius: 50%;\n align-items: center;\n justify-content: center;\n color: common.$color-axa;\n\n button {\n all: unset;\n cursor: pointer;\n\n &:focus-visible {\n outline: 1px solid common.$color-axa;\n }\n }\n }\n\n li[aria-current] {\n color: common.$color-white;\n background: common.$color-axa;\n }\n }\n\n .first {\n margin: 0 3rem 0 0;\n\n li:last-child::before {\n padding: 2rem;\n content: \"...\";\n }\n }\n\n .between {\n margin: 0 2rem;\n\n li:first-child::after {\n padding: 2rem;\n content: \"...\";\n }\n\n li:last-child::before {\n padding: 2rem;\n content: \"...\";\n }\n }\n\n .last {\n margin: 0 0 0 3rem;\n\n li:first-child::after {\n padding: 2rem;\n content: \"...\";\n }\n }\n}\n","@use \"../common/common\" as common;\n\n.af-pagination-desktop {\n ul {\n display: flex;\n margin: 0;\n padding: 0;\n justify-content: center;\n gap: 0.5rem;\n list-style-type: none;\n\n li {\n display: flex;\n width: 3rem;\n height: 3rem;\n border-radius: 50%;\n align-items: center;\n justify-content: center;\n color: common.$color-axa;\n\n button {\n all: unset;\n cursor: pointer;\n\n &:focus-visible {\n outline: 1px solid common.$color-axa;\n }\n }\n }\n\n li[aria-current] {\n color: common.$color-white;\n background: common.$color-axa;\n }\n }\n\n .first {\n margin: 0 3rem 0 0;\n\n li:last-child::before {\n padding: 2rem;\n content: \"...\";\n }\n }\n\n .between {\n margin: 0 2rem;\n\n li:first-child::after {\n padding: 2rem;\n content: \"...\";\n }\n\n li:last-child::before {\n padding: 2rem;\n content: \"...\";\n }\n }\n\n .last {\n margin: 0 0 0 3rem;\n\n li:first-child::after {\n padding: 2rem;\n content: \"...\";\n }\n }\n}\n"]}
@@ -0,0 +1,68 @@
1
+ @use "../common/common" as common;
2
+
3
+ .af-pagination-desktop {
4
+ ul {
5
+ display: flex;
6
+ margin: 0;
7
+ padding: 0;
8
+ justify-content: center;
9
+ gap: 0.5rem;
10
+ list-style-type: none;
11
+
12
+ li {
13
+ display: flex;
14
+ width: 3rem;
15
+ height: 3rem;
16
+ border-radius: 50%;
17
+ align-items: center;
18
+ justify-content: center;
19
+ color: common.$color-axa;
20
+
21
+ button {
22
+ all: unset;
23
+ cursor: pointer;
24
+
25
+ &:focus-visible {
26
+ outline: 1px solid common.$color-axa;
27
+ }
28
+ }
29
+ }
30
+
31
+ li[aria-current] {
32
+ color: common.$color-white;
33
+ background: common.$color-axa;
34
+ }
35
+ }
36
+
37
+ .first {
38
+ margin: 0 3rem 0 0;
39
+
40
+ li:last-child::before {
41
+ padding: 2rem;
42
+ content: "...";
43
+ }
44
+ }
45
+
46
+ .between {
47
+ margin: 0 2rem;
48
+
49
+ li:first-child::after {
50
+ padding: 2rem;
51
+ content: "...";
52
+ }
53
+
54
+ li:last-child::before {
55
+ padding: 2rem;
56
+ content: "...";
57
+ }
58
+ }
59
+
60
+ .last {
61
+ margin: 0 0 0 3rem;
62
+
63
+ li:first-child::after {
64
+ padding: 2rem;
65
+ content: "...";
66
+ }
67
+ }
68
+ }
@@ -0,0 +1 @@
1
+ .af-pagination-mobile{align-items:center;font-size:1rem;font-weight:600;line-height:1.2rem}.af-pagination-mobile>span{color:#5f5f5f}.af-pagination-mobile button{background:none;border:none;cursor:pointer;outline:none}.af-pagination-mobile button:focus-visible{outline:1px solid #00008f}.af-pagination-mobile button .arrow{color:#00008f}.af-pagination-mobile button:disabled{pointer-events:none}.af-pagination-mobile button:disabled .arrow{color:#e5e5e5}
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/Pagination/PaginationMobile.scss%23sass","../../src/Pagination/PaginationMobile.scss"],"names":[],"mappings":"AAEA,sBACE,kBAAA,CCDF,cAAA,CDGE,eAAA,CACA,kBCDF,CDGE,2BACE,aCDJ,CDIE,6BAEE,eAAA,CADA,WAAA,CAGA,cAAA,CADA,YCDJ,CDII,2CACE,yBCFN,CDKI,oCACE,aCHN,CDMI,sCACE,mBCJN,CDMM,6CACE,aCJR","file":"PaginationMobile.css","sourcesContent":["@use \"../common/common\" as common;\n\n.af-pagination-mobile {\n align-items: center;\n font-size: 1rem;\n font-weight: 600;\n line-height: 1.2rem;\n\n > span {\n color: common.$color-gray;\n }\n\n button {\n border: none;\n background: none;\n outline: none;\n cursor: pointer;\n\n &:focus-visible {\n outline: 1px solid common.$color-axa;\n }\n\n .arrow {\n color: common.$color-axa;\n }\n\n &:disabled {\n pointer-events: none;\n\n .arrow {\n color: common.$color-gray-400;\n }\n }\n }\n}\n","@use \"../common/common\" as common;\n\n.af-pagination-mobile {\n align-items: center;\n font-size: 1rem;\n font-weight: 600;\n line-height: 1.2rem;\n\n > span {\n color: common.$color-gray;\n }\n\n button {\n border: none;\n background: none;\n outline: none;\n cursor: pointer;\n\n &:focus-visible {\n outline: 1px solid common.$color-axa;\n }\n\n .arrow {\n color: common.$color-axa;\n }\n\n &:disabled {\n pointer-events: none;\n\n .arrow {\n color: common.$color-gray-400;\n }\n }\n }\n}\n"]}
@@ -0,0 +1,35 @@
1
+ @use "../common/common" as common;
2
+
3
+ .af-pagination-mobile {
4
+ align-items: center;
5
+ font-size: 1rem;
6
+ font-weight: 600;
7
+ line-height: 1.2rem;
8
+
9
+ > span {
10
+ color: common.$color-gray;
11
+ }
12
+
13
+ button {
14
+ border: none;
15
+ background: none;
16
+ outline: none;
17
+ cursor: pointer;
18
+
19
+ &:focus-visible {
20
+ outline: 1px solid common.$color-axa;
21
+ }
22
+
23
+ .arrow {
24
+ color: common.$color-axa;
25
+ }
26
+
27
+ &:disabled {
28
+ pointer-events: none;
29
+
30
+ .arrow {
31
+ color: common.$color-gray-400;
32
+ }
33
+ }
34
+ }
35
+ }
@@ -0,0 +1 @@
1
+ .af-stepper-client{background-color:initial;display:flex;flex-direction:column;width:100%}.af-stepper-client__title{color:#333;font-family:Publico Headline Bold,Source Sans Pro,arial,sans-serif;font-size:2rem;font-weight:700;line-height:2.5rem;margin-bottom:.5rem;text-align:left}.af-stepper-client__subtitle{color:#5f5f5f;font-family:Source Sans Pro,arial,sans-serif;font-size:1.125rem;font-weight:400;line-height:1.406rem;margin-bottom:1.5rem;text-align:left}.af-stepper-client__content{align-items:flex-end;display:flex;gap:1rem}.af-stepper-client__progressbar{background-color:#e5e5e5;border-radius:4px;height:.375rem;width:100%}.af-stepper-client__progress{background-color:#00008f;border-radius:4px;height:100%;height:.375rem;text-align:left;transition:.75s ease-out,background-color .75s;width:50%}
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/Stepper/Stepper.scss%23sass","../../src/Stepper/Stepper.scss","../../src/common/common.scss"],"names":[],"mappings":"AAEA,mBAIE,wBAAA,CAHA,YAAA,CAEA,qBAAA,CCHF,UAGA,CDGE,0BAOE,UAAA,CALA,kEAAA,CACA,cAAA,CACA,eAAA,CACA,kBAAA,CAJA,mBAAA,CAKA,eCAJ,CDIE,6BAOE,aAAA,CALA,4CEpBqB,CFqBrB,kBAAA,CACA,eAAA,CACA,oBAAA,CAJA,oBAAA,CAKA,eCDJ,CDKE,4BAEE,oBAAA,CADA,YAAA,CAEA,QCHJ,CDME,gCAIE,wBEjBwB,CFgBxB,iBAAA,CADA,cAAA,CADA,UCDJ,CDOE,6BAME,wBAAA,CAFA,iBAAA,CAFA,WAAA,CACA,cAAA,CAEA,eAAA,CAEA,8CACE,CAPF,SCCJ","file":"Stepper.css","sourcesContent":["@use \"../common/common\" as common;\n\n.af-stepper-client {\n display: flex;\n width: 100%;\n flex-direction: column;\n background-color: transparent;\n\n &__title {\n margin-bottom: 0.5rem;\n font-family: common.$font-family-publico-bold, common.$font-family-base;\n font-size: 2rem;\n font-weight: 700;\n line-height: 2.5rem;\n text-align: left;\n color: common.$color-gray-900;\n }\n\n &__subtitle {\n margin-bottom: 1.5rem;\n font-family: common.$font-family-sans-serif;\n font-size: 1.125rem;\n font-weight: 400;\n line-height: 1.406rem;\n text-align: left;\n color: common.$color-gray-700;\n }\n\n &__content {\n display: flex;\n align-items: flex-end;\n gap: 1rem;\n }\n\n &__progressbar {\n width: 100%;\n height: 0.375rem;\n border-radius: common.$default-border-radius;\n background-color: common.$color-btn-disabled-border;\n }\n\n &__progress {\n width: 50%;\n height: 100%;\n height: 0.375rem;\n border-radius: common.$default-border-radius;\n text-align: left;\n background-color: common.$color-axa;\n transition:\n 0.75s ease-out,\n background-color 0.75s;\n }\n}\n","@use \"../common/common\" as common;\n\n.af-stepper-client {\n display: flex;\n width: 100%;\n flex-direction: column;\n background-color: transparent;\n\n &__title {\n margin-bottom: 0.5rem;\n font-family: common.$font-family-publico-bold, common.$font-family-base;\n font-size: 2rem;\n font-weight: 700;\n line-height: 2.5rem;\n text-align: left;\n color: common.$color-gray-900;\n }\n\n &__subtitle {\n margin-bottom: 1.5rem;\n font-family: common.$font-family-sans-serif;\n font-size: 1.125rem;\n font-weight: 400;\n line-height: 1.406rem;\n text-align: left;\n color: common.$color-gray-700;\n }\n\n &__content {\n display: flex;\n align-items: flex-end;\n gap: 1rem;\n }\n\n &__progressbar {\n width: 100%;\n height: 0.375rem;\n border-radius: common.$default-border-radius;\n background-color: common.$color-btn-disabled-border;\n }\n\n &__progress {\n width: 50%;\n height: 100%;\n height: 0.375rem;\n border-radius: common.$default-border-radius;\n text-align: left;\n background-color: common.$color-axa;\n transition:\n 0.75s ease-out,\n background-color 0.75s;\n }\n}\n","$font-family-sans-serif: \"Source Sans Pro\", arial, sans-serif !default;\n$font-family-serif: georgia, times, \"Times New Roman\", serif !default;\n$font-family-base: $font-family-sans-serif !default;\n$font-family-publico-bold: \"Publico Headline Bold\" !default;\n$font-family-publico: \"Publico Headline\" !default;\n// colors\n\n$color-axa: #00008f !default;\n$color-white: #fff !default;\n$color-black: #000 !default;\n$color-red: #ff1721 !default;\n$color-gray: #5f5f5f !default;\n$color-red-700: #c91432 !default;\n$color-blue-1: #000072 !default;\n$color-blue-2: #f8f8ff !default;\n$color-blue-3: #36f !default;\n$color-btn-light: #3333a5 !default;\n$color-btn-business: #c94e14 !default;\n$color-btn-business-dark: #a8391c !default;\n$color-btn-business-light: #df7e65 !default;\n$color-btn-disabled-text: #999 !default;\n$color-btn-disabled-border: #e5e5e5 !default;\n$color-btn-error-text: #a11028 !default;\n$color-btn-error-bg: #fff3f5 !default;\n$color-btn-tertiary-bg: #eef !default;\n$color-btn-tertiary-bg-darker: #e4e4ff !default;\n$color-btn-tertiary-bg-lighter: #f8f8ff !default;\n$color-oceanBlue: #4976ba !default;\n$color-gray-1: #ccc !default;\n$color-gray-200: #f3f3f3;\n$color-gray-300: #e9ecf2;\n$color-gray-400: #e5e5e5;\n$color-gray-500: #999;\n$color-gray-700: #5f5f5f;\n$color-gray-900: #333 !default;\n$color-green-600: #118635 !default;\n$color-border: #f3f3f3 !default;\n$color-focus: #36f !default;\n\n// others\n\n$default-border-radius: 4px !default;\n\n$transition-duration: 0.2s !default;\n\n// spacing\n\n$sizing-u0: 0 !default;\n$sizing-u05: 0.4rem !default;\n$sizing-u1: 0.8rem !default;\n$sizing-u2: 1.6rem !default;\n$sizing-u3: 2.4rem !default;\n$sizing-u4: 3.2rem !default;\n$sizing-u5: 4rem !default;\n$sizing-u6: 4.8rem !default;\n$sizing-u7: 5.6rem !default;\n$sizing-u8: 6.4rem !default;\n$sizing-u9: 7.2rem !default;\n$sizing-u10: 8rem !default;\n$spacing-u0: 0 !default;\n$spacing-u05: 0.4rem !default;\n$spacing-u1: 0.8rem !default;\n$spacing-u2: 1.6rem !default;\n$spacing-u3: 2.4rem !default;\n$spacing-u4: 3.2rem !default;\n$spacing-u5: 4rem !default;\n$spacing-u6: 4.8rem !default;\n$spacing-u7: 5.6rem !default;\n$spacing-u8: 6.4rem !default;\n$spacing-u9: 7.2rem !default;\n$spacing-u10: 8rem !default;\n$spacing-u11: 8.8rem !default;\n$spacing-u12: 9.6rem !default;\n$spacing-u13: 10.4rem !default;\n$spacing-u14: 11.2rem !default;\n$spacing-u15: 12rem !default;\n$spacing-u16: 12.8rem !default;\n$spacing-u17: 13.6rem !default;\n$spacing-u18: 14.4rem !default;\n$spacing-u19: 15.2rem !default;\n$spacing-u20: 16rem !default;\n$screen-size-668: s !default;\n$screen-size-1024: m !default;\n$screen-size-1200: oldl !default;\n$screen-size-1280: l !default;\n$screen-size-1540: oldxl !default;\n$screen-size-1600: xl !default;\n$screen-size-s: 668px !default;\n$screen-size-m: 1024px !default;\n$screen-size-l: 1280px !default;\n$screen-size-xl: 1600px !default;\n$screen-size-oldl: 1200px !default;\n$screen-size-oldxl: 1540px !default;\n\n$error-custom-border: #d18e8e !default;\n$error-custom-bg: #ffbfbf !default;\n\n$color-alertDanger-colorBorder: #c8b282 !default;\n$color-alertDanger-bgColor: #f1d596 !default;\n\n// breakpoints\n\n$breakpoint-xs: 0 !default;\n$breakpoint-sm: 667px !default;\n$breakpoint-md: 1023px !default;\n$breakpoint-lg: 1279px !default;\n$breakpoint-xl: 1599px !default;\n"]}
@@ -0,0 +1,53 @@
1
+ @use "../common/common" as common;
2
+
3
+ .af-stepper-client {
4
+ display: flex;
5
+ width: 100%;
6
+ flex-direction: column;
7
+ background-color: transparent;
8
+
9
+ &__title {
10
+ margin-bottom: 0.5rem;
11
+ font-family: common.$font-family-publico-bold, common.$font-family-base;
12
+ font-size: 2rem;
13
+ font-weight: 700;
14
+ line-height: 2.5rem;
15
+ text-align: left;
16
+ color: common.$color-gray-900;
17
+ }
18
+
19
+ &__subtitle {
20
+ margin-bottom: 1.5rem;
21
+ font-family: common.$font-family-sans-serif;
22
+ font-size: 1.125rem;
23
+ font-weight: 400;
24
+ line-height: 1.406rem;
25
+ text-align: left;
26
+ color: common.$color-gray-700;
27
+ }
28
+
29
+ &__content {
30
+ display: flex;
31
+ align-items: flex-end;
32
+ gap: 1rem;
33
+ }
34
+
35
+ &__progressbar {
36
+ width: 100%;
37
+ height: 0.375rem;
38
+ border-radius: common.$default-border-radius;
39
+ background-color: common.$color-btn-disabled-border;
40
+ }
41
+
42
+ &__progress {
43
+ width: 50%;
44
+ height: 100%;
45
+ height: 0.375rem;
46
+ border-radius: common.$default-border-radius;
47
+ text-align: left;
48
+ background-color: common.$color-axa;
49
+ transition:
50
+ 0.75s ease-out,
51
+ background-color 0.75s;
52
+ }
53
+ }
@@ -0,0 +1 @@
1
+ .af-tabs-client{display:flex;flex-direction:column;font-family:Source Sans Pro,arial,sans-serif;margin:0;padding:0;width:100%}.af-tabs-client>[role=tablist]{box-shadow:inset 0 -2px 0 0 #e9ecf2;display:flex;margin-bottom:.8rem;width:100%}.af-tabs-client [role=tab]{all:unset;cursor:pointer;font-size:1.25rem;line-height:1.6rem;padding:1rem;position:relative;text-align:center}.af-tabs-client [role=tab]>span{display:block;height:100%;width:100%}.af-tabs-client [role=tab][aria-selected=true]{border-bottom:4px solid #00008f;color:#00008f;font-weight:600}.af-tabs-client--center>[role=tablist]{justify-content:center}.af-tabs-client--center [role=tab]{flex-grow:1;width:100%}.af-tabs-client [role=tab]:focus{outline:unset}.af-tabs-client [role=tab]:focus-visible{outline:2px solid #36f;outline-offset:3px}.af-tabs-client>[role=tabpanel][aria-hidden=true]{display:none}
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/Tabs/Tabs.scss%23sass","../../src/Tabs/Tabs.scss","../../src/common/common.scss"],"names":[],"mappings":"AAEA,gBACE,YAAA,CAIA,qBAAA,CACA,4CAAA,CAHA,QAAA,CACA,SAAA,CCJF,UAKA,CDGE,+BAIE,mCAAA,CAHA,YAAA,CAEA,mBEgDS,CFjDT,UCCJ,CDIE,2BACE,SAAA,CAMA,cAAA,CAHA,iBAAA,CACA,kBAAA,CAFA,YAAA,CADA,iBAAA,CAIA,iBCDJ,CDII,gCACE,aAAA,CAEA,WAAA,CADA,UCDN,CDKI,+CACE,+BAAA,CAEA,aE5BM,CF2BN,eCFN,CDQI,uCACE,sBCNN,CDSI,mCAEE,WAAA,CADA,UCNN,CDWE,iCACE,aCTJ,CDYE,yCACE,sBAAA,CACA,kBCVJ,CDaE,kDACE,YCXJ","file":"Tabs.css","sourcesContent":["@use \"../common/common\" as common;\n\n.af-tabs-client {\n display: flex;\n width: 100%;\n margin: 0;\n padding: 0;\n flex-direction: column;\n font-family: \"Source Sans Pro\", arial, sans-serif;\n\n & > [role=\"tablist\"] {\n display: flex;\n width: 100%;\n margin-bottom: common.$spacing-u1;\n box-shadow: inset 0 -2px 0 0 common.$color-gray-300;\n }\n\n & [role=\"tab\"] {\n all: unset;\n position: relative;\n padding: 1rem;\n font-size: 1.25rem;\n line-height: common.$sizing-u2;\n text-align: center;\n cursor: pointer;\n\n & > span {\n display: block;\n width: 100%;\n height: 100%;\n }\n\n &[aria-selected=\"true\"] {\n border-bottom: 4px solid common.$color-axa;\n font-weight: 600;\n color: common.$color-axa;\n }\n }\n\n &--center {\n & > [role=\"tablist\"] {\n justify-content: center;\n }\n\n & [role=\"tab\"] {\n width: 100%;\n flex-grow: 1;\n }\n }\n\n & [role=\"tab\"]:focus {\n outline: unset;\n }\n\n & [role=\"tab\"]:focus-visible {\n outline: 2px solid common.$color-blue-3;\n outline-offset: 3px;\n }\n\n & > [role=\"tabpanel\"][aria-hidden=\"true\"] {\n display: none;\n }\n}\n","@use \"../common/common\" as common;\n\n.af-tabs-client {\n display: flex;\n width: 100%;\n margin: 0;\n padding: 0;\n flex-direction: column;\n font-family: \"Source Sans Pro\", arial, sans-serif;\n\n & > [role=\"tablist\"] {\n display: flex;\n width: 100%;\n margin-bottom: common.$spacing-u1;\n box-shadow: inset 0 -2px 0 0 common.$color-gray-300;\n }\n\n & [role=\"tab\"] {\n all: unset;\n position: relative;\n padding: 1rem;\n font-size: 1.25rem;\n line-height: common.$sizing-u2;\n text-align: center;\n cursor: pointer;\n\n & > span {\n display: block;\n width: 100%;\n height: 100%;\n }\n\n &[aria-selected=\"true\"] {\n border-bottom: 4px solid common.$color-axa;\n font-weight: 600;\n color: common.$color-axa;\n }\n }\n\n &--center {\n & > [role=\"tablist\"] {\n justify-content: center;\n }\n\n & [role=\"tab\"] {\n width: 100%;\n flex-grow: 1;\n }\n }\n\n & [role=\"tab\"]:focus {\n outline: unset;\n }\n\n & [role=\"tab\"]:focus-visible {\n outline: 2px solid common.$color-blue-3;\n outline-offset: 3px;\n }\n\n & > [role=\"tabpanel\"][aria-hidden=\"true\"] {\n display: none;\n }\n}\n","$font-family-sans-serif: \"Source Sans Pro\", arial, sans-serif !default;\n$font-family-serif: georgia, times, \"Times New Roman\", serif !default;\n$font-family-base: $font-family-sans-serif !default;\n$font-family-publico-bold: \"Publico Headline Bold\" !default;\n$font-family-publico: \"Publico Headline\" !default;\n// colors\n\n$color-axa: #00008f !default;\n$color-white: #fff !default;\n$color-black: #000 !default;\n$color-red: #ff1721 !default;\n$color-gray: #5f5f5f !default;\n$color-red-700: #c91432 !default;\n$color-blue-1: #000072 !default;\n$color-blue-2: #f8f8ff !default;\n$color-blue-3: #36f !default;\n$color-btn-light: #3333a5 !default;\n$color-btn-business: #c94e14 !default;\n$color-btn-business-dark: #a8391c !default;\n$color-btn-business-light: #df7e65 !default;\n$color-btn-disabled-text: #999 !default;\n$color-btn-disabled-border: #e5e5e5 !default;\n$color-btn-error-text: #a11028 !default;\n$color-btn-error-bg: #fff3f5 !default;\n$color-btn-tertiary-bg: #eef !default;\n$color-btn-tertiary-bg-darker: #e4e4ff !default;\n$color-btn-tertiary-bg-lighter: #f8f8ff !default;\n$color-oceanBlue: #4976ba !default;\n$color-gray-1: #ccc !default;\n$color-gray-200: #f3f3f3;\n$color-gray-300: #e9ecf2;\n$color-gray-400: #e5e5e5;\n$color-gray-500: #999;\n$color-gray-700: #5f5f5f;\n$color-gray-900: #333 !default;\n$color-green-600: #118635 !default;\n$color-border: #f3f3f3 !default;\n$color-focus: #36f !default;\n\n// others\n\n$default-border-radius: 4px !default;\n\n$transition-duration: 0.2s !default;\n\n// spacing\n\n$sizing-u0: 0 !default;\n$sizing-u05: 0.4rem !default;\n$sizing-u1: 0.8rem !default;\n$sizing-u2: 1.6rem !default;\n$sizing-u3: 2.4rem !default;\n$sizing-u4: 3.2rem !default;\n$sizing-u5: 4rem !default;\n$sizing-u6: 4.8rem !default;\n$sizing-u7: 5.6rem !default;\n$sizing-u8: 6.4rem !default;\n$sizing-u9: 7.2rem !default;\n$sizing-u10: 8rem !default;\n$spacing-u0: 0 !default;\n$spacing-u05: 0.4rem !default;\n$spacing-u1: 0.8rem !default;\n$spacing-u2: 1.6rem !default;\n$spacing-u3: 2.4rem !default;\n$spacing-u4: 3.2rem !default;\n$spacing-u5: 4rem !default;\n$spacing-u6: 4.8rem !default;\n$spacing-u7: 5.6rem !default;\n$spacing-u8: 6.4rem !default;\n$spacing-u9: 7.2rem !default;\n$spacing-u10: 8rem !default;\n$spacing-u11: 8.8rem !default;\n$spacing-u12: 9.6rem !default;\n$spacing-u13: 10.4rem !default;\n$spacing-u14: 11.2rem !default;\n$spacing-u15: 12rem !default;\n$spacing-u16: 12.8rem !default;\n$spacing-u17: 13.6rem !default;\n$spacing-u18: 14.4rem !default;\n$spacing-u19: 15.2rem !default;\n$spacing-u20: 16rem !default;\n$screen-size-668: s !default;\n$screen-size-1024: m !default;\n$screen-size-1200: oldl !default;\n$screen-size-1280: l !default;\n$screen-size-1540: oldxl !default;\n$screen-size-1600: xl !default;\n$screen-size-s: 668px !default;\n$screen-size-m: 1024px !default;\n$screen-size-l: 1280px !default;\n$screen-size-xl: 1600px !default;\n$screen-size-oldl: 1200px !default;\n$screen-size-oldxl: 1540px !default;\n\n$error-custom-border: #d18e8e !default;\n$error-custom-bg: #ffbfbf !default;\n\n$color-alertDanger-colorBorder: #c8b282 !default;\n$color-alertDanger-bgColor: #f1d596 !default;\n\n// breakpoints\n\n$breakpoint-xs: 0 !default;\n$breakpoint-sm: 667px !default;\n$breakpoint-md: 1023px !default;\n$breakpoint-lg: 1279px !default;\n$breakpoint-xl: 1599px !default;\n"]}