@axa-fr/design-system-look-and-feel-css 0.3.0-ci.288 → 0.3.0-ci.289

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 (103) hide show
  1. package/dist/Accordion/Accordion.css +1 -1
  2. package/dist/Accordion/Accordion.css.map +1 -1
  3. package/dist/Accordion/Accordion.scss +3 -3
  4. package/dist/AccordionCore/AccordionCore.css +1 -1
  5. package/dist/AccordionCore/AccordionCore.css.map +1 -1
  6. package/dist/AccordionCore/AccordionCore.scss +4 -4
  7. package/dist/Alert/Alert.css +1 -1
  8. package/dist/Alert/Alert.css.map +1 -1
  9. package/dist/Alert/Alert.scss +21 -23
  10. package/dist/Button/Button.css +1 -1
  11. package/dist/Button/Button.css.map +1 -1
  12. package/dist/Button/Button.scss +39 -41
  13. package/dist/Card/Card.css +1 -1
  14. package/dist/Card/Card.css.map +1 -1
  15. package/dist/Card/Card.scss +5 -6
  16. package/dist/Divider/Divider.css +1 -1
  17. package/dist/Divider/Divider.css.map +1 -1
  18. package/dist/Divider/Divider.scss +1 -3
  19. package/dist/Form/Checkbox/Checkbox.css +1 -1
  20. package/dist/Form/Checkbox/Checkbox.css.map +1 -1
  21. package/dist/Form/Checkbox/Checkbox.scss +29 -31
  22. package/dist/Form/FileUpload/FileUpload.css +1 -1
  23. package/dist/Form/FileUpload/FileUpload.css.map +1 -1
  24. package/dist/Form/FileUpload/FileUpload.scss +19 -21
  25. package/dist/Form/InputError/InputError.css +1 -1
  26. package/dist/Form/InputError/InputError.css.map +1 -1
  27. package/dist/Form/InputError/InputError.scss +4 -6
  28. package/dist/Form/Radio/Radio.css +1 -1
  29. package/dist/Form/Radio/Radio.css.map +1 -1
  30. package/dist/Form/Radio/Radio.scss +27 -29
  31. package/dist/Form/Select/Select.css +1 -1
  32. package/dist/Form/Select/Select.css.map +1 -1
  33. package/dist/Form/Select/Select.scss +24 -25
  34. package/dist/Form/Text/Text.css +1 -1
  35. package/dist/Form/Text/Text.css.map +1 -1
  36. package/dist/Form/Text/Text.scss +10 -10
  37. package/dist/IconBg/IconBg.css +1 -1
  38. package/dist/IconBg/IconBg.css.map +1 -1
  39. package/dist/IconBg/IconBg.scss +6 -6
  40. package/dist/Layout/Footer/Footer.css +1 -1
  41. package/dist/Layout/Footer/Footer.css.map +1 -1
  42. package/dist/Layout/Footer/Footer.scss +24 -24
  43. package/dist/Layout/Header/Header.css +1 -1
  44. package/dist/Layout/Header/Header.css.map +1 -1
  45. package/dist/Layout/Header/Header.scss +9 -9
  46. package/dist/Layout/Header/NavBar/NavBar.css +1 -1
  47. package/dist/Layout/Header/NavBar/NavBar.css.map +1 -1
  48. package/dist/Layout/Header/NavBar/NavBar.scss +6 -8
  49. package/dist/Layout/Header/PreviousLink/PreviousLink.css +1 -1
  50. package/dist/Layout/Header/PreviousLink/PreviousLink.css.map +1 -1
  51. package/dist/Layout/Header/PreviousLink/PreviousLink.scss +5 -5
  52. package/dist/Link/Link.css +1 -1
  53. package/dist/Link/Link.css.map +1 -1
  54. package/dist/Link/Link.scss +8 -10
  55. package/dist/List/ClickList/ClickList.css +1 -1
  56. package/dist/List/ClickList/ClickList.css.map +1 -1
  57. package/dist/List/ClickList/ClickList.scss +12 -12
  58. package/dist/List/ContentItemDuo/ContentItemDuo.css +1 -1
  59. package/dist/List/ContentItemDuo/ContentItemDuo.css.map +1 -1
  60. package/dist/List/ContentItemDuo/ContentItemDuo.scss +5 -5
  61. package/dist/List/ContentItemMono/ContentItemMono.css +1 -1
  62. package/dist/List/ContentItemMono/ContentItemMono.css.map +1 -1
  63. package/dist/List/ContentItemMono/ContentItemMono.scss +12 -12
  64. package/dist/List/ContentTabList/ContentTabList.css +1 -1
  65. package/dist/List/ContentTabList/ContentTabList.css.map +1 -1
  66. package/dist/List/ContentTabList/ContentTabList.scss +5 -5
  67. package/dist/List/List.css +1 -1
  68. package/dist/List/List.css.map +1 -1
  69. package/dist/List/List.scss +1 -1
  70. package/dist/Loader/Loader.css +1 -1
  71. package/dist/Loader/Loader.css.map +1 -1
  72. package/dist/Loader/Loader.scss +2 -4
  73. package/dist/Modal/Modal.css +1 -1
  74. package/dist/Modal/Modal.css.map +1 -1
  75. package/dist/Modal/Modal.scss +10 -10
  76. package/dist/Pagination/Pagination.css +1 -1
  77. package/dist/Pagination/Pagination.css.map +1 -1
  78. package/dist/Pagination/Pagination.scss +1 -3
  79. package/dist/Pagination/PaginationDesktop.css +1 -1
  80. package/dist/Pagination/PaginationDesktop.css.map +1 -1
  81. package/dist/Pagination/PaginationDesktop.scss +4 -6
  82. package/dist/Pagination/PaginationMobile.css +1 -1
  83. package/dist/Pagination/PaginationMobile.css.map +1 -1
  84. package/dist/Pagination/PaginationMobile.scss +4 -6
  85. package/dist/Stepper/Stepper.css +1 -1
  86. package/dist/Stepper/Stepper.css.map +1 -1
  87. package/dist/Stepper/Stepper.scss +8 -10
  88. package/dist/Tabs/Tabs.css +1 -1
  89. package/dist/Tabs/Tabs.css.map +1 -1
  90. package/dist/Tabs/Tabs.scss +6 -8
  91. package/dist/Tag/Tag.css +1 -1
  92. package/dist/Tag/Tag.css.map +1 -1
  93. package/dist/Tag/Tag.scss +12 -12
  94. package/dist/Title/Title.css +1 -1
  95. package/dist/Title/Title.css.map +1 -1
  96. package/dist/Title/Title.scss +5 -5
  97. package/dist/common/tokens.css +1 -0
  98. package/dist/common/tokens.css.map +1 -0
  99. package/dist/common/tokens.scss +119 -0
  100. package/dist/look-and-feel.css +1 -1
  101. package/dist/look-and-feel.css.map +1 -1
  102. package/dist/look-and-feel.scss +1 -0
  103. package/package.json +1 -1
