@axa-fr/design-system-look-and-feel-css 1.0.5-ci.12 → 1.0.5-ci.120

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 (93) hide show
  1. package/dist/Accordion/Accordion.css +1 -1
  2. package/dist/Accordion/Accordion.css.map +1 -1
  3. package/dist/AccordionCore/AccordionCore.css +1 -1
  4. package/dist/AccordionCore/AccordionCore.css.map +1 -1
  5. package/dist/Alert/Alert.css +1 -1
  6. package/dist/Alert/Alert.css.map +1 -1
  7. package/dist/Alert/Alert.scss +6 -6
  8. package/dist/Card/Card.css +1 -1
  9. package/dist/Card/Card.css.map +1 -1
  10. package/dist/Form/Checkbox/Checkbox.css +1 -1
  11. package/dist/Form/Checkbox/Checkbox.css.map +1 -1
  12. package/dist/Form/Checkbox/Checkbox.scss +16 -5
  13. package/dist/Form/FileUpload/FileUpload.css +1 -1
  14. package/dist/Form/FileUpload/FileUpload.css.map +1 -1
  15. package/dist/Form/FileUpload/FileUpload.scss +9 -4
  16. package/dist/Form/InputError/InputError.css +1 -1
  17. package/dist/Form/InputError/InputError.css.map +1 -1
  18. package/dist/Form/InputError/InputError.scss +1 -1
  19. package/dist/Form/Radio/Radio.css +1 -1
  20. package/dist/Form/Radio/Radio.css.map +1 -1
  21. package/dist/Form/Radio/Radio.scss +17 -6
  22. package/dist/Form/Select/Select.css +1 -1
  23. package/dist/Form/Select/Select.css.map +1 -1
  24. package/dist/Form/Select/Select.scss +57 -88
  25. package/dist/Form/Text/Text.css +1 -1
  26. package/dist/Form/Text/Text.css.map +1 -1
  27. package/dist/Form/Text/Text.scss +64 -13
  28. package/dist/Form/TextArea/TextArea.css +1 -1
  29. package/dist/Form/TextArea/TextArea.css.map +1 -1
  30. package/dist/Form/TextArea/TextArea.scss +5 -1
  31. package/dist/Grid/Grid-demo-example-form.css +1 -1
  32. package/dist/Grid/Grid-demo-example-form.css.map +1 -1
  33. package/dist/Grid/Grid-demo-example-form.scss +20 -0
  34. package/dist/Grid/Grid-demo-wireframe.css +1 -1
  35. package/dist/Grid/Grid-demo-wireframe.css.map +1 -1
  36. package/dist/IconBg/IconBg.css +1 -1
  37. package/dist/IconBg/IconBg.css.map +1 -1
  38. package/dist/Layout/Footer/Footer.css +1 -1
  39. package/dist/Layout/Footer/Footer.css.map +1 -1
  40. package/dist/Layout/Header/BurgerMenu/BurgerMenu.css +1 -0
  41. package/dist/Layout/Header/BurgerMenu/BurgerMenu.css.map +1 -0
  42. package/dist/Layout/Header/BurgerMenu/BurgerMenu.scss +48 -0
  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 +70 -62
  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 +35 -29
  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 -7
  52. package/dist/Link/Link.css +1 -1
  53. package/dist/Link/Link.css.map +1 -1
  54. package/dist/List/ClickList/ClickList.css +1 -1
  55. package/dist/List/ClickList/ClickList.css.map +1 -1
  56. package/dist/Modal/Modal.css +1 -1
  57. package/dist/Modal/Modal.css.map +1 -1
  58. package/dist/Modal/Modal.scss +62 -89
  59. package/dist/Stepper/Stepper.css +1 -1
  60. package/dist/Stepper/Stepper.css.map +1 -1
  61. package/dist/Stepper/Stepper.scss +4 -3
  62. package/dist/Title/Title.css +1 -1
  63. package/dist/Title/Title.css.map +1 -1
  64. package/dist/common/common.scss +100 -2
  65. package/dist/common/reboot.css +1 -1
  66. package/dist/common/reboot.css.map +1 -1
  67. package/dist/common/tokens.css +1 -1
  68. package/dist/common/tokens.css.map +1 -1
  69. package/dist/common/tokens.scss +2 -0
  70. package/dist/look-and-feel.css +1 -1
  71. package/dist/look-and-feel.css.map +1 -1
  72. package/dist/look-and-feel.scss +2 -5
  73. package/package.json +27 -22
  74. package/dist/Button/Button.css +0 -1
  75. package/dist/Button/Button.css.map +0 -1
  76. package/dist/Button/Button.scss +0 -150
  77. package/dist/Grid/DebugGrid.css +0 -1
  78. package/dist/Grid/DebugGrid.css.map +0 -1
  79. package/dist/Grid/DebugGrid.scss +0 -92
  80. package/dist/Grid/Grid.css +0 -1
  81. package/dist/Grid/Grid.css.map +0 -1
  82. package/dist/Grid/Grid.scss +0 -71
  83. package/dist/Loader/Loader.css +0 -1
  84. package/dist/Loader/Loader.css.map +0 -1
  85. package/dist/Loader/Loader.scss +0 -39
  86. package/dist/common/glyphicons/icons.eot +0 -0
  87. package/dist/common/glyphicons/icons.svg +0 -918
  88. package/dist/common/glyphicons/icons.ttf +0 -0
  89. package/dist/common/glyphicons/icons.woff +0 -0
  90. package/dist/common/icons.css +0 -1
  91. package/dist/common/icons.css.map +0 -1
  92. package/dist/common/icons.scss +0 -1236
  93. /package/{dist/common → files}/assets/logo-axa.svg +0 -0
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Layout/Header/Header.scss%23sass","../../../src/Layout/Header/Header.scss"],"names":[],"mappings":"AAEA,WAIE,mCAAA,CAHA,eAAA,CAEA,KAAA,CCHF,WAGA,CDIA,qBAQE,kBAAA,CAFA,6CAAA,CADA,qCAAA,CAQA,sBAAA,CAZA,YAAA,CAMA,kBAAA,CAGA,yCAAA,CACA,iBAAA,CACA,eAAA,CATA,WAAA,CAMA,6BAAA,CALA,cAAA,CCJF,UAYA,CDGE,oCACE,WAAA,CAAA,cCDJ,CDGI,wCACE,YCDN,CDMA,SAGE,iBAAA,CCLF,WAAA,CDGE,UCDF,CDMA,yBACE,YCHF,CDMA,sBCAA,kBAAA,CDCE,YAAA,CAEA,kBAAA,CAEA,qBAAA,CCPF,0BAIA,CDMA,yCACE,qBCAA,qCAAA,CDEE,WAAA,CCHJ,iBAAA,CAFA,UAIE,CDKE,wCACE,aCHJ,CDOA,SAEE,WAAA,CADA,UCJF,CDQA,qBAIE,kBAAA,CAHA,YAAA,CAEA,kBAAA,CCLF,UAAA,CAHA,WAIA,CDQE,yBACE,aCNJ,CDUA,sBAEE,qBAAA,CADA,QCPF,CACF","file":"Header.css","sourcesContent":["@use \"../../common/common\" as common;\n\n.af-header {\n position: sticky;\n z-index: 100;\n top: 0;\n background-color: var(--color-white);\n}\n\n.af-header-container {\n display: flex;\n width: 100%;\n height: 72px;\n padding: 0 1rem;\n border-top: 2px solid var(--color-axa);\n border-bottom: 1px solid var(--color-gray-300);\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n font-family: var(--font-family-sans-serif);\n font-size: 1.25rem;\n font-weight: 600;\n color: var(--color-axa);\n\n & .af-btn-client {\n min-width: initial;\n\n & > svg {\n display: none;\n }\n }\n}\n\n.af-logo {\n width: 40px;\n height: 40px;\n align-self: center;\n}\n\n.af-header-left-item > nav {\n display: none;\n}\n\n.af-header-right-item {\n display: flex;\n margin: 0 var(--spacing-u1);\n flex-direction: row;\n align-items: center;\n gap: var(--spacing-u1);\n}\n\n@media only screen and (width >= #{common.$breakpoint-md}) {\n .af-header-container {\n width: auto;\n height: 80px;\n padding: 0 3.75rem;\n border-top: 2px solid var(--color-axa);\n\n & .af-btn-client > svg {\n display: block;\n }\n }\n\n .af-logo {\n width: 56px;\n height: 56px;\n }\n\n .af-header-left-item {\n display: flex;\n height: 5rem;\n flex-direction: row;\n align-items: center;\n gap: 1.5rem;\n\n & > nav {\n display: block;\n }\n }\n\n .af-header-right-item {\n margin: 0;\n gap: var(--spacing-u2);\n }\n}\n","@use \"../../common/common\" as common;\n\n.af-header {\n position: sticky;\n z-index: 100;\n top: 0;\n background-color: var(--color-white);\n}\n\n.af-header-container {\n display: flex;\n width: 100%;\n height: 72px;\n padding: 0 1rem;\n border-top: 2px solid var(--color-axa);\n border-bottom: 1px solid var(--color-gray-300);\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n font-family: var(--font-family-sans-serif);\n font-size: 1.25rem;\n font-weight: 600;\n color: var(--color-axa);\n\n & .af-btn-client {\n min-width: initial;\n\n & > svg {\n display: none;\n }\n }\n}\n\n.af-logo {\n width: 40px;\n height: 40px;\n align-self: center;\n}\n\n.af-header-left-item > nav {\n display: none;\n}\n\n.af-header-right-item {\n display: flex;\n margin: 0 var(--spacing-u1);\n flex-direction: row;\n align-items: center;\n gap: var(--spacing-u1);\n}\n\n@media only screen and (width >= #{common.$breakpoint-md}) {\n .af-header-container {\n width: auto;\n height: 80px;\n padding: 0 3.75rem;\n border-top: 2px solid var(--color-axa);\n\n & .af-btn-client > svg {\n display: block;\n }\n }\n\n .af-logo {\n width: 56px;\n height: 56px;\n }\n\n .af-header-left-item {\n display: flex;\n height: 5rem;\n flex-direction: row;\n align-items: center;\n gap: 1.5rem;\n\n & > nav {\n display: block;\n }\n }\n\n .af-header-right-item {\n margin: 0;\n gap: var(--spacing-u2);\n }\n}\n"]}
1
+ {"version":3,"sources":["../../../src/Layout/Header/Header.scss%23sass","../../../src/Layout/Header/Header.scss","../../../src/common/common.scss"],"names":[],"mappings":"AAEA,WAIE,mCAAA,CAHA,eAAA,CAEA,KAAA,CCHF,SAGA,CDGE,gCAQE,kBAAA,CAFA,6CAAA,CADA,qCAAA,CAQA,sBAAA,CAZA,YAAA,CAMA,kBAAA,CAGA,yCAAA,CACA,iBAAA,CACA,eAAA,CATA,WAAA,CAMA,6BAAA,CALA,iBAAA,CAFA,UCUJ,CCmLI,6BF/LF,gCAiBI,WAAA,CACA,cAAA,CAFA,UCEJ,CACF,CDEI,qDAIE,kBAAA,CAHA,YAAA,CAEA,kBAAA,CAEA,UAAA,CAHA,WCGN,CDEM,8DAEE,WAAA,CADA,UCCR,CCiKI,6BFnKE,8DAOI,iBAAA,CADA,WAAA,CADA,UCGR,CACF,CDEM,yDACE,aCAR,CCuJI,6BFnJI,yDACE,YCDR,CACF,CDKI,sDACE,YAAA,CAEA,kBAAA,CACA,qBAAA,CAFA,QCDN,CC4II,6BF7IA,sDAOI,YCFN,CACF,CDKI,+CACE,YCHN,CCoII,6BFlIA,+CAII,aCFN,CACF,CDOA,mBACE,YCJF,CC2HI,6BFpHA,wBAME,gCAAA,CCPJ,aAAA,CDII,OAAA,CAEA,UAAA,CCTN,cAAA,CACE,SAKA,CACF","file":"Header.css","sourcesContent":["@use \"../../common/common\" as common;\n\n.af-header {\n position: sticky;\n z-index: 2;\n top: 0;\n background-color: var(--color-white);\n\n & > .af-header-container {\n display: flex;\n width: auto;\n height: common.rem(80);\n padding: 0 3.75rem;\n border-top: 2px solid var(--color-axa);\n border-bottom: 1px solid var(--color-gray-300);\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n font-family: var(--font-family-sans-serif);\n font-size: 1.25rem;\n font-weight: 600;\n color: var(--color-axa);\n\n @include common.media-breakpoint-down(md) {\n width: 100%;\n height: 72px;\n padding: 0 1rem;\n }\n\n & > .af-header-left-item {\n display: flex;\n height: 5rem;\n flex-direction: row;\n align-items: center;\n gap: 1.5rem;\n\n & > .af-logo {\n width: 56px;\n height: 56px;\n\n @include common.media-breakpoint-down(md) {\n width: 40px;\n height: 40px;\n align-self: center;\n }\n }\n\n & > nav {\n display: block;\n }\n\n @include common.media-breakpoint-down(md) {\n & > nav {\n display: none;\n }\n }\n }\n\n & > .af-header-right-item {\n display: flex;\n margin: 0;\n flex-direction: row;\n gap: var(--spacing-u2);\n\n @include common.media-breakpoint-down(md) {\n display: none;\n }\n }\n\n & > .af-btn-client {\n display: none;\n\n @include common.media-breakpoint-down(md) {\n display: block;\n }\n }\n }\n}\n\n.af-header-overlay {\n display: none;\n\n @include common.media-breakpoint-down(md) {\n &.open {\n position: fixed;\n z-index: 1;\n inset: 0;\n display: block;\n opacity: 0.5;\n background: var(--color-gray-900);\n }\n }\n}\n","@use \"../../common/common\" as common;\n\n.af-header {\n position: sticky;\n z-index: 2;\n top: 0;\n background-color: var(--color-white);\n\n & > .af-header-container {\n display: flex;\n width: auto;\n height: common.rem(80);\n padding: 0 3.75rem;\n border-top: 2px solid var(--color-axa);\n border-bottom: 1px solid var(--color-gray-300);\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n font-family: var(--font-family-sans-serif);\n font-size: 1.25rem;\n font-weight: 600;\n color: var(--color-axa);\n\n @include common.media-breakpoint-down(md) {\n width: 100%;\n height: 72px;\n padding: 0 1rem;\n }\n\n & > .af-header-left-item {\n display: flex;\n height: 5rem;\n flex-direction: row;\n align-items: center;\n gap: 1.5rem;\n\n & > .af-logo {\n width: 56px;\n height: 56px;\n\n @include common.media-breakpoint-down(md) {\n width: 40px;\n height: 40px;\n align-self: center;\n }\n }\n\n & > nav {\n display: block;\n }\n\n @include common.media-breakpoint-down(md) {\n & > nav {\n display: none;\n }\n }\n }\n\n & > .af-header-right-item {\n display: flex;\n margin: 0;\n flex-direction: row;\n gap: var(--spacing-u2);\n\n @include common.media-breakpoint-down(md) {\n display: none;\n }\n }\n\n & > .af-btn-client {\n display: none;\n\n @include common.media-breakpoint-down(md) {\n display: block;\n }\n }\n }\n}\n\n.af-header-overlay {\n display: none;\n\n @include common.media-breakpoint-down(md) {\n &.open {\n position: fixed;\n z-index: 1;\n inset: 0;\n display: block;\n opacity: 0.5;\n background: var(--color-gray-900);\n }\n }\n}\n","@use \"sass:map\";\n@use \"sass:list\";\n\n@forward \"./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$radius-8: 8px !default;\n$radius-100: 100% !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// Grid 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\n// Define the minimum dimensions at which your layout will change,\n// adapting to different screen sizes, for use in media queries.\n\n$grid-breakpoints: (\n xs: $breakpoint-xs,\n sm: $breakpoint-sm,\n md: $breakpoint-md,\n lg: $breakpoint-lg,\n xl: $breakpoint-xl,\n);\n\n// Breakpoint viewport sizes and media queries.\n\n// Breakpoints are defined as a map of (name: minimum width), order from small to large:\n\n// (xs: 0, sm: 667px, md: 1023px, lg: 1279px, xl: 1599px)\n\n// The map defined in the `$grid-breakpoints` global variable is used as the `$breakpoints` argument by default.\n// Name of the next breakpoint, or null for the last breakpoint.\n\n// >> breakpoint-next(sm)\n// md\n// >> breakpoint-next(sm, (xs: 0, sm: 667px, md: 1023px, lg: 1279px, xl: 1599px))\n// md\n// >> breakpoint-next(sm, $breakpoint-names: (xs sm md lg xl))\n// md\n@function breakpoint-next(\n $name,\n $breakpoints: $grid-breakpoints,\n $breakpoint-names: map.keys($breakpoints)\n) {\n $n: list.index($breakpoint-names, $name);\n\n @return if(\n $n < list.length($breakpoint-names),\n list.nth($breakpoint-names, $n + 1),\n null\n );\n}\n\n// Minimum breakpoint width. Null for the smallest (first) breakpoint.\n\n// >> breakpoint-min(sm, (xs: 0, sm: 667px, md: 1023px, lg: 1279px, xl: 1599px))\n// 667px\n@function breakpoint-min($name, $breakpoints: $grid-breakpoints) {\n $min: map.get($breakpoints, $name);\n\n @return if($min != 0, $min, null);\n}\n\n// Maximum breakpoint width. Null for the largest (last) breakpoint.\n// The maximum value is calculated as the minimum of the next one less 0.02px\n// to work around the limitations of `min-` and `max-` prefixes and viewports with fractional widths.\n// See https://www.w3.org/TR/mediaqueries-4/#mq-min-max\n// Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.\n// See https://bugs.webkit.org/show_bug.cgi?id=178261\n\n// >> breakpoint-max(sm, (xs: 0, sm: 667px, md: 1023px, lg: 1279px, xl: 1599px))\n// 1022.98px\n@function breakpoint-max($name, $breakpoints: $grid-breakpoints) {\n $next: breakpoint-next($name, $breakpoints);\n\n @return if($next, breakpoint-min($next, $breakpoints) - 0.02px, null);\n}\n\n// Media of at least the minimum breakpoint width. No query for the smallest breakpoint.\n// Makes the @content apply to the given breakpoint and wider.\n@mixin media-breakpoint-up($name, $breakpoints: $grid-breakpoints) {\n $min: breakpoint-min($name, $breakpoints);\n\n @if $min {\n @media (min-width: $min) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n// Media of at most the maximum breakpoint width. No query for the largest breakpoint.\n// Makes the @content apply to the given breakpoint and narrower.\n@mixin media-breakpoint-down($name, $breakpoints: $grid-breakpoints) {\n $max: breakpoint-max($name, $breakpoints);\n\n @if $max {\n @media (max-width: $max) {\n @content;\n }\n } @else {\n @content;\n }\n}\n"]}
@@ -2,84 +2,92 @@
2
2
 
3
3
  .af-header {
4
4
  position: sticky;
5
- z-index: 100;
5
+ z-index: 2;
6
6
  top: 0;
7
7
  background-color: var(--color-white);
8
- }
9
-
10
- .af-header-container {
11
- display: flex;
12
- width: 100%;
13
- height: 72px;
14
- padding: 0 1rem;
15
- border-top: 2px solid var(--color-axa);
16
- border-bottom: 1px solid var(--color-gray-300);
17
- flex-direction: row;
18
- align-items: center;
19
- justify-content: space-between;
20
- font-family: var(--font-family-sans-serif);
21
- font-size: 1.25rem;
22
- font-weight: 600;
23
- color: var(--color-axa);
24
8
 
25
- & .af-btn-client {
26
- min-width: initial;
9
+ & > .af-header-container {
10
+ display: flex;
11
+ width: auto;
12
+ height: common.rem(80);
13
+ padding: 0 3.75rem;
14
+ border-top: 2px solid var(--color-axa);
15
+ border-bottom: 1px solid var(--color-gray-300);
16
+ flex-direction: row;
17
+ align-items: center;
18
+ justify-content: space-between;
19
+ font-family: var(--font-family-sans-serif);
20
+ font-size: 1.25rem;
21
+ font-weight: 600;
22
+ color: var(--color-axa);
27
23
 
28
- & > svg {
29
- display: none;
24
+ @include common.media-breakpoint-down(md) {
25
+ width: 100%;
26
+ height: 72px;
27
+ padding: 0 1rem;
30
28
  }
31
- }
32
- }
33
29
 
34
- .af-logo {
35
- width: 40px;
36
- height: 40px;
37
- align-self: center;
38
- }
30
+ & > .af-header-left-item {
31
+ display: flex;
32
+ height: 5rem;
33
+ flex-direction: row;
34
+ align-items: center;
35
+ gap: 1.5rem;
39
36
 
40
- .af-header-left-item > nav {
41
- display: none;
42
- }
37
+ & > .af-logo {
38
+ width: 56px;
39
+ height: 56px;
43
40
 
44
- .af-header-right-item {
45
- display: flex;
46
- margin: 0 var(--spacing-u1);
47
- flex-direction: row;
48
- align-items: center;
49
- gap: var(--spacing-u1);
50
- }
41
+ @include common.media-breakpoint-down(md) {
42
+ width: 40px;
43
+ height: 40px;
44
+ align-self: center;
45
+ }
46
+ }
51
47
 
52
- @media only screen and (width >= #{common.$breakpoint-md}) {
53
- .af-header-container {
54
- width: auto;
55
- height: 80px;
56
- padding: 0 3.75rem;
57
- border-top: 2px solid var(--color-axa);
48
+ & > nav {
49
+ display: block;
50
+ }
58
51
 
59
- & .af-btn-client > svg {
60
- display: block;
52
+ @include common.media-breakpoint-down(md) {
53
+ & > nav {
54
+ display: none;
55
+ }
56
+ }
61
57
  }
62
- }
63
58
 
64
- .af-logo {
65
- width: 56px;
66
- height: 56px;
67
- }
59
+ & > .af-header-right-item {
60
+ display: flex;
61
+ margin: 0;
62
+ flex-direction: row;
63
+ gap: var(--spacing-u2);
68
64
 
69
- .af-header-left-item {
70
- display: flex;
71
- height: 5rem;
72
- flex-direction: row;
73
- align-items: center;
74
- gap: 1.5rem;
65
+ @include common.media-breakpoint-down(md) {
66
+ display: none;
67
+ }
68
+ }
75
69
 
76
- & > nav {
77
- display: block;
70
+ & > .af-btn-client {
71
+ display: none;
72
+
73
+ @include common.media-breakpoint-down(md) {
74
+ display: block;
75
+ }
78
76
  }
79
77
  }
78
+ }
80
79
 
81
- .af-header-right-item {
82
- margin: 0;
83
- gap: var(--spacing-u2);
80
+ .af-header-overlay {
81
+ display: none;
82
+
83
+ @include common.media-breakpoint-down(md) {
84
+ &.open {
85
+ position: fixed;
86
+ z-index: 1;
87
+ inset: 0;
88
+ display: block;
89
+ opacity: 0.5;
90
+ background: var(--color-gray-900);
91
+ }
84
92
  }
85
93
  }
@@ -1 +1 @@
1
- .af-navbar-container{align-items:center;display:flex;flex-direction:row;gap:1.6rem;height:5rem;list-style-type:none;margin:0;padding:0}.af-navbar-item{cursor:pointer;height:100%}.af-navbar-item__link{box-sizing:border-box;color:var(--color-gray-900);display:inline-block;font-family:var(--font-family-base);font-size:1.125rem;font-weight:400;height:100%;line-height:1.4rem;min-width:8.4rem;padding:1.625rem 1.5rem;text-align:center;text-decoration:none}.af-navbar-item__link--active,.af-navbar-item__link:focus{border-bottom:4px solid var(--color-axa);color:var(--color-axa);font-weight:600;line-height:1.6rem;outline:none;text-decoration:none}.af-navbar-item__link:not(:focus,--active):hover{border-bottom:2px solid var(--color-gray-300);color:var(--color-gray-900);font-weight:400;line-height:1.4rem;text-decoration:none}
1
+ .af-navbar-container{align-items:center;display:flex;flex-direction:row;gap:1.6rem;height:5rem;list-style-type:none;margin:0;padding:0}.af-navbar-container .af-navbar-item{cursor:pointer;height:100%}.af-navbar-container .af-navbar-item__link{box-sizing:border-box;color:var(--color-gray-900);display:inline-block;font-family:var(--font-family-base);font-size:1.125rem;font-weight:400;height:100%;line-height:1.4rem;min-width:8.4rem;padding:1.625rem 1.5rem;text-align:center;text-decoration:none}.af-navbar-container .af-navbar-item__link>svg{display:none}.af-navbar-container .af-navbar-item__link--active,.af-navbar-container .af-navbar-item__link:focus{border-bottom:4px solid var(--color-axa);color:var(--color-axa);font-weight:600;line-height:1.6rem;outline:none;text-decoration:none}.af-navbar-container .af-navbar-item__link:not(:focus,--active):hover{border-bottom:2px solid var(--color-gray-300);color:var(--color-gray-900);font-weight:400;line-height:1.4rem;text-decoration:none}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/Layout/Header/NavBar/NavBar.scss%23sass","../../../../src/Layout/Header/NavBar/NavBar.scss"],"names":[],"mappings":"AAAA,qBAME,kBAAA,CALA,YAAA,CAIA,kBAAA,CAEA,UAAA,CALA,WAAA,CAMA,oBAAA,CALA,QAAA,CACA,SCKF,CDEA,gBAEE,cAAA,CADA,WCEF,CDCE,sBAEE,qBAAA,CAUA,2BAAA,CAXA,oBAAA,CAKA,mCAAA,CACA,kBAAA,CACA,eAAA,CAJA,WAAA,CAKA,kBAAA,CANA,gBAAA,CAEA,uBAAA,CAKA,iBAAA,CACA,oBCEJ,CDCI,0DAEE,wCAAA,CAIA,sBAAA,CAHA,eAAA,CACA,kBAAA,CAGA,YAAA,CAFA,oBCEN,CDGI,iDACE,6CAAA,CAIA,2BAAA,CAHA,eAAA,CACA,kBAAA,CACA,oBCAN","file":"NavBar.css","sourcesContent":[".af-navbar-container {\n display: flex;\n height: 5rem;\n margin: 0;\n padding: 0;\n flex-direction: row;\n align-items: center;\n gap: 1.6rem;\n list-style-type: none;\n}\n\n.af-navbar-item {\n height: 100%;\n cursor: pointer;\n\n &__link {\n display: inline-block;\n box-sizing: border-box;\n min-width: 8.4rem;\n height: 100%;\n padding: 1.625rem 1.5rem;\n font-family: var(--font-family-base);\n font-size: 1.125rem;\n font-weight: 400;\n line-height: 1.4rem;\n text-align: center;\n text-decoration: none;\n color: var(--color-gray-900);\n\n &:focus,\n &--active {\n border-bottom: 4px solid var(--color-axa);\n font-weight: 600;\n line-height: 1.6rem;\n text-decoration: none;\n color: var(--color-axa);\n outline: none;\n }\n\n &:not(:focus, --active):hover {\n border-bottom: 2px solid var(--color-gray-300);\n font-weight: 400;\n line-height: 1.4rem;\n text-decoration: none;\n color: var(--color-gray-900);\n }\n }\n}\n",".af-navbar-container {\n display: flex;\n height: 5rem;\n margin: 0;\n padding: 0;\n flex-direction: row;\n align-items: center;\n gap: 1.6rem;\n list-style-type: none;\n}\n\n.af-navbar-item {\n height: 100%;\n cursor: pointer;\n\n &__link {\n display: inline-block;\n box-sizing: border-box;\n min-width: 8.4rem;\n height: 100%;\n padding: 1.625rem 1.5rem;\n font-family: var(--font-family-base);\n font-size: 1.125rem;\n font-weight: 400;\n line-height: 1.4rem;\n text-align: center;\n text-decoration: none;\n color: var(--color-gray-900);\n\n &:focus,\n &--active {\n border-bottom: 4px solid var(--color-axa);\n font-weight: 600;\n line-height: 1.6rem;\n text-decoration: none;\n color: var(--color-axa);\n outline: none;\n }\n\n &:not(:focus, --active):hover {\n border-bottom: 2px solid var(--color-gray-300);\n font-weight: 400;\n line-height: 1.4rem;\n text-decoration: none;\n color: var(--color-gray-900);\n }\n }\n}\n"]}
1
+ {"version":3,"sources":["../../../../src/Layout/Header/NavBar/NavBar.scss%23sass","../../../../src/Layout/Header/NavBar/NavBar.scss"],"names":[],"mappings":"AAEA,qBAME,kBAAA,CALA,YAAA,CAIA,kBAAA,CAEA,UAAA,CCPF,WAAA,CDQE,oBAAA,CALA,QAAA,CACA,SCGF,CDGE,qCAEE,cAAA,CADA,WCAJ,CDGI,2CAEE,qBAAA,CAUA,2BAAA,CAXA,oBAAA,CAKA,mCAAA,CACA,kBAAA,CACA,eAAA,CAJA,WAAA,CAKA,kBAAA,CANA,gBAAA,CAEA,uBAAA,CAKA,iBAAA,CACA,oBCAN,CDGM,+CACE,YCDR,CDIM,oGAEE,wCAAA,CAIA,sBAAA,CAHA,eAAA,CACA,kBAAA,CAGA,YAAA,CAFA,oBCDR,CDMM,sEACE,6CAAA,CAIA,2BAAA,CAHA,eAAA,CACA,kBAAA,CACA,oBCHR","file":"NavBar.css","sourcesContent":["@use \"../../../common/common\" as common;\n\n.af-navbar-container {\n display: flex;\n height: 5rem;\n margin: 0;\n padding: 0;\n flex-direction: row;\n align-items: center;\n gap: 1.6rem;\n list-style-type: none;\n\n .af-navbar-item {\n height: 100%;\n cursor: pointer;\n\n &__link {\n display: inline-block;\n box-sizing: border-box;\n min-width: 8.4rem;\n height: 100%;\n padding: 1.625rem 1.5rem;\n font-family: var(--font-family-base);\n font-size: 1.125rem;\n font-weight: 400;\n line-height: 1.4rem;\n text-align: center;\n text-decoration: none;\n color: var(--color-gray-900);\n\n & > svg {\n display: none;\n }\n\n &:focus,\n &--active {\n border-bottom: 4px solid var(--color-axa);\n font-weight: 600;\n line-height: 1.6rem;\n text-decoration: none;\n color: var(--color-axa);\n outline: none;\n }\n\n &:not(:focus, --active):hover {\n border-bottom: 2px solid var(--color-gray-300);\n font-weight: 400;\n line-height: 1.4rem;\n text-decoration: none;\n color: var(--color-gray-900);\n }\n }\n }\n}\n","@use \"../../../common/common\" as common;\n\n.af-navbar-container {\n display: flex;\n height: 5rem;\n margin: 0;\n padding: 0;\n flex-direction: row;\n align-items: center;\n gap: 1.6rem;\n list-style-type: none;\n\n .af-navbar-item {\n height: 100%;\n cursor: pointer;\n\n &__link {\n display: inline-block;\n box-sizing: border-box;\n min-width: 8.4rem;\n height: 100%;\n padding: 1.625rem 1.5rem;\n font-family: var(--font-family-base);\n font-size: 1.125rem;\n font-weight: 400;\n line-height: 1.4rem;\n text-align: center;\n text-decoration: none;\n color: var(--color-gray-900);\n\n & > svg {\n display: none;\n }\n\n &:focus,\n &--active {\n border-bottom: 4px solid var(--color-axa);\n font-weight: 600;\n line-height: 1.6rem;\n text-decoration: none;\n color: var(--color-axa);\n outline: none;\n }\n\n &:not(:focus, --active):hover {\n border-bottom: 2px solid var(--color-gray-300);\n font-weight: 400;\n line-height: 1.4rem;\n text-decoration: none;\n color: var(--color-gray-900);\n }\n }\n }\n}\n"]}
@@ -1,3 +1,5 @@
1
+ @use "../../../common/common" as common;
2
+
1
3
  .af-navbar-container {
2
4
  display: flex;
3
5
  height: 5rem;
@@ -7,42 +9,46 @@
7
9
  align-items: center;
8
10
  gap: 1.6rem;
9
11
  list-style-type: none;
10
- }
11
-
12
- .af-navbar-item {
13
- height: 100%;
14
- cursor: pointer;
15
12
 
16
- &__link {
17
- display: inline-block;
18
- box-sizing: border-box;
19
- min-width: 8.4rem;
13
+ .af-navbar-item {
20
14
  height: 100%;
21
- padding: 1.625rem 1.5rem;
22
- font-family: var(--font-family-base);
23
- font-size: 1.125rem;
24
- font-weight: 400;
25
- line-height: 1.4rem;
26
- text-align: center;
27
- text-decoration: none;
28
- color: var(--color-gray-900);
15
+ cursor: pointer;
29
16
 
30
- &:focus,
31
- &--active {
32
- border-bottom: 4px solid var(--color-axa);
33
- font-weight: 600;
34
- line-height: 1.6rem;
35
- text-decoration: none;
36
- color: var(--color-axa);
37
- outline: none;
38
- }
39
-
40
- &:not(:focus, --active):hover {
41
- border-bottom: 2px solid var(--color-gray-300);
17
+ &__link {
18
+ display: inline-block;
19
+ box-sizing: border-box;
20
+ min-width: 8.4rem;
21
+ height: 100%;
22
+ padding: 1.625rem 1.5rem;
23
+ font-family: var(--font-family-base);
24
+ font-size: 1.125rem;
42
25
  font-weight: 400;
43
26
  line-height: 1.4rem;
27
+ text-align: center;
44
28
  text-decoration: none;
45
29
  color: var(--color-gray-900);
30
+
31
+ & > svg {
32
+ display: none;
33
+ }
34
+
35
+ &:focus,
36
+ &--active {
37
+ border-bottom: 4px solid var(--color-axa);
38
+ font-weight: 600;
39
+ line-height: 1.6rem;
40
+ text-decoration: none;
41
+ color: var(--color-axa);
42
+ outline: none;
43
+ }
44
+
45
+ &:not(:focus, --active):hover {
46
+ border-bottom: 2px solid var(--color-gray-300);
47
+ font-weight: 400;
48
+ line-height: 1.4rem;
49
+ text-decoration: none;
50
+ color: var(--color-gray-900);
51
+ }
46
52
  }
47
53
  }
48
54
  }
@@ -1 +1 @@
1
- .af-header-previous-link-container{align-items:center;display:flex;gap:.25rem;padding-top:1rem}.af-header-previous-link-container .af-btn-client--header-previous-link{color:var(--color-gray-700);font-size:1rem;font-weight:400;line-height:1.25rem}.af-header-previous-link-container .af-btn-client--header-previous-link svg{fill:var(--color-gray-700)}@media only screen and (width >= 1023px){.af-header-previous-link-container{padding:1.5rem 0 0 7.5rem}.af-header-previous-link-container .af-btn-client--header-previous-link{font-size:1.125rem;line-height:1.40625rem}}
1
+ .af-header-previous-link-container{align-items:center;display:flex;gap:.25rem;padding-top:1rem}@media (min-width:1023px){.af-header-previous-link-container{padding:1.5rem 0 0 7.5rem}}.af-header-previous-link-container .af-btn-client--header-previous-link{color:var(--color-gray-700);font-size:1rem;font-weight:400;line-height:1.25rem}.af-header-previous-link-container .af-btn-client--header-previous-link svg{fill:var(--color-gray-700)}@media (min-width:1023px){.af-header-previous-link-container .af-btn-client--header-previous-link{font-size:1.125rem;line-height:1.40625rem}}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/Layout/Header/PreviousLink/PreviousLink.scss%23sass","../../../../src/Layout/Header/PreviousLink/PreviousLink.scss"],"names":[],"mappings":"AAEA,mCAGE,kBAAA,CAFA,YAAA,CAGA,UAAA,CCJF,gBAGA,CDGE,wEAIE,2BAAA,CAHA,cAAA,CACA,eAAA,CACA,mBCAJ,CDGI,4EACE,0BCDN,CDMA,yCACE,mCCHF,yBACE,CACF,wEACE,kBAAA,CDKI,sBCHJ,CACF","file":"PreviousLink.css","sourcesContent":["@use \"../../../common/common\" as common;\n\n.af-header-previous-link-container {\n display: flex;\n padding-top: 1rem;\n align-items: center;\n gap: 0.25rem;\n\n .af-btn-client--header-previous-link {\n font-size: common.rem(16);\n font-weight: 400;\n line-height: common.rem(20);\n color: var(--color-gray-700);\n\n svg {\n fill: var(--color-gray-700);\n }\n }\n}\n\n@media only screen and (width >= #{common.$breakpoint-md}) {\n .af-header-previous-link-container {\n padding: 1.5rem 0 0 7.5rem;\n\n .af-btn-client--header-previous-link {\n font-size: common.rem(18);\n line-height: common.rem(22.5);\n }\n }\n}\n","@use \"../../../common/common\" as common;\n\n.af-header-previous-link-container {\n display: flex;\n padding-top: 1rem;\n align-items: center;\n gap: 0.25rem;\n\n .af-btn-client--header-previous-link {\n font-size: common.rem(16);\n font-weight: 400;\n line-height: common.rem(20);\n color: var(--color-gray-700);\n\n svg {\n fill: var(--color-gray-700);\n }\n }\n}\n\n@media only screen and (width >= #{common.$breakpoint-md}) {\n .af-header-previous-link-container {\n padding: 1.5rem 0 0 7.5rem;\n\n .af-btn-client--header-previous-link {\n font-size: common.rem(18);\n line-height: common.rem(22.5);\n }\n }\n}\n"]}
1
+ {"version":3,"sources":["../../../../src/Layout/Header/PreviousLink/PreviousLink.scss%23sass","../../../../src/Layout/Header/PreviousLink/PreviousLink.scss","../../../../src/common/common.scss"],"names":[],"mappings":"AAEA,mCAGE,kBAAA,CAFA,YAAA,CAGA,UAAA,CCJF,gBAGA,CCoLI,0BFvLJ,mCCME,yBACA,CACF,CDEE,wEAIE,2BAAA,CAHA,cAAA,CACA,eAAA,CACA,mBCCJ,CDEI,4EACE,0BCAN,CCsKI,0BF7KF,wEAWI,kBAAA,CACA,sBCAJ,CACF","file":"PreviousLink.css","sourcesContent":["@use \"../../../common/common\" as common;\n\n.af-header-previous-link-container {\n display: flex;\n padding-top: 1rem;\n align-items: center;\n gap: 0.25rem;\n\n @include common.media-breakpoint-up(md) {\n padding: 1.5rem 0 0 7.5rem;\n }\n\n .af-btn-client--header-previous-link {\n font-size: common.rem(16);\n font-weight: 400;\n line-height: common.rem(20);\n color: var(--color-gray-700);\n\n svg {\n fill: var(--color-gray-700);\n }\n\n @include common.media-breakpoint-up(md) {\n font-size: common.rem(18);\n line-height: common.rem(22.5);\n }\n }\n}\n","@use \"../../../common/common\" as common;\n\n.af-header-previous-link-container {\n display: flex;\n padding-top: 1rem;\n align-items: center;\n gap: 0.25rem;\n\n @include common.media-breakpoint-up(md) {\n padding: 1.5rem 0 0 7.5rem;\n }\n\n .af-btn-client--header-previous-link {\n font-size: common.rem(16);\n font-weight: 400;\n line-height: common.rem(20);\n color: var(--color-gray-700);\n\n svg {\n fill: var(--color-gray-700);\n }\n\n @include common.media-breakpoint-up(md) {\n font-size: common.rem(18);\n line-height: common.rem(22.5);\n }\n }\n}\n","@use \"sass:map\";\n@use \"sass:list\";\n\n@forward \"./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$radius-8: 8px !default;\n$radius-100: 100% !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// Grid 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\n// Define the minimum dimensions at which your layout will change,\n// adapting to different screen sizes, for use in media queries.\n\n$grid-breakpoints: (\n xs: $breakpoint-xs,\n sm: $breakpoint-sm,\n md: $breakpoint-md,\n lg: $breakpoint-lg,\n xl: $breakpoint-xl,\n);\n\n// Breakpoint viewport sizes and media queries.\n\n// Breakpoints are defined as a map of (name: minimum width), order from small to large:\n\n// (xs: 0, sm: 667px, md: 1023px, lg: 1279px, xl: 1599px)\n\n// The map defined in the `$grid-breakpoints` global variable is used as the `$breakpoints` argument by default.\n// Name of the next breakpoint, or null for the last breakpoint.\n\n// >> breakpoint-next(sm)\n// md\n// >> breakpoint-next(sm, (xs: 0, sm: 667px, md: 1023px, lg: 1279px, xl: 1599px))\n// md\n// >> breakpoint-next(sm, $breakpoint-names: (xs sm md lg xl))\n// md\n@function breakpoint-next(\n $name,\n $breakpoints: $grid-breakpoints,\n $breakpoint-names: map.keys($breakpoints)\n) {\n $n: list.index($breakpoint-names, $name);\n\n @return if(\n $n < list.length($breakpoint-names),\n list.nth($breakpoint-names, $n + 1),\n null\n );\n}\n\n// Minimum breakpoint width. Null for the smallest (first) breakpoint.\n\n// >> breakpoint-min(sm, (xs: 0, sm: 667px, md: 1023px, lg: 1279px, xl: 1599px))\n// 667px\n@function breakpoint-min($name, $breakpoints: $grid-breakpoints) {\n $min: map.get($breakpoints, $name);\n\n @return if($min != 0, $min, null);\n}\n\n// Maximum breakpoint width. Null for the largest (last) breakpoint.\n// The maximum value is calculated as the minimum of the next one less 0.02px\n// to work around the limitations of `min-` and `max-` prefixes and viewports with fractional widths.\n// See https://www.w3.org/TR/mediaqueries-4/#mq-min-max\n// Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.\n// See https://bugs.webkit.org/show_bug.cgi?id=178261\n\n// >> breakpoint-max(sm, (xs: 0, sm: 667px, md: 1023px, lg: 1279px, xl: 1599px))\n// 1022.98px\n@function breakpoint-max($name, $breakpoints: $grid-breakpoints) {\n $next: breakpoint-next($name, $breakpoints);\n\n @return if($next, breakpoint-min($next, $breakpoints) - 0.02px, null);\n}\n\n// Media of at least the minimum breakpoint width. No query for the smallest breakpoint.\n// Makes the @content apply to the given breakpoint and wider.\n@mixin media-breakpoint-up($name, $breakpoints: $grid-breakpoints) {\n $min: breakpoint-min($name, $breakpoints);\n\n @if $min {\n @media (min-width: $min) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n// Media of at most the maximum breakpoint width. No query for the largest breakpoint.\n// Makes the @content apply to the given breakpoint and narrower.\n@mixin media-breakpoint-down($name, $breakpoints: $grid-breakpoints) {\n $max: breakpoint-max($name, $breakpoints);\n\n @if $max {\n @media (max-width: $max) {\n @content;\n }\n } @else {\n @content;\n }\n}\n"]}
@@ -6,6 +6,10 @@
6
6
  align-items: center;
7
7
  gap: 0.25rem;
8
8
 
9
+ @include common.media-breakpoint-up(md) {
10
+ padding: 1.5rem 0 0 7.5rem;
11
+ }
12
+
9
13
  .af-btn-client--header-previous-link {
10
14
  font-size: common.rem(16);
11
15
  font-weight: 400;
@@ -15,14 +19,8 @@
15
19
  svg {
16
20
  fill: var(--color-gray-700);
17
21
  }
18
- }
19
- }
20
-
21
- @media only screen and (width >= #{common.$breakpoint-md}) {
22
- .af-header-previous-link-container {
23
- padding: 1.5rem 0 0 7.5rem;
24
22
 
25
- .af-btn-client--header-previous-link {
23
+ @include common.media-breakpoint-up(md) {
26
24
  font-size: common.rem(18);
27
25
  line-height: common.rem(22.5);
28
26
  }
@@ -1 +1 @@
1
- .af-link{align-items:center;color:var(--color-axa);display:inline-flex;font-family:var(--font-family-base);gap:.25rem;height:-moz-fit-content;height:fit-content;text-decoration:underline;width:-moz-fit-content;width:fit-content;fill:var(--color-axa)}.af-link svg{aspect-ratio:1;height:1.25rem;width:1.25rem}.af-link--openInNewTab{font-weight:600}.af-link:has(svg){text-decoration:none}.af-link:active,.af-link:focus{color:var(--color-blue-1);fill:var(--color-blue-1)}.af-link:focus-visible{outline:2px solid var(--color-blue-3);outline-offset:3px}.af-link:hover{color:var(--color-blue-1);fill:var(--color-blue-1)}.af-link:hover:has(svg){text-decoration:none}
1
+ .af-link{align-items:center;color:var(--color-axa);display:inline-flex;font-family:var(--font-family-base);gap:.25rem;height:fit-content;text-decoration:underline;width:fit-content;fill:var(--color-axa)}.af-link svg{aspect-ratio:1;height:1.25rem;width:1.25rem}.af-link--openInNewTab{font-weight:600}.af-link:has(svg){text-decoration:none}.af-link:active,.af-link:focus{color:var(--color-blue-1);fill:var(--color-blue-1)}.af-link:focus-visible{outline:2px solid var(--color-blue-3);outline-offset:3px}.af-link:hover{color:var(--color-blue-1);fill:var(--color-blue-1)}.af-link:hover:has(svg){text-decoration:none}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Link/Link.scss%23sass","../../src/Link/Link.scss"],"names":[],"mappings":"AAEA,SAIE,kBAAA,CAIA,sBAAA,CAPA,mBAAA,CAKA,mCAAA,CADA,UAAA,CAFA,uBAAA,CAAA,kBAAA,CAIA,yBAAA,CCPF,sBAAA,CAAA,iBAAA,CDSE,qBCDF,CDGE,aAGE,cAAA,CADA,cAAA,CADA,aCCJ,CDIE,uBACE,eCFJ,CDKE,kBACE,oBCHJ,CDME,+BAEE,yBAAA,CACA,wBCLJ,CDQE,uBACE,qCAAA,CACA,kBCNJ,CDSE,eACE,yBAAA,CACA,wBCPJ,CDSI,wBACE,oBCPN","file":"Link.css","sourcesContent":["@use \"../common/common\" as common;\n\n.af-link {\n display: inline-flex;\n width: fit-content;\n height: fit-content;\n align-items: center;\n gap: common.rem(4);\n font-family: var(--font-family-base);\n text-decoration: underline;\n color: var(--color-axa);\n fill: var(--color-axa);\n\n svg {\n width: common.rem(20);\n height: common.rem(20);\n aspect-ratio: 1;\n }\n\n &--openInNewTab {\n font-weight: 600;\n }\n\n &:has(svg) {\n text-decoration: none;\n }\n\n &:active,\n &:focus {\n color: var(--color-blue-1);\n fill: var(--color-blue-1);\n }\n\n &:focus-visible {\n outline: 2px solid var(--color-blue-3);\n outline-offset: 3px;\n }\n\n &:hover {\n color: var(--color-blue-1);\n fill: var(--color-blue-1);\n\n &:has(svg) {\n text-decoration: none;\n }\n }\n}\n","@use \"../common/common\" as common;\n\n.af-link {\n display: inline-flex;\n width: fit-content;\n height: fit-content;\n align-items: center;\n gap: common.rem(4);\n font-family: var(--font-family-base);\n text-decoration: underline;\n color: var(--color-axa);\n fill: var(--color-axa);\n\n svg {\n width: common.rem(20);\n height: common.rem(20);\n aspect-ratio: 1;\n }\n\n &--openInNewTab {\n font-weight: 600;\n }\n\n &:has(svg) {\n text-decoration: none;\n }\n\n &:active,\n &:focus {\n color: var(--color-blue-1);\n fill: var(--color-blue-1);\n }\n\n &:focus-visible {\n outline: 2px solid var(--color-blue-3);\n outline-offset: 3px;\n }\n\n &:hover {\n color: var(--color-blue-1);\n fill: var(--color-blue-1);\n\n &:has(svg) {\n text-decoration: none;\n }\n }\n}\n"]}
1
+ {"version":3,"sources":["../../src/Link/Link.scss%23sass","../../src/Link/Link.scss"],"names":[],"mappings":"AAEA,SAIE,kBAAA,CAIA,sBAAA,CAPA,mBAAA,CAKA,mCAAA,CADA,UAAA,CAFA,kBAAA,CAIA,yBAAA,CCPF,iBAAA,CDSE,qBCDF,CDGE,aAGE,cAAA,CADA,cAAA,CADA,aCCJ,CDIE,uBACE,eCFJ,CDKE,kBACE,oBCHJ,CDME,+BAEE,yBAAA,CACA,wBCLJ,CDQE,uBACE,qCAAA,CACA,kBCNJ,CDSE,eACE,yBAAA,CACA,wBCPJ,CDSI,wBACE,oBCPN","file":"Link.css","sourcesContent":["@use \"../common/common\" as common;\n\n.af-link {\n display: inline-flex;\n width: fit-content;\n height: fit-content;\n align-items: center;\n gap: common.rem(4);\n font-family: var(--font-family-base);\n text-decoration: underline;\n color: var(--color-axa);\n fill: var(--color-axa);\n\n svg {\n width: common.rem(20);\n height: common.rem(20);\n aspect-ratio: 1;\n }\n\n &--openInNewTab {\n font-weight: 600;\n }\n\n &:has(svg) {\n text-decoration: none;\n }\n\n &:active,\n &:focus {\n color: var(--color-blue-1);\n fill: var(--color-blue-1);\n }\n\n &:focus-visible {\n outline: 2px solid var(--color-blue-3);\n outline-offset: 3px;\n }\n\n &:hover {\n color: var(--color-blue-1);\n fill: var(--color-blue-1);\n\n &:has(svg) {\n text-decoration: none;\n }\n }\n}\n","@use \"../common/common\" as common;\n\n.af-link {\n display: inline-flex;\n width: fit-content;\n height: fit-content;\n align-items: center;\n gap: common.rem(4);\n font-family: var(--font-family-base);\n text-decoration: underline;\n color: var(--color-axa);\n fill: var(--color-axa);\n\n svg {\n width: common.rem(20);\n height: common.rem(20);\n aspect-ratio: 1;\n }\n\n &--openInNewTab {\n font-weight: 600;\n }\n\n &:has(svg) {\n text-decoration: none;\n }\n\n &:active,\n &:focus {\n color: var(--color-blue-1);\n fill: var(--color-blue-1);\n }\n\n &:focus-visible {\n outline: 2px solid var(--color-blue-3);\n outline-offset: 3px;\n }\n\n &:hover {\n color: var(--color-blue-1);\n fill: var(--color-blue-1);\n\n &:has(svg) {\n text-decoration: none;\n }\n }\n}\n"]}
@@ -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:content-box;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:baseline}sub{bottom:-.25em}sup{top:-.5em}a{background-color:transparent;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;-moz-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;-moz-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:baseline}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:none;-moz-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-click-item{align-items:center;background:none;border:none;border-radius:var(--default-border-radius);cursor:pointer;display:flex;gap:.5rem;padding:1rem;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%}.af-click-item:active,.af-click-item:focus,.af-click-item:focus-visible{outline:none}.af-click-item:hover{text-decoration:none}.af-click-item:focus-visible{border:2px solid var(--color-focus)}.af-click-item__content{align-items:center;display:flex;gap:.75rem}.af-click-item__action svg,.af-click-item__icon svg{height:1.5rem;width:1.5rem;fill:var(--color-axa)}.af-click-item__label,.af-click-item__subtitle,.af-click-item__title{font-size:1.125rem;line-height:1.4rem}.af-click-item__secondary,.af-click-item__subtitle,.af-click-item__title{margin:0}.af-click-item__label{color:var(--color-gray-900);text-align:left}.af-click-item__title{color:var(--color-gray-900);font-weight:600}.af-click-item__secondary,.af-click-item__subtitle{color:var(--color-gray-700);font-weight:400}.af-click-item__secondary{font-size:.875rem;line-height:1.1rem}.af-click-item__action{margin-left:auto}.af-click-item--small .af-click-item__label{font-size:1rem;line-height:1.25rem}.af-click-item--large .af-click-item__label{font-weight:600}.af-click-item.af-click-item--disabled{pointer-events:none}.af-click-item.af-click-item--disabled .af-click-item__action svg,.af-click-item.af-click-item--disabled .af-click-item__icon svg{fill:var(--color-gray-500)}.af-click-item.af-click-item--disabled .af-click-item__label,.af-click-item.af-click-item--disabled .af-click-item__secondary,.af-click-item.af-click-item--disabled .af-click-item__subtitle,.af-click-item.af-click-item--disabled .af-click-item__title{color:var(--color-gray-500)}.af-click-item:not(.af-click-item--disabled):hover{box-shadow:0 4px 8px 0 rgba(16,24,65,.08)}.af-click-item:not(.af-click-item--disabled):active{box-shadow:inset 0 2px 8px 0 rgba(0,0,0,.15)}@media (width <= 667px){.af-click-item:focus-visible{border:none;border:1px solid var(--color-focus)}.af-click-item__label,.af-click-item__subtitle,.af-click-item__title{font-size:1rem;line-height:1.25rem}.af-click-item--small .af-click-item__label{font-size:.875rem;line-height:1.1rem}.af-click-item:not(.af-click-item--disabled),.af-click-item:not(.af-click-item--disabled):hover{box-shadow:none}.af-click-item:not(.af-click-item--disabled):hover .af-click-item__label,.af-click-item:not(.af-click-item--disabled):hover .af-click-item__secondary,.af-click-item:not(.af-click-item--disabled):hover .af-click-item__subtitle,.af-click-item:not(.af-click-item--disabled):hover .af-click-item__title{color:var(--color-axa)}.af-click-item:not(.af-click-item--disabled):active{box-shadow:none}.af-click-item:not(.af-click-item--disabled):active .af-click-item__label,.af-click-item:not(.af-click-item--disabled):active .af-click-item__secondary,.af-click-item:not(.af-click-item--disabled):active .af-click-item__subtitle,.af-click-item:not(.af-click-item--disabled):active .af-click-item__title{color:var(--color-blue-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-click-item{align-items:center;background:none;border:none;border-radius:var(--default-border-radius);cursor:pointer;display:flex;gap:.5rem;padding:1rem;-webkit-user-select:none;user-select:none;width:100%}.af-click-item:active,.af-click-item:focus,.af-click-item:focus-visible{outline:none}.af-click-item:hover{text-decoration:none}.af-click-item:focus-visible{border:2px solid var(--color-focus)}.af-click-item__content{align-items:center;display:flex;gap:.75rem}.af-click-item__action svg,.af-click-item__icon svg{height:1.5rem;width:1.5rem;fill:var(--color-axa)}.af-click-item__label,.af-click-item__subtitle,.af-click-item__title{font-size:1.125rem;line-height:1.4rem}.af-click-item__secondary,.af-click-item__subtitle,.af-click-item__title{margin:0}.af-click-item__label{color:var(--color-gray-900);text-align:left}.af-click-item__title{color:var(--color-gray-900);font-weight:600}.af-click-item__secondary,.af-click-item__subtitle{color:var(--color-gray-700);font-weight:400}.af-click-item__secondary{font-size:.875rem;line-height:1.1rem}.af-click-item__action{margin-left:auto}.af-click-item--small .af-click-item__label{font-size:1rem;line-height:1.25rem}.af-click-item--large .af-click-item__label{font-weight:600}.af-click-item.af-click-item--disabled{pointer-events:none}.af-click-item.af-click-item--disabled .af-click-item__action svg,.af-click-item.af-click-item--disabled .af-click-item__icon svg{fill:var(--color-gray-500)}.af-click-item.af-click-item--disabled .af-click-item__label,.af-click-item.af-click-item--disabled .af-click-item__secondary,.af-click-item.af-click-item--disabled .af-click-item__subtitle,.af-click-item.af-click-item--disabled .af-click-item__title{color:var(--color-gray-500)}.af-click-item:not(.af-click-item--disabled):hover{box-shadow:0 4px 8px 0 #10184114}.af-click-item:not(.af-click-item--disabled):active{box-shadow:inset 0 2px 8px 0 #00000026}@media (width <= 667px){.af-click-item:focus-visible{border:none;border:1px solid var(--color-focus)}.af-click-item__label,.af-click-item__subtitle,.af-click-item__title{font-size:1rem;line-height:1.25rem}.af-click-item--small .af-click-item__label{font-size:.875rem;line-height:1.1rem}.af-click-item:not(.af-click-item--disabled),.af-click-item:not(.af-click-item--disabled):hover{box-shadow:none}.af-click-item:not(.af-click-item--disabled):hover .af-click-item__label,.af-click-item:not(.af-click-item--disabled):hover .af-click-item__secondary,.af-click-item:not(.af-click-item--disabled):hover .af-click-item__subtitle,.af-click-item:not(.af-click-item--disabled):hover .af-click-item__title{color:var(--color-axa)}.af-click-item:not(.af-click-item--disabled):active{box-shadow:none}.af-click-item:not(.af-click-item--disabled):active .af-click-item__label,.af-click-item:not(.af-click-item--disabled):active .af-click-item__secondary,.af-click-item:not(.af-click-item--disabled):active .af-click-item__subtitle,.af-click-item:not(.af-click-item--disabled):active .af-click-item__title{color:var(--color-blue-1)}}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/common/reboot.scss","../../../src/List/ClickList/ClickList.scss","../../../src/List/ClickList/ClickList.scss%23sass"],"names":[],"mappings":"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","file":"ClickList.css","sourcesContent":["*,\n::after,\n::before {\n box-sizing: border-box;\n}\n\nhtml {\n font-family: sans-serif;\n line-height: 1.15;\n text-size-adjust: 100%;\n -webkit-tap-highlight-color: transparent;\n}\n\narticle,\naside,\nfigcaption,\nfigure,\nfooter,\nheader,\nhgroup,\nmain,\nnav,\nsection {\n display: block;\n}\n\nbody {\n margin: 0;\n font-family: \"Source Sans Pro\", Arial, sans-serif;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.5;\n text-align: left;\n color: #333;\n background-color: #fff;\n}\n\n[tabindex=\"-1\"]:focus {\n outline: 0 !important;\n}\n\nhr {\n box-sizing: content-box;\n height: 0;\n overflow: visible;\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n margin-top: 0;\n margin-bottom: 0.5rem;\n}\n\np {\n margin-top: 0;\n margin-bottom: 1rem;\n}\n\nabbr[data-original-title],\nabbr[title] {\n border-bottom: 0;\n text-decoration: underline;\n text-decoration: underline dotted;\n text-decoration-skip-ink: none;\n cursor: help;\n}\n\naddress {\n margin-bottom: 1rem;\n font-style: normal;\n line-height: inherit;\n}\n\ndl,\nol,\nul {\n margin-top: 0;\n margin-bottom: 1rem;\n}\n\nol ol,\nol ul,\nul ol,\nul ul {\n margin-bottom: 0;\n}\n\ndt {\n font-weight: 700;\n}\n\ndd {\n margin-bottom: 0.5rem;\n margin-left: 0;\n}\n\nblockquote {\n margin: 0 0 1rem;\n}\n\nb,\nstrong {\n font-weight: bolder;\n}\n\nsmall {\n font-size: 80%;\n}\n\nsub,\nsup {\n position: relative;\n vertical-align: baseline;\n font-size: 75%;\n line-height: 0;\n}\n\nsub {\n bottom: -0.25em;\n}\n\nsup {\n top: -0.5em;\n}\n\na {\n text-decoration: none;\n color: #00008f;\n background-color: transparent;\n}\n\na:hover {\n text-decoration: underline;\n color: #000043;\n}\n\na:not([href], [tabindex]) {\n text-decoration: none;\n color: inherit;\n}\n\na:not([href], [tabindex]):focus,\na:not([href], [tabindex]):hover {\n text-decoration: none;\n color: inherit;\n}\n\na:not([href], [tabindex]):focus {\n outline: 0;\n}\n\ncode,\nkbd,\npre,\nsamp {\n font-family: SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\",\n \"Courier New\", monospace;\n font-size: 1em;\n}\n\npre {\n margin-top: 0;\n margin-bottom: 1rem;\n overflow: auto;\n}\n\nfigure {\n margin: 0 0 1rem;\n}\n\nimg {\n border-style: none;\n vertical-align: middle;\n}\n\nsvg {\n vertical-align: middle;\n overflow: hidden;\n}\n\ntable {\n border-collapse: collapse;\n}\n\ncaption {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n caption-side: bottom;\n text-align: left;\n color: #6c757d;\n}\n\nth {\n text-align: inherit;\n}\n\nbutton {\n border-radius: 0;\n}\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n margin: 0;\n font-family: inherit;\n font-size: inherit;\n line-height: inherit;\n}\n\nbutton,\ninput {\n overflow: visible;\n}\n\nbutton,\nselect {\n text-transform: none;\n}\n\nselect {\n word-wrap: normal;\n}\n\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"],\nbutton {\n appearance: button;\n}\n\nbutton:focus {\n outline: 1px dotted;\n outline: 5px auto -webkit-focus-ring-color;\n}\n\n[type=\"button\"]:not(:disabled),\n[type=\"reset\"]:not(:disabled),\n[type=\"submit\"]:not(:disabled),\nbutton:not(:disabled) {\n cursor: pointer;\n}\n\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner,\nbutton::-moz-focus-inner {\n padding: 0;\n border-style: none;\n}\n\ninput[type=\"checkbox\"],\ninput[type=\"radio\"] {\n box-sizing: border-box;\n padding: 0;\n}\n\ninput[type=\"date\"],\ninput[type=\"datetime-local\"],\ninput[type=\"month\"],\ninput[type=\"time\"] {\n appearance: listbox;\n}\n\ntextarea {\n overflow: auto;\n resize: vertical;\n}\n\nfieldset {\n min-width: 0;\n margin: 0;\n padding: 0;\n border: 0;\n}\n\nlegend {\n display: block;\n width: 100%;\n max-width: 100%;\n margin-bottom: 0.5rem;\n padding: 0;\n font-size: 1.5rem;\n line-height: inherit;\n white-space: normal;\n color: inherit;\n}\n\nprogress {\n vertical-align: baseline;\n}\n\n[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button {\n height: auto;\n}\n\n[type=\"search\"] {\n outline-offset: -2px;\n appearance: none;\n}\n\n[type=\"search\"]::-webkit-search-decoration {\n appearance: none;\n}\n\n::-webkit-file-upload-button {\n font: inherit;\n appearance: button;\n}\n\noutput {\n display: inline-block;\n}\n\nsummary {\n display: list-item;\n cursor: pointer;\n}\n\ntemplate {\n display: none;\n}\n\n[hidden] {\n display: none !important;\n}\n","@use \"../../common/reboot\";\n@use \"../../common/common\" as common;\n\n.af-click-item {\n display: flex;\n width: 100%;\n padding: 1rem;\n border: none;\n border-radius: var(--default-border-radius);\n align-items: center;\n gap: 0.5rem;\n background: none;\n cursor: pointer;\n user-select: none;\n\n &:active,\n &:focus,\n &:focus-visible {\n outline: none;\n }\n\n &:hover {\n text-decoration: none;\n }\n\n &:focus-visible {\n border: 2px solid var(--color-focus);\n }\n\n &__content {\n display: flex;\n align-items: center;\n gap: 0.75rem;\n }\n\n &__icon svg,\n &__action svg {\n width: 1.5rem;\n height: 1.5rem;\n fill: var(--color-axa);\n }\n\n &__title,\n &__subtitle,\n &__label {\n font-size: 1.125rem;\n line-height: 1.4rem;\n }\n\n &__title,\n &__subtitle,\n &__secondary {\n margin: 0;\n }\n\n &__label {\n text-align: left;\n color: var(--color-gray-900);\n }\n\n &__title {\n font-weight: 600;\n color: var(--color-gray-900);\n }\n\n &__subtitle {\n font-weight: 400;\n color: var(--color-gray-700);\n }\n\n &__secondary {\n font-size: 0.875rem;\n font-weight: 400;\n line-height: 1.1rem;\n color: var(--color-gray-700);\n }\n\n &__action {\n margin-left: auto;\n }\n\n &--small &__label {\n font-size: 1rem;\n line-height: 1.25rem;\n }\n\n &--large &__label {\n font-weight: 600;\n }\n\n &.af-click-item--disabled {\n pointer-events: none;\n\n .af-click-item {\n &__action svg,\n &__icon svg {\n fill: var(--color-gray-500);\n }\n\n &__label,\n &__title,\n &__subtitle,\n &__secondary {\n color: var(--color-gray-500);\n }\n }\n }\n\n &:not(.af-click-item--disabled) {\n &:hover {\n box-shadow: 0 4px 8px 0 hsla(230deg, 60%, 16%, 8%);\n }\n\n &:active {\n box-shadow: 0 2px 8px 0 hsla(0deg, 0%, 0%, 15%) inset;\n }\n }\n}\n\n@media (width <= #{common.$breakpoint-sm}) {\n .af-click-item {\n &:focus-visible {\n border: none;\n border: 1px solid var(--color-focus);\n }\n\n &__label,\n &__title,\n &__subtitle {\n font-size: 1rem;\n line-height: 1.25rem;\n }\n\n &--small &__label {\n font-size: 0.875rem;\n line-height: 1.1rem;\n }\n\n &:not(.af-click-item--disabled) {\n box-shadow: none;\n\n &:hover {\n box-shadow: none;\n\n .af-click-item {\n &__label,\n &__title,\n &__subtitle,\n &__secondary {\n color: var(--color-axa);\n }\n }\n }\n\n &:active {\n box-shadow: none;\n\n .af-click-item {\n &__label,\n &__title,\n &__subtitle,\n &__secondary {\n color: var(--color-blue-1);\n }\n }\n }\n }\n }\n}\n","@use \"../../common/reboot\";\n@use \"../../common/common\" as common;\n\n.af-click-item {\n display: flex;\n width: 100%;\n padding: 1rem;\n border: none;\n border-radius: var(--default-border-radius);\n align-items: center;\n gap: 0.5rem;\n background: none;\n cursor: pointer;\n user-select: none;\n\n &:active,\n &:focus,\n &:focus-visible {\n outline: none;\n }\n\n &:hover {\n text-decoration: none;\n }\n\n &:focus-visible {\n border: 2px solid var(--color-focus);\n }\n\n &__content {\n display: flex;\n align-items: center;\n gap: 0.75rem;\n }\n\n &__icon svg,\n &__action svg {\n width: 1.5rem;\n height: 1.5rem;\n fill: var(--color-axa);\n }\n\n &__title,\n &__subtitle,\n &__label {\n font-size: 1.125rem;\n line-height: 1.4rem;\n }\n\n &__title,\n &__subtitle,\n &__secondary {\n margin: 0;\n }\n\n &__label {\n text-align: left;\n color: var(--color-gray-900);\n }\n\n &__title {\n font-weight: 600;\n color: var(--color-gray-900);\n }\n\n &__subtitle {\n font-weight: 400;\n color: var(--color-gray-700);\n }\n\n &__secondary {\n font-size: 0.875rem;\n font-weight: 400;\n line-height: 1.1rem;\n color: var(--color-gray-700);\n }\n\n &__action {\n margin-left: auto;\n }\n\n &--small &__label {\n font-size: 1rem;\n line-height: 1.25rem;\n }\n\n &--large &__label {\n font-weight: 600;\n }\n\n &.af-click-item--disabled {\n pointer-events: none;\n\n .af-click-item {\n &__action svg,\n &__icon svg {\n fill: var(--color-gray-500);\n }\n\n &__label,\n &__title,\n &__subtitle,\n &__secondary {\n color: var(--color-gray-500);\n }\n }\n }\n\n &:not(.af-click-item--disabled) {\n &:hover {\n box-shadow: 0 4px 8px 0 hsla(230deg, 60%, 16%, 8%);\n }\n\n &:active {\n box-shadow: 0 2px 8px 0 hsla(0deg, 0%, 0%, 15%) inset;\n }\n }\n}\n\n@media (width <= #{common.$breakpoint-sm}) {\n .af-click-item {\n &:focus-visible {\n border: none;\n border: 1px solid var(--color-focus);\n }\n\n &__label,\n &__title,\n &__subtitle {\n font-size: 1rem;\n line-height: 1.25rem;\n }\n\n &--small &__label {\n font-size: 0.875rem;\n line-height: 1.1rem;\n }\n\n &:not(.af-click-item--disabled) {\n box-shadow: none;\n\n &:hover {\n box-shadow: none;\n\n .af-click-item {\n &__label,\n &__title,\n &__subtitle,\n &__secondary {\n color: var(--color-axa);\n }\n }\n }\n\n &:active {\n box-shadow: none;\n\n .af-click-item {\n &__label,\n &__title,\n &__subtitle,\n &__secondary {\n color: var(--color-blue-1);\n }\n }\n }\n }\n }\n}\n"]}
1
+ {"version":3,"sources":["../../../src/common/reboot.scss","../../../src/List/ClickList/ClickList.scss","../../../src/List/ClickList/ClickList.scss%23sass"],"names":[],"mappings":"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","file":"ClickList.css","sourcesContent":["*,\n::after,\n::before {\n box-sizing: border-box;\n}\n\nhtml {\n font-family: sans-serif;\n line-height: 1.15;\n text-size-adjust: 100%;\n -webkit-tap-highlight-color: transparent;\n}\n\narticle,\naside,\nfigcaption,\nfigure,\nfooter,\nheader,\nhgroup,\nmain,\nnav,\nsection {\n display: block;\n}\n\nbody {\n margin: 0;\n font-family: \"Source Sans Pro\", Arial, sans-serif;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.5;\n text-align: left;\n color: #333;\n background-color: #fff;\n}\n\n[tabindex=\"-1\"]:focus {\n outline: 0 !important;\n}\n\nhr {\n box-sizing: content-box;\n height: 0;\n overflow: visible;\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n margin-top: 0;\n margin-bottom: 0.5rem;\n}\n\np {\n margin-top: 0;\n margin-bottom: 1rem;\n}\n\nabbr[data-original-title],\nabbr[title] {\n border-bottom: 0;\n text-decoration: underline;\n text-decoration: underline dotted;\n text-decoration-skip-ink: none;\n cursor: help;\n}\n\naddress {\n margin-bottom: 1rem;\n font-style: normal;\n line-height: inherit;\n}\n\ndl,\nol,\nul {\n margin-top: 0;\n margin-bottom: 1rem;\n}\n\nol ol,\nol ul,\nul ol,\nul ul {\n margin-bottom: 0;\n}\n\ndt {\n font-weight: 700;\n}\n\ndd {\n margin-bottom: 0.5rem;\n margin-left: 0;\n}\n\nblockquote {\n margin: 0 0 1rem;\n}\n\nb,\nstrong {\n font-weight: bolder;\n}\n\nsmall {\n font-size: 80%;\n}\n\nsub,\nsup {\n position: relative;\n vertical-align: baseline;\n font-size: 75%;\n line-height: 0;\n}\n\nsub {\n bottom: -0.25em;\n}\n\nsup {\n top: -0.5em;\n}\n\na {\n text-decoration: none;\n color: #00008f;\n background-color: transparent;\n}\n\na:hover {\n text-decoration: underline;\n color: #000043;\n}\n\na:not([href], [tabindex]) {\n text-decoration: none;\n color: inherit;\n}\n\na:not([href], [tabindex]):focus,\na:not([href], [tabindex]):hover {\n text-decoration: none;\n color: inherit;\n}\n\na:not([href], [tabindex]):focus {\n outline: 0;\n}\n\ncode,\nkbd,\npre,\nsamp {\n font-family: SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\",\n \"Courier New\", monospace;\n font-size: 1em;\n}\n\npre {\n margin-top: 0;\n margin-bottom: 1rem;\n overflow: auto;\n}\n\nfigure {\n margin: 0 0 1rem;\n}\n\nimg {\n border-style: none;\n vertical-align: middle;\n}\n\nsvg {\n vertical-align: middle;\n overflow: hidden;\n}\n\ntable {\n border-collapse: collapse;\n}\n\ncaption {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n caption-side: bottom;\n text-align: left;\n color: #6c757d;\n}\n\nth {\n text-align: inherit;\n}\n\nbutton {\n border-radius: 0;\n}\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n margin: 0;\n font-family: inherit;\n font-size: inherit;\n line-height: inherit;\n}\n\nbutton,\ninput {\n overflow: visible;\n}\n\nbutton,\nselect {\n text-transform: none;\n}\n\nselect {\n word-wrap: normal;\n}\n\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"],\nbutton {\n appearance: button;\n}\n\nbutton:focus {\n outline: 1px dotted;\n outline: 5px auto -webkit-focus-ring-color;\n}\n\n[type=\"button\"]:not(:disabled),\n[type=\"reset\"]:not(:disabled),\n[type=\"submit\"]:not(:disabled),\nbutton:not(:disabled) {\n cursor: pointer;\n}\n\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner,\nbutton::-moz-focus-inner {\n padding: 0;\n border-style: none;\n}\n\ninput[type=\"checkbox\"],\ninput[type=\"radio\"] {\n box-sizing: border-box;\n padding: 0;\n}\n\ninput[type=\"date\"],\ninput[type=\"datetime-local\"],\ninput[type=\"month\"],\ninput[type=\"time\"] {\n appearance: listbox;\n}\n\ntextarea {\n overflow: auto;\n resize: vertical;\n}\n\nfieldset {\n min-width: 0;\n margin: 0;\n padding: 0;\n border: 0;\n}\n\nlegend {\n display: block;\n width: 100%;\n max-width: 100%;\n margin-bottom: 0.5rem;\n padding: 0;\n font-size: 1.5rem;\n line-height: inherit;\n white-space: normal;\n color: inherit;\n}\n\nprogress {\n vertical-align: baseline;\n}\n\n[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button {\n height: auto;\n}\n\n[type=\"search\"] {\n outline-offset: -2px;\n appearance: none;\n}\n\n[type=\"search\"]::-webkit-search-decoration {\n appearance: none;\n}\n\n::-webkit-file-upload-button {\n font: inherit;\n appearance: button;\n}\n\noutput {\n display: inline-block;\n}\n\nsummary {\n display: list-item;\n cursor: pointer;\n}\n\ntemplate {\n display: none;\n}\n\n[hidden] {\n display: none !important;\n}\n","@use \"../../common/reboot\";\n@use \"../../common/common\" as common;\n\n.af-click-item {\n display: flex;\n width: 100%;\n padding: 1rem;\n border: none;\n border-radius: var(--default-border-radius);\n align-items: center;\n gap: 0.5rem;\n background: none;\n cursor: pointer;\n user-select: none;\n\n &:active,\n &:focus,\n &:focus-visible {\n outline: none;\n }\n\n &:hover {\n text-decoration: none;\n }\n\n &:focus-visible {\n border: 2px solid var(--color-focus);\n }\n\n &__content {\n display: flex;\n align-items: center;\n gap: 0.75rem;\n }\n\n &__icon svg,\n &__action svg {\n width: 1.5rem;\n height: 1.5rem;\n fill: var(--color-axa);\n }\n\n &__title,\n &__subtitle,\n &__label {\n font-size: 1.125rem;\n line-height: 1.4rem;\n }\n\n &__title,\n &__subtitle,\n &__secondary {\n margin: 0;\n }\n\n &__label {\n text-align: left;\n color: var(--color-gray-900);\n }\n\n &__title {\n font-weight: 600;\n color: var(--color-gray-900);\n }\n\n &__subtitle {\n font-weight: 400;\n color: var(--color-gray-700);\n }\n\n &__secondary {\n font-size: 0.875rem;\n font-weight: 400;\n line-height: 1.1rem;\n color: var(--color-gray-700);\n }\n\n &__action {\n margin-left: auto;\n }\n\n &--small &__label {\n font-size: 1rem;\n line-height: 1.25rem;\n }\n\n &--large &__label {\n font-weight: 600;\n }\n\n &.af-click-item--disabled {\n pointer-events: none;\n\n .af-click-item {\n &__action svg,\n &__icon svg {\n fill: var(--color-gray-500);\n }\n\n &__label,\n &__title,\n &__subtitle,\n &__secondary {\n color: var(--color-gray-500);\n }\n }\n }\n\n &:not(.af-click-item--disabled) {\n &:hover {\n box-shadow: 0 4px 8px 0 hsla(230deg, 60%, 16%, 8%);\n }\n\n &:active {\n box-shadow: 0 2px 8px 0 hsla(0deg, 0%, 0%, 15%) inset;\n }\n }\n}\n\n@media (width <= #{common.$breakpoint-sm}) {\n .af-click-item {\n &:focus-visible {\n border: none;\n border: 1px solid var(--color-focus);\n }\n\n &__label,\n &__title,\n &__subtitle {\n font-size: 1rem;\n line-height: 1.25rem;\n }\n\n &--small &__label {\n font-size: 0.875rem;\n line-height: 1.1rem;\n }\n\n &:not(.af-click-item--disabled) {\n box-shadow: none;\n\n &:hover {\n box-shadow: none;\n\n .af-click-item {\n &__label,\n &__title,\n &__subtitle,\n &__secondary {\n color: var(--color-axa);\n }\n }\n }\n\n &:active {\n box-shadow: none;\n\n .af-click-item {\n &__label,\n &__title,\n &__subtitle,\n &__secondary {\n color: var(--color-blue-1);\n }\n }\n }\n }\n }\n}\n","@use \"../../common/reboot\";\n@use \"../../common/common\" as common;\n\n.af-click-item {\n display: flex;\n width: 100%;\n padding: 1rem;\n border: none;\n border-radius: var(--default-border-radius);\n align-items: center;\n gap: 0.5rem;\n background: none;\n cursor: pointer;\n user-select: none;\n\n &:active,\n &:focus,\n &:focus-visible {\n outline: none;\n }\n\n &:hover {\n text-decoration: none;\n }\n\n &:focus-visible {\n border: 2px solid var(--color-focus);\n }\n\n &__content {\n display: flex;\n align-items: center;\n gap: 0.75rem;\n }\n\n &__icon svg,\n &__action svg {\n width: 1.5rem;\n height: 1.5rem;\n fill: var(--color-axa);\n }\n\n &__title,\n &__subtitle,\n &__label {\n font-size: 1.125rem;\n line-height: 1.4rem;\n }\n\n &__title,\n &__subtitle,\n &__secondary {\n margin: 0;\n }\n\n &__label {\n text-align: left;\n color: var(--color-gray-900);\n }\n\n &__title {\n font-weight: 600;\n color: var(--color-gray-900);\n }\n\n &__subtitle {\n font-weight: 400;\n color: var(--color-gray-700);\n }\n\n &__secondary {\n font-size: 0.875rem;\n font-weight: 400;\n line-height: 1.1rem;\n color: var(--color-gray-700);\n }\n\n &__action {\n margin-left: auto;\n }\n\n &--small &__label {\n font-size: 1rem;\n line-height: 1.25rem;\n }\n\n &--large &__label {\n font-weight: 600;\n }\n\n &.af-click-item--disabled {\n pointer-events: none;\n\n .af-click-item {\n &__action svg,\n &__icon svg {\n fill: var(--color-gray-500);\n }\n\n &__label,\n &__title,\n &__subtitle,\n &__secondary {\n color: var(--color-gray-500);\n }\n }\n }\n\n &:not(.af-click-item--disabled) {\n &:hover {\n box-shadow: 0 4px 8px 0 hsla(230deg, 60%, 16%, 8%);\n }\n\n &:active {\n box-shadow: 0 2px 8px 0 hsla(0deg, 0%, 0%, 15%) inset;\n }\n }\n}\n\n@media (width <= #{common.$breakpoint-sm}) {\n .af-click-item {\n &:focus-visible {\n border: none;\n border: 1px solid var(--color-focus);\n }\n\n &__label,\n &__title,\n &__subtitle {\n font-size: 1rem;\n line-height: 1.25rem;\n }\n\n &--small &__label {\n font-size: 0.875rem;\n line-height: 1.1rem;\n }\n\n &:not(.af-click-item--disabled) {\n box-shadow: none;\n\n &:hover {\n box-shadow: none;\n\n .af-click-item {\n &__label,\n &__title,\n &__subtitle,\n &__secondary {\n color: var(--color-axa);\n }\n }\n }\n\n &:active {\n box-shadow: none;\n\n .af-click-item {\n &__label,\n &__title,\n &__subtitle,\n &__secondary {\n color: var(--color-blue-1);\n }\n }\n }\n }\n }\n}\n"]}
@@ -1 +1 @@
1
- .af-modal{background-color:var(--color-white);border:none;border-radius:.5rem;margin:0 auto;padding:0 0 1.5rem;position:fixed;width:100%}.af-modal::backdrop{background:var(--color-gray-900);opacity:.4}.af-modal__top{align-items:center;background-color:var(--color-white);border-bottom:1px solid var(--color-gray-400);display:flex;gap:1rem;padding:1.5rem;position:sticky;top:0;z-index:5}.af-modal__top-title{align-items:start;color:var(--color-gray-900);display:flex;justify-content:space-between;margin:0;width:100%}.af-modal__top-title-text{font-family:var(--font-family-publico);font-size:1.5rem;line-height:1.875rem}.af-modal__top-title-subtitle{color:var(--color-gray-700);font-family:var(--font-family-sans-serif);font-size:1.125rem;font-weight:400;line-height:1.406rem}.af-modal__top-title-close-btn{all:unset;align-items:center;cursor:pointer;display:flex;height:2rem;justify-content:center;width:2rem;fill:var(--color-axa)}.af-modal__top-title :hover{background:none}.af-modal__top-title :focus{background:none;border:none}.af-modal__content{display:flex;flex-direction:column;font-family:var(--font-family-base);font-size:1.125rem;font-weight:400;gap:2.5rem;margin-top:2.5rem;padding:0 1.5rem;z-index:0}.af-modal__actions{align-items:flex-end;display:flex;flex-direction:column-reverse;gap:1rem;justify-content:flex-end;padding-top:0}.af-modal__actions *,.af-modal__actions--fullWidth *{flex-grow:1;width:100%}@media only screen and (width >= 1024px){.af-modal{margin:auto;max-width:72rem;min-width:48rem}.af-modal__actions{flex-direction:row-reverse;justify-content:flex-start}.af-modal__actions *{flex-grow:unset;width:auto}.af-modal__actions--fullWidth *{flex-grow:1;width:100%}}
1
+ .af-modal{--spacing-modal:calc(16/var(--font-size-base)*1rem);--font-size-heading:calc(20/var(--font-size-base)*1rem);--font-size-subtitle:calc(16/var(--font-size-base)*1rem);--line-height-heading:calc(25/var(--font-size-base)*1rem);--line-height-subtitle:calc(20/var(--font-size-base)*1rem);border:none;border-radius:var(--radius-8);padding:var(--spacing-modal) 0}.af-modal::backdrop{background:var(--color-gray-900);opacity:.4}.af-modal__header{border-bottom:1px solid var(--color-gray-400);display:grid;gap:var(--spacing-modal);grid-template-areas:"headertitle closebtn";grid-template-columns:1fr auto;padding-bottom:var(--spacing-modal);padding-inline:var(--spacing-modal)}.af-modal__header>.af-btn-client{align-items:start;grid-area:closebtn;height:fit-content;justify-self:end;width:fit-content}.af-modal__header-title{display:grid;gap:0 1rem;grid-area:headertitle;grid-template-areas:"icon title" "icon subtitle";justify-self:start}.af-modal__header-title-heading{color:var(--color-gray-900);font-family:var(--font-family-publico);font-size:var(--font-size-heading);grid-area:title;line-height:var(--line-height-heading);margin:0}.af-modal__header-title-subtitle{color:var(--color-gray-700);font-size:var(--font-size-subtitle);grid-area:subtitle;line-height:var(--line-height-subtitle)}.af-modal__header-title svg{grid-area:icon;fill:var(--color-axa)}.af-modal__body{padding:var(--spacing-modal)}.af-modal__footer{display:flex;gap:var(--spacing-modal);justify-content:flex-end;padding:var(--spacing-modal) var(--spacing-modal) 0 var(--spacing-modal)}.af-modal__footer .af-btn-client{flex-grow:1}@media (width > 667px){.af-modal{--spacing-modal:calc(24/var(--font-size-base)*1rem);--font-size-heading:calc(24/var(--font-size-base)*1rem);--font-size-subtitle:calc(18/var(--font-size-base)*1rem);--line-height-heading:calc(30/var(--font-size-base)*1rem);--line-height-subtitle:calc(22.5/var(--font-size-base)*1rem);max-width:revert}.af-modal__footer .af-btn-client{flex-grow:inherit;min-width:180px}.af-modal__footer .af-btn-client:last-child{width:250px}}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Modal/Modal.scss%23sass","../../src/Modal/Modal.scss"],"names":[],"mappings":"AAEA,UAOE,mCAAA,CAFA,WAAA,CACA,mBAAA,CAHA,aAAA,CACA,kBAAA,CAHA,cAAA,CCDF,UAMA,CDGE,oBAEE,gCAAA,CADA,UCAJ,CDIE,eAOE,kBAAA,CAEA,mCAAA,CAHA,6CAAA,CAFA,YAAA,CAIA,QAAA,CAHA,cAAA,CAJA,eAAA,CAEA,KAAA,CADA,SCKJ,CDII,qBAIE,iBAAA,CAEA,2BAAA,CALA,YAAA,CAIA,6BAAA,CAFA,QAAA,CADA,UCEN,CDIM,0BACE,sCAAA,CACA,gBAAA,CACA,oBCFR,CDKM,8BAKE,2BAAA,CAJA,yCAAA,CACA,kBAAA,CACA,eAAA,CACA,oBCFR,CDMM,+BACE,SAAA,CAIA,kBAAA,CAEA,cAAA,CALA,YAAA,CAEA,WAAA,CAEA,sBAAA,CAHA,UAAA,CAKA,qBCJR,CDOM,4BACE,eCLR,CDQM,4BAEE,eAAA,CADA,WCLR,CDWE,mBAEE,YAAA,CAGA,qBAAA,CAEA,mCAAA,CACA,kBAAA,CACA,eAAA,CAHA,UAAA,CAHA,iBAAA,CACA,gBAAA,CAHA,SCDJ,CDYE,mBAIE,oBAAA,CAHA,YAAA,CAEA,6BAAA,CAGA,QAAA,CADA,wBAAA,CAHA,aCLJ,CDkBM,qDAEE,WAAA,CADA,UCXR,CDkBA,yCACE,UAGE,WAAA,CADA,eAAA,CADA,eCbF,CDiBE,mBACE,0BAAA,CACA,0BCfJ,CDiBI,qBAEE,eAAA,CADA,UCdN,CACF,gCAEA,WAAA,CDiBU,UChBR,CACF","file":"Modal.css","sourcesContent":["@use \"../common/common\" as common;\n\n.af-modal {\n position: fixed;\n width: 100%;\n margin: 0 auto;\n padding: 0 0 1.5rem;\n border: none;\n border-radius: 0.5rem;\n background-color: var(--color-white);\n\n &::backdrop {\n opacity: 0.4;\n background: var(--color-gray-900);\n }\n\n &__top {\n position: sticky;\n z-index: 5;\n top: 0;\n display: flex;\n padding: 1.5rem;\n border-bottom: 1px solid var(--color-gray-400);\n align-items: center;\n gap: 1rem;\n background-color: var(--color-white);\n\n &-title {\n display: flex;\n width: 100%;\n margin: 0;\n align-items: start;\n justify-content: space-between;\n color: var(--color-gray-900);\n\n &-text {\n font-family: var(--font-family-publico);\n font-size: 1.5rem;\n line-height: 1.875rem;\n }\n\n &-subtitle {\n font-family: var(--font-family-sans-serif);\n font-size: 1.125rem;\n font-weight: 400;\n line-height: 1.406rem;\n color: var(--color-gray-700);\n }\n\n &-close-btn {\n all: unset;\n display: flex;\n width: 2rem;\n height: 2rem;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n fill: var(--color-axa);\n }\n\n :hover {\n background: none;\n }\n\n :focus {\n border: none;\n background: none;\n }\n }\n }\n\n &__content {\n z-index: 0;\n display: flex;\n margin-top: 2.5rem;\n padding: 0 1.5rem;\n flex-direction: column;\n gap: 2.5rem;\n font-family: var(--font-family-base);\n font-size: 1.125rem;\n font-weight: 400;\n }\n\n &__actions {\n display: flex;\n padding-top: 0;\n flex-direction: column-reverse;\n align-items: flex-end;\n justify-content: flex-end;\n gap: 1rem;\n\n /* force fullwidth in mobile*/\n & * {\n width: 100%;\n flex-grow: 1;\n }\n\n &--fullWidth {\n & * {\n width: 100%;\n flex-grow: 1;\n }\n }\n }\n}\n\n@media only screen and (width >= #{common.$screen-size-m}) {\n .af-modal {\n min-width: 48rem;\n max-width: 72rem;\n margin: auto;\n\n &__actions {\n flex-direction: row-reverse;\n justify-content: flex-start;\n\n & * {\n width: auto;\n flex-grow: unset;\n }\n\n &--fullWidth {\n & * {\n width: 100%;\n flex-grow: 1;\n }\n }\n }\n }\n}\n","@use \"../common/common\" as common;\n\n.af-modal {\n position: fixed;\n width: 100%;\n margin: 0 auto;\n padding: 0 0 1.5rem;\n border: none;\n border-radius: 0.5rem;\n background-color: var(--color-white);\n\n &::backdrop {\n opacity: 0.4;\n background: var(--color-gray-900);\n }\n\n &__top {\n position: sticky;\n z-index: 5;\n top: 0;\n display: flex;\n padding: 1.5rem;\n border-bottom: 1px solid var(--color-gray-400);\n align-items: center;\n gap: 1rem;\n background-color: var(--color-white);\n\n &-title {\n display: flex;\n width: 100%;\n margin: 0;\n align-items: start;\n justify-content: space-between;\n color: var(--color-gray-900);\n\n &-text {\n font-family: var(--font-family-publico);\n font-size: 1.5rem;\n line-height: 1.875rem;\n }\n\n &-subtitle {\n font-family: var(--font-family-sans-serif);\n font-size: 1.125rem;\n font-weight: 400;\n line-height: 1.406rem;\n color: var(--color-gray-700);\n }\n\n &-close-btn {\n all: unset;\n display: flex;\n width: 2rem;\n height: 2rem;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n fill: var(--color-axa);\n }\n\n :hover {\n background: none;\n }\n\n :focus {\n border: none;\n background: none;\n }\n }\n }\n\n &__content {\n z-index: 0;\n display: flex;\n margin-top: 2.5rem;\n padding: 0 1.5rem;\n flex-direction: column;\n gap: 2.5rem;\n font-family: var(--font-family-base);\n font-size: 1.125rem;\n font-weight: 400;\n }\n\n &__actions {\n display: flex;\n padding-top: 0;\n flex-direction: column-reverse;\n align-items: flex-end;\n justify-content: flex-end;\n gap: 1rem;\n\n // force fullwidth in mobile\n & * {\n width: 100%;\n flex-grow: 1;\n }\n\n &--fullWidth {\n & * {\n width: 100%;\n flex-grow: 1;\n }\n }\n }\n}\n\n@media only screen and (width >= #{common.$screen-size-m}) {\n .af-modal {\n min-width: 48rem;\n max-width: 72rem;\n margin: auto;\n\n &__actions {\n flex-direction: row-reverse;\n justify-content: flex-start;\n\n & * {\n width: auto;\n flex-grow: unset;\n }\n\n &--fullWidth {\n & * {\n width: 100%;\n flex-grow: 1;\n }\n }\n }\n }\n}\n"]}
1
+ {"version":3,"sources":["../../src/Modal/Modal.scss%23sass","../../src/Modal/Modal.scss"],"names":[],"mappings":"AAEA,UACE,mDAAA,CCDF,uDAAA,CDGE,wDAAA,CACA,yDAAA,CACA,0DAAA,CAGA,WAAA,CACA,6BAAA,CAFA,8BCAF,CDIE,oBAEE,gCAAA,CADA,UCDJ,CDKE,kBAIE,6CAAA,CAHA,YAAA,CAMA,wBAAA,CAFA,0CAAA,CACA,8BAAA,CAJA,mCAAA,CACA,mCCCJ,CDKI,iCAIE,iBAAA,CADA,kBAAA,CADA,kBAAA,CAGA,gBAAA,CAJA,iBCCN,CDMI,wBACE,YAAA,CAMA,UAAA,CALA,qBAAA,CACA,gDAAA,CAGA,kBCLN,CDQM,gCAME,2BAAA,CAHA,sCAAA,CACA,kCAAA,CAFA,eAAA,CAGA,sCAAA,CAJA,QCDR,CDSM,iCAIE,2BAAA,CAFA,mCAAA,CADA,kBAAA,CAEA,uCCNR,CDUM,4BACE,cAAA,CACA,qBCRR,CDaE,gBACE,4BCXJ,CDcE,kBACE,YAAA,CAGA,wBAAA,CADA,wBAAA,CADA,wECVJ,CDcI,iCACE,WCZN,CDgBE,uBAhFF,UCmEE,mDAAA,CDeE,uDAAA,CCbF,wDAAA,CDeE,yDAAA,CACA,4DAAA,CAEA,gBCdF,CDiBI,iCAEE,iBAAA,CADA,eCdN,CDiBM,4CACE,WCfR,CACF","file":"Modal.css","sourcesContent":["@use \"../common/common.scss\" as common;\n\n.af-modal {\n --spacing-modal: calc(16 / var(--font-size-base) * 1rem);\n --font-size-heading: calc(20 / var(--font-size-base) * 1rem);\n --font-size-subtitle: calc(16 / var(--font-size-base) * 1rem);\n --line-height-heading: calc(25 / var(--font-size-base) * 1rem);\n --line-height-subtitle: calc(20 / var(--font-size-base) * 1rem);\n\n padding: var(--spacing-modal) 0;\n border: none;\n border-radius: var(--radius-8);\n\n &::backdrop {\n opacity: 0.4;\n background: var(--color-gray-900);\n }\n\n &__header {\n display: grid;\n padding-bottom: var(--spacing-modal);\n padding-inline: var(--spacing-modal);\n border-bottom: 1px solid var(--color-gray-400);\n grid-template-areas: \"headertitle closebtn\";\n grid-template-columns: 1fr auto;\n gap: var(--spacing-modal);\n\n > .af-btn-client {\n width: fit-content;\n height: fit-content;\n grid-area: closebtn;\n align-items: start;\n justify-self: end;\n }\n\n &-title {\n display: grid;\n grid-area: headertitle;\n grid-template-areas:\n \"icon title\"\n \"icon subtitle\";\n justify-self: start;\n gap: 0 1rem;\n\n &-heading {\n margin: 0;\n grid-area: title;\n font-family: var(--font-family-publico);\n font-size: var(--font-size-heading);\n line-height: var(--line-height-heading);\n color: var(--color-gray-900);\n }\n\n &-subtitle {\n grid-area: subtitle;\n font-size: var(--font-size-subtitle);\n line-height: var(--line-height-subtitle);\n color: var(--color-gray-700);\n }\n\n svg {\n grid-area: icon;\n fill: var(--color-axa);\n }\n }\n }\n\n &__body {\n padding: var(--spacing-modal);\n }\n\n &__footer {\n display: flex;\n padding: var(--spacing-modal) var(--spacing-modal) 0 var(--spacing-modal);\n justify-content: flex-end;\n gap: var(--spacing-modal);\n\n .af-btn-client {\n flex-grow: 1;\n }\n }\n\n @media (width > #{common.$breakpoint-sm}) {\n --spacing-modal: calc(24 / var(--font-size-base) * 1rem);\n --font-size-heading: calc(24 / var(--font-size-base) * 1rem);\n --font-size-subtitle: calc(18 / var(--font-size-base) * 1rem);\n --line-height-heading: calc(30 / var(--font-size-base) * 1rem);\n --line-height-subtitle: calc(22.5 / var(--font-size-base) * 1rem);\n\n max-width: revert;\n\n &__footer {\n .af-btn-client {\n min-width: 180px;\n flex-grow: inherit;\n\n &:last-child {\n width: 250px;\n }\n }\n }\n }\n}\n","@use \"../common/common.scss\" as common;\n\n.af-modal {\n --spacing-modal: calc(16 / var(--font-size-base) * 1rem);\n --font-size-heading: calc(20 / var(--font-size-base) * 1rem);\n --font-size-subtitle: calc(16 / var(--font-size-base) * 1rem);\n --line-height-heading: calc(25 / var(--font-size-base) * 1rem);\n --line-height-subtitle: calc(20 / var(--font-size-base) * 1rem);\n\n padding: var(--spacing-modal) 0;\n border: none;\n border-radius: var(--radius-8);\n\n &::backdrop {\n opacity: 0.4;\n background: var(--color-gray-900);\n }\n\n &__header {\n display: grid;\n padding-bottom: var(--spacing-modal);\n padding-inline: var(--spacing-modal);\n border-bottom: 1px solid var(--color-gray-400);\n grid-template-areas: \"headertitle closebtn\";\n grid-template-columns: 1fr auto;\n gap: var(--spacing-modal);\n\n > .af-btn-client {\n width: fit-content;\n height: fit-content;\n grid-area: closebtn;\n align-items: start;\n justify-self: end;\n }\n\n &-title {\n display: grid;\n grid-area: headertitle;\n grid-template-areas:\n \"icon title\"\n \"icon subtitle\";\n justify-self: start;\n gap: 0 1rem;\n\n &-heading {\n margin: 0;\n grid-area: title;\n font-family: var(--font-family-publico);\n font-size: var(--font-size-heading);\n line-height: var(--line-height-heading);\n color: var(--color-gray-900);\n }\n\n &-subtitle {\n grid-area: subtitle;\n font-size: var(--font-size-subtitle);\n line-height: var(--line-height-subtitle);\n color: var(--color-gray-700);\n }\n\n svg {\n grid-area: icon;\n fill: var(--color-axa);\n }\n }\n }\n\n &__body {\n padding: var(--spacing-modal);\n }\n\n &__footer {\n display: flex;\n padding: var(--spacing-modal) var(--spacing-modal) 0 var(--spacing-modal);\n justify-content: flex-end;\n gap: var(--spacing-modal);\n\n .af-btn-client {\n flex-grow: 1;\n }\n }\n\n @media (width > #{common.$breakpoint-sm}) {\n --spacing-modal: calc(24 / var(--font-size-base) * 1rem);\n --font-size-heading: calc(24 / var(--font-size-base) * 1rem);\n --font-size-subtitle: calc(18 / var(--font-size-base) * 1rem);\n --line-height-heading: calc(30 / var(--font-size-base) * 1rem);\n --line-height-subtitle: calc(22.5 / var(--font-size-base) * 1rem);\n\n max-width: revert;\n\n &__footer {\n .af-btn-client {\n min-width: 180px;\n flex-grow: inherit;\n\n &:last-child {\n width: 250px;\n }\n }\n }\n }\n}\n"]}