@@ -1 +1 @@
1
- .af-accordion{--summary-areas:"tag-date-container title-container value arrow";--summary-columns:auto 1fr repeat(2,auto);--title-container-areas:"icon title" "icon subtitle";--title-container-columns:min-content 1fr}.af-accordion__summary{grid-template-areas:var(--summary-areas);grid-template-columns:var(--summary-columns)}.af-accordion__summary:not(:has(.af-accordion__tag-date-container)){--summary-areas:"title-container value arrow";--summary-columns:1fr repeat(2,auto)}.af-accordion__summary:not(:has(.af-accordion__value)){--summary-areas:"tag-date-container title-container arrow";--summary-columns:auto 1fr auto}.af-accordion__summary:not(:has(.af-accordion__value)):not(:has(.af-accordion__tag-date-container)){--summary-areas:"title-container arrow";--summary-columns:1fr auto}.af-accordion__summary .af-accordion__icon{align-items:center;display:grid;grid-area:icon}.af-accordion__summary .af-accordion__title-container{display:grid;gap:.125rem 1rem;grid-area:title-container;grid-template:var(--title-container-areas);grid-template-columns:var(--title-container-columns)}.af-accordion__summary .af-accordion__title-container:not(:has(.af-accordion__icon)){--title-container-areas:"title" "subtitle";--title-container-columns:1fr;column-gap:0}.af-accordion__summary .af-accordion__title-container:not(:has(.af-accordion__subtitle)){--title-container-areas:"icon title";row-gap:0}.af-accordion__summary .af-accordion__title-container:not(:has(.af-accordion__subtitle)):not(:has(.af-accordion__icon)){--title-container-areas:"title"}.af-accordion__summary .af-accordion__title-container .af-accordion__title{grid-area:title}.af-accordion__summary .af-accordion__title-container .af-accordion__subtitle{color:#5f5f5f;font-size:1rem;font-weight:400;grid-area:subtitle;line-height:1.25rem}.af-accordion__summary .af-accordion__value{color:#118635;display:grid;grid-area:value;justify-items:center;min-width:9.375rem}.af-accordion__summary .af-accordion__tag-date-container{display:grid;grid-area:tag-date-container;grid-template:"tag" "date";padding-right:3.93rem;row-gap:.5rem}.af-accordion__summary .af-accordion__tag-date-container .af-accordion__tag-container{grid-area:tag;justify-items:center;text-align:center}.af-accordion__summary .af-accordion__tag-date-container .af-accordion__tag-container .af-tag{cursor:inherit}.af-accordion__summary .af-accordion__tag-date-container .af-accordion__date{align-items:center;color:#5f5f5f;display:grid;grid-area:date;text-align:center}.af-accordion__summary--title-first{--summary-areas:"title-container tag-date-container value arrow";--summary-columns:repeat(3,auto) min-content}.af-accordion__summary--title-first:not(:has(.af-accordion__value)){--summary-areas:"title-container tag-date-container arrow";--summary-columns:repeat(2,auto) min-content}.af-accordion__summary--title-first .af-accordion__tag-date-container{column-gap:inherit;grid-template:"tag date";padding:0}.af-accordion__summary--title-first .af-accordion__tag-date-container .af-accordion__tag-container{padding:0 1.688rem}.af-accordion__summary--title-first .af-accordion__tag-date-container .af-accordion__date{padding:0 3.125rem}.af-accordion__summary--title-first .af-accordion__value{min-width:auto}.af-accordion__summary .af-accordion__tag-date-container:has(>:only-child){row-gap:0}@media (width <= 1023px){.af-accordion .af-accordion__summary--title-first .af-accordion__tag-date-container .af-accordion__date,.af-accordion .af-accordion__summary--title-first .af-accordion__tag-date-container .af-accordion__tag-container{padding:0}}@media (width <= 667px){.af-accordion .af-accordion__summary{--summary-areas:"tag-date-container arrow" "title-container arrow" "value arrow";--summary-columns:1fr;column-gap:0}.af-accordion .af-accordion__summary .af-accordion__title-container{justify-content:start}.af-accordion .af-accordion__summary .af-accordion__title-container .af-accordion__subtitle{font-size:.875rem;line-height:1.1rem}.af-accordion .af-accordion__summary .af-accordion__tag-date-container{display:flex;gap:.5rem}.af-accordion .af-accordion__summary .af-accordion__value{justify-content:start}.af-accordion .af-accordion__summary--title-first{--summary-areas:"icon title-container arrow" "icon tag-date-container arrow" "icon value arrow";--summary-columns:auto 1fr auto;column-gap:.75rem}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__icon)){--summary-areas:"title-container arrow" "tag-date-container arrow" "value arrow";--summary-columns:1fr auto}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__tag-date-container)){--summary-areas:"icon title-container arrow" "icon value arrow"}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__value)){--summary-areas:"icon title-container arrow" "icon tag-date-container arrow"}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__icon),:has(.af-accordion__tag-date-container)){--summary-areas:"title-container arrow" "value arrow"}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__tag-date-container),:has(.af-accordion__value)){--summary-areas:"icon title-container arrow";--summary-columns:auto 1fr auto}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__icon),:has(.af-accordion__value)){--summary-areas:"title-container arrow" "tag-date-container arrow"}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__icon),:has(.af-accordion__tag-date-container),:has(.af-accordion__value)){--summary-areas:"title-container arrow";--summary-columns:1fr auto}}
1
+ .af-accordion{--summary-areas:"tag-date-container title-container value arrow";--summary-columns:auto 1fr repeat(2,auto);--title-container-areas:"icon title" "icon subtitle";--title-container-columns:min-content 1fr}.af-accordion__summary{grid-template-areas:var(--summary-areas);grid-template-columns:var(--summary-columns)}.af-accordion__summary:not(:has(.af-accordion__tag-date-container)){--summary-areas:"title-container value arrow";--summary-columns:1fr repeat(2,auto)}.af-accordion__summary:not(:has(.af-accordion__value)){--summary-areas:"tag-date-container title-container arrow";--summary-columns:auto 1fr auto}.af-accordion__summary:not(:has(.af-accordion__value)):not(:has(.af-accordion__tag-date-container)){--summary-areas:"title-container arrow";--summary-columns:1fr auto}.af-accordion__summary .af-accordion__icon{align-items:center;display:grid;grid-area:icon}.af-accordion__summary .af-accordion__title-container{display:grid;gap:.125rem 1rem;grid-area:title-container;grid-template:var(--title-container-areas);grid-template-columns:var(--title-container-columns)}.af-accordion__summary .af-accordion__title-container:not(:has(.af-accordion__icon)){--title-container-areas:"title" "subtitle";--title-container-columns:1fr;column-gap:0}.af-accordion__summary .af-accordion__title-container:not(:has(.af-accordion__subtitle)){--title-container-areas:"icon title";row-gap:0}.af-accordion__summary .af-accordion__title-container:not(:has(.af-accordion__subtitle)):not(:has(.af-accordion__icon)){--title-container-areas:"title"}.af-accordion__summary .af-accordion__title-container .af-accordion__title{grid-area:title}.af-accordion__summary .af-accordion__title-container .af-accordion__subtitle{color:var(--color-gray-700);font-size:1rem;font-weight:400;grid-area:subtitle;line-height:1.25rem}.af-accordion__summary .af-accordion__value{color:var(--color-green-600);display:grid;grid-area:value;justify-items:center;min-width:9.375rem}.af-accordion__summary .af-accordion__tag-date-container{display:grid;grid-area:tag-date-container;grid-template:"tag" "date";padding-right:3.93rem;row-gap:.5rem}.af-accordion__summary .af-accordion__tag-date-container .af-accordion__tag-container{grid-area:tag;justify-items:center;text-align:center}.af-accordion__summary .af-accordion__tag-date-container .af-accordion__tag-container .af-tag{cursor:inherit}.af-accordion__summary .af-accordion__tag-date-container .af-accordion__date{align-items:center;color:var(--color-gray-700);display:grid;grid-area:date;text-align:center}.af-accordion__summary--title-first{--summary-areas:"title-container tag-date-container value arrow";--summary-columns:repeat(3,auto) min-content}.af-accordion__summary--title-first:not(:has(.af-accordion__value)){--summary-areas:"title-container tag-date-container arrow";--summary-columns:repeat(2,auto) min-content}.af-accordion__summary--title-first .af-accordion__tag-date-container{column-gap:inherit;grid-template:"tag date";padding:0}.af-accordion__summary--title-first .af-accordion__tag-date-container .af-accordion__tag-container{padding:0 1.688rem}.af-accordion__summary--title-first .af-accordion__tag-date-container .af-accordion__date{padding:0 3.125rem}.af-accordion__summary--title-first .af-accordion__value{min-width:auto}.af-accordion__summary .af-accordion__tag-date-container:has(>:only-child){row-gap:0}@media (width <= 1023px){.af-accordion .af-accordion__summary--title-first .af-accordion__tag-date-container .af-accordion__date,.af-accordion .af-accordion__summary--title-first .af-accordion__tag-date-container .af-accordion__tag-container{padding:0}}@media (width <= 667px){.af-accordion .af-accordion__summary{--summary-areas:"tag-date-container arrow" "title-container arrow" "value arrow";--summary-columns:1fr;column-gap:0}.af-accordion .af-accordion__summary .af-accordion__title-container{justify-content:start}.af-accordion .af-accordion__summary .af-accordion__title-container .af-accordion__subtitle{font-size:.875rem;line-height:1.1rem}.af-accordion .af-accordion__summary .af-accordion__tag-date-container{display:flex;gap:.5rem}.af-accordion .af-accordion__summary .af-accordion__value{justify-content:start}.af-accordion .af-accordion__summary--title-first{--summary-areas:"icon title-container arrow" "icon tag-date-container arrow" "icon value arrow";--summary-columns:auto 1fr auto;column-gap:.75rem}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__icon)){--summary-areas:"title-container arrow" "tag-date-container arrow" "value arrow";--summary-columns:1fr auto}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__tag-date-container)){--summary-areas:"icon title-container arrow" "icon value arrow"}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__value)){--summary-areas:"icon title-container arrow" "icon tag-date-container arrow"}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__icon),:has(.af-accordion__tag-date-container)){--summary-areas:"title-container arrow" "value arrow"}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__tag-date-container),:has(.af-accordion__value)){--summary-areas:"icon title-container arrow";--summary-columns:auto 1fr auto}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__icon),:has(.af-accordion__value)){--summary-areas:"title-container arrow" "tag-date-container arrow"}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__icon),:has(.af-accordion__tag-date-container),:has(.af-accordion__value)){--summary-areas:"title-container arrow";--summary-columns:1fr auto}}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Accordion/Accordion.scss%23sass","../../src/Accordion/Accordion.scss","../../src/common/common.scss"],"names":[],"mappings":"AAEA,cACE,gEAAA,CCDF,yCAAA,CDGE,oDAAA,CACA,yCCDF,CDGE,uBACE,wCAAA,CACA,4CCDJ,CDGI,oEACE,6CAAA,CACA,oCCDN,CDII,uDACE,0DAAA,CACA,+BCFN,CDIM,oGACE,uCAAA,CACA,0BCFR,CDOM,2CAGE,kBAAA,CAFA,YAAA,CACA,cCJR,CDQM,sDACE,YAAA,CAIA,gBAAA,CAHA,yBAAA,CACA,0CAAA,CACA,oDCLR,CDQQ,qFACE,0CAAA,CACA,6BAAA,CAEA,YCPV,CDUQ,yFACE,oCAAA,CAEA,SCTV,CDWU,wHACE,+BCTZ,CDcU,2EACE,eCZZ,CDeU,8EAKE,aElCK,CF+BL,cAAA,CACA,eAAA,CAFA,kBAAA,CAGA,mBCZZ,CDkBM,4CAKE,aE1CU,CFsCV,YAAA,CAEA,eAAA,CACA,oBAAA,CAFA,kBCbR,CDmBM,yDACE,YAAA,CAEA,4BAAA,CACA,0BAAA,CAFA,qBAAA,CAGA,aCjBR,CDoBU,sFACE,aAAA,CACA,oBAAA,CACA,iBClBZ,CDoBY,8FACE,cClBd,CDsBU,6EAGE,kBAAA,CAEA,aAAA,CAJA,YAAA,CACA,cAAA,CAEA,iBCnBZ,CD0BI,oCACE,gEAAA,CACA,4CCxBN,CD0BM,oEACE,0DAAA,CACA,4CCxBR,CD4BQ,sEAGE,kBAAA,CADA,wBAAA,CADA,SCxBV,CD6BY,mGACE,kBC3Bd,CD8BY,0FACE,kBC5Bd,CDiCQ,yDACE,cC/BV,CDoCI,2EACE,SClCN,CDsCE,yBAII,yNAEE,SCxCN,CACF,CD4CE,wBACE,qCACE,gFAAA,CAEA,qBAAA,CAEA,YC3CJ,CD8CM,oEACE,qBC5CR,CD+CU,4FACE,iBAAA,CACA,kBC7CZ,CDkDM,uEACE,YAAA,CACA,SChDR,CDmDM,0DACE,qBCjDR,CDqDI,kDACE,+FAAA,CAEA,+BAAA,CAEA,iBCpDN,CDsDM,iFACE,gFAAA,CCnDR,0BACA,CDuDM,+FACE,+DCrDR,CDwDM,kFACE,4ECrDR,CDyDM,yHCtDN,qDACA,CD4DM,0HAIE,4CAAA,CACA,+BC5DR,CD+DM,4GACE,kEC7DR,CDgEM,oJAKE,uCAAA,CACA,0BChER,CACF","file":"Accordion.css","sourcesContent":["@use \"../common/common.scss\" as common;\n\n.af-accordion {\n --summary-areas: \"tag-date-container title-container value arrow\";\n --summary-columns: auto 1fr repeat(2, auto);\n --title-container-areas: \"icon title\" \"icon subtitle\";\n --title-container-columns: min-content 1fr;\n\n &__summary {\n grid-template-areas: var(--summary-areas);\n grid-template-columns: var(--summary-columns);\n\n &:not(:has(.af-accordion__tag-date-container)) {\n --summary-areas: \"title-container value arrow\";\n --summary-columns: 1fr repeat(2, auto);\n }\n\n &:not(:has(.af-accordion__value)) {\n --summary-areas: \"tag-date-container title-container arrow\";\n --summary-columns: auto 1fr auto;\n\n &:not(:has(.af-accordion__tag-date-container)) {\n --summary-areas: \"title-container arrow\";\n --summary-columns: 1fr auto;\n }\n }\n\n .af-accordion {\n &__icon {\n display: grid;\n grid-area: icon;\n align-items: center;\n }\n\n &__title-container {\n display: grid;\n grid-area: title-container;\n grid-template: var(--title-container-areas);\n grid-template-columns: var(--title-container-columns);\n gap: 0.125rem 1rem;\n\n &:not(:has(.af-accordion__icon)) {\n --title-container-areas: \"title\" \"subtitle\";\n --title-container-columns: 1fr;\n\n column-gap: 0;\n }\n\n &:not(:has(.af-accordion__subtitle)) {\n --title-container-areas: \"icon title\";\n\n row-gap: 0;\n\n &:not(:has(.af-accordion__icon)) {\n --title-container-areas: \"title\";\n }\n }\n\n .af-accordion {\n &__title {\n grid-area: title;\n }\n\n &__subtitle {\n grid-area: subtitle;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.25rem;\n color: common.$color-gray-700;\n }\n }\n }\n\n &__value {\n display: grid;\n min-width: 9.375rem;\n grid-area: value;\n justify-items: center;\n color: common.$color-green-600;\n }\n\n &__tag-date-container {\n display: grid;\n padding-right: 3.93rem;\n grid-area: tag-date-container;\n grid-template: \"tag\" \"date\";\n row-gap: 0.5rem;\n\n .af-accordion {\n &__tag-container {\n grid-area: tag;\n justify-items: center;\n text-align: center;\n\n .af-tag {\n cursor: inherit;\n }\n }\n\n &__date {\n display: grid;\n grid-area: date;\n align-items: center;\n text-align: center;\n color: common.$color-gray-700;\n }\n }\n }\n }\n\n &--title-first {\n --summary-areas: \"title-container tag-date-container value arrow\";\n --summary-columns: repeat(3, auto) min-content;\n\n &:not(:has(.af-accordion__value)) {\n --summary-areas: \"title-container tag-date-container arrow\";\n --summary-columns: repeat(2, auto) min-content;\n }\n\n .af-accordion {\n &__tag-date-container {\n padding: 0;\n grid-template: \"tag date\";\n column-gap: inherit;\n\n .af-accordion {\n &__tag-container {\n padding: 0 1.688rem;\n }\n\n &__date {\n padding: 0 3.125rem;\n }\n }\n }\n\n &__value {\n min-width: auto;\n }\n }\n }\n\n .af-accordion__tag-date-container:has(> :only-child) {\n row-gap: 0;\n }\n }\n\n @media (width <= #{common.$breakpoint-md}) {\n .af-accordion__summary--title-first\n .af-accordion__tag-date-container\n .af-accordion {\n &__tag-container,\n &__date {\n padding: 0;\n }\n }\n }\n\n @media (width <= #{common.$breakpoint-sm}) {\n .af-accordion__summary {\n --summary-areas: \"tag-date-container arrow\" \"title-container arrow\"\n \"value arrow\";\n --summary-columns: 1fr;\n\n column-gap: 0;\n\n .af-accordion {\n &__title-container {\n justify-content: start;\n\n .af-accordion {\n &__subtitle {\n font-size: 0.875rem;\n line-height: 1.1rem;\n }\n }\n }\n\n &__tag-date-container {\n display: flex;\n gap: 0.5rem;\n }\n\n &__value {\n justify-content: start;\n }\n }\n\n &--title-first {\n --summary-areas: \"icon title-container arrow\"\n \"icon tag-date-container arrow\" \"icon value arrow\";\n --summary-columns: auto 1fr auto;\n\n column-gap: 0.75rem;\n\n &:not(:has(.af-accordion__icon)) {\n --summary-areas: \"title-container arrow\" \"tag-date-container arrow\"\n \"value arrow\";\n --summary-columns: 1fr auto;\n }\n\n &:not(:has(.af-accordion__tag-date-container)) {\n --summary-areas: \"icon title-container arrow\" \"icon value arrow\";\n }\n\n &:not(:has(.af-accordion__value)) {\n --summary-areas: \"icon title-container arrow\"\n \"icon tag-date-container arrow\";\n }\n\n &:not(\n :has(.af-accordion__icon),\n :has(.af-accordion__tag-date-container)\n ) {\n --summary-areas: \"title-container arrow\" \"value arrow\";\n }\n\n &:not(\n :has(.af-accordion__tag-date-container),\n :has(.af-accordion__value)\n ) {\n --summary-areas: \"icon title-container arrow\";\n --summary-columns: auto 1fr auto;\n }\n\n &:not(:has(.af-accordion__icon), :has(.af-accordion__value)) {\n --summary-areas: \"title-container arrow\" \"tag-date-container arrow\";\n }\n\n &:not(\n :has(.af-accordion__icon),\n :has(.af-accordion__tag-date-container),\n :has(.af-accordion__value)\n ) {\n --summary-areas: \"title-container arrow\";\n --summary-columns: 1fr auto;\n }\n }\n }\n }\n}\n","@use \"../common/common.scss\" as common;\n\n.af-accordion {\n --summary-areas: \"tag-date-container title-container value arrow\";\n --summary-columns: auto 1fr repeat(2, auto);\n --title-container-areas: \"icon title\" \"icon subtitle\";\n --title-container-columns: min-content 1fr;\n\n &__summary {\n grid-template-areas: var(--summary-areas);\n grid-template-columns: var(--summary-columns);\n\n &:not(:has(.af-accordion__tag-date-container)) {\n --summary-areas: \"title-container value arrow\";\n --summary-columns: 1fr repeat(2, auto);\n }\n\n &:not(:has(.af-accordion__value)) {\n --summary-areas: \"tag-date-container title-container arrow\";\n --summary-columns: auto 1fr auto;\n\n &:not(:has(.af-accordion__tag-date-container)) {\n --summary-areas: \"title-container arrow\";\n --summary-columns: 1fr auto;\n }\n }\n\n .af-accordion {\n &__icon {\n display: grid;\n grid-area: icon;\n align-items: center;\n }\n\n &__title-container {\n display: grid;\n grid-area: title-container;\n grid-template: var(--title-container-areas);\n grid-template-columns: var(--title-container-columns);\n gap: 0.125rem 1rem;\n\n &:not(:has(.af-accordion__icon)) {\n --title-container-areas: \"title\" \"subtitle\";\n --title-container-columns: 1fr;\n\n column-gap: 0;\n }\n\n &:not(:has(.af-accordion__subtitle)) {\n --title-container-areas: \"icon title\";\n\n row-gap: 0;\n\n &:not(:has(.af-accordion__icon)) {\n --title-container-areas: \"title\";\n }\n }\n\n .af-accordion {\n &__title {\n grid-area: title;\n }\n\n &__subtitle {\n grid-area: subtitle;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.25rem;\n color: common.$color-gray-700;\n }\n }\n }\n\n &__value {\n display: grid;\n min-width: 9.375rem;\n grid-area: value;\n justify-items: center;\n color: common.$color-green-600;\n }\n\n &__tag-date-container {\n display: grid;\n padding-right: 3.93rem;\n grid-area: tag-date-container;\n grid-template: \"tag\" \"date\";\n row-gap: 0.5rem;\n\n .af-accordion {\n &__tag-container {\n grid-area: tag;\n justify-items: center;\n text-align: center;\n\n .af-tag {\n cursor: inherit;\n }\n }\n\n &__date {\n display: grid;\n grid-area: date;\n align-items: center;\n text-align: center;\n color: common.$color-gray-700;\n }\n }\n }\n }\n\n &--title-first {\n --summary-areas: \"title-container tag-date-container value arrow\";\n --summary-columns: repeat(3, auto) min-content;\n\n &:not(:has(.af-accordion__value)) {\n --summary-areas: \"title-container tag-date-container arrow\";\n --summary-columns: repeat(2, auto) min-content;\n }\n\n .af-accordion {\n &__tag-date-container {\n padding: 0;\n grid-template: \"tag date\";\n column-gap: inherit;\n\n .af-accordion {\n &__tag-container {\n padding: 0 1.688rem;\n }\n\n &__date {\n padding: 0 3.125rem;\n }\n }\n }\n\n &__value {\n min-width: auto;\n }\n }\n }\n\n .af-accordion__tag-date-container:has(> :only-child) {\n row-gap: 0;\n }\n }\n\n @media (width <= #{common.$breakpoint-md}) {\n .af-accordion__summary--title-first\n .af-accordion__tag-date-container\n .af-accordion {\n &__tag-container,\n &__date {\n padding: 0;\n }\n }\n }\n\n @media (width <= #{common.$breakpoint-sm}) {\n .af-accordion__summary {\n --summary-areas: \"tag-date-container arrow\" \"title-container arrow\"\n \"value arrow\";\n --summary-columns: 1fr;\n\n column-gap: 0;\n\n .af-accordion {\n &__title-container {\n justify-content: start;\n\n .af-accordion {\n &__subtitle {\n font-size: 0.875rem;\n line-height: 1.1rem;\n }\n }\n }\n\n &__tag-date-container {\n display: flex;\n gap: 0.5rem;\n }\n\n &__value {\n justify-content: start;\n }\n }\n\n &--title-first {\n --summary-areas: \"icon title-container arrow\"\n \"icon tag-date-container arrow\" \"icon value arrow\";\n --summary-columns: auto 1fr auto;\n\n column-gap: 0.75rem;\n\n &:not(:has(.af-accordion__icon)) {\n --summary-areas: \"title-container arrow\" \"tag-date-container arrow\"\n \"value arrow\";\n --summary-columns: 1fr auto;\n }\n\n &:not(:has(.af-accordion__tag-date-container)) {\n --summary-areas: \"icon title-container arrow\" \"icon value arrow\";\n }\n\n &:not(:has(.af-accordion__value)) {\n --summary-areas: \"icon title-container arrow\"\n \"icon tag-date-container arrow\";\n }\n\n &:not(\n :has(.af-accordion__icon),\n :has(.af-accordion__tag-date-container)\n ) {\n --summary-areas: \"title-container arrow\" \"value arrow\";\n }\n\n &:not(\n :has(.af-accordion__tag-date-container),\n :has(.af-accordion__value)\n ) {\n --summary-areas: \"icon title-container arrow\";\n --summary-columns: auto 1fr auto;\n }\n\n &:not(:has(.af-accordion__icon), :has(.af-accordion__value)) {\n --summary-areas: \"title-container arrow\" \"tag-date-container arrow\";\n }\n\n &:not(\n :has(.af-accordion__icon),\n :has(.af-accordion__tag-date-container),\n :has(.af-accordion__value)\n ) {\n --summary-areas: \"title-container arrow\";\n --summary-columns: 1fr auto;\n }\n }\n }\n }\n}\n","@import \"./mixins\";\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-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"]}
1
+ {"version":3,"sources":["../../src/Accordion/Accordion.scss%23sass","../../src/Accordion/Accordion.scss"],"names":[],"mappings":"AAEA,cACE,gEAAA,CCDF,yCAAA,CDGE,oDAAA,CACA,yCCDF,CDGE,uBACE,wCAAA,CACA,4CCDJ,CDGI,oEACE,6CAAA,CACA,oCCDN,CDII,uDACE,0DAAA,CACA,+BCFN,CDIM,oGACE,uCAAA,CACA,0BCFR,CDOM,2CAGE,kBAAA,CAFA,YAAA,CACA,cCJR,CDQM,sDACE,YAAA,CAIA,gBAAA,CAHA,yBAAA,CACA,0CAAA,CACA,oDCLR,CDQQ,qFACE,0CAAA,CACA,6BAAA,CAEA,YCPV,CDUQ,yFACE,oCAAA,CAEA,SCTV,CDWU,wHACE,+BCTZ,CDcU,2EACE,eCZZ,CDeU,8EAKE,2BAAA,CAHA,cAAA,CACA,eAAA,CAFA,kBAAA,CAGA,mBCZZ,CDkBM,4CAKE,4BAAA,CAJA,YAAA,CAEA,eAAA,CACA,oBAAA,CAFA,kBCbR,CDmBM,yDACE,YAAA,CAEA,4BAAA,CACA,0BAAA,CAFA,qBAAA,CAGA,aCjBR,CDoBU,sFACE,aAAA,CACA,oBAAA,CACA,iBClBZ,CDoBY,8FACE,cClBd,CDsBU,6EAGE,kBAAA,CAEA,2BAAA,CAJA,YAAA,CACA,cAAA,CAEA,iBCnBZ,CD0BI,oCACE,gEAAA,CACA,4CCxBN,CD0BM,oEACE,0DAAA,CACA,4CCxBR,CD4BQ,sEAGE,kBAAA,CADA,wBAAA,CADA,SCxBV,CD6BY,mGACE,kBC3Bd,CD8BY,0FACE,kBC5Bd,CDiCQ,yDACE,cC/BV,CDoCI,2EACE,SClCN,CDsCE,yBAII,yNAEE,SCxCN,CACF,CD4CE,wBACE,qCACE,gFAAA,CAEA,qBAAA,CAEA,YC3CJ,CD8CM,oEACE,qBC5CR,CD+CU,4FACE,iBAAA,CACA,kBC7CZ,CDkDM,uEACE,YAAA,CACA,SChDR,CDmDM,0DACE,qBCjDR,CDqDI,kDACE,+FAAA,CAEA,+BAAA,CAEA,iBCpDN,CDsDM,iFACE,gFAAA,CCnDR,0BACA,CDuDM,+FACE,+DCrDR,CDwDM,kFACE,4ECrDR,CDyDM,yHCtDN,qDACA,CD4DM,0HAIE,4CAAA,CACA,+BC5DR,CD+DM,4GACE,kEC7DR,CDgEM,oJAKE,uCAAA,CACA,0BChER,CACF","file":"Accordion.css","sourcesContent":["@use \"../common/common.scss\" as common;\n\n.af-accordion {\n --summary-areas: \"tag-date-container title-container value arrow\";\n --summary-columns: auto 1fr repeat(2, auto);\n --title-container-areas: \"icon title\" \"icon subtitle\";\n --title-container-columns: min-content 1fr;\n\n &__summary {\n grid-template-areas: var(--summary-areas);\n grid-template-columns: var(--summary-columns);\n\n &:not(:has(.af-accordion__tag-date-container)) {\n --summary-areas: \"title-container value arrow\";\n --summary-columns: 1fr repeat(2, auto);\n }\n\n &:not(:has(.af-accordion__value)) {\n --summary-areas: \"tag-date-container title-container arrow\";\n --summary-columns: auto 1fr auto;\n\n &:not(:has(.af-accordion__tag-date-container)) {\n --summary-areas: \"title-container arrow\";\n --summary-columns: 1fr auto;\n }\n }\n\n .af-accordion {\n &__icon {\n display: grid;\n grid-area: icon;\n align-items: center;\n }\n\n &__title-container {\n display: grid;\n grid-area: title-container;\n grid-template: var(--title-container-areas);\n grid-template-columns: var(--title-container-columns);\n gap: 0.125rem 1rem;\n\n &:not(:has(.af-accordion__icon)) {\n --title-container-areas: \"title\" \"subtitle\";\n --title-container-columns: 1fr;\n\n column-gap: 0;\n }\n\n &:not(:has(.af-accordion__subtitle)) {\n --title-container-areas: \"icon title\";\n\n row-gap: 0;\n\n &:not(:has(.af-accordion__icon)) {\n --title-container-areas: \"title\";\n }\n }\n\n .af-accordion {\n &__title {\n grid-area: title;\n }\n\n &__subtitle {\n grid-area: subtitle;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.25rem;\n color: var(--color-gray-700);\n }\n }\n }\n\n &__value {\n display: grid;\n min-width: 9.375rem;\n grid-area: value;\n justify-items: center;\n color: var(--color-green-600);\n }\n\n &__tag-date-container {\n display: grid;\n padding-right: 3.93rem;\n grid-area: tag-date-container;\n grid-template: \"tag\" \"date\";\n row-gap: 0.5rem;\n\n .af-accordion {\n &__tag-container {\n grid-area: tag;\n justify-items: center;\n text-align: center;\n\n .af-tag {\n cursor: inherit;\n }\n }\n\n &__date {\n display: grid;\n grid-area: date;\n align-items: center;\n text-align: center;\n color: var(--color-gray-700);\n }\n }\n }\n }\n\n &--title-first {\n --summary-areas: \"title-container tag-date-container value arrow\";\n --summary-columns: repeat(3, auto) min-content;\n\n &:not(:has(.af-accordion__value)) {\n --summary-areas: \"title-container tag-date-container arrow\";\n --summary-columns: repeat(2, auto) min-content;\n }\n\n .af-accordion {\n &__tag-date-container {\n padding: 0;\n grid-template: \"tag date\";\n column-gap: inherit;\n\n .af-accordion {\n &__tag-container {\n padding: 0 1.688rem;\n }\n\n &__date {\n padding: 0 3.125rem;\n }\n }\n }\n\n &__value {\n min-width: auto;\n }\n }\n }\n\n .af-accordion__tag-date-container:has(> :only-child) {\n row-gap: 0;\n }\n }\n\n @media (width <= #{common.$breakpoint-md}) {\n .af-accordion__summary--title-first\n .af-accordion__tag-date-container\n .af-accordion {\n &__tag-container,\n &__date {\n padding: 0;\n }\n }\n }\n\n @media (width <= #{common.$breakpoint-sm}) {\n .af-accordion__summary {\n --summary-areas: \"tag-date-container arrow\" \"title-container arrow\"\n \"value arrow\";\n --summary-columns: 1fr;\n\n column-gap: 0;\n\n .af-accordion {\n &__title-container {\n justify-content: start;\n\n .af-accordion {\n &__subtitle {\n font-size: 0.875rem;\n line-height: 1.1rem;\n }\n }\n }\n\n &__tag-date-container {\n display: flex;\n gap: 0.5rem;\n }\n\n &__value {\n justify-content: start;\n }\n }\n\n &--title-first {\n --summary-areas: \"icon title-container arrow\"\n \"icon tag-date-container arrow\" \"icon value arrow\";\n --summary-columns: auto 1fr auto;\n\n column-gap: 0.75rem;\n\n &:not(:has(.af-accordion__icon)) {\n --summary-areas: \"title-container arrow\" \"tag-date-container arrow\"\n \"value arrow\";\n --summary-columns: 1fr auto;\n }\n\n &:not(:has(.af-accordion__tag-date-container)) {\n --summary-areas: \"icon title-container arrow\" \"icon value arrow\";\n }\n\n &:not(:has(.af-accordion__value)) {\n --summary-areas: \"icon title-container arrow\"\n \"icon tag-date-container arrow\";\n }\n\n &:not(\n :has(.af-accordion__icon),\n :has(.af-accordion__tag-date-container)\n ) {\n --summary-areas: \"title-container arrow\" \"value arrow\";\n }\n\n &:not(\n :has(.af-accordion__tag-date-container),\n :has(.af-accordion__value)\n ) {\n --summary-areas: \"icon title-container arrow\";\n --summary-columns: auto 1fr auto;\n }\n\n &:not(:has(.af-accordion__icon), :has(.af-accordion__value)) {\n --summary-areas: \"title-container arrow\" \"tag-date-container arrow\";\n }\n\n &:not(\n :has(.af-accordion__icon),\n :has(.af-accordion__tag-date-container),\n :has(.af-accordion__value)\n ) {\n --summary-areas: \"title-container arrow\";\n --summary-columns: 1fr auto;\n }\n }\n }\n }\n}\n","@use \"../common/common.scss\" as common;\n\n.af-accordion {\n --summary-areas: \"tag-date-container title-container value arrow\";\n --summary-columns: auto 1fr repeat(2, auto);\n --title-container-areas: \"icon title\" \"icon subtitle\";\n --title-container-columns: min-content 1fr;\n\n &__summary {\n grid-template-areas: var(--summary-areas);\n grid-template-columns: var(--summary-columns);\n\n &:not(:has(.af-accordion__tag-date-container)) {\n --summary-areas: \"title-container value arrow\";\n --summary-columns: 1fr repeat(2, auto);\n }\n\n &:not(:has(.af-accordion__value)) {\n --summary-areas: \"tag-date-container title-container arrow\";\n --summary-columns: auto 1fr auto;\n\n &:not(:has(.af-accordion__tag-date-container)) {\n --summary-areas: \"title-container arrow\";\n --summary-columns: 1fr auto;\n }\n }\n\n .af-accordion {\n &__icon {\n display: grid;\n grid-area: icon;\n align-items: center;\n }\n\n &__title-container {\n display: grid;\n grid-area: title-container;\n grid-template: var(--title-container-areas);\n grid-template-columns: var(--title-container-columns);\n gap: 0.125rem 1rem;\n\n &:not(:has(.af-accordion__icon)) {\n --title-container-areas: \"title\" \"subtitle\";\n --title-container-columns: 1fr;\n\n column-gap: 0;\n }\n\n &:not(:has(.af-accordion__subtitle)) {\n --title-container-areas: \"icon title\";\n\n row-gap: 0;\n\n &:not(:has(.af-accordion__icon)) {\n --title-container-areas: \"title\";\n }\n }\n\n .af-accordion {\n &__title {\n grid-area: title;\n }\n\n &__subtitle {\n grid-area: subtitle;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.25rem;\n color: var(--color-gray-700);\n }\n }\n }\n\n &__value {\n display: grid;\n min-width: 9.375rem;\n grid-area: value;\n justify-items: center;\n color: var(--color-green-600);\n }\n\n &__tag-date-container {\n display: grid;\n padding-right: 3.93rem;\n grid-area: tag-date-container;\n grid-template: \"tag\" \"date\";\n row-gap: 0.5rem;\n\n .af-accordion {\n &__tag-container {\n grid-area: tag;\n justify-items: center;\n text-align: center;\n\n .af-tag {\n cursor: inherit;\n }\n }\n\n &__date {\n display: grid;\n grid-area: date;\n align-items: center;\n text-align: center;\n color: var(--color-gray-700);\n }\n }\n }\n }\n\n &--title-first {\n --summary-areas: \"title-container tag-date-container value arrow\";\n --summary-columns: repeat(3, auto) min-content;\n\n &:not(:has(.af-accordion__value)) {\n --summary-areas: \"title-container tag-date-container arrow\";\n --summary-columns: repeat(2, auto) min-content;\n }\n\n .af-accordion {\n &__tag-date-container {\n padding: 0;\n grid-template: \"tag date\";\n column-gap: inherit;\n\n .af-accordion {\n &__tag-container {\n padding: 0 1.688rem;\n }\n\n &__date {\n padding: 0 3.125rem;\n }\n }\n }\n\n &__value {\n min-width: auto;\n }\n }\n }\n\n .af-accordion__tag-date-container:has(> :only-child) {\n row-gap: 0;\n }\n }\n\n @media (width <= #{common.$breakpoint-md}) {\n .af-accordion__summary--title-first\n .af-accordion__tag-date-container\n .af-accordion {\n &__tag-container,\n &__date {\n padding: 0;\n }\n }\n }\n\n @media (width <= #{common.$breakpoint-sm}) {\n .af-accordion__summary {\n --summary-areas: \"tag-date-container arrow\" \"title-container arrow\"\n \"value arrow\";\n --summary-columns: 1fr;\n\n column-gap: 0;\n\n .af-accordion {\n &__title-container {\n justify-content: start;\n\n .af-accordion {\n &__subtitle {\n font-size: 0.875rem;\n line-height: 1.1rem;\n }\n }\n }\n\n &__tag-date-container {\n display: flex;\n gap: 0.5rem;\n }\n\n &__value {\n justify-content: start;\n }\n }\n\n &--title-first {\n --summary-areas: \"icon title-container arrow\"\n \"icon tag-date-container arrow\" \"icon value arrow\";\n --summary-columns: auto 1fr auto;\n\n column-gap: 0.75rem;\n\n &:not(:has(.af-accordion__icon)) {\n --summary-areas: \"title-container arrow\" \"tag-date-container arrow\"\n \"value arrow\";\n --summary-columns: 1fr auto;\n }\n\n &:not(:has(.af-accordion__tag-date-container)) {\n --summary-areas: \"icon title-container arrow\" \"icon value arrow\";\n }\n\n &:not(:has(.af-accordion__value)) {\n --summary-areas: \"icon title-container arrow\"\n \"icon tag-date-container arrow\";\n }\n\n &:not(\n :has(.af-accordion__icon),\n :has(.af-accordion__tag-date-container)\n ) {\n --summary-areas: \"title-container arrow\" \"value arrow\";\n }\n\n &:not(\n :has(.af-accordion__tag-date-container),\n :has(.af-accordion__value)\n ) {\n --summary-areas: \"icon title-container arrow\";\n --summary-columns: auto 1fr auto;\n }\n\n &:not(:has(.af-accordion__icon), :has(.af-accordion__value)) {\n --summary-areas: \"title-container arrow\" \"tag-date-container arrow\";\n }\n\n &:not(\n :has(.af-accordion__icon),\n :has(.af-accordion__tag-date-container),\n :has(.af-accordion__value)\n ) {\n --summary-areas: \"title-container arrow\";\n --summary-columns: 1fr auto;\n }\n }\n }\n }\n}\n"]}
@@ -66,7 +66,7 @@
66
66
  font-size: 1rem;
67
67
  font-weight: 400;
68
68
  line-height: 1.25rem;
69
- color: common.$color-gray-700;
69
+ color: var(--color-gray-700);
70
70
  }
71
71
  }
72
72
  }
@@ -76,7 +76,7 @@
76
76
  min-width: 9.375rem;
77
77
  grid-area: value;
78
78
  justify-items: center;
79
- color: common.$color-green-600;
79
+ color: var(--color-green-600);
80
80
  }
81
81
 
82
82
  &__tag-date-container {
@@ -102,7 +102,7 @@
102
102
  grid-area: date;
103
103
  align-items: center;
104
104
  text-align: center;
105
- color: common.$color-gray-700;
105
+ color: var(--color-gray-700);
106
106
  }
107
107
  }
108
108
  }
@@ -1 +1 @@
1
- .af-accordion{font-family:Source Sans Pro,arial,sans-serif}.af-accordion__summary{align-items:center;color:#333;column-gap:2.5rem;cursor:pointer;display:grid;font-size:1.125rem;font-weight:600;grid-template-areas:"summary arrow";grid-template-columns:1fr auto;line-height:1.4rem;padding:1rem}.af-accordion__summary p{margin:0}.af-accordion__summary:first-child{grid-area:summary}.af-accordion__summary:after{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' fill='none' viewBox='0 0 32 32'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%2300008F' d='m24 13.333-1.88-1.88L16 17.56l-6.12-6.107L8 13.333l8 8z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M32 0v32H0V0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");background-repeat:no-repeat;background-size:100%;content:"";display:inline-block;flex-shrink:0;grid-area:arrow;height:2rem;margin-left:auto;transition:transform .2s ease-in-out;width:2rem}.af-accordion[open]>.af-accordion__summary{border-bottom:1px solid #e9ecf2}.af-accordion[open]>.af-accordion__summary:after{transform:rotate(180deg)}.af-accordion__content{color:#5f5f5f;font-size:1rem;font-weight:400;line-height:1.25rem;padding:1rem}@media (width <= 667px){.af-accordion__summary{font-size:1rem;font-weight:600;line-height:1.25rem;row-gap:.25rem}.af-accordion__content{font-size:.875rem;line-height:1.1rem}}
1
+ .af-accordion{font-family:var(--font-family-base)}.af-accordion__summary{align-items:center;color:var(--color-gray-900);column-gap:2.5rem;cursor:pointer;display:grid;font-size:1.125rem;font-weight:600;grid-template-areas:"summary arrow";grid-template-columns:1fr auto;line-height:1.4rem;padding:1rem}.af-accordion__summary p{margin:0}.af-accordion__summary:first-child{grid-area:summary}.af-accordion__summary:after{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' fill='none' viewBox='0 0 32 32'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%2300008F' d='m24 13.333-1.88-1.88L16 17.56l-6.12-6.107L8 13.333l8 8z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M32 0v32H0V0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");background-repeat:no-repeat;background-size:100%;content:"";display:inline-block;flex-shrink:0;grid-area:arrow;height:2rem;margin-left:auto;transition:transform .2s ease-in-out;width:2rem}.af-accordion[open]>.af-accordion__summary{border-bottom:1px solid var(--color-gray-300)}.af-accordion[open]>.af-accordion__summary:after{transform:rotate(180deg)}.af-accordion__content{color:var(--color-gray-700);font-size:1rem;font-weight:400;line-height:1.25rem;padding:1rem}@media (width <= 667px){.af-accordion__summary{font-size:1rem;font-weight:600;line-height:1.25rem;row-gap:.25rem}.af-accordion__content{font-size:.875rem;line-height:1.1rem}}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/AccordionCore/AccordionCore.scss%23sass","../../src/AccordionCore/AccordionCore.scss"],"names":[],"mappings":"AAEA,cACE,4CCDF,CDGE,uBAKE,kBAAA,CAKA,UAAA,CAJA,iBAAA,CAKA,cAAA,CAVA,YAAA,CAMA,kBAAA,CACA,eAAA,CALA,mCAAA,CACA,8BAAA,CAKA,kBAAA,CAPA,YCQJ,CDGI,yBACE,QCDN,CDII,mCACE,iBCFN,CDKI,6BAOE,uYAAA,CACA,2BAAA,CACA,oBAAA,CAEA,UAAA,CAVA,oBAAA,CAKA,aAAA,CADA,eAAA,CAFA,WAAA,CACA,gBAAA,CAMA,oCAAA,CARA,UCMN,CDOE,2CACE,+BCLJ,CDOI,iDACE,wBCLN,CDSE,uBAKE,aAAA,CAHA,cAAA,CACA,eAAA,CACA,mBAAA,CAHA,YCHJ,CDWA,wBAEI,uBAEE,cAAA,CACA,eAAA,CACA,mBAAA,CAHA,cCNJ,CACF,uBDYM,iBAAA,CCVN,kBACE,CACF","file":"AccordionCore.css","sourcesContent":["@use \"../common/common.scss\" as common;\n\n.af-accordion {\n font-family: common.$font-family-base;\n\n &__summary {\n display: grid;\n padding: 1rem;\n grid-template-areas: \"summary arrow\";\n grid-template-columns: 1fr auto;\n align-items: center;\n column-gap: 2.5rem;\n font-size: 1.125rem;\n font-weight: 600;\n line-height: 1.4rem;\n color: common.$color-gray-900;\n cursor: pointer;\n\n p {\n margin: 0;\n }\n\n &:first-child {\n grid-area: summary;\n }\n\n &::after {\n display: inline-block;\n width: 2rem;\n height: 2rem;\n margin-left: auto;\n grid-area: arrow;\n flex-shrink: 0;\n background-image: url(\"data:image/svg+xml,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_14583_27882)%22%3E%0A%3Cpath%20d%3D%22M24%2013.3331L22.12%2011.4531L16%2017.5598L9.88%2011.4531L8%2013.3331L16%2021.3331L24%2013.3331Z%22%20fill%3D%22%2300008F%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3CclipPath%20id%3D%22clip0_14583_27882%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%20transform%3D%22matrix(0%201%20-1%200%2032%200)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E%0A\");\n background-repeat: no-repeat;\n background-size: 100%;\n transition: transform 0.2s ease-in-out;\n content: \"\";\n }\n }\n\n &[open] > .af-accordion__summary {\n border-bottom: 1px solid common.$color-gray-300;\n\n &::after {\n transform: rotate(180deg);\n }\n }\n\n &__content {\n padding: 1rem;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.25rem;\n color: common.$color-gray-700;\n }\n}\n\n@media (width <= #{common.$breakpoint-sm}) {\n .af-accordion {\n &__summary {\n row-gap: 0.25rem;\n font-size: 1rem;\n font-weight: 600;\n line-height: 1.25rem;\n }\n\n &__content {\n font-size: 0.875rem;\n line-height: 1.1rem;\n }\n }\n}\n","@use \"../common/common.scss\" as common;\n\n.af-accordion {\n font-family: common.$font-family-base;\n\n &__summary {\n display: grid;\n padding: 1rem;\n grid-template-areas: \"summary arrow\";\n grid-template-columns: 1fr auto;\n align-items: center;\n column-gap: 2.5rem;\n font-size: 1.125rem;\n font-weight: 600;\n line-height: 1.4rem;\n color: common.$color-gray-900;\n cursor: pointer;\n\n p {\n margin: 0;\n }\n\n &:first-child {\n grid-area: summary;\n }\n\n &::after {\n display: inline-block;\n width: 2rem;\n height: 2rem;\n margin-left: auto;\n grid-area: arrow;\n flex-shrink: 0;\n background-image: url(\"data:image/svg+xml,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_14583_27882)%22%3E%0A%3Cpath%20d%3D%22M24%2013.3331L22.12%2011.4531L16%2017.5598L9.88%2011.4531L8%2013.3331L16%2021.3331L24%2013.3331Z%22%20fill%3D%22%2300008F%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3CclipPath%20id%3D%22clip0_14583_27882%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%20transform%3D%22matrix(0%201%20-1%200%2032%200)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E%0A\");\n background-repeat: no-repeat;\n background-size: 100%;\n transition: transform 0.2s ease-in-out;\n content: \"\";\n }\n }\n\n &[open] > .af-accordion__summary {\n border-bottom: 1px solid common.$color-gray-300;\n\n &::after {\n transform: rotate(180deg);\n }\n }\n\n &__content {\n padding: 1rem;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.25rem;\n color: common.$color-gray-700;\n }\n}\n\n@media (width <= #{common.$breakpoint-sm}) {\n .af-accordion {\n &__summary {\n row-gap: 0.25rem;\n font-size: 1rem;\n font-weight: 600;\n line-height: 1.25rem;\n }\n\n &__content {\n font-size: 0.875rem;\n line-height: 1.1rem;\n }\n }\n}\n"]}
1
+ {"version":3,"sources":["../../src/AccordionCore/AccordionCore.scss%23sass","../../src/AccordionCore/AccordionCore.scss"],"names":[],"mappings":"AAEA,cACE,mCCDF,CDGE,uBAKE,kBAAA,CAKA,2BAAA,CAJA,iBAAA,CAKA,cAAA,CAVA,YAAA,CAMA,kBAAA,CACA,eAAA,CALA,mCAAA,CACA,8BAAA,CAKA,kBAAA,CAPA,YCQJ,CDGI,yBACE,QCDN,CDII,mCACE,iBCFN,CDKI,6BAOE,uYAAA,CACA,2BAAA,CACA,oBAAA,CAEA,UAAA,CAVA,oBAAA,CAKA,aAAA,CADA,eAAA,CAFA,WAAA,CACA,gBAAA,CAMA,oCAAA,CARA,UCMN,CDOE,2CACE,6CCLJ,CDOI,iDACE,wBCLN,CDSE,uBAKE,2BAAA,CAHA,cAAA,CACA,eAAA,CACA,mBAAA,CAHA,YCHJ,CDWA,wBAEI,uBAEE,cAAA,CACA,eAAA,CACA,mBAAA,CAHA,cCNJ,CACF,uBDYM,iBAAA,CCVN,kBACE,CACF","file":"AccordionCore.css","sourcesContent":["@use \"../common/common.scss\" as common;\n\n.af-accordion {\n font-family: var(--font-family-base);\n\n &__summary {\n display: grid;\n padding: 1rem;\n grid-template-areas: \"summary arrow\";\n grid-template-columns: 1fr auto;\n align-items: center;\n column-gap: 2.5rem;\n font-size: 1.125rem;\n font-weight: 600;\n line-height: 1.4rem;\n color: var(--color-gray-900);\n cursor: pointer;\n\n p {\n margin: 0;\n }\n\n &:first-child {\n grid-area: summary;\n }\n\n &::after {\n display: inline-block;\n width: 2rem;\n height: 2rem;\n margin-left: auto;\n grid-area: arrow;\n flex-shrink: 0;\n background-image: url(\"data:image/svg+xml,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_14583_27882)%22%3E%0A%3Cpath%20d%3D%22M24%2013.3331L22.12%2011.4531L16%2017.5598L9.88%2011.4531L8%2013.3331L16%2021.3331L24%2013.3331Z%22%20fill%3D%22%2300008F%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3CclipPath%20id%3D%22clip0_14583_27882%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%20transform%3D%22matrix(0%201%20-1%200%2032%200)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E%0A\");\n background-repeat: no-repeat;\n background-size: 100%;\n transition: transform 0.2s ease-in-out;\n content: \"\";\n }\n }\n\n &[open] > .af-accordion__summary {\n border-bottom: 1px solid var(--color-gray-300);\n\n &::after {\n transform: rotate(180deg);\n }\n }\n\n &__content {\n padding: 1rem;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.25rem;\n color: var(--color-gray-700);\n }\n}\n\n@media (width <= #{common.$breakpoint-sm}) {\n .af-accordion {\n &__summary {\n row-gap: 0.25rem;\n font-size: 1rem;\n font-weight: 600;\n line-height: 1.25rem;\n }\n\n &__content {\n font-size: 0.875rem;\n line-height: 1.1rem;\n }\n }\n}\n","@use \"../common/common.scss\" as common;\n\n.af-accordion {\n font-family: var(--font-family-base);\n\n &__summary {\n display: grid;\n padding: 1rem;\n grid-template-areas: \"summary arrow\";\n grid-template-columns: 1fr auto;\n align-items: center;\n column-gap: 2.5rem;\n font-size: 1.125rem;\n font-weight: 600;\n line-height: 1.4rem;\n color: var(--color-gray-900);\n cursor: pointer;\n\n p {\n margin: 0;\n }\n\n &:first-child {\n grid-area: summary;\n }\n\n &::after {\n display: inline-block;\n width: 2rem;\n height: 2rem;\n margin-left: auto;\n grid-area: arrow;\n flex-shrink: 0;\n background-image: url(\"data:image/svg+xml,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_14583_27882)%22%3E%0A%3Cpath%20d%3D%22M24%2013.3331L22.12%2011.4531L16%2017.5598L9.88%2011.4531L8%2013.3331L16%2021.3331L24%2013.3331Z%22%20fill%3D%22%2300008F%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3CclipPath%20id%3D%22clip0_14583_27882%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%20transform%3D%22matrix(0%201%20-1%200%2032%200)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E%0A\");\n background-repeat: no-repeat;\n background-size: 100%;\n transition: transform 0.2s ease-in-out;\n content: \"\";\n }\n }\n\n &[open] > .af-accordion__summary {\n border-bottom: 1px solid var(--color-gray-300);\n\n &::after {\n transform: rotate(180deg);\n }\n }\n\n &__content {\n padding: 1rem;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.25rem;\n color: var(--color-gray-700);\n }\n}\n\n@media (width <= #{common.$breakpoint-sm}) {\n .af-accordion {\n &__summary {\n row-gap: 0.25rem;\n font-size: 1rem;\n font-weight: 600;\n line-height: 1.25rem;\n }\n\n &__content {\n font-size: 0.875rem;\n line-height: 1.1rem;\n }\n }\n}\n"]}
@@ -1,7 +1,7 @@
1
1
  @use "../common/common.scss" as common;
2
2
 
3
3
  .af-accordion {
4
- font-family: common.$font-family-base;
4
+ font-family: var(--font-family-base);
5
5
 
6
6
  &__summary {
7
7
  display: grid;
@@ -13,7 +13,7 @@
13
13
  font-size: 1.125rem;
14
14
  font-weight: 600;
15
15
  line-height: 1.4rem;
16
- color: common.$color-gray-900;
16
+ color: var(--color-gray-900);
17
17
  cursor: pointer;
18
18
 
19
19
  p {
@@ -40,7 +40,7 @@
40
40
  }
41
41
 
42
42
  &[open] > .af-accordion__summary {
43
- border-bottom: 1px solid common.$color-gray-300;
43
+ border-bottom: 1px solid var(--color-gray-300);
44
44
 
45
45
  &::after {
46
46
  transform: rotate(180deg);
@@ -52,7 +52,7 @@
52
52
  font-size: 1rem;
53
53
  font-weight: 400;
54
54
  line-height: 1.25rem;
55
- color: common.$color-gray-700;
55
+ color: var(--color-gray-700);
56
56
  }
57
57
  }
58
58
 
@@ -1 +1 @@
1
- .af-alert{background-color:#fff;border-radius:12px;display:flex;flex:1 1;font-family:Source Sans Pro,arial,sans-serif;padding:1rem}.af-alert .af-alert__icon{aspect-ratio:1;flex-shrink:0;margin-right:1rem}.af-alert--information{border:1px solid #00008f}.af-alert--information .af-alert__icon{color:#00008f;transform:rotate(180deg);fill:#00008f}.af-alert--information .af-alert__title{color:#00008f}.af-alert--error{border:1px solid #c91432}.af-alert--error .af-alert__icon{color:#c91432;fill:#c91432}.af-alert--error .af-alert__title{color:#c91432}.af-alert--neutral{border:1px solid #5f5f5f}.af-alert--neutral .af-alert__icon{color:#5f5f5f;fill:#5f5f5f}.af-alert--neutral .af-alert__title{color:#5f5f5f}.af-alert--warning{border:1px solid #c94e14}.af-alert--warning .af-alert__icon{color:#c94e14;fill:#c94e14}.af-alert--warning .af-alert__title{color:#c94e14}.af-alert--validation{border:1px solid #118635}.af-alert--validation .af-alert__icon{color:#118635;fill:#118635}.af-alert--validation .af-alert__title{color:#118635}.af-alert .af-alert-client__content{width:100%}.af-alert .af-alert-client__content .af-alert__action{display:flex;justify-content:end;text-align:right}.af-alert .af-alert-client__content .af-alert__title{font-weight:600;line-height:1.5rem;padding-bottom:.25rem}.af-alert *{font-size:1.125rem;font-weight:400;margin:0}
1
+ .af-alert{background-color:#fff;border-radius:12px;display:flex;flex:1 1;font-family:var(--font-family-base);padding:1rem}.af-alert .af-alert__icon{aspect-ratio:1;flex-shrink:0;margin-right:1rem}.af-alert--information{border:1px solid var(--color-axa)}.af-alert--information .af-alert__icon{color:var(--color-axa);transform:rotate(180deg);fill:var(--color-axa)}.af-alert--information .af-alert__title{color:var(--color-axa)}.af-alert--error{border:1px solid var(--color-red-700)}.af-alert--error .af-alert__icon{color:var(--color-red-700);fill:var(--color-red-700)}.af-alert--error .af-alert__title{color:var(--color-red-700)}.af-alert--neutral{border:1px solid var(--color-gray)}.af-alert--neutral .af-alert__icon{color:var(--color-gray);fill:var(--color-gray)}.af-alert--neutral .af-alert__title{color:var(--color-gray)}.af-alert--warning{border:1px solid var(--color-btn-business)}.af-alert--warning .af-alert__icon{color:var(--color-btn-business);fill:var(--color-btn-business)}.af-alert--warning .af-alert__title{color:var(--color-btn-business)}.af-alert--validation{border:1px solid var(--color-green-600)}.af-alert--validation .af-alert__icon{color:var(--color-green-600);fill:var(--color-green-600)}.af-alert--validation .af-alert__title{color:var(--color-green-600)}.af-alert .af-alert-client__content{width:100%}.af-alert .af-alert-client__content .af-alert__action{display:flex;justify-content:end;text-align:right}.af-alert .af-alert-client__content .af-alert__title{font-weight:600;line-height:1.5rem;padding-bottom:.25rem}.af-alert *{font-size:1.125rem;font-weight:400;margin:0}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Alert/Alert.scss%23sass","../../src/common/common.scss","../../src/Alert/Alert.scss"],"names":[],"mappings":"AAEA,UAME,qBAAA,CAHA,kBAAA,CAFA,YAAA,CAGA,QAAA,CACA,4CCLuB,CCAzB,YAKA,CFGE,0BACE,cAAA,CAEA,aAAA,CADA,iBEAJ,CFIE,uBACE,wBEFJ,CFII,uCACE,aAAA,CACA,wBAAA,CACA,YEFN,CFKI,wCACE,aEHN,CFOE,iBACE,wBELJ,CFOI,iCACE,aAAA,CACA,YELN,CFQI,kCACE,aENN,CFUE,mBACE,wBERJ,CFUI,mCACE,aAAA,CACA,YERN,CFWI,oCACE,aETN,CFaE,mBACE,wBEXJ,CFaI,mCACE,aAAA,CACA,YEXN,CFcI,oCACE,aEZN,CFgBE,sBACE,wBEdJ,CFgBI,sCACE,aCrCY,CDsCZ,YEdN,CFiBI,uCACE,aEfN,CFmBE,oCACE,UEjBJ,CFmBI,sDACE,YAAA,CACA,mBAAA,CACA,gBEjBN,CFoBI,qDAEE,eAAA,CACA,kBAAA,CAFA,qBEhBN,CFsBE,YAEE,kBAAA,CACA,eAAA,CAFA,QElBJ","file":"Alert.css","sourcesContent":["@use \"../common/common\" as common;\n\n.af-alert {\n display: flex;\n padding: 1rem;\n border-radius: 12px;\n flex: 1 1 0;\n font-family: common.$font-family-base;\n background-color: white;\n\n .af-alert__icon {\n aspect-ratio: 1;\n margin-right: 1rem;\n flex-shrink: 0;\n }\n\n &--information {\n border: 1px solid common.$color-axa;\n\n .af-alert__icon {\n color: common.$color-axa;\n transform: rotate(180deg);\n fill: common.$color-axa;\n }\n\n .af-alert__title {\n color: common.$color-axa;\n }\n }\n\n &--error {\n border: 1px solid common.$color-red-700;\n\n .af-alert__icon {\n color: common.$color-red-700;\n fill: common.$color-red-700;\n }\n\n .af-alert__title {\n color: common.$color-red-700;\n }\n }\n\n &--neutral {\n border: 1px solid common.$color-gray;\n\n .af-alert__icon {\n color: common.$color-gray;\n fill: common.$color-gray;\n }\n\n .af-alert__title {\n color: common.$color-gray;\n }\n }\n\n &--warning {\n border: 1px solid common.$color-btn-business;\n\n .af-alert__icon {\n color: common.$color-btn-business;\n fill: common.$color-btn-business;\n }\n\n .af-alert__title {\n color: common.$color-btn-business;\n }\n }\n\n &--validation {\n border: 1px solid common.$color-green-600;\n\n .af-alert__icon {\n color: common.$color-green-600;\n fill: common.$color-green-600;\n }\n\n .af-alert__title {\n color: common.$color-green-600;\n }\n }\n\n .af-alert-client__content {\n width: 100%;\n\n .af-alert__action {\n display: flex;\n justify-content: end;\n text-align: right;\n }\n\n .af-alert__title {\n padding-bottom: 0.25rem;\n font-weight: 600;\n line-height: 1.5rem;\n }\n }\n\n * {\n margin: 0;\n font-size: 1.125rem;\n font-weight: 400;\n }\n}\n","@import \"./mixins\";\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-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","@use \"../common/common\" as common;\n\n.af-alert {\n display: flex;\n padding: 1rem;\n border-radius: 12px;\n flex: 1 1 0;\n font-family: common.$font-family-base;\n background-color: white;\n\n .af-alert__icon {\n aspect-ratio: 1;\n margin-right: 1rem;\n flex-shrink: 0;\n }\n\n &--information {\n border: 1px solid common.$color-axa;\n\n .af-alert__icon {\n color: common.$color-axa;\n transform: rotate(180deg);\n fill: common.$color-axa;\n }\n\n .af-alert__title {\n color: common.$color-axa;\n }\n }\n\n &--error {\n border: 1px solid common.$color-red-700;\n\n .af-alert__icon {\n color: common.$color-red-700;\n fill: common.$color-red-700;\n }\n\n .af-alert__title {\n color: common.$color-red-700;\n }\n }\n\n &--neutral {\n border: 1px solid common.$color-gray;\n\n .af-alert__icon {\n color: common.$color-gray;\n fill: common.$color-gray;\n }\n\n .af-alert__title {\n color: common.$color-gray;\n }\n }\n\n &--warning {\n border: 1px solid common.$color-btn-business;\n\n .af-alert__icon {\n color: common.$color-btn-business;\n fill: common.$color-btn-business;\n }\n\n .af-alert__title {\n color: common.$color-btn-business;\n }\n }\n\n &--validation {\n border: 1px solid common.$color-green-600;\n\n .af-alert__icon {\n color: common.$color-green-600;\n fill: common.$color-green-600;\n }\n\n .af-alert__title {\n color: common.$color-green-600;\n }\n }\n\n .af-alert-client__content {\n width: 100%;\n\n .af-alert__action {\n display: flex;\n justify-content: end;\n text-align: right;\n }\n\n .af-alert__title {\n padding-bottom: 0.25rem;\n font-weight: 600;\n line-height: 1.5rem;\n }\n }\n\n * {\n margin: 0;\n font-size: 1.125rem;\n font-weight: 400;\n }\n}\n"]}
1
+ {"version":3,"sources":["../../src/Alert/Alert.scss%23sass","../../src/Alert/Alert.scss"],"names":[],"mappings":"AAAA,UAME,qBAAA,CAHA,kBAAA,CAFA,YAAA,CAGA,QAAA,CACA,mCAAA,CAHA,YCKF,CDCE,0BACE,cAAA,CAEA,aAAA,CADA,iBCEJ,CDEE,uBACE,iCCAJ,CDEI,uCACE,sBAAA,CACA,wBAAA,CACA,qBCAN,CDGI,wCACE,sBCDN,CDKE,iBACE,qCCHJ,CDKI,iCACE,0BAAA,CACA,yBCHN,CDMI,kCACE,0BCJN,CDQE,mBACE,kCCNJ,CDQI,mCACE,uBAAA,CACA,sBCNN,CDSI,oCACE,uBCPN,CDWE,mBACE,0CCTJ,CDWI,mCACE,+BAAA,CACA,8BCTN,CDYI,oCACE,+BCVN,CDcE,sBACE,uCCZJ,CDcI,sCACE,4BAAA,CACA,2BCZN,CDeI,uCACE,4BCbN,CDiBE,oCACE,UCfJ,CDiBI,sDACE,YAAA,CACA,mBAAA,CACA,gBCfN,CDkBI,qDAEE,eAAA,CACA,kBAAA,CAFA,qBCdN,CDoBE,YAEE,kBAAA,CACA,eAAA,CAFA,QChBJ","file":"Alert.css","sourcesContent":[".af-alert {\n display: flex;\n padding: 1rem;\n border-radius: 12px;\n flex: 1 1 0;\n font-family: var(--font-family-base);\n background-color: white;\n\n .af-alert__icon {\n aspect-ratio: 1;\n margin-right: 1rem;\n flex-shrink: 0;\n }\n\n &--information {\n border: 1px solid var(--color-axa);\n\n .af-alert__icon {\n color: var(--color-axa);\n transform: rotate(180deg);\n fill: var(--color-axa);\n }\n\n .af-alert__title {\n color: var(--color-axa);\n }\n }\n\n &--error {\n border: 1px solid var(--color-red-700);\n\n .af-alert__icon {\n color: var(--color-red-700);\n fill: var(--color-red-700);\n }\n\n .af-alert__title {\n color: var(--color-red-700);\n }\n }\n\n &--neutral {\n border: 1px solid var(--color-gray);\n\n .af-alert__icon {\n color: var(--color-gray);\n fill: var(--color-gray);\n }\n\n .af-alert__title {\n color: var(--color-gray);\n }\n }\n\n &--warning {\n border: 1px solid var(--color-btn-business);\n\n .af-alert__icon {\n color: var(--color-btn-business);\n fill: var(--color-btn-business);\n }\n\n .af-alert__title {\n color: var(--color-btn-business);\n }\n }\n\n &--validation {\n border: 1px solid var(--color-green-600);\n\n .af-alert__icon {\n color: var(--color-green-600);\n fill: var(--color-green-600);\n }\n\n .af-alert__title {\n color: var(--color-green-600);\n }\n }\n\n .af-alert-client__content {\n width: 100%;\n\n .af-alert__action {\n display: flex;\n justify-content: end;\n text-align: right;\n }\n\n .af-alert__title {\n padding-bottom: 0.25rem;\n font-weight: 600;\n line-height: 1.5rem;\n }\n }\n\n * {\n margin: 0;\n font-size: 1.125rem;\n font-weight: 400;\n }\n}\n",".af-alert {\n display: flex;\n padding: 1rem;\n border-radius: 12px;\n flex: 1 1 0;\n font-family: var(--font-family-base);\n background-color: white;\n\n .af-alert__icon {\n aspect-ratio: 1;\n margin-right: 1rem;\n flex-shrink: 0;\n }\n\n &--information {\n border: 1px solid var(--color-axa);\n\n .af-alert__icon {\n color: var(--color-axa);\n transform: rotate(180deg);\n fill: var(--color-axa);\n }\n\n .af-alert__title {\n color: var(--color-axa);\n }\n }\n\n &--error {\n border: 1px solid var(--color-red-700);\n\n .af-alert__icon {\n color: var(--color-red-700);\n fill: var(--color-red-700);\n }\n\n .af-alert__title {\n color: var(--color-red-700);\n }\n }\n\n &--neutral {\n border: 1px solid var(--color-gray);\n\n .af-alert__icon {\n color: var(--color-gray);\n fill: var(--color-gray);\n }\n\n .af-alert__title {\n color: var(--color-gray);\n }\n }\n\n &--warning {\n border: 1px solid var(--color-btn-business);\n\n .af-alert__icon {\n color: var(--color-btn-business);\n fill: var(--color-btn-business);\n }\n\n .af-alert__title {\n color: var(--color-btn-business);\n }\n }\n\n &--validation {\n border: 1px solid var(--color-green-600);\n\n .af-alert__icon {\n color: var(--color-green-600);\n fill: var(--color-green-600);\n }\n\n .af-alert__title {\n color: var(--color-green-600);\n }\n }\n\n .af-alert-client__content {\n width: 100%;\n\n .af-alert__action {\n display: flex;\n justify-content: end;\n text-align: right;\n }\n\n .af-alert__title {\n padding-bottom: 0.25rem;\n font-weight: 600;\n line-height: 1.5rem;\n }\n }\n\n * {\n margin: 0;\n font-size: 1.125rem;\n font-weight: 400;\n }\n}\n"]}
@@ -1,11 +1,9 @@
1
- @use "../common/common" as common;
2
-
3
1
  .af-alert {
4
2
  display: flex;
5
3
  padding: 1rem;
6
4
  border-radius: 12px;
7
5
  flex: 1 1 0;
8
- font-family: common.$font-family-base;
6
+ font-family: var(--font-family-base);
9
7
  background-color: white;
10
8
 
11
9
  .af-alert__icon {
@@ -15,68 +13,68 @@
15
13
  }
16
14
 
17
15
  &--information {
18
- border: 1px solid common.$color-axa;
16
+ border: 1px solid var(--color-axa);
19
17
 
20
18
  .af-alert__icon {
21
- color: common.$color-axa;
19
+ color: var(--color-axa);
22
20
  transform: rotate(180deg);
23
- fill: common.$color-axa;
21
+ fill: var(--color-axa);
24
22
  }
25
23
 
26
24
  .af-alert__title {
27
- color: common.$color-axa;
25
+ color: var(--color-axa);
28
26
  }
29
27
  }
30
28
 
31
29
  &--error {
32
- border: 1px solid common.$color-red-700;
30
+ border: 1px solid var(--color-red-700);
33
31
 
34
32
  .af-alert__icon {
35
- color: common.$color-red-700;
36
- fill: common.$color-red-700;
33
+ color: var(--color-red-700);
34
+ fill: var(--color-red-700);
37
35
  }
38
36
 
39
37
  .af-alert__title {
40
- color: common.$color-red-700;
38
+ color: var(--color-red-700);
41
39
  }
42
40
  }
43
41
 
44
42
  &--neutral {
45
- border: 1px solid common.$color-gray;
43
+ border: 1px solid var(--color-gray);
46
44
 
47
45
  .af-alert__icon {
48
- color: common.$color-gray;
49
- fill: common.$color-gray;
46
+ color: var(--color-gray);
47
+ fill: var(--color-gray);
50
48
  }
51
49
 
52
50
  .af-alert__title {
53
- color: common.$color-gray;
51
+ color: var(--color-gray);
54
52
  }
55
53
  }
56
54
 
57
55
  &--warning {
58
- border: 1px solid common.$color-btn-business;
56
+ border: 1px solid var(--color-btn-business);
59
57
 
60
58
  .af-alert__icon {
61
- color: common.$color-btn-business;
62
- fill: common.$color-btn-business;
59
+ color: var(--color-btn-business);
60
+ fill: var(--color-btn-business);
63
61
  }
64
62
 
65
63
  .af-alert__title {
66
- color: common.$color-btn-business;
64
+ color: var(--color-btn-business);
67
65
  }
68
66
  }
69
67
 
70
68
  &--validation {
71
- border: 1px solid common.$color-green-600;
69
+ border: 1px solid var(--color-green-600);
72
70
 
73
71
  .af-alert__icon {
74
- color: common.$color-green-600;
75
- fill: common.$color-green-600;
72
+ color: var(--color-green-600);
73
+ fill: var(--color-green-600);
76
74
  }
77
75
 
78
76
  .af-alert__title {
79
- color: common.$color-green-600;
77
+ color: var(--color-green-600);
80
78
  }
81
79
  }
82
80
 
@@ -1 +1 @@
1
- .af-btn-client{align-items:center;background-color:#00008f;border:0;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-family:Source Sans Pro,arial,sans-serif;font-weight:600;gap:1rem;justify-content:center;min-height:3.5rem;padding:.8rem 1.2rem;transition-duration:.2s;transition-property:width,height,border,color,background-color,outline,box-shadow;transition-timing-function:linear}.af-btn-client:hover{background-color:#000072;color:#fff}.af-btn-client:active,.af-btn-client:focus{background-color:#3333a5;color:#fff;outline:none}.af-btn-client:focus-visible{outline:2px solid #36f;outline-offset:3px}.af-btn-client>svg{aspect-ratio:1}.af-btn-client--ghost{background-color:initial;color:#00008f;gap:.25rem;min-height:auto;min-width:auto;padding:0}.af-btn-client--ghost:hover{background-color:initial;color:#000072}.af-btn-client--ghost:active,.af-btn-client--ghost:focus{background-color:initial;color:#3333a5}.af-btn-client--primary-business{background-color:#c94e14}.af-btn-client--primary-business:hover{background-color:#a8391c}.af-btn-client--primary-business:focus{background-color:#df7e65}.af-btn-client--tertiary{background-color:#eef;color:#00008f}.af-btn-client--tertiary:hover{background-color:#e4e4ff;color:#00008f}.af-btn-client--tertiary:active,.af-btn-client--tertiary:focus{background-color:#f8f8ff;color:#00008f}.af-btn-client--secondary{background-color:#fff;box-shadow:inset 0 0 0 1px #00008f;color:#00008f}.af-btn-client--secondary:active,.af-btn-client--secondary:focus,.af-btn-client--secondary:hover{background-color:#fff;box-shadow:inset 0 0 0 2px #000072;color:#000072}.af-btn-client--secondary:active{background-color:#f8f8ff}.af-btn-client--secondary-error{background-color:#fff;box-shadow:inset 0 0 0 1px #c91432;color:#c91432}.af-btn-client--secondary-error:active,.af-btn-client--secondary-error:focus,.af-btn-client--secondary-error:hover{background-color:#fff;box-shadow:inset 0 0 0 2px #a11028;color:#a11028}.af-btn-client--secondary-error:active{background-color:#fff3f5}.af-btn-client__wrapper{align-items:center;display:flex;justify-content:center;line-height:1}.af-btn-client:disabled,.af-btn-client[aria-disabled=true]{background-color:#e9ecf2;box-shadow:none;color:#999;cursor:not-allowed}.af-btn-client:disabled:focus,.af-btn-client:disabled:hover,.af-btn-client[aria-disabled=true]:focus,.af-btn-client[aria-disabled=true]:hover{background-color:#e9ecf2;border-color:#0000;color:#999}
1
+ .af-btn-client{align-items:center;background-color:var(--color-axa);border:0;border-radius:8px;color:var(--color-white);cursor:pointer;display:flex;font-family:var(--font-family-base);font-weight:600;gap:1rem;justify-content:center;min-height:3.5rem;padding:.8rem 1.2rem;transition-duration:var(--transition-duration);transition-property:width,height,border,color,background-color,outline,box-shadow;transition-timing-function:linear}.af-btn-client:hover{background-color:var(--color-blue-1);color:var(--color-white)}.af-btn-client:active,.af-btn-client:focus{background-color:var(--color-btn-light);color:var(--color-white);outline:none}.af-btn-client:focus-visible{outline:2px solid var(--color-blue-3);outline-offset:3px}.af-btn-client>svg{aspect-ratio:1}.af-btn-client--ghost{background-color:initial;color:var(--color-axa);gap:.25rem;min-height:auto;min-width:auto;padding:0}.af-btn-client--ghost:hover{background-color:initial;color:var(--color-blue-1)}.af-btn-client--ghost:active,.af-btn-client--ghost:focus{background-color:initial;color:var(--color-btn-light)}.af-btn-client--primary-business{background-color:var(--color-btn-business)}.af-btn-client--primary-business:hover{background-color:var(--color-btn-business-dark)}.af-btn-client--primary-business:focus{background-color:var(--color-btn-business-light)}.af-btn-client--tertiary{background-color:var(--color-btn-tertiary-bg);color:var(--color-axa)}.af-btn-client--tertiary:hover{background-color:var(--color-btn-tertiary-bg-darker);color:var(--color-axa)}.af-btn-client--tertiary:active,.af-btn-client--tertiary:focus{background-color:var(--color-btn-tertiary-bg-lighter);color:var(--color-axa)}.af-btn-client--secondary{background-color:var(--color-white);box-shadow:0 0 0 1px var(--color-axa) inset;color:var(--color-axa)}.af-btn-client--secondary:active,.af-btn-client--secondary:focus,.af-btn-client--secondary:hover{background-color:var(--color-white);box-shadow:0 0 0 2px var(--color-blue-1) inset;color:var(--color-blue-1)}.af-btn-client--secondary:active{background-color:var(--color-blue-2)}.af-btn-client--secondary-error{background-color:var(--color-white);box-shadow:0 0 0 1px var(--color-red-700) inset;color:var(--color-red-700)}.af-btn-client--secondary-error:active,.af-btn-client--secondary-error:focus,.af-btn-client--secondary-error:hover{background-color:var(--color-white);box-shadow:0 0 0 2px var(--color-btn-error-text) inset;color:var(--color-btn-error-text)}.af-btn-client--secondary-error:active{background-color:var(--color-btn-error-bg)}.af-btn-client__wrapper{align-items:center;display:flex;justify-content:center;line-height:1}.af-btn-client:disabled,.af-btn-client[aria-disabled=true]{background-color:var(--color-gray-300);box-shadow:none;color:var(--color-btn-disabled-text);cursor:not-allowed}.af-btn-client:disabled:focus,.af-btn-client:disabled:hover,.af-btn-client[aria-disabled=true]:focus,.af-btn-client[aria-disabled=true]:hover{background-color:var(--color-gray-300);border-color:#0000;color:var(--color-btn-disabled-text)}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Button/Button.scss%23sass","../../src/common/common.scss","../../src/Button/Button.scss"],"names":[],"mappings":"AAEA,eAME,kBAAA,CAMA,wBAAA,CARA,QAAA,CACA,iBAAA,CAMA,UAAA,CAMA,cAAA,CAhBA,YAAA,CAQA,4CCTuB,CDUvB,eAAA,CAFA,QAAA,CADA,sBAAA,CEPF,iBAAA,CFGE,oBAAA,CAUA,uBAAA,CACA,iFAAA,CAEA,iCEDF,CFIE,qBAEE,wBCRW,CDOX,UEDJ,CFKE,2CAGE,wBAAA,CADA,UAAA,CAEA,YEJJ,CFOE,6BACE,sBAAA,CACA,kBELJ,CFQE,mBACE,cENJ,CFSE,sBAME,wBAAA,CADA,aAAA,CADA,UAAA,CAFA,eAAA,CADA,cAAA,CAEA,SEJJ,CFSI,4BAEE,wBAAA,CADA,aENN,CFUI,yDAGE,wBAAA,CADA,aERN,CFaE,iCACE,wBEXJ,CFaI,uCACE,wBEXN,CFcI,uCACE,wBEZN,CFgBE,yBAEE,qBCnDoB,CDkDpB,aEbJ,CFgBI,+BAEE,wBAAA,CADA,aEbN,CFiBI,+DAGE,wBAAA,CADA,aEfN,CFoBE,0BAEE,qBClFU,CDmFV,kCAAA,CAFA,aEhBJ,CFoBI,iGAIE,qBAAA,CACA,kCAAA,CAFA,aElBN,CFuBI,iCACE,wBErBN,CFyBE,gCAEE,qBAAA,CACA,kCAAA,CAFA,aErBJ,CFyBI,mHAIE,qBAAA,CACA,kCAAA,CAFA,aEvBN,CF4BI,uCACE,wBE1BN,CF8BE,wBAEE,kBAAA,CADA,YAAA,CAEA,sBAAA,CACA,aE5BJ,CF+BE,2DAGE,wBAAA,CACA,eAAA,CAFA,UAAA,CAGA,kBE9BJ,CFgCI,8IAIE,wBCjHW,CD+GX,kBAAA,CACA,UE9BN","file":"Button.css","sourcesContent":["@use \"../common/common\" as common;\n\n.af-btn-client {\n display: flex;\n min-height: 3.5rem;\n padding: 0.8rem 1.2rem;\n border: 0;\n border-radius: 8px;\n align-items: center;\n justify-content: center;\n gap: 1rem;\n font-family: common.$font-family-base;\n font-weight: 600;\n color: common.$color-white;\n background-color: common.$color-axa;\n transition-duration: common.$transition-duration;\n transition-property: width, height, border, color, background-color, outline,\n box-shadow;\n transition-timing-function: linear;\n cursor: pointer;\n\n &:hover {\n color: common.$color-white;\n background-color: common.$color-blue-1;\n }\n\n &:active,\n &:focus {\n color: common.$color-white;\n background-color: common.$color-btn-light;\n outline: none;\n }\n\n &:focus-visible {\n outline: 2px solid common.$color-blue-3;\n outline-offset: 3px;\n }\n\n & > svg {\n aspect-ratio: 1;\n }\n\n &--ghost {\n min-width: auto;\n min-height: auto;\n padding: 0;\n gap: 0.25rem;\n color: common.$color-axa;\n background-color: transparent;\n\n &:hover {\n color: common.$color-blue-1;\n background-color: transparent;\n }\n\n &:focus,\n &:active {\n color: common.$color-btn-light;\n background-color: transparent;\n }\n }\n\n &--primary-business {\n background-color: common.$color-btn-business;\n\n &:hover {\n background-color: common.$color-btn-business-dark;\n }\n\n &:focus {\n background-color: common.$color-btn-business-light;\n }\n }\n\n &--tertiary {\n color: common.$color-axa;\n background-color: common.$color-btn-tertiary-bg;\n\n &:hover {\n color: common.$color-axa;\n background-color: common.$color-btn-tertiary-bg-darker;\n }\n\n &:focus,\n &:active {\n color: common.$color-axa;\n background-color: common.$color-btn-tertiary-bg-lighter;\n }\n }\n\n &--secondary {\n color: common.$color-axa;\n background-color: common.$color-white;\n box-shadow: 0 0 0 1px common.$color-axa inset;\n\n &:hover,\n &:focus,\n &:active {\n color: common.$color-blue-1;\n background-color: common.$color-white;\n box-shadow: 0 0 0 2px common.$color-blue-1 inset;\n }\n\n &:active {\n background-color: common.$color-blue-2;\n }\n }\n\n &--secondary-error {\n color: common.$color-red-700;\n background-color: common.$color-white;\n box-shadow: 0 0 0 1px common.$color-red-700 inset;\n\n &:hover,\n &:focus,\n &:active {\n color: common.$color-btn-error-text;\n background-color: common.$color-white;\n box-shadow: 0 0 0 2px common.$color-btn-error-text inset;\n }\n\n &:active {\n background-color: common.$color-btn-error-bg;\n }\n }\n\n &__wrapper {\n display: flex;\n align-items: center;\n justify-content: center;\n line-height: 1;\n }\n\n &:disabled,\n &[aria-disabled=\"true\"] {\n color: common.$color-btn-disabled-text;\n background-color: common.$color-gray-300;\n box-shadow: none;\n cursor: not-allowed;\n\n &:hover,\n &:focus {\n border-color: transparent;\n color: common.$color-btn-disabled-text;\n background-color: common.$color-gray-300;\n }\n }\n}\n","@import \"./mixins\";\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-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","@use \"../common/common\" as common;\n\n.af-btn-client {\n display: flex;\n min-height: 3.5rem;\n padding: 0.8rem 1.2rem;\n border: 0;\n border-radius: 8px;\n align-items: center;\n justify-content: center;\n gap: 1rem;\n font-family: common.$font-family-base;\n font-weight: 600;\n color: common.$color-white;\n background-color: common.$color-axa;\n transition-duration: common.$transition-duration;\n transition-property: width, height, border, color, background-color, outline,\n box-shadow;\n transition-timing-function: linear;\n cursor: pointer;\n\n &:hover {\n color: common.$color-white;\n background-color: common.$color-blue-1;\n }\n\n &:active,\n &:focus {\n color: common.$color-white;\n background-color: common.$color-btn-light;\n outline: none;\n }\n\n &:focus-visible {\n outline: 2px solid common.$color-blue-3;\n outline-offset: 3px;\n }\n\n & > svg {\n aspect-ratio: 1;\n }\n\n &--ghost {\n min-width: auto;\n min-height: auto;\n padding: 0;\n gap: 0.25rem;\n color: common.$color-axa;\n background-color: transparent;\n\n &:hover {\n color: common.$color-blue-1;\n background-color: transparent;\n }\n\n &:focus,\n &:active {\n color: common.$color-btn-light;\n background-color: transparent;\n }\n }\n\n &--primary-business {\n background-color: common.$color-btn-business;\n\n &:hover {\n background-color: common.$color-btn-business-dark;\n }\n\n &:focus {\n background-color: common.$color-btn-business-light;\n }\n }\n\n &--tertiary {\n color: common.$color-axa;\n background-color: common.$color-btn-tertiary-bg;\n\n &:hover {\n color: common.$color-axa;\n background-color: common.$color-btn-tertiary-bg-darker;\n }\n\n &:focus,\n &:active {\n color: common.$color-axa;\n background-color: common.$color-btn-tertiary-bg-lighter;\n }\n }\n\n &--secondary {\n color: common.$color-axa;\n background-color: common.$color-white;\n box-shadow: 0 0 0 1px common.$color-axa inset;\n\n &:hover,\n &:focus,\n &:active {\n color: common.$color-blue-1;\n background-color: common.$color-white;\n box-shadow: 0 0 0 2px common.$color-blue-1 inset;\n }\n\n &:active {\n background-color: common.$color-blue-2;\n }\n }\n\n &--secondary-error {\n color: common.$color-red-700;\n background-color: common.$color-white;\n box-shadow: 0 0 0 1px common.$color-red-700 inset;\n\n &:hover,\n &:focus,\n &:active {\n color: common.$color-btn-error-text;\n background-color: common.$color-white;\n box-shadow: 0 0 0 2px common.$color-btn-error-text inset;\n }\n\n &:active {\n background-color: common.$color-btn-error-bg;\n }\n }\n\n &__wrapper {\n display: flex;\n align-items: center;\n justify-content: center;\n line-height: 1;\n }\n\n &:disabled,\n &[aria-disabled=\"true\"] {\n color: common.$color-btn-disabled-text;\n background-color: common.$color-gray-300;\n box-shadow: none;\n cursor: not-allowed;\n\n &:hover,\n &:focus {\n border-color: transparent;\n color: common.$color-btn-disabled-text;\n background-color: common.$color-gray-300;\n }\n }\n}\n"]}
1
+ {"version":3,"sources":["../../src/Button/Button.scss%23sass","../../src/Button/Button.scss"],"names":[],"mappings":"AAAA,eAME,kBAAA,CAMA,iCAAA,CARA,QAAA,CACA,iBAAA,CAMA,wBAAA,CAMA,cAAA,CAhBA,YAAA,CAQA,mCAAA,CACA,eAAA,CAFA,QAAA,CADA,sBAAA,CALA,iBAAA,CACA,oBAAA,CAUA,8CAAA,CACA,iFAAA,CAEA,iCCCF,CDEE,qBAEE,oCAAA,CADA,wBCCJ,CDGE,2CAGE,uCAAA,CADA,wBAAA,CAEA,YCFJ,CDKE,6BACE,qCAAA,CACA,kBCHJ,CDME,mBACE,cCJJ,CDOE,sBAME,wBAAA,CADA,sBAAA,CADA,UAAA,CAFA,eAAA,CADA,cAAA,CAEA,SCFJ,CDOI,4BAEE,wBAAA,CADA,yBCJN,CDQI,yDAGE,wBAAA,CADA,4BCNN,CDWE,iCACE,0CCTJ,CDWI,uCACE,+CCTN,CDYI,uCACE,gDCVN,CDcE,yBAEE,6CAAA,CADA,sBCXJ,CDcI,+BAEE,oDAAA,CADA,sBCXN,CDeI,+DAGE,qDAAA,CADA,sBCbN,CDkBE,0BAEE,mCAAA,CACA,2CAAA,CAFA,sBCdJ,CDkBI,iGAIE,mCAAA,CACA,8CAAA,CAFA,yBChBN,CDqBI,iCACE,oCCnBN,CDuBE,gCAEE,mCAAA,CACA,+CAAA,CAFA,0BCnBJ,CDuBI,mHAIE,mCAAA,CACA,sDAAA,CAFA,iCCrBN,CD0BI,uCACE,0CCxBN,CD4BE,wBAEE,kBAAA,CADA,YAAA,CAEA,sBAAA,CACA,aC1BJ,CD6BE,2DAGE,sCAAA,CACA,eAAA,CAFA,oCAAA,CAGA,kBC5BJ,CD8BI,8IAIE,sCAAA,CAFA,kBAAA,CACA,oCC5BN","file":"Button.css","sourcesContent":[".af-btn-client {\n display: flex;\n min-height: 3.5rem;\n padding: 0.8rem 1.2rem;\n border: 0;\n border-radius: 8px;\n align-items: center;\n justify-content: center;\n gap: 1rem;\n font-family: var(--font-family-base);\n font-weight: 600;\n color: var(--color-white);\n background-color: var(--color-axa);\n transition-duration: var(--transition-duration);\n transition-property: width, height, border, color, background-color, outline,\n box-shadow;\n transition-timing-function: linear;\n cursor: pointer;\n\n &:hover {\n color: var(--color-white);\n background-color: var(--color-blue-1);\n }\n\n &:active,\n &:focus {\n color: var(--color-white);\n background-color: var(--color-btn-light);\n outline: none;\n }\n\n &:focus-visible {\n outline: 2px solid var(--color-blue-3);\n outline-offset: 3px;\n }\n\n & > svg {\n aspect-ratio: 1;\n }\n\n &--ghost {\n min-width: auto;\n min-height: auto;\n padding: 0;\n gap: 0.25rem;\n color: var(--color-axa);\n background-color: transparent;\n\n &:hover {\n color: var(--color-blue-1);\n background-color: transparent;\n }\n\n &:focus,\n &:active {\n color: var(--color-btn-light);\n background-color: transparent;\n }\n }\n\n &--primary-business {\n background-color: var(--color-btn-business);\n\n &:hover {\n background-color: var(--color-btn-business-dark);\n }\n\n &:focus {\n background-color: var(--color-btn-business-light);\n }\n }\n\n &--tertiary {\n color: var(--color-axa);\n background-color: var(--color-btn-tertiary-bg);\n\n &:hover {\n color: var(--color-axa);\n background-color: var(--color-btn-tertiary-bg-darker);\n }\n\n &:focus,\n &:active {\n color: var(--color-axa);\n background-color: var(--color-btn-tertiary-bg-lighter);\n }\n }\n\n &--secondary {\n color: var(--color-axa);\n background-color: var(--color-white);\n box-shadow: 0 0 0 1px var(--color-axa) inset;\n\n &:hover,\n &:focus,\n &:active {\n color: var(--color-blue-1);\n background-color: var(--color-white);\n box-shadow: 0 0 0 2px var(--color-blue-1) inset;\n }\n\n &:active {\n background-color: var(--color-blue-2);\n }\n }\n\n &--secondary-error {\n color: var(--color-red-700);\n background-color: var(--color-white);\n box-shadow: 0 0 0 1px var(--color-red-700) inset;\n\n &:hover,\n &:focus,\n &:active {\n color: var(--color-btn-error-text);\n background-color: var(--color-white);\n box-shadow: 0 0 0 2px var(--color-btn-error-text) inset;\n }\n\n &:active {\n background-color: var(--color-btn-error-bg);\n }\n }\n\n &__wrapper {\n display: flex;\n align-items: center;\n justify-content: center;\n line-height: 1;\n }\n\n &:disabled,\n &[aria-disabled=\"true\"] {\n color: var(--color-btn-disabled-text);\n background-color: var(--color-gray-300);\n box-shadow: none;\n cursor: not-allowed;\n\n &:hover,\n &:focus {\n border-color: transparent;\n color: var(--color-btn-disabled-text);\n background-color: var(--color-gray-300);\n }\n }\n}\n",".af-btn-client {\n display: flex;\n min-height: 3.5rem;\n padding: 0.8rem 1.2rem;\n border: 0;\n border-radius: 8px;\n align-items: center;\n justify-content: center;\n gap: 1rem;\n font-family: var(--font-family-base);\n font-weight: 600;\n color: var(--color-white);\n background-color: var(--color-axa);\n transition-duration: var(--transition-duration);\n transition-property: width, height, border, color, background-color, outline,\n box-shadow;\n transition-timing-function: linear;\n cursor: pointer;\n\n &:hover {\n color: var(--color-white);\n background-color: var(--color-blue-1);\n }\n\n &:active,\n &:focus {\n color: var(--color-white);\n background-color: var(--color-btn-light);\n outline: none;\n }\n\n &:focus-visible {\n outline: 2px solid var(--color-blue-3);\n outline-offset: 3px;\n }\n\n & > svg {\n aspect-ratio: 1;\n }\n\n &--ghost {\n min-width: auto;\n min-height: auto;\n padding: 0;\n gap: 0.25rem;\n color: var(--color-axa);\n background-color: transparent;\n\n &:hover {\n color: var(--color-blue-1);\n background-color: transparent;\n }\n\n &:focus,\n &:active {\n color: var(--color-btn-light);\n background-color: transparent;\n }\n }\n\n &--primary-business {\n background-color: var(--color-btn-business);\n\n &:hover {\n background-color: var(--color-btn-business-dark);\n }\n\n &:focus {\n background-color: var(--color-btn-business-light);\n }\n }\n\n &--tertiary {\n color: var(--color-axa);\n background-color: var(--color-btn-tertiary-bg);\n\n &:hover {\n color: var(--color-axa);\n background-color: var(--color-btn-tertiary-bg-darker);\n }\n\n &:focus,\n &:active {\n color: var(--color-axa);\n background-color: var(--color-btn-tertiary-bg-lighter);\n }\n }\n\n &--secondary {\n color: var(--color-axa);\n background-color: var(--color-white);\n box-shadow: 0 0 0 1px var(--color-axa) inset;\n\n &:hover,\n &:focus,\n &:active {\n color: var(--color-blue-1);\n background-color: var(--color-white);\n box-shadow: 0 0 0 2px var(--color-blue-1) inset;\n }\n\n &:active {\n background-color: var(--color-blue-2);\n }\n }\n\n &--secondary-error {\n color: var(--color-red-700);\n background-color: var(--color-white);\n box-shadow: 0 0 0 1px var(--color-red-700) inset;\n\n &:hover,\n &:focus,\n &:active {\n color: var(--color-btn-error-text);\n background-color: var(--color-white);\n box-shadow: 0 0 0 2px var(--color-btn-error-text) inset;\n }\n\n &:active {\n background-color: var(--color-btn-error-bg);\n }\n }\n\n &__wrapper {\n display: flex;\n align-items: center;\n justify-content: center;\n line-height: 1;\n }\n\n &:disabled,\n &[aria-disabled=\"true\"] {\n color: var(--color-btn-disabled-text);\n background-color: var(--color-gray-300);\n box-shadow: none;\n cursor: not-allowed;\n\n &:hover,\n &:focus {\n border-color: transparent;\n color: var(--color-btn-disabled-text);\n background-color: var(--color-gray-300);\n }\n }\n}\n"]}
@@ -1,5 +1,3 @@
1
- @use "../common/common" as common;
2
-
3
1
  .af-btn-client {
4
2
  display: flex;
5
3
  min-height: 3.5rem;
@@ -9,30 +7,30 @@
9
7
  align-items: center;
10
8
  justify-content: center;
11
9
  gap: 1rem;
12
- font-family: common.$font-family-base;
10
+ font-family: var(--font-family-base);
13
11
  font-weight: 600;
14
- color: common.$color-white;
15
- background-color: common.$color-axa;
16
- transition-duration: common.$transition-duration;
12
+ color: var(--color-white);
13
+ background-color: var(--color-axa);
14
+ transition-duration: var(--transition-duration);
17
15
  transition-property: width, height, border, color, background-color, outline,
18
16
  box-shadow;
19
17
  transition-timing-function: linear;
20
18
  cursor: pointer;
21
19
 
22
20
  &:hover {
23
- color: common.$color-white;
24
- background-color: common.$color-blue-1;
21
+ color: var(--color-white);
22
+ background-color: var(--color-blue-1);
25
23
  }
26
24
 
27
25
  &:active,
28
26
  &:focus {
29
- color: common.$color-white;
30
- background-color: common.$color-btn-light;
27
+ color: var(--color-white);
28
+ background-color: var(--color-btn-light);
31
29
  outline: none;
32
30
  }
33
31
 
34
32
  &:focus-visible {
35
- outline: 2px solid common.$color-blue-3;
33
+ outline: 2px solid var(--color-blue-3);
36
34
  outline-offset: 3px;
37
35
  }
38
36
 
@@ -45,82 +43,82 @@
45
43
  min-height: auto;
46
44
  padding: 0;
47
45
  gap: 0.25rem;
48
- color: common.$color-axa;
46
+ color: var(--color-axa);
49
47
  background-color: transparent;
50
48
 
51
49
  &:hover {
52
- color: common.$color-blue-1;
50
+ color: var(--color-blue-1);
53
51
  background-color: transparent;
54
52
  }
55
53
 
56
54
  &:focus,
57
55
  &:active {
58
- color: common.$color-btn-light;
56
+ color: var(--color-btn-light);
59
57
  background-color: transparent;
60
58
  }
61
59
  }
62
60
 
63
61
  &--primary-business {
64
- background-color: common.$color-btn-business;
62
+ background-color: var(--color-btn-business);
65
63
 
66
64
  &:hover {
67
- background-color: common.$color-btn-business-dark;
65
+ background-color: var(--color-btn-business-dark);
68
66
  }
69
67
 
70
68
  &:focus {
71
- background-color: common.$color-btn-business-light;
69
+ background-color: var(--color-btn-business-light);
72
70
  }
73
71
  }
74
72
 
75
73
  &--tertiary {
76
- color: common.$color-axa;
77
- background-color: common.$color-btn-tertiary-bg;
74
+ color: var(--color-axa);
75
+ background-color: var(--color-btn-tertiary-bg);
78
76
 
79
77
  &:hover {
80
- color: common.$color-axa;
81
- background-color: common.$color-btn-tertiary-bg-darker;
78
+ color: var(--color-axa);
79
+ background-color: var(--color-btn-tertiary-bg-darker);
82
80
  }
83
81
 
84
82
  &:focus,
85
83
  &:active {
86
- color: common.$color-axa;
87
- background-color: common.$color-btn-tertiary-bg-lighter;
84
+ color: var(--color-axa);
85
+ background-color: var(--color-btn-tertiary-bg-lighter);
88
86
  }
89
87
  }
90
88
 
91
89
  &--secondary {
92
- color: common.$color-axa;
93
- background-color: common.$color-white;
94
- box-shadow: 0 0 0 1px common.$color-axa inset;
90
+ color: var(--color-axa);
91
+ background-color: var(--color-white);
92
+ box-shadow: 0 0 0 1px var(--color-axa) inset;
95
93
 
96
94
  &:hover,
97
95
  &:focus,
98
96
  &:active {
99
- color: common.$color-blue-1;
100
- background-color: common.$color-white;
101
- box-shadow: 0 0 0 2px common.$color-blue-1 inset;
97
+ color: var(--color-blue-1);
98
+ background-color: var(--color-white);
99
+ box-shadow: 0 0 0 2px var(--color-blue-1) inset;
102
100
  }
103
101
 
104
102
  &:active {
105
- background-color: common.$color-blue-2;
103
+ background-color: var(--color-blue-2);
106
104
  }
107
105
  }
108
106
 
109
107
  &--secondary-error {
110
- color: common.$color-red-700;
111
- background-color: common.$color-white;
112
- box-shadow: 0 0 0 1px common.$color-red-700 inset;
108
+ color: var(--color-red-700);
109
+ background-color: var(--color-white);
110
+ box-shadow: 0 0 0 1px var(--color-red-700) inset;
113
111
 
114
112
  &:hover,
115
113
  &:focus,
116
114
  &:active {
117
- color: common.$color-btn-error-text;
118
- background-color: common.$color-white;
119
- box-shadow: 0 0 0 2px common.$color-btn-error-text inset;
115
+ color: var(--color-btn-error-text);
116
+ background-color: var(--color-white);
117
+ box-shadow: 0 0 0 2px var(--color-btn-error-text) inset;
120
118
  }
121
119
 
122
120
  &:active {
123
- background-color: common.$color-btn-error-bg;
121
+ background-color: var(--color-btn-error-bg);
124
122
  }
125
123
  }
126
124
 
@@ -133,16 +131,16 @@
133
131
 
134
132
  &:disabled,
135
133
  &[aria-disabled="true"] {
136
- color: common.$color-btn-disabled-text;
137
- background-color: common.$color-gray-300;
134
+ color: var(--color-btn-disabled-text);
135
+ background-color: var(--color-gray-300);
138
136
  box-shadow: none;
139
137
  cursor: not-allowed;
140
138
 
141
139
  &:hover,
142
140
  &:focus {
143
141
  border-color: transparent;
144
- color: common.$color-btn-disabled-text;
145
- background-color: common.$color-gray-300;
142
+ color: var(--color-btn-disabled-text);
143
+ background-color: var(--color-gray-300);
146
144
  }
147
145
  }
148
146
  }
@@ -1 +1 @@
1
- *,:after,:before{box-sizing:border-box}html{font-family:sans-serif;line-height:1.15;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;-webkit-tap-highlight-color:transparent}article,aside,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}body{background-color:#fff;color:#333;font-family:Source Sans Pro,Arial,sans-serif;font-size:1rem;font-weight:400;line-height:1.5;margin:0;text-align:left}[tabindex="-1"]:focus{outline:0!important}hr{box-sizing:initial;height:0;overflow:visible}h1,h2,h3,h4,h5,h6{margin-bottom:.5rem;margin-top:0}p{margin-bottom:1rem;margin-top:0}abbr[data-original-title],abbr[title]{border-bottom:0;cursor:help;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none}address{font-style:normal;line-height:inherit}address,dl,ol,ul{margin-bottom:1rem}dl,ol,ul{margin-top:0}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-left:0}blockquote{margin:0 0 1rem}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}a{background-color:initial;color:#00008f;text-decoration:none}a:hover{color:#000043;text-decoration:underline}a:not([href],[tabindex]),a:not([href],[tabindex]):focus,a:not([href],[tabindex]):hover{color:inherit;text-decoration:none}a:not([href],[tabindex]):focus{outline:0}code,kbd,pre,samp{font-family:SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}pre{margin-bottom:1rem;margin-top:0;overflow:auto}figure{margin:0 0 1rem}img{border-style:none}img,svg{vertical-align:middle}svg{overflow:hidden}table{border-collapse:collapse}caption{caption-side:bottom;color:#6c757d;padding-bottom:.5rem;padding-top:.5rem;text-align:left}th{text-align:inherit}button{border-radius:0}button,input,optgroup,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit;margin:0}button,input{overflow:visible}button,select{text-transform:none}select{word-wrap:normal}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;appearance:button}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled){cursor:pointer}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=date],input[type=datetime-local],input[type=month],input[type=time]{-webkit-appearance:listbox;appearance:listbox}textarea{overflow:auto;resize:vertical}fieldset{border:0;margin:0;min-width:0;padding:0}legend{color:inherit;display:block;font-size:1.5rem;line-height:inherit;margin-bottom:.5rem;max-width:100%;padding:0;white-space:normal;width:100%}progress{vertical-align:initial}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:none;appearance:none;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none;appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;appearance:button;font:inherit}output{display:inline-block}summary{cursor:pointer;display:list-item}template{display:none}[hidden]{display:none!important}.af-card{background-color:#fff;border:1px solid #e9ecf2;border-radius:.5rem;box-shadow:0 .25rem .5rem 0 #10184114;font-family:Source Sans Pro,arial,sans-serif;font-size:1rem;font-weight:400;line-height:1.25rem;padding:1rem}.af-card>:last-child{margin-block-end:0}.af-card:focus-visible{border:2px solid #36f;outline:none}.af-card--elevation-2:not(:focus){box-shadow:0 .25rem .5rem 0 #10184129}.af-card__title{color:#00008f;font-size:1.125rem;font-weight:600;line-height:1.4rem}.af-card--accordion{box-shadow:none;padding:0}button.af-card{cursor:pointer;text-align:initial}button.af-card:active{box-shadow:none}button.af-card:focus{outline:none}
1
+ *,:after,:before{box-sizing:border-box}html{font-family:sans-serif;line-height:1.15;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;-webkit-tap-highlight-color:transparent}article,aside,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}body{background-color:#fff;color:#333;font-family:Source Sans Pro,Arial,sans-serif;font-size:1rem;font-weight:400;line-height:1.5;margin:0;text-align:left}[tabindex="-1"]:focus{outline:0!important}hr{box-sizing:initial;height:0;overflow:visible}h1,h2,h3,h4,h5,h6{margin-bottom:.5rem;margin-top:0}p{margin-bottom:1rem;margin-top:0}abbr[data-original-title],abbr[title]{border-bottom:0;cursor:help;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none}address{font-style:normal;line-height:inherit}address,dl,ol,ul{margin-bottom:1rem}dl,ol,ul{margin-top:0}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-left:0}blockquote{margin:0 0 1rem}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}a{background-color:initial;color:#00008f;text-decoration:none}a:hover{color:#000043;text-decoration:underline}a:not([href],[tabindex]),a:not([href],[tabindex]):focus,a:not([href],[tabindex]):hover{color:inherit;text-decoration:none}a:not([href],[tabindex]):focus{outline:0}code,kbd,pre,samp{font-family:SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}pre{margin-bottom:1rem;margin-top:0;overflow:auto}figure{margin:0 0 1rem}img{border-style:none}img,svg{vertical-align:middle}svg{overflow:hidden}table{border-collapse:collapse}caption{caption-side:bottom;color:#6c757d;padding-bottom:.5rem;padding-top:.5rem;text-align:left}th{text-align:inherit}button{border-radius:0}button,input,optgroup,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit;margin:0}button,input{overflow:visible}button,select{text-transform:none}select{word-wrap:normal}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;appearance:button}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled){cursor:pointer}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=date],input[type=datetime-local],input[type=month],input[type=time]{-webkit-appearance:listbox;appearance:listbox}textarea{overflow:auto;resize:vertical}fieldset{border:0;margin:0;min-width:0;padding:0}legend{color:inherit;display:block;font-size:1.5rem;line-height:inherit;margin-bottom:.5rem;max-width:100%;padding:0;white-space:normal;width:100%}progress{vertical-align:initial}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:none;appearance:none;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none;appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;appearance:button;font:inherit}output{display:inline-block}summary{cursor:pointer;display:list-item}template{display:none}[hidden]{display:none!important}.af-card{background-color:var(--color-white);border:1px solid var(--color-gray-300);border-radius:.5rem;box-shadow:0 .25rem .5rem 0 #10184114;font-family:var(--font-family-base);font-size:1rem;font-weight:400;line-height:1.25rem;padding:1rem}.af-card>:last-child{margin-block-end:0}.af-card:focus-visible{border:2px solid var(--color-focus);outline:none}.af-card--elevation-2:not(:focus){box-shadow:0 .25rem .5rem 0 #10184129}.af-card__title{color:var(--color-axa);font-size:1.125rem;font-weight:600;line-height:1.4rem}.af-card--accordion{box-shadow:none;padding:0}button.af-card{cursor:pointer;text-align:initial}button.af-card:active{box-shadow:none}button.af-card:focus{outline:none}