@axa-fr/design-system-look-and-feel-css 0.2.0-beta.331 → 0.2.0-beta.333

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.
@@ -1 +1 @@
1
- .af-accordion-client{background-color:#fff;border-radius:8px;display:block;font-family:Source Sans Pro,arial,sans-serif;margin:0;padding:0}.af-accordion-client__item:not(:last-child){border-bottom:1px solid #e9ecf2}.af-accordion-client__item>h3{font-size:1.125rem;font-weight:600;margin:0;width:100%}.af-accordion-client__item>h3:has(button[aria-expanded=true]){border-bottom:none;color:#00008f}.af-accordion-client__item>h3>button{align-items:center;background-color:inherit;border:0;color:inherit;cursor:pointer;display:flex;font-size:1.125rem;font-weight:600;padding:15px 20px;text-align:start;width:100%}.af-accordion-client__item>h3>button:focus{outline:unset}.af-accordion-client__item>h3>button:focus-visible{outline:2px solid #36f;outline-offset:3px}.af-accordion-client__item>h3>button:after{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' fill='none' viewBox='0 0 32 32'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%2300008F' d='m24 13.333-1.88-1.88L16 17.56l-6.12-6.107L8 13.333l8 8z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M32 0v32H0V0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");background-repeat:no-repeat;background-size:100%;content:"";flex-shrink:0;height:32px;margin-left:auto;transition:transform .2s ease-in-out;width:32px}.af-accordion-client__item>h3>button[aria-expanded=true]:after{transform:rotate(180deg)}.af-accordion-client__item>[role=region]{margin-bottom:1rem;padding:0 20px}
1
+ .af-accordion{--summary-areas:"tag-date-container title-container value arrow";--summary-columns:auto 1fr repeat(2,auto);--title-container-areas:"icon title" "icon subtitle";--title-container-columns:min-content 1fr}.af-accordion__summary{grid-template-areas:var(--summary-areas);grid-template-columns:var(--summary-columns)}.af-accordion__summary:not(:has(.af-accordion__tag-date-container)){--summary-areas:"title-container value arrow";--summary-columns:1fr repeat(2,auto)}.af-accordion__summary:not(:has(.af-accordion__value)){--summary-areas:"tag-date-container title-container arrow";--summary-columns:auto 1fr auto}.af-accordion__summary:not(:has(.af-accordion__value)):not(:has(.af-accordion__tag-date-container)){--summary-areas:"title-container arrow";--summary-columns:1fr auto}.af-accordion__summary .af-accordion__icon{align-items:center;display:grid;grid-area:icon}.af-accordion__summary .af-accordion__title-container{display:grid;gap:.125rem 1rem;grid-area:title-container;grid-template:var(--title-container-areas);grid-template-columns:var(--title-container-columns)}.af-accordion__summary .af-accordion__title-container:not(:has(.af-accordion__icon)){--title-container-areas:"title" "subtitle";--title-container-columns:1fr;column-gap:0}.af-accordion__summary .af-accordion__title-container:not(:has(.af-accordion__subtitle)){--title-container-areas:"icon title";row-gap:0}.af-accordion__summary .af-accordion__title-container:not(:has(.af-accordion__subtitle)):not(:has(.af-accordion__icon)){--title-container-areas:"title"}.af-accordion__summary .af-accordion__title-container .af-accordion__title{grid-area:title}.af-accordion__summary .af-accordion__title-container .af-accordion__subtitle{color:#5f5f5f;font-size:1rem;font-weight:400;grid-area:subtitle;line-height:1.25rem}.af-accordion__summary .af-accordion__value{color:#118635;display:grid;grid-area:value;justify-items:center;min-width:9.375rem}.af-accordion__summary .af-accordion__tag-date-container{display:grid;grid-area:tag-date-container;grid-template:"tag" "date";padding-right:3.93rem;row-gap:.5rem}.af-accordion__summary .af-accordion__tag-date-container .af-accordion__tag-container{grid-area:tag;justify-items:center;text-align:center}.af-accordion__summary .af-accordion__tag-date-container .af-accordion__tag-container .af-tag{cursor:inherit}.af-accordion__summary .af-accordion__tag-date-container .af-accordion__date{align-items:center;color:#5f5f5f;display:grid;grid-area:date;text-align:center}.af-accordion__summary--title-first{--summary-areas:"title-container tag-date-container value arrow";--summary-columns:repeat(3,auto) min-content}.af-accordion__summary--title-first:not(:has(.af-accordion__value)){--summary-areas:"title-container tag-date-container arrow";--summary-columns:repeat(2,auto) min-content}.af-accordion__summary--title-first .af-accordion__tag-date-container{column-gap:inherit;grid-template:"tag date";padding:0}.af-accordion__summary--title-first .af-accordion__tag-date-container .af-accordion__tag-container{padding:0 1.688rem}.af-accordion__summary--title-first .af-accordion__tag-date-container .af-accordion__date{padding:0 3.125rem}.af-accordion__summary--title-first .af-accordion__value{min-width:auto}.af-accordion__summary .af-accordion__tag-date-container:has(>:only-child){row-gap:0}@media (width <= 1023px){.af-accordion .af-accordion__summary--title-first .af-accordion__tag-date-container .af-accordion__date,.af-accordion .af-accordion__summary--title-first .af-accordion__tag-date-container .af-accordion__tag-container{padding:0}}@media (width <= 667px){.af-accordion .af-accordion__summary{--summary-areas:"tag-date-container arrow" "title-container arrow" "value arrow";--summary-columns:1fr;column-gap:0}.af-accordion .af-accordion__summary .af-accordion__title-container{justify-content:start}.af-accordion .af-accordion__summary .af-accordion__title-container .af-accordion__subtitle{font-size:.875rem;line-height:1.1rem}.af-accordion .af-accordion__summary .af-accordion__tag-date-container{display:flex;gap:.5rem}.af-accordion .af-accordion__summary .af-accordion__value{justify-content:start}.af-accordion .af-accordion__summary--title-first{--summary-areas:"icon title-container arrow" "icon tag-date-container arrow" "icon value arrow";--summary-columns:auto 1fr auto;column-gap:.75rem}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__icon)){--summary-areas:"title-container arrow" "tag-date-container arrow" "value arrow";--summary-columns:1fr auto}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__tag-date-container)){--summary-areas:"icon title-container arrow" "icon value arrow"}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__value)){--summary-areas:"icon title-container arrow" "icon tag-date-container arrow"}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__icon),:has(.af-accordion__tag-date-container)){--summary-areas:"title-container arrow" "value arrow"}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__tag-date-container),:has(.af-accordion__value)){--summary-areas:"icon title-container arrow";--summary-columns:auto 1fr auto}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__icon),:has(.af-accordion__value)){--summary-areas:"title-container arrow" "tag-date-container arrow"}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__icon),:has(.af-accordion__tag-date-container),:has(.af-accordion__value)){--summary-areas:"title-container arrow";--summary-columns:1fr auto}}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Accordion/Accordion.scss%23sass","../../src/Accordion/Accordion.scss"],"names":[],"mappings":"AAEA,qBAME,qBAAA,CAFA,iBAAA,CAHA,aAAA,CAIA,4CAAA,CCLF,QAAA,CDGE,SCEF,CDII,4CACE,+BCFN,CDKI,8BAGE,kBAAA,CACA,eAAA,CAFA,QAAA,CADA,UCAN,CDKM,8DACE,kBAAA,CACA,aCHR,CDMM,qCAKE,kBAAA,CAKA,wBAAA,CANA,QAAA,CAKA,aAAA,CAEA,cAAA,CAVA,YAAA,CAKA,kBAAA,CACA,eAAA,CAJA,iBAAA,CAKA,gBAAA,CANA,UCKR,CDMQ,2CACE,aCJV,CDOQ,mDACE,sBAAA,CACA,kBCLV,CDQQ,2CAKE,uYAAA,CACA,2BAAA,CACA,oBAAA,CAEA,UAAA,CALA,aAAA,CAFA,WAAA,CACA,gBAAA,CAKA,oCAAA,CAPA,UCEV,CDUU,+DACE,wBCRZ,CDcI,yCACE,kBAAA,CACA,cCZN","file":"Accordion.css","sourcesContent":["@use \"../common/common\" as common;\n\n.af-accordion-client {\n display: block;\n margin: 0;\n padding: 0;\n border-radius: 8px;\n font-family: \"Source Sans Pro\", arial, sans-serif;\n background-color: common.$color-white;\n\n &__item {\n &:not(:last-child) {\n border-bottom: 1px solid #e9ecf2;\n }\n\n & > h3 {\n width: 100%;\n margin: 0;\n font-size: 1.125rem;\n font-weight: 600;\n\n &:has(button[aria-expanded=\"true\"]) {\n border-bottom: none;\n color: common.$color-axa;\n }\n\n & > button {\n display: flex;\n width: 100%;\n padding: 15px 20px;\n border: 0;\n align-items: center;\n font-size: 1.125rem;\n font-weight: 600;\n text-align: start;\n color: inherit;\n background-color: inherit;\n cursor: pointer;\n\n &:focus {\n outline: unset;\n }\n\n &:focus-visible {\n outline: 2px solid common.$color-blue-3;\n outline-offset: 3px;\n }\n\n &::after {\n width: 32px;\n height: 32px;\n margin-left: auto;\n flex-shrink: 0;\n background-image: url(\"data:image/svg+xml,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_14583_27882)%22%3E%0A%3Cpath%20d%3D%22M24%2013.3331L22.12%2011.4531L16%2017.5598L9.88%2011.4531L8%2013.3331L16%2021.3331L24%2013.3331Z%22%20fill%3D%22%2300008F%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3CclipPath%20id%3D%22clip0_14583_27882%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%20transform%3D%22matrix(0%201%20-1%200%2032%200)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E%0A\");\n background-repeat: no-repeat;\n background-size: 100%;\n transition: transform 0.2s ease-in-out;\n content: \"\";\n }\n\n &[aria-expanded=\"true\"] {\n &::after {\n transform: rotate(180deg);\n }\n }\n }\n }\n\n & > [role=\"region\"] {\n margin-bottom: 1rem;\n padding: 0 20px;\n }\n }\n}\n","@use \"../common/common\" as common;\n\n.af-accordion-client {\n display: block;\n margin: 0;\n padding: 0;\n border-radius: 8px;\n font-family: \"Source Sans Pro\", arial, sans-serif;\n background-color: common.$color-white;\n\n &__item {\n &:not(:last-child) {\n border-bottom: 1px solid #e9ecf2;\n }\n\n & > h3 {\n width: 100%;\n margin: 0;\n font-size: 1.125rem;\n font-weight: 600;\n\n &:has(button[aria-expanded=\"true\"]) {\n border-bottom: none;\n color: common.$color-axa;\n }\n\n & > button {\n display: flex;\n width: 100%;\n padding: 15px 20px;\n border: 0;\n align-items: center;\n font-size: 1.125rem;\n font-weight: 600;\n text-align: start;\n color: inherit;\n background-color: inherit;\n cursor: pointer;\n\n &:focus {\n outline: unset;\n }\n\n &:focus-visible {\n outline: 2px solid common.$color-blue-3;\n outline-offset: 3px;\n }\n\n &::after {\n width: 32px;\n height: 32px;\n margin-left: auto;\n flex-shrink: 0;\n background-image: url(\"data:image/svg+xml,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_14583_27882)%22%3E%0A%3Cpath%20d%3D%22M24%2013.3331L22.12%2011.4531L16%2017.5598L9.88%2011.4531L8%2013.3331L16%2021.3331L24%2013.3331Z%22%20fill%3D%22%2300008F%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3CclipPath%20id%3D%22clip0_14583_27882%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%20transform%3D%22matrix(0%201%20-1%200%2032%200)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E%0A\");\n background-repeat: no-repeat;\n background-size: 100%;\n transition: transform 0.2s ease-in-out;\n content: \"\";\n }\n\n &[aria-expanded=\"true\"] {\n &::after {\n transform: rotate(180deg);\n }\n }\n }\n }\n\n & > [role=\"region\"] {\n margin-bottom: 1rem;\n padding: 0 20px;\n }\n }\n}\n"]}
1
+ {"version":3,"sources":["../../src/Accordion/Accordion.scss%23sass","../../src/Accordion/Accordion.scss","../../src/common/common.scss"],"names":[],"mappings":"AAEA,cACE,gEAAA,CCDF,yCAAA,CDGE,oDAAA,CACA,yCCDF,CDGE,uBACE,wCAAA,CACA,4CCDJ,CDGI,oEACE,6CAAA,CACA,oCCDN,CDII,uDACE,0DAAA,CACA,+BCFN,CDIM,oGACE,uCAAA,CACA,0BCFR,CDOM,2CAGE,kBAAA,CAFA,YAAA,CACA,cCJR,CDQM,sDACE,YAAA,CAIA,gBAAA,CAHA,yBAAA,CACA,0CAAA,CACA,oDCLR,CDQQ,qFACE,0CAAA,CACA,6BAAA,CAEA,YCPV,CDUQ,yFACE,oCAAA,CAEA,SCTV,CDWU,wHACE,+BCTZ,CDcU,2EACE,eCZZ,CDeU,8EAKE,aEnCK,CFgCL,cAAA,CACA,eAAA,CAFA,kBAAA,CAGA,mBCZZ,CDkBM,4CAKE,aE3CU,CFuCV,YAAA,CAEA,eAAA,CACA,oBAAA,CAFA,kBCbR,CDmBM,yDACE,YAAA,CAEA,4BAAA,CACA,0BAAA,CAFA,qBAAA,CAGA,aCjBR,CDoBU,sFACE,aAAA,CACA,oBAAA,CACA,iBClBZ,CDoBY,8FACE,cClBd,CDsBU,6EAGE,kBAAA,CAEA,aAAA,CAJA,YAAA,CACA,cAAA,CAEA,iBCnBZ,CD0BI,oCACE,gEAAA,CACA,4CCxBN,CD0BM,oEACE,0DAAA,CACA,4CCxBR,CD4BQ,sEAGE,kBAAA,CADA,wBAAA,CADA,SCxBV,CD6BY,mGACE,kBC3Bd,CD8BY,0FACE,kBC5Bd,CDiCQ,yDACE,cC/BV,CDoCI,2EACE,SClCN,CDsCE,yBAII,yNAEE,SCxCN,CACF,CD4CE,wBACE,qCACE,gFAAA,CAEA,qBAAA,CAEA,YC3CJ,CD8CM,oEACE,qBC5CR,CD+CU,4FACE,iBAAA,CACA,kBC7CZ,CDkDM,uEACE,YAAA,CACA,SChDR,CDmDM,0DACE,qBCjDR,CDqDI,kDACE,+FAAA,CAEA,+BAAA,CAEA,iBCpDN,CDsDM,iFACE,gFAAA,CCnDR,0BACA,CDuDM,+FACE,+DCrDR,CDwDM,kFACE,4ECrDR,CDyDM,yHCtDN,qDACA,CD4DM,0HAIE,4CAAA,CACA,+BC5DR,CD+DM,4GACE,kEC7DR,CDgEM,oJAKE,uCAAA,CACA,0BChER,CACF","file":"Accordion.css","sourcesContent":["@use \"../common/common.scss\" as common;\n\n.af-accordion {\n --summary-areas: \"tag-date-container title-container value arrow\";\n --summary-columns: auto 1fr repeat(2, auto);\n --title-container-areas: \"icon title\" \"icon subtitle\";\n --title-container-columns: min-content 1fr;\n\n &__summary {\n grid-template-areas: var(--summary-areas);\n grid-template-columns: var(--summary-columns);\n\n &:not(:has(.af-accordion__tag-date-container)) {\n --summary-areas: \"title-container value arrow\";\n --summary-columns: 1fr repeat(2, auto);\n }\n\n &:not(:has(.af-accordion__value)) {\n --summary-areas: \"tag-date-container title-container arrow\";\n --summary-columns: auto 1fr auto;\n\n &:not(:has(.af-accordion__tag-date-container)) {\n --summary-areas: \"title-container arrow\";\n --summary-columns: 1fr auto;\n }\n }\n\n .af-accordion {\n &__icon {\n display: grid;\n grid-area: icon;\n align-items: center;\n }\n\n &__title-container {\n display: grid;\n grid-area: title-container;\n grid-template: var(--title-container-areas);\n grid-template-columns: var(--title-container-columns);\n gap: 0.125rem 1rem;\n\n &:not(:has(.af-accordion__icon)) {\n --title-container-areas: \"title\" \"subtitle\";\n --title-container-columns: 1fr;\n\n column-gap: 0;\n }\n\n &:not(:has(.af-accordion__subtitle)) {\n --title-container-areas: \"icon title\";\n\n row-gap: 0;\n\n &:not(:has(.af-accordion__icon)) {\n --title-container-areas: \"title\";\n }\n }\n\n .af-accordion {\n &__title {\n grid-area: title;\n }\n\n &__subtitle {\n grid-area: subtitle;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.25rem;\n color: common.$color-gray-700;\n }\n }\n }\n\n &__value {\n display: grid;\n min-width: 9.375rem;\n grid-area: value;\n justify-items: center;\n color: common.$color-green-600;\n }\n\n &__tag-date-container {\n display: grid;\n padding-right: 3.93rem;\n grid-area: tag-date-container;\n grid-template: \"tag\" \"date\";\n row-gap: 0.5rem;\n\n .af-accordion {\n &__tag-container {\n grid-area: tag;\n justify-items: center;\n text-align: center;\n\n .af-tag {\n cursor: inherit;\n }\n }\n\n &__date {\n display: grid;\n grid-area: date;\n align-items: center;\n text-align: center;\n color: common.$color-gray-700;\n }\n }\n }\n }\n\n &--title-first {\n --summary-areas: \"title-container tag-date-container value arrow\";\n --summary-columns: repeat(3, auto) min-content;\n\n &:not(:has(.af-accordion__value)) {\n --summary-areas: \"title-container tag-date-container arrow\";\n --summary-columns: repeat(2, auto) min-content;\n }\n\n .af-accordion {\n &__tag-date-container {\n padding: 0;\n grid-template: \"tag date\";\n column-gap: inherit;\n\n .af-accordion {\n &__tag-container {\n padding: 0 1.688rem;\n }\n\n &__date {\n padding: 0 3.125rem;\n }\n }\n }\n\n &__value {\n min-width: auto;\n }\n }\n }\n\n .af-accordion__tag-date-container:has(> :only-child) {\n row-gap: 0;\n }\n }\n\n @media (width <= #{common.$breakpoint-md}) {\n .af-accordion__summary--title-first\n .af-accordion__tag-date-container\n .af-accordion {\n &__tag-container,\n &__date {\n padding: 0;\n }\n }\n }\n\n @media (width <= #{common.$breakpoint-sm}) {\n .af-accordion__summary {\n --summary-areas: \"tag-date-container arrow\" \"title-container arrow\"\n \"value arrow\";\n --summary-columns: 1fr;\n\n column-gap: 0;\n\n .af-accordion {\n &__title-container {\n justify-content: start;\n\n .af-accordion {\n &__subtitle {\n font-size: 0.875rem;\n line-height: 1.1rem;\n }\n }\n }\n\n &__tag-date-container {\n display: flex;\n gap: 0.5rem;\n }\n\n &__value {\n justify-content: start;\n }\n }\n\n &--title-first {\n --summary-areas: \"icon title-container arrow\"\n \"icon tag-date-container arrow\" \"icon value arrow\";\n --summary-columns: auto 1fr auto;\n\n column-gap: 0.75rem;\n\n &:not(:has(.af-accordion__icon)) {\n --summary-areas: \"title-container arrow\" \"tag-date-container arrow\"\n \"value arrow\";\n --summary-columns: 1fr auto;\n }\n\n &:not(:has(.af-accordion__tag-date-container)) {\n --summary-areas: \"icon title-container arrow\" \"icon value arrow\";\n }\n\n &:not(:has(.af-accordion__value)) {\n --summary-areas: \"icon title-container arrow\"\n \"icon tag-date-container arrow\";\n }\n\n &:not(\n :has(.af-accordion__icon),\n :has(.af-accordion__tag-date-container)\n ) {\n --summary-areas: \"title-container arrow\" \"value arrow\";\n }\n\n &:not(\n :has(.af-accordion__tag-date-container),\n :has(.af-accordion__value)\n ) {\n --summary-areas: \"icon title-container arrow\";\n --summary-columns: auto 1fr auto;\n }\n\n &:not(:has(.af-accordion__icon), :has(.af-accordion__value)) {\n --summary-areas: \"title-container arrow\" \"tag-date-container arrow\";\n }\n\n &:not(\n :has(.af-accordion__icon),\n :has(.af-accordion__tag-date-container),\n :has(.af-accordion__value)\n ) {\n --summary-areas: \"title-container arrow\";\n --summary-columns: 1fr auto;\n }\n }\n }\n }\n}\n","@use \"../common/common.scss\" as common;\n\n.af-accordion {\n --summary-areas: \"tag-date-container title-container value arrow\";\n --summary-columns: auto 1fr repeat(2, auto);\n --title-container-areas: \"icon title\" \"icon subtitle\";\n --title-container-columns: min-content 1fr;\n\n &__summary {\n grid-template-areas: var(--summary-areas);\n grid-template-columns: var(--summary-columns);\n\n &:not(:has(.af-accordion__tag-date-container)) {\n --summary-areas: \"title-container value arrow\";\n --summary-columns: 1fr repeat(2, auto);\n }\n\n &:not(:has(.af-accordion__value)) {\n --summary-areas: \"tag-date-container title-container arrow\";\n --summary-columns: auto 1fr auto;\n\n &:not(:has(.af-accordion__tag-date-container)) {\n --summary-areas: \"title-container arrow\";\n --summary-columns: 1fr auto;\n }\n }\n\n .af-accordion {\n &__icon {\n display: grid;\n grid-area: icon;\n align-items: center;\n }\n\n &__title-container {\n display: grid;\n grid-area: title-container;\n grid-template: var(--title-container-areas);\n grid-template-columns: var(--title-container-columns);\n gap: 0.125rem 1rem;\n\n &:not(:has(.af-accordion__icon)) {\n --title-container-areas: \"title\" \"subtitle\";\n --title-container-columns: 1fr;\n\n column-gap: 0;\n }\n\n &:not(:has(.af-accordion__subtitle)) {\n --title-container-areas: \"icon title\";\n\n row-gap: 0;\n\n &:not(:has(.af-accordion__icon)) {\n --title-container-areas: \"title\";\n }\n }\n\n .af-accordion {\n &__title {\n grid-area: title;\n }\n\n &__subtitle {\n grid-area: subtitle;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.25rem;\n color: common.$color-gray-700;\n }\n }\n }\n\n &__value {\n display: grid;\n min-width: 9.375rem;\n grid-area: value;\n justify-items: center;\n color: common.$color-green-600;\n }\n\n &__tag-date-container {\n display: grid;\n padding-right: 3.93rem;\n grid-area: tag-date-container;\n grid-template: \"tag\" \"date\";\n row-gap: 0.5rem;\n\n .af-accordion {\n &__tag-container {\n grid-area: tag;\n justify-items: center;\n text-align: center;\n\n .af-tag {\n cursor: inherit;\n }\n }\n\n &__date {\n display: grid;\n grid-area: date;\n align-items: center;\n text-align: center;\n color: common.$color-gray-700;\n }\n }\n }\n }\n\n &--title-first {\n --summary-areas: \"title-container tag-date-container value arrow\";\n --summary-columns: repeat(3, auto) min-content;\n\n &:not(:has(.af-accordion__value)) {\n --summary-areas: \"title-container tag-date-container arrow\";\n --summary-columns: repeat(2, auto) min-content;\n }\n\n .af-accordion {\n &__tag-date-container {\n padding: 0;\n grid-template: \"tag date\";\n column-gap: inherit;\n\n .af-accordion {\n &__tag-container {\n padding: 0 1.688rem;\n }\n\n &__date {\n padding: 0 3.125rem;\n }\n }\n }\n\n &__value {\n min-width: auto;\n }\n }\n }\n\n .af-accordion__tag-date-container:has(> :only-child) {\n row-gap: 0;\n }\n }\n\n @media (width <= #{common.$breakpoint-md}) {\n .af-accordion__summary--title-first\n .af-accordion__tag-date-container\n .af-accordion {\n &__tag-container,\n &__date {\n padding: 0;\n }\n }\n }\n\n @media (width <= #{common.$breakpoint-sm}) {\n .af-accordion__summary {\n --summary-areas: \"tag-date-container arrow\" \"title-container arrow\"\n \"value arrow\";\n --summary-columns: 1fr;\n\n column-gap: 0;\n\n .af-accordion {\n &__title-container {\n justify-content: start;\n\n .af-accordion {\n &__subtitle {\n font-size: 0.875rem;\n line-height: 1.1rem;\n }\n }\n }\n\n &__tag-date-container {\n display: flex;\n gap: 0.5rem;\n }\n\n &__value {\n justify-content: start;\n }\n }\n\n &--title-first {\n --summary-areas: \"icon title-container arrow\"\n \"icon tag-date-container arrow\" \"icon value arrow\";\n --summary-columns: auto 1fr auto;\n\n column-gap: 0.75rem;\n\n &:not(:has(.af-accordion__icon)) {\n --summary-areas: \"title-container arrow\" \"tag-date-container arrow\"\n \"value arrow\";\n --summary-columns: 1fr auto;\n }\n\n &:not(:has(.af-accordion__tag-date-container)) {\n --summary-areas: \"icon title-container arrow\" \"icon value arrow\";\n }\n\n &:not(:has(.af-accordion__value)) {\n --summary-areas: \"icon title-container arrow\"\n \"icon tag-date-container arrow\";\n }\n\n &:not(\n :has(.af-accordion__icon),\n :has(.af-accordion__tag-date-container)\n ) {\n --summary-areas: \"title-container arrow\" \"value arrow\";\n }\n\n &:not(\n :has(.af-accordion__tag-date-container),\n :has(.af-accordion__value)\n ) {\n --summary-areas: \"icon title-container arrow\";\n --summary-columns: auto 1fr auto;\n }\n\n &:not(:has(.af-accordion__icon), :has(.af-accordion__value)) {\n --summary-areas: \"title-container arrow\" \"tag-date-container arrow\";\n }\n\n &:not(\n :has(.af-accordion__icon),\n :has(.af-accordion__tag-date-container),\n :has(.af-accordion__value)\n ) {\n --summary-areas: \"title-container arrow\";\n --summary-columns: 1fr auto;\n }\n }\n }\n }\n}\n","$font-family-sans-serif: \"Source Sans Pro\", arial, sans-serif !default;\n$font-family-serif: georgia, times, \"Times New Roman\", serif !default;\n$font-family-base: $font-family-sans-serif !default;\n$font-family-publico-bold: \"Publico Headline Bold\" !default;\n$font-family-publico: \"Publico Headline\" !default;\n// colors\n\n$color-axa: #00008f !default;\n$color-white: #fff !default;\n$color-black: #000 !default;\n$color-red: #ff1721 !default;\n$color-gray: #5f5f5f !default;\n$color-red-700: #c91432 !default;\n$color-blue-1: #000072 !default;\n$color-blue-2: #f8f8ff !default;\n$color-blue-3: #36f !default;\n$color-btn-light: #3333a5 !default;\n$color-btn-business: #c94e14 !default;\n$color-btn-business-dark: #a8391c !default;\n$color-btn-business-light: #df7e65 !default;\n$color-btn-disabled-text: #999 !default;\n$color-btn-disabled-border: #e5e5e5 !default;\n$color-btn-error-text: #a11028 !default;\n$color-btn-error-bg: #fff3f5 !default;\n$color-btn-tertiary-bg: #eef !default;\n$color-btn-tertiary-bg-darker: #e4e4ff !default;\n$color-btn-tertiary-bg-lighter: #f8f8ff !default;\n$color-oceanBlue: #4976ba !default;\n$color-gray-1: #ccc !default;\n$color-gray-200: #f3f3f3;\n$color-gray-300: #e9ecf2;\n$color-gray-400: #e5e5e5;\n$color-gray-500: #999;\n$color-gray-700: #5f5f5f;\n$color-gray-900: #333 !default;\n$color-green-600: #118635 !default;\n$color-border: #f3f3f3 !default;\n$color-focus: #36f !default;\n\n// others\n\n$default-border-radius: 4px !default;\n\n$transition-duration: 0.2s !default;\n\n// spacing\n\n$sizing-u0: 0 !default;\n$sizing-u05: 0.4rem !default;\n$sizing-u1: 0.8rem !default;\n$sizing-u2: 1.6rem !default;\n$sizing-u3: 2.4rem !default;\n$sizing-u4: 3.2rem !default;\n$sizing-u5: 4rem !default;\n$sizing-u6: 4.8rem !default;\n$sizing-u7: 5.6rem !default;\n$sizing-u8: 6.4rem !default;\n$sizing-u9: 7.2rem !default;\n$sizing-u10: 8rem !default;\n$spacing-u0: 0 !default;\n$spacing-u05: 0.4rem !default;\n$spacing-u1: 0.8rem !default;\n$spacing-u2: 1.6rem !default;\n$spacing-u3: 2.4rem !default;\n$spacing-u4: 3.2rem !default;\n$spacing-u5: 4rem !default;\n$spacing-u6: 4.8rem !default;\n$spacing-u7: 5.6rem !default;\n$spacing-u8: 6.4rem !default;\n$spacing-u9: 7.2rem !default;\n$spacing-u10: 8rem !default;\n$spacing-u11: 8.8rem !default;\n$spacing-u12: 9.6rem !default;\n$spacing-u13: 10.4rem !default;\n$spacing-u14: 11.2rem !default;\n$spacing-u15: 12rem !default;\n$spacing-u16: 12.8rem !default;\n$spacing-u17: 13.6rem !default;\n$spacing-u18: 14.4rem !default;\n$spacing-u19: 15.2rem !default;\n$spacing-u20: 16rem !default;\n$screen-size-668: s !default;\n$screen-size-1024: m !default;\n$screen-size-1200: oldl !default;\n$screen-size-1280: l !default;\n$screen-size-1540: oldxl !default;\n$screen-size-1600: xl !default;\n$screen-size-s: 668px !default;\n$screen-size-m: 1024px !default;\n$screen-size-l: 1280px !default;\n$screen-size-xl: 1600px !default;\n$screen-size-oldl: 1200px !default;\n$screen-size-oldxl: 1540px !default;\n\n$error-custom-border: #d18e8e !default;\n$error-custom-bg: #ffbfbf !default;\n\n$color-alertDanger-colorBorder: #c8b282 !default;\n$color-alertDanger-bgColor: #f1d596 !default;\n\n// breakpoints\n\n$breakpoint-xs: 0 !default;\n$breakpoint-sm: 667px !default;\n$breakpoint-md: 1023px !default;\n$breakpoint-lg: 1279px !default;\n$breakpoint-xl: 1599px !default;\n"]}
@@ -1,74 +1,241 @@
1
- @use "../common/common" as common;
2
-
3
- .af-accordion-client {
4
- display: block;
5
- margin: 0;
6
- padding: 0;
7
- border-radius: 8px;
8
- font-family: "Source Sans Pro", arial, sans-serif;
9
- background-color: common.$color-white;
10
-
11
- &__item {
12
- &:not(:last-child) {
13
- border-bottom: 1px solid #e9ecf2;
1
+ @use "../common/common.scss" as common;
2
+
3
+ .af-accordion {
4
+ --summary-areas: "tag-date-container title-container value arrow";
5
+ --summary-columns: auto 1fr repeat(2, auto);
6
+ --title-container-areas: "icon title" "icon subtitle";
7
+ --title-container-columns: min-content 1fr;
8
+
9
+ &__summary {
10
+ grid-template-areas: var(--summary-areas);
11
+ grid-template-columns: var(--summary-columns);
12
+
13
+ &:not(:has(.af-accordion__tag-date-container)) {
14
+ --summary-areas: "title-container value arrow";
15
+ --summary-columns: 1fr repeat(2, auto);
14
16
  }
15
17
 
16
- & > h3 {
17
- width: 100%;
18
- margin: 0;
19
- font-size: 1.125rem;
20
- font-weight: 600;
18
+ &:not(:has(.af-accordion__value)) {
19
+ --summary-areas: "tag-date-container title-container arrow";
20
+ --summary-columns: auto 1fr auto;
21
21
 
22
- &:has(button[aria-expanded="true"]) {
23
- border-bottom: none;
24
- color: common.$color-axa;
22
+ &:not(:has(.af-accordion__tag-date-container)) {
23
+ --summary-areas: "title-container arrow";
24
+ --summary-columns: 1fr auto;
25
25
  }
26
+ }
26
27
 
27
- & > button {
28
- display: flex;
29
- width: 100%;
30
- padding: 15px 20px;
31
- border: 0;
28
+ .af-accordion {
29
+ &__icon {
30
+ display: grid;
31
+ grid-area: icon;
32
32
  align-items: center;
33
- font-size: 1.125rem;
34
- font-weight: 600;
35
- text-align: start;
36
- color: inherit;
37
- background-color: inherit;
38
- cursor: pointer;
33
+ }
39
34
 
40
- &:focus {
41
- outline: unset;
35
+ &__title-container {
36
+ display: grid;
37
+ grid-area: title-container;
38
+ grid-template: var(--title-container-areas);
39
+ grid-template-columns: var(--title-container-columns);
40
+ gap: 0.125rem 1rem;
41
+
42
+ &:not(:has(.af-accordion__icon)) {
43
+ --title-container-areas: "title" "subtitle";
44
+ --title-container-columns: 1fr;
45
+
46
+ column-gap: 0;
42
47
  }
43
48
 
44
- &:focus-visible {
45
- outline: 2px solid common.$color-blue-3;
46
- outline-offset: 3px;
49
+ &:not(:has(.af-accordion__subtitle)) {
50
+ --title-container-areas: "icon title";
51
+
52
+ row-gap: 0;
53
+
54
+ &:not(:has(.af-accordion__icon)) {
55
+ --title-container-areas: "title";
56
+ }
47
57
  }
48
58
 
49
- &::after {
50
- width: 32px;
51
- height: 32px;
52
- margin-left: auto;
53
- flex-shrink: 0;
54
- background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_14583_27882)%22%3E%0A%3Cpath%20d%3D%22M24%2013.3331L22.12%2011.4531L16%2017.5598L9.88%2011.4531L8%2013.3331L16%2021.3331L24%2013.3331Z%22%20fill%3D%22%2300008F%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3CclipPath%20id%3D%22clip0_14583_27882%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%20transform%3D%22matrix(0%201%20-1%200%2032%200)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E%0A");
55
- background-repeat: no-repeat;
56
- background-size: 100%;
57
- transition: transform 0.2s ease-in-out;
58
- content: "";
59
+ .af-accordion {
60
+ &__title {
61
+ grid-area: title;
62
+ }
63
+
64
+ &__subtitle {
65
+ grid-area: subtitle;
66
+ font-size: 1rem;
67
+ font-weight: 400;
68
+ line-height: 1.25rem;
69
+ color: common.$color-gray-700;
70
+ }
59
71
  }
72
+ }
73
+
74
+ &__value {
75
+ display: grid;
76
+ min-width: 9.375rem;
77
+ grid-area: value;
78
+ justify-items: center;
79
+ color: common.$color-green-600;
80
+ }
81
+
82
+ &__tag-date-container {
83
+ display: grid;
84
+ padding-right: 3.93rem;
85
+ grid-area: tag-date-container;
86
+ grid-template: "tag" "date";
87
+ row-gap: 0.5rem;
60
88
 
61
- &[aria-expanded="true"] {
62
- &::after {
63
- transform: rotate(180deg);
89
+ .af-accordion {
90
+ &__tag-container {
91
+ grid-area: tag;
92
+ justify-items: center;
93
+ text-align: center;
94
+
95
+ .af-tag {
96
+ cursor: inherit;
97
+ }
98
+ }
99
+
100
+ &__date {
101
+ display: grid;
102
+ grid-area: date;
103
+ align-items: center;
104
+ text-align: center;
105
+ color: common.$color-gray-700;
106
+ }
107
+ }
108
+ }
109
+ }
110
+
111
+ &--title-first {
112
+ --summary-areas: "title-container tag-date-container value arrow";
113
+ --summary-columns: repeat(3, auto) min-content;
114
+
115
+ &:not(:has(.af-accordion__value)) {
116
+ --summary-areas: "title-container tag-date-container arrow";
117
+ --summary-columns: repeat(2, auto) min-content;
118
+ }
119
+
120
+ .af-accordion {
121
+ &__tag-date-container {
122
+ padding: 0;
123
+ grid-template: "tag date";
124
+ column-gap: inherit;
125
+
126
+ .af-accordion {
127
+ &__tag-container {
128
+ padding: 0 1.688rem;
129
+ }
130
+
131
+ &__date {
132
+ padding: 0 3.125rem;
133
+ }
64
134
  }
65
135
  }
136
+
137
+ &__value {
138
+ min-width: auto;
139
+ }
140
+ }
141
+ }
142
+
143
+ .af-accordion__tag-date-container:has(> :only-child) {
144
+ row-gap: 0;
145
+ }
146
+ }
147
+
148
+ @media (width <= #{common.$breakpoint-md}) {
149
+ .af-accordion__summary--title-first
150
+ .af-accordion__tag-date-container
151
+ .af-accordion {
152
+ &__tag-container,
153
+ &__date {
154
+ padding: 0;
66
155
  }
67
156
  }
157
+ }
158
+
159
+ @media (width <= #{common.$breakpoint-sm}) {
160
+ .af-accordion__summary {
161
+ --summary-areas: "tag-date-container arrow" "title-container arrow"
162
+ "value arrow";
163
+ --summary-columns: 1fr;
164
+
165
+ column-gap: 0;
166
+
167
+ .af-accordion {
168
+ &__title-container {
169
+ justify-content: start;
170
+
171
+ .af-accordion {
172
+ &__subtitle {
173
+ font-size: 0.875rem;
174
+ line-height: 1.1rem;
175
+ }
176
+ }
177
+ }
178
+
179
+ &__tag-date-container {
180
+ display: flex;
181
+ gap: 0.5rem;
182
+ }
183
+
184
+ &__value {
185
+ justify-content: start;
186
+ }
187
+ }
68
188
 
69
- & > [role="region"] {
70
- margin-bottom: 1rem;
71
- padding: 0 20px;
189
+ &--title-first {
190
+ --summary-areas: "icon title-container arrow"
191
+ "icon tag-date-container arrow" "icon value arrow";
192
+ --summary-columns: auto 1fr auto;
193
+
194
+ column-gap: 0.75rem;
195
+
196
+ &:not(:has(.af-accordion__icon)) {
197
+ --summary-areas: "title-container arrow" "tag-date-container arrow"
198
+ "value arrow";
199
+ --summary-columns: 1fr auto;
200
+ }
201
+
202
+ &:not(:has(.af-accordion__tag-date-container)) {
203
+ --summary-areas: "icon title-container arrow" "icon value arrow";
204
+ }
205
+
206
+ &:not(:has(.af-accordion__value)) {
207
+ --summary-areas: "icon title-container arrow"
208
+ "icon tag-date-container arrow";
209
+ }
210
+
211
+ &:not(
212
+ :has(.af-accordion__icon),
213
+ :has(.af-accordion__tag-date-container)
214
+ ) {
215
+ --summary-areas: "title-container arrow" "value arrow";
216
+ }
217
+
218
+ &:not(
219
+ :has(.af-accordion__tag-date-container),
220
+ :has(.af-accordion__value)
221
+ ) {
222
+ --summary-areas: "icon title-container arrow";
223
+ --summary-columns: auto 1fr auto;
224
+ }
225
+
226
+ &:not(:has(.af-accordion__icon), :has(.af-accordion__value)) {
227
+ --summary-areas: "title-container arrow" "tag-date-container arrow";
228
+ }
229
+
230
+ &:not(
231
+ :has(.af-accordion__icon),
232
+ :has(.af-accordion__tag-date-container),
233
+ :has(.af-accordion__value)
234
+ ) {
235
+ --summary-areas: "title-container arrow";
236
+ --summary-columns: 1fr auto;
237
+ }
238
+ }
72
239
  }
73
240
  }
74
241
  }
@@ -0,0 +1 @@
1
+ .af-accordion{font-family:Source Sans Pro,arial,sans-serif}.af-accordion__summary{align-items:center;color:#333;column-gap:2.5rem;cursor:pointer;display:grid;font-size:1.125rem;font-weight:600;grid-template-areas:"summary arrow";grid-template-columns:1fr auto;line-height:1.4rem;padding:1rem}.af-accordion__summary p{margin:0}.af-accordion__summary:first-child{grid-area:summary}.af-accordion__summary:after{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' fill='none' viewBox='0 0 32 32'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%2300008F' d='m24 13.333-1.88-1.88L16 17.56l-6.12-6.107L8 13.333l8 8z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M32 0v32H0V0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");background-repeat:no-repeat;background-size:100%;content:"";display:inline-block;flex-shrink:0;grid-area:arrow;height:2rem;margin-left:auto;transition:transform .2s ease-in-out;width:2rem}.af-accordion[open]>.af-accordion__summary:after{transform:rotate(180deg)}.af-accordion__separator{border:0;border-top:1px solid #e9ecf2;margin:0}.af-accordion__content{color:#5f5f5f;font-size:1rem;font-weight:400;line-height:1.25rem;padding:1rem}@media (width <= 667px){.af-accordion__summary{font-size:1rem;font-weight:600;line-height:1.25rem;row-gap:.25rem}.af-accordion__content{font-size:.875rem;line-height:1.1rem}}
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/AccordionCore/AccordionCore.scss%23sass","../../src/AccordionCore/AccordionCore.scss"],"names":[],"mappings":"AAEA,cACE,4CCDF,CDGE,uBAKE,kBAAA,CAKA,UAAA,CAJA,iBAAA,CAKA,cAAA,CAVA,YAAA,CAMA,kBAAA,CACA,eAAA,CALA,mCAAA,CACA,8BAAA,CAKA,kBAAA,CAPA,YCQJ,CDGI,yBACE,QCDN,CDII,mCACE,iBCFN,CDKI,6BAOE,uYAAA,CACA,2BAAA,CACA,oBAAA,CAEA,UAAA,CAVA,oBAAA,CAKA,aAAA,CADA,eAAA,CAFA,WAAA,CACA,gBAAA,CAMA,oCAAA,CARA,UCMN,CDOE,iDACE,wBCLJ,CDQE,yBAEE,QAAA,CACA,4BAAA,CAFA,QCJJ,CDSE,uBAKE,aAAA,CAHA,cAAA,CACA,eAAA,CACA,mBAAA,CAHA,YCHJ,CDWA,wBAEI,uBAEE,cAAA,CACA,eAAA,CACA,mBAAA,CAHA,cCNJ,CACF,uBDYM,iBAAA,CCVN,kBACE,CACF","file":"AccordionCore.css","sourcesContent":["@use \"../common/common.scss\" as common;\n\n.af-accordion {\n font-family: common.$font-family-base;\n\n &__summary {\n display: grid;\n padding: 1rem;\n grid-template-areas: \"summary arrow\";\n grid-template-columns: 1fr auto;\n align-items: center;\n column-gap: 2.5rem;\n font-size: 1.125rem;\n font-weight: 600;\n line-height: 1.4rem;\n color: common.$color-gray-900;\n cursor: pointer;\n\n p {\n margin: 0;\n }\n\n &:first-child {\n grid-area: summary;\n }\n\n &::after {\n display: inline-block;\n width: 2rem;\n height: 2rem;\n margin-left: auto;\n grid-area: arrow;\n flex-shrink: 0;\n background-image: url(\"data:image/svg+xml,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_14583_27882)%22%3E%0A%3Cpath%20d%3D%22M24%2013.3331L22.12%2011.4531L16%2017.5598L9.88%2011.4531L8%2013.3331L16%2021.3331L24%2013.3331Z%22%20fill%3D%22%2300008F%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3CclipPath%20id%3D%22clip0_14583_27882%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%20transform%3D%22matrix(0%201%20-1%200%2032%200)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E%0A\");\n background-repeat: no-repeat;\n background-size: 100%;\n transition: transform 0.2s ease-in-out;\n content: \"\";\n }\n }\n\n &[open] > .af-accordion__summary::after {\n transform: rotate(180deg);\n }\n\n &__separator {\n margin: 0;\n border: 0;\n border-top: 1px solid common.$color-gray-300;\n }\n\n &__content {\n padding: 1rem;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.25rem;\n color: common.$color-gray-700;\n }\n}\n\n@media (width <= #{common.$breakpoint-sm}) {\n .af-accordion {\n &__summary {\n row-gap: 0.25rem;\n font-size: 1rem;\n font-weight: 600;\n line-height: 1.25rem;\n }\n\n &__content {\n font-size: 0.875rem;\n line-height: 1.1rem;\n }\n }\n}\n","@use \"../common/common.scss\" as common;\n\n.af-accordion {\n font-family: common.$font-family-base;\n\n &__summary {\n display: grid;\n padding: 1rem;\n grid-template-areas: \"summary arrow\";\n grid-template-columns: 1fr auto;\n align-items: center;\n column-gap: 2.5rem;\n font-size: 1.125rem;\n font-weight: 600;\n line-height: 1.4rem;\n color: common.$color-gray-900;\n cursor: pointer;\n\n p {\n margin: 0;\n }\n\n &:first-child {\n grid-area: summary;\n }\n\n &::after {\n display: inline-block;\n width: 2rem;\n height: 2rem;\n margin-left: auto;\n grid-area: arrow;\n flex-shrink: 0;\n background-image: url(\"data:image/svg+xml,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_14583_27882)%22%3E%0A%3Cpath%20d%3D%22M24%2013.3331L22.12%2011.4531L16%2017.5598L9.88%2011.4531L8%2013.3331L16%2021.3331L24%2013.3331Z%22%20fill%3D%22%2300008F%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3CclipPath%20id%3D%22clip0_14583_27882%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%20transform%3D%22matrix(0%201%20-1%200%2032%200)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E%0A\");\n background-repeat: no-repeat;\n background-size: 100%;\n transition: transform 0.2s ease-in-out;\n content: \"\";\n }\n }\n\n &[open] > .af-accordion__summary::after {\n transform: rotate(180deg);\n }\n\n &__separator {\n margin: 0;\n border: 0;\n border-top: 1px solid common.$color-gray-300;\n }\n\n &__content {\n padding: 1rem;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.25rem;\n color: common.$color-gray-700;\n }\n}\n\n@media (width <= #{common.$breakpoint-sm}) {\n .af-accordion {\n &__summary {\n row-gap: 0.25rem;\n font-size: 1rem;\n font-weight: 600;\n line-height: 1.25rem;\n }\n\n &__content {\n font-size: 0.875rem;\n line-height: 1.1rem;\n }\n }\n}\n"]}
@@ -0,0 +1,75 @@
1
+ @use "../common/common.scss" as common;
2
+
3
+ .af-accordion {
4
+ font-family: common.$font-family-base;
5
+
6
+ &__summary {
7
+ display: grid;
8
+ padding: 1rem;
9
+ grid-template-areas: "summary arrow";
10
+ grid-template-columns: 1fr auto;
11
+ align-items: center;
12
+ column-gap: 2.5rem;
13
+ font-size: 1.125rem;
14
+ font-weight: 600;
15
+ line-height: 1.4rem;
16
+ color: common.$color-gray-900;
17
+ cursor: pointer;
18
+
19
+ p {
20
+ margin: 0;
21
+ }
22
+
23
+ &:first-child {
24
+ grid-area: summary;
25
+ }
26
+
27
+ &::after {
28
+ display: inline-block;
29
+ width: 2rem;
30
+ height: 2rem;
31
+ margin-left: auto;
32
+ grid-area: arrow;
33
+ flex-shrink: 0;
34
+ background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_14583_27882)%22%3E%0A%3Cpath%20d%3D%22M24%2013.3331L22.12%2011.4531L16%2017.5598L9.88%2011.4531L8%2013.3331L16%2021.3331L24%2013.3331Z%22%20fill%3D%22%2300008F%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3CclipPath%20id%3D%22clip0_14583_27882%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%20transform%3D%22matrix(0%201%20-1%200%2032%200)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E%0A");
35
+ background-repeat: no-repeat;
36
+ background-size: 100%;
37
+ transition: transform 0.2s ease-in-out;
38
+ content: "";
39
+ }
40
+ }
41
+
42
+ &[open] > .af-accordion__summary::after {
43
+ transform: rotate(180deg);
44
+ }
45
+
46
+ &__separator {
47
+ margin: 0;
48
+ border: 0;
49
+ border-top: 1px solid common.$color-gray-300;
50
+ }
51
+
52
+ &__content {
53
+ padding: 1rem;
54
+ font-size: 1rem;
55
+ font-weight: 400;
56
+ line-height: 1.25rem;
57
+ color: common.$color-gray-700;
58
+ }
59
+ }
60
+
61
+ @media (width <= #{common.$breakpoint-sm}) {
62
+ .af-accordion {
63
+ &__summary {
64
+ row-gap: 0.25rem;
65
+ font-size: 1rem;
66
+ font-weight: 600;
67
+ line-height: 1.25rem;
68
+ }
69
+
70
+ &__content {
71
+ font-size: 0.875rem;
72
+ line-height: 1.1rem;
73
+ }
74
+ }
75
+ }
@@ -1 +1 @@
1
- *,:after,:before{box-sizing:border-box}html{font-family:sans-serif;line-height:1.15;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;-webkit-tap-highlight-color:transparent}article,aside,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}body{background-color:#fff;color:#333;font-family:Source Sans Pro,Arial,sans-serif;font-size:1rem;font-weight:400;line-height:1.5;margin:0;text-align:left}[tabindex="-1"]:focus{outline:0!important}hr{box-sizing:initial;height:0;overflow:visible}h1,h2,h3,h4,h5,h6{margin-bottom:.5rem;margin-top:0}p{margin-bottom:1rem;margin-top:0}abbr[data-original-title],abbr[title]{border-bottom:0;cursor:help;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none}address{font-style:normal;line-height:inherit}address,dl,ol,ul{margin-bottom:1rem}dl,ol,ul{margin-top:0}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-left:0}blockquote{margin:0 0 1rem}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}a{background-color:initial;color:#00008f;text-decoration:none}a:hover{color:#000043;text-decoration:underline}a:not([href],[tabindex]),a:not([href],[tabindex]):focus,a:not([href],[tabindex]):hover{color:inherit;text-decoration:none}a:not([href],[tabindex]):focus{outline:0}code,kbd,pre,samp{font-family:SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}pre{margin-bottom:1rem;margin-top:0;overflow:auto}figure{margin:0 0 1rem}img{border-style:none}img,svg{vertical-align:middle}svg{overflow:hidden}table{border-collapse:collapse}caption{caption-side:bottom;color:#6c757d;padding-bottom:.5rem;padding-top:.5rem;text-align:left}th{text-align:inherit}label{display:inline-block;margin-bottom:.5rem}button{border-radius:0}button,input,optgroup,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit;margin:0}button,input{overflow:visible}button,select{text-transform:none}select{word-wrap:normal}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;appearance:button}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled){cursor:pointer}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=date],input[type=datetime-local],input[type=month],input[type=time]{-webkit-appearance:listbox;appearance:listbox}textarea{overflow:auto;resize:vertical}fieldset{border:0;margin:0;min-width:0;padding:0}legend{color:inherit;display:block;font-size:1.5rem;line-height:inherit;margin-bottom:.5rem;max-width:100%;padding:0;white-space:normal;width:100%}progress{vertical-align:initial}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:none;appearance:none;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none;appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;appearance:button;font:inherit}output{display:inline-block}summary{cursor:pointer;display:list-item}template{display:none}[hidden]{display:none!important}.af-card{background-color:#fff;border:1px solid #e9ecf2;border-radius:.5rem;box-shadow:0 .25rem .5rem 0 #10184114;font-family:Source Sans Pro,arial,sans-serif;font-size:1rem;font-weight:400;line-height:1.25rem;padding:1rem;width:fit-content}.af-card>:last-child{margin-block-end:0}.af-card:focus-visible{border:2px solid #36f;outline:none}.af-card--elevation-2:not(:focus){box-shadow:0 .25rem .5rem 0 #10184129}.af-card__title{color:#00008f;font-size:1.125rem;font-weight:600;line-height:1.4rem}button.af-card{cursor:pointer;text-align:initial}button.af-card:active{box-shadow:none}button.af-card:focus{outline:none}
1
+ *,:after,:before{box-sizing:border-box}html{font-family:sans-serif;line-height:1.15;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;-webkit-tap-highlight-color:transparent}article,aside,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}body{background-color:#fff;color:#333;font-family:Source Sans Pro,Arial,sans-serif;font-size:1rem;font-weight:400;line-height:1.5;margin:0;text-align:left}[tabindex="-1"]:focus{outline:0!important}hr{box-sizing:initial;height:0;overflow:visible}h1,h2,h3,h4,h5,h6{margin-bottom:.5rem;margin-top:0}p{margin-bottom:1rem;margin-top:0}abbr[data-original-title],abbr[title]{border-bottom:0;cursor:help;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none}address{font-style:normal;line-height:inherit}address,dl,ol,ul{margin-bottom:1rem}dl,ol,ul{margin-top:0}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-left:0}blockquote{margin:0 0 1rem}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}a{background-color:initial;color:#00008f;text-decoration:none}a:hover{color:#000043;text-decoration:underline}a:not([href],[tabindex]),a:not([href],[tabindex]):focus,a:not([href],[tabindex]):hover{color:inherit;text-decoration:none}a:not([href],[tabindex]):focus{outline:0}code,kbd,pre,samp{font-family:SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}pre{margin-bottom:1rem;margin-top:0;overflow:auto}figure{margin:0 0 1rem}img{border-style:none}img,svg{vertical-align:middle}svg{overflow:hidden}table{border-collapse:collapse}caption{caption-side:bottom;color:#6c757d;padding-bottom:.5rem;padding-top:.5rem;text-align:left}th{text-align:inherit}label{display:inline-block;margin-bottom:.5rem}button{border-radius:0}button,input,optgroup,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit;margin:0}button,input{overflow:visible}button,select{text-transform:none}select{word-wrap:normal}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;appearance:button}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled){cursor:pointer}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=date],input[type=datetime-local],input[type=month],input[type=time]{-webkit-appearance:listbox;appearance:listbox}textarea{overflow:auto;resize:vertical}fieldset{border:0;margin:0;min-width:0;padding:0}legend{color:inherit;display:block;font-size:1.5rem;line-height:inherit;margin-bottom:.5rem;max-width:100%;padding:0;white-space:normal;width:100%}progress{vertical-align:initial}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:none;appearance:none;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none;appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;appearance:button;font:inherit}output{display:inline-block}summary{cursor:pointer;display:list-item}template{display:none}[hidden]{display:none!important}.af-card{background-color:#fff;border:1px solid #e9ecf2;border-radius:.5rem;box-shadow:0 .25rem .5rem 0 #10184114;font-family:Source Sans Pro,arial,sans-serif;font-size:1rem;font-weight:400;line-height:1.25rem;padding:1rem;width:fit-content}.af-card>:last-child{margin-block-end:0}.af-card:focus-visible{border:2px solid #36f;outline:none}.af-card--elevation-2:not(:focus){box-shadow:0 .25rem .5rem 0 #10184129}.af-card__title{color:#00008f;font-size:1.125rem;font-weight:600;line-height:1.4rem}.af-card--large{width:100%}.af-card--accordion{box-shadow:none;padding:0}button.af-card{cursor:pointer;text-align:initial}button.af-card:active{box-shadow:none}button.af-card:focus{outline:none}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/common/reboot.scss","../../src/Card/Card.scss","../../src/Card/Card.scss%23sass","../../src/common/common.scss"],"names":[],"mappings":"AAAA,iBCGA,qBACA,CDEA,KACE,sBAAA,CACA,gBAAA,CACA,6BAAA,CAAA,0BAAA,CAAA,qBAAA,CACA,uCCCF,CDEA,sEAUE,aCCF,CDEA,KCQA,qBAAA,CDDE,UAAA,CALA,4CAAA,CACA,cAAA,CACA,eAAA,CACA,eAAA,CAJA,QAAA,CAKA,eCGF,CDEA,sBACE,mBCCF,CDEA,GACE,kBAAA,CACA,QAAA,CACA,gBCCF,CDEA,kBAOE,mBAAA,CADA,YCEF,CDEA,EAEE,kBAAA,CADA,YCEF,CDEA,sCAEE,eAAA,CAIA,WAAA,CAHA,yBAAA,CACA,wCAAA,CAAA,gCAAA,CACA,qCAAA,CAAA,6BCEF,CDEA,QAEE,iBAAA,CACA,mBCCF,CDEA,iBALE,kBCUF,CDLA,SAGE,YCEF,CDEA,wBAIE,eCCF,CDEA,GACE,eCCF,CDEA,GACE,mBAAA,CACA,aCCF,CDEA,WACE,eCCF,CDEA,SAEE,kBCCF,CDEA,MACE,aCCF,CDEA,QAIE,aAAA,CACA,aAAA,CAHA,iBAAA,CACA,sBCGF,CDEA,IACE,aCCF,CDEA,IACE,SCCF,CDEA,EAGE,wBAAA,CADA,aAAA,CADA,oBCGF,CDEA,QAEE,aAAA,CADA,yBCEF,CDOA,uFAGE,aAAA,CADA,oBCEF,CDEA,+BACE,SCCF,CDEA,kBAIE,sFAAA,CAEA,aCAF,CDGA,IAEE,kBAAA,CADA,YAAA,CAEA,aCAF,CDGA,OACE,eCAF,CDGA,IACE,iBCCF,CDGA,QAHE,qBCKF,CDFA,IAEE,eCAF,CDGA,MACE,wBCAF,CDGA,QAGE,mBAAA,CAEA,aAAA,CAHA,oBAAA,CADA,iBAAA,CAGA,eCCF,CDGA,GACE,kBCAF,CDGA,MACE,oBAAA,CACA,mBCAF,CDGA,OACE,eCAF,CDGA,sCAME,mBAAA,CACA,iBAAA,CACA,mBAAA,CAHA,QCGF,CDGA,aAEE,gBCAF,CDGA,cAEE,mBCAF,CDGA,OACE,gBCAF,CDGA,gDAIE,yBAAA,CAAA,iBCAF,CDGA,aACE,kBAAA,CACA,yCCAF,CDGA,4GAIE,cCAF,CDGA,wHAKE,iBAAA,CADA,SCCF,CDGA,uCAEE,qBAAA,CACA,SCAF,CDGA,+EAIE,0BAAA,CAAA,kBCAF,CDGA,SACE,aAAA,CACA,eCAF,CDGA,SAIE,QAAA,CAFA,QAAA,CADA,WAAA,CAEA,SCCF,CDGA,OASE,aAAA,CARA,aAAA,CAKA,gBAAA,CACA,mBAAA,CAHA,mBAAA,CADA,cAAA,CAEA,SAAA,CAGA,kBAAA,CANA,UCOF,CDGA,SACE,sBCAF,CDGA,kFAEE,WCAF,CDGA,cAEE,uBAAA,CAAA,eAAA,CADA,mBCCF,CDGA,yCACE,uBAAA,CAAA,eCAF,CDGA,6BAEE,yBAAA,CAAA,iBAAA,CADA,YCCF,CDGA,OACE,oBCAF,CDGA,QAEE,cAAA,CADA,iBCCF,CDGA,SACE,YCAF,CDGA,SACE,sBCAF,CC5UA,SASE,qBCJY,CDFZ,wBAAA,CACA,mBAAA,CAMA,qCAAA,CALA,4CCRuB,CDSvB,cAAA,CACA,eAAA,CACA,mBAAA,CANA,YAAA,CADA,iBDwVF,CC7UE,qBACE,kBD+UJ,CC5UE,uBACE,qBAAA,CACA,YD8UJ,CC3UE,kCACE,qCD6UJ,CC1UE,gBAIE,aCzBQ,CDsBR,kBAAA,CACA,eAAA,CACA,kBD6UJ,CCxUA,eAEE,cAAA,CADA,kBD4UF,CCzUE,sBACE,eD2UJ,CCxUE,qBACE,YD0UJ","file":"Card.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\nlabel {\n display: inline-block;\n margin-bottom: 0.5rem;\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-card {\n width: fit-content;\n padding: 1rem;\n border: 1px solid common.$color-gray-300;\n border-radius: 0.5rem;\n font-family: common.$font-family-base;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.25rem;\n background-color: common.$color-white;\n box-shadow: 0 0.25rem 0.5rem 0 hsla(230deg, 60%, 16%, 8%);\n\n > *:last-child {\n margin-block-end: 0;\n }\n\n &:focus-visible {\n border: 2px solid common.$color-focus;\n outline: none;\n }\n\n &--elevation-2:not(:focus) {\n box-shadow: 0 0.25rem 0.5rem 0 hsla(230deg, 60%, 16%, 16%);\n }\n\n &__title {\n font-size: 1.125rem;\n font-weight: 600;\n line-height: 1.4rem;\n color: common.$color-axa;\n }\n}\n\nbutton.af-card {\n text-align: initial;\n cursor: pointer;\n\n &:active {\n box-shadow: none;\n }\n\n &:focus {\n outline: none;\n }\n}\n","@use \"../common/reboot\";\n@use \"../common/common\" as common;\n\n.af-card {\n width: fit-content;\n padding: 1rem;\n border: 1px solid common.$color-gray-300;\n border-radius: 0.5rem;\n font-family: common.$font-family-base;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.25rem;\n background-color: common.$color-white;\n box-shadow: 0 0.25rem 0.5rem 0 hsla(230deg, 60%, 16%, 8%);\n\n > *:last-child {\n margin-block-end: 0;\n }\n\n &:focus-visible {\n border: 2px solid common.$color-focus;\n outline: none;\n }\n\n &--elevation-2:not(:focus) {\n box-shadow: 0 0.25rem 0.5rem 0 hsla(230deg, 60%, 16%, 16%);\n }\n\n &__title {\n font-size: 1.125rem;\n font-weight: 600;\n line-height: 1.4rem;\n color: common.$color-axa;\n }\n}\n\nbutton.af-card {\n text-align: initial;\n cursor: pointer;\n\n &:active {\n box-shadow: none;\n }\n\n &:focus {\n outline: none;\n }\n}\n","$font-family-sans-serif: \"Source Sans Pro\", arial, sans-serif !default;\n$font-family-serif: georgia, times, \"Times New Roman\", serif !default;\n$font-family-base: $font-family-sans-serif !default;\n$font-family-publico-bold: \"Publico Headline Bold\" !default;\n$font-family-publico: \"Publico Headline\" !default;\n// colors\n\n$color-axa: #00008f !default;\n$color-white: #fff !default;\n$color-black: #000 !default;\n$color-red: #ff1721 !default;\n$color-gray: #5f5f5f !default;\n$color-red-700: #c91432 !default;\n$color-blue-1: #000072 !default;\n$color-blue-2: #f8f8ff !default;\n$color-blue-3: #36f !default;\n$color-btn-light: #3333a5 !default;\n$color-btn-business: #c94e14 !default;\n$color-btn-business-dark: #a8391c !default;\n$color-btn-business-light: #df7e65 !default;\n$color-btn-disabled-text: #999 !default;\n$color-btn-disabled-border: #e5e5e5 !default;\n$color-btn-error-text: #a11028 !default;\n$color-btn-error-bg: #fff3f5 !default;\n$color-btn-tertiary-bg: #eef !default;\n$color-btn-tertiary-bg-darker: #e4e4ff !default;\n$color-btn-tertiary-bg-lighter: #f8f8ff !default;\n$color-oceanBlue: #4976ba !default;\n$color-gray-1: #ccc !default;\n$color-gray-200: #f3f3f3;\n$color-gray-300: #e9ecf2;\n$color-gray-400: #e5e5e5;\n$color-gray-500: #999;\n$color-gray-700: #5f5f5f;\n$color-gray-900: #333 !default;\n$color-green-600: #118635 !default;\n$color-border: #f3f3f3 !default;\n$color-focus: #36f !default;\n\n// others\n\n$default-border-radius: 4px !default;\n\n$transition-duration: 0.2s !default;\n\n// spacing\n\n$sizing-u0: 0 !default;\n$sizing-u05: 0.4rem !default;\n$sizing-u1: 0.8rem !default;\n$sizing-u2: 1.6rem !default;\n$sizing-u3: 2.4rem !default;\n$sizing-u4: 3.2rem !default;\n$sizing-u5: 4rem !default;\n$sizing-u6: 4.8rem !default;\n$sizing-u7: 5.6rem !default;\n$sizing-u8: 6.4rem !default;\n$sizing-u9: 7.2rem !default;\n$sizing-u10: 8rem !default;\n$spacing-u0: 0 !default;\n$spacing-u05: 0.4rem !default;\n$spacing-u1: 0.8rem !default;\n$spacing-u2: 1.6rem !default;\n$spacing-u3: 2.4rem !default;\n$spacing-u4: 3.2rem !default;\n$spacing-u5: 4rem !default;\n$spacing-u6: 4.8rem !default;\n$spacing-u7: 5.6rem !default;\n$spacing-u8: 6.4rem !default;\n$spacing-u9: 7.2rem !default;\n$spacing-u10: 8rem !default;\n$spacing-u11: 8.8rem !default;\n$spacing-u12: 9.6rem !default;\n$spacing-u13: 10.4rem !default;\n$spacing-u14: 11.2rem !default;\n$spacing-u15: 12rem !default;\n$spacing-u16: 12.8rem !default;\n$spacing-u17: 13.6rem !default;\n$spacing-u18: 14.4rem !default;\n$spacing-u19: 15.2rem !default;\n$spacing-u20: 16rem !default;\n$screen-size-668: s !default;\n$screen-size-1024: m !default;\n$screen-size-1200: oldl !default;\n$screen-size-1280: l !default;\n$screen-size-1540: oldxl !default;\n$screen-size-1600: xl !default;\n$screen-size-s: 668px !default;\n$screen-size-m: 1024px !default;\n$screen-size-l: 1280px !default;\n$screen-size-xl: 1600px !default;\n$screen-size-oldl: 1200px !default;\n$screen-size-oldxl: 1540px !default;\n\n$error-custom-border: #d18e8e !default;\n$error-custom-bg: #ffbfbf !default;\n\n$color-alertDanger-colorBorder: #c8b282 !default;\n$color-alertDanger-bgColor: #f1d596 !default;\n\n// breakpoints\n\n$breakpoint-xs: 0 !default;\n$breakpoint-sm: 667px !default;\n$breakpoint-md: 1023px !default;\n$breakpoint-lg: 1279px !default;\n$breakpoint-xl: 1599px !default;\n"]}
1
+ {"version":3,"sources":["../../src/common/reboot.scss","../../src/Card/Card.scss","../../src/Card/Card.scss%23sass","../../src/common/common.scss"],"names":[],"mappings":"AAAA,iBCGA,qBACA,CDEA,KACE,sBAAA,CACA,gBAAA,CACA,6BAAA,CAAA,0BAAA,CAAA,qBAAA,CACA,uCCCF,CDEA,sEAUE,aCCF,CDEA,KAQE,qBAAA,CADA,UAAA,CALA,4CAAA,CACA,cAAA,CACA,eAAA,CACA,eAAA,CAJA,QAAA,CAKA,eCGF,CDEA,sBACE,mBCCF,CDEA,GACE,kBAAA,CCCF,QAAA,CDCE,gBCCF,CDEA,kBAOE,mBAAA,CADA,YCEF,CDEA,EAEE,kBAAA,CADA,YCEF,CDEA,sCAEE,eAAA,CAIA,WAAA,CAHA,yBAAA,CACA,wCAAA,CAAA,gCAAA,CACA,qCAAA,CAAA,6BCEF,CDEA,QAEE,iBAAA,CACA,mBCCF,CDEA,iBALE,kBCUF,CDLA,SAGE,YCEF,CDEA,wBAIE,eCCF,CDEA,GACE,eCCF,CDEA,GACE,mBAAA,CACA,aCCF,CDEA,WACE,eCCF,CDEA,SAEE,kBCCF,CDEA,MACE,aCCF,CDEA,QAIE,aAAA,CACA,aAAA,CAHA,iBAAA,CACA,sBCGF,CDEA,IACE,aCCF,CDEA,IACE,SCCF,CDEA,EAGE,wBAAA,CADA,aAAA,CADA,oBCGF,CDEA,QAEE,aAAA,CADA,yBCEF,CDOA,uFAGE,aAAA,CADA,oBCEF,CDEA,+BACE,SCCF,CDEA,kBAIE,sFAAA,CAEA,aCAF,CDGA,IAEE,kBAAA,CADA,YAAA,CAEA,aCAF,CDGA,OACE,eCAF,CDGA,IACE,iBCCF,CDGA,QAHE,qBCKF,CDFA,IAEE,eCAF,CDGA,MACE,wBCAF,CDGA,QAGE,mBAAA,CAEA,aAAA,CAHA,oBAAA,CADA,iBAAA,CAGA,eCCF,CDGA,GACE,kBCAF,CDGA,MACE,oBAAA,CACA,mBCAF,CDGA,OACE,eCAF,CDGA,sCAME,mBAAA,CACA,iBAAA,CACA,mBAAA,CAHA,QCGF,CDGA,aAEE,gBCAF,CDGA,cAEE,mBCAF,CDGA,OACE,gBCAF,CDGA,gDAIE,yBAAA,CAAA,iBCAF,CDGA,aACE,kBAAA,CACA,yCCAF,CDGA,4GAIE,cCAF,CDGA,wHAKE,iBAAA,CADA,SCCF,CDGA,uCAEE,qBAAA,CACA,SCAF,CDGA,+EAIE,0BAAA,CAAA,kBCAF,CDGA,SACE,aAAA,CACA,eCAF,CDGA,SAIE,QAAA,CAFA,QAAA,CADA,WAAA,CAEA,SCCF,CDGA,OASE,aAAA,CARA,aAAA,CAKA,gBAAA,CACA,mBAAA,CAHA,mBAAA,CADA,cAAA,CAEA,SAAA,CAGA,kBAAA,CANA,UCOF,CDGA,SACE,sBCAF,CDGA,kFAEE,WCAF,CDGA,cAEE,uBAAA,CAAA,eAAA,CADA,mBCCF,CDGA,yCACE,uBAAA,CAAA,eCAF,CDGA,6BAEE,yBAAA,CAAA,iBAAA,CADA,YCCF,CDGA,OACE,oBCAF,CDGA,QAEE,cAAA,CADA,iBCCF,CDGA,SACE,YCAF,CDGA,SACE,sBCAF,CC5UA,SASE,qBCJY,CDFZ,wBAAA,CACA,mBAAA,CAMA,qCAAA,CALA,4CCRuB,CDSvB,cAAA,CACA,eAAA,CACA,mBAAA,CANA,YAAA,CADA,iBDwVF,CC7UE,qBACE,kBD+UJ,CC5UE,uBACE,qBAAA,CACA,YD8UJ,CC3UE,kCACE,qCD6UJ,CC1UE,gBAIE,aCzBQ,CDsBR,kBAAA,CACA,eAAA,CACA,kBD6UJ,CCzUE,gBACE,UD2UJ,CCxUE,oBAEE,eAAA,CADA,SD2UJ,CCtUA,eAEE,cAAA,CADA,kBD0UF,CCvUE,sBACE,eDyUJ,CCtUE,qBACE,YDwUJ","file":"Card.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\nlabel {\n display: inline-block;\n margin-bottom: 0.5rem;\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-card {\n width: fit-content;\n padding: 1rem;\n border: 1px solid common.$color-gray-300;\n border-radius: 0.5rem;\n font-family: common.$font-family-base;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.25rem;\n background-color: common.$color-white;\n box-shadow: 0 0.25rem 0.5rem 0 hsla(230deg, 60%, 16%, 8%);\n\n > *:last-child {\n margin-block-end: 0;\n }\n\n &:focus-visible {\n border: 2px solid common.$color-focus;\n outline: none;\n }\n\n &--elevation-2:not(:focus) {\n box-shadow: 0 0.25rem 0.5rem 0 hsla(230deg, 60%, 16%, 16%);\n }\n\n &__title {\n font-size: 1.125rem;\n font-weight: 600;\n line-height: 1.4rem;\n color: common.$color-axa;\n }\n\n &--large {\n width: 100%;\n }\n\n &--accordion {\n padding: 0;\n box-shadow: none;\n }\n}\n\nbutton.af-card {\n text-align: initial;\n cursor: pointer;\n\n &:active {\n box-shadow: none;\n }\n\n &:focus {\n outline: none;\n }\n}\n","@use \"../common/reboot\";\n@use \"../common/common\" as common;\n\n.af-card {\n width: fit-content;\n padding: 1rem;\n border: 1px solid common.$color-gray-300;\n border-radius: 0.5rem;\n font-family: common.$font-family-base;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.25rem;\n background-color: common.$color-white;\n box-shadow: 0 0.25rem 0.5rem 0 hsla(230deg, 60%, 16%, 8%);\n\n > *:last-child {\n margin-block-end: 0;\n }\n\n &:focus-visible {\n border: 2px solid common.$color-focus;\n outline: none;\n }\n\n &--elevation-2:not(:focus) {\n box-shadow: 0 0.25rem 0.5rem 0 hsla(230deg, 60%, 16%, 16%);\n }\n\n &__title {\n font-size: 1.125rem;\n font-weight: 600;\n line-height: 1.4rem;\n color: common.$color-axa;\n }\n\n &--large {\n width: 100%;\n }\n\n &--accordion {\n padding: 0;\n box-shadow: none;\n }\n}\n\nbutton.af-card {\n text-align: initial;\n cursor: pointer;\n\n &:active {\n box-shadow: none;\n }\n\n &:focus {\n outline: none;\n }\n}\n","$font-family-sans-serif: \"Source Sans Pro\", arial, sans-serif !default;\n$font-family-serif: georgia, times, \"Times New Roman\", serif !default;\n$font-family-base: $font-family-sans-serif !default;\n$font-family-publico-bold: \"Publico Headline Bold\" !default;\n$font-family-publico: \"Publico Headline\" !default;\n// colors\n\n$color-axa: #00008f !default;\n$color-white: #fff !default;\n$color-black: #000 !default;\n$color-red: #ff1721 !default;\n$color-gray: #5f5f5f !default;\n$color-red-700: #c91432 !default;\n$color-blue-1: #000072 !default;\n$color-blue-2: #f8f8ff !default;\n$color-blue-3: #36f !default;\n$color-btn-light: #3333a5 !default;\n$color-btn-business: #c94e14 !default;\n$color-btn-business-dark: #a8391c !default;\n$color-btn-business-light: #df7e65 !default;\n$color-btn-disabled-text: #999 !default;\n$color-btn-disabled-border: #e5e5e5 !default;\n$color-btn-error-text: #a11028 !default;\n$color-btn-error-bg: #fff3f5 !default;\n$color-btn-tertiary-bg: #eef !default;\n$color-btn-tertiary-bg-darker: #e4e4ff !default;\n$color-btn-tertiary-bg-lighter: #f8f8ff !default;\n$color-oceanBlue: #4976ba !default;\n$color-gray-1: #ccc !default;\n$color-gray-200: #f3f3f3;\n$color-gray-300: #e9ecf2;\n$color-gray-400: #e5e5e5;\n$color-gray-500: #999;\n$color-gray-700: #5f5f5f;\n$color-gray-900: #333 !default;\n$color-green-600: #118635 !default;\n$color-border: #f3f3f3 !default;\n$color-focus: #36f !default;\n\n// others\n\n$default-border-radius: 4px !default;\n\n$transition-duration: 0.2s !default;\n\n// spacing\n\n$sizing-u0: 0 !default;\n$sizing-u05: 0.4rem !default;\n$sizing-u1: 0.8rem !default;\n$sizing-u2: 1.6rem !default;\n$sizing-u3: 2.4rem !default;\n$sizing-u4: 3.2rem !default;\n$sizing-u5: 4rem !default;\n$sizing-u6: 4.8rem !default;\n$sizing-u7: 5.6rem !default;\n$sizing-u8: 6.4rem !default;\n$sizing-u9: 7.2rem !default;\n$sizing-u10: 8rem !default;\n$spacing-u0: 0 !default;\n$spacing-u05: 0.4rem !default;\n$spacing-u1: 0.8rem !default;\n$spacing-u2: 1.6rem !default;\n$spacing-u3: 2.4rem !default;\n$spacing-u4: 3.2rem !default;\n$spacing-u5: 4rem !default;\n$spacing-u6: 4.8rem !default;\n$spacing-u7: 5.6rem !default;\n$spacing-u8: 6.4rem !default;\n$spacing-u9: 7.2rem !default;\n$spacing-u10: 8rem !default;\n$spacing-u11: 8.8rem !default;\n$spacing-u12: 9.6rem !default;\n$spacing-u13: 10.4rem !default;\n$spacing-u14: 11.2rem !default;\n$spacing-u15: 12rem !default;\n$spacing-u16: 12.8rem !default;\n$spacing-u17: 13.6rem !default;\n$spacing-u18: 14.4rem !default;\n$spacing-u19: 15.2rem !default;\n$spacing-u20: 16rem !default;\n$screen-size-668: s !default;\n$screen-size-1024: m !default;\n$screen-size-1200: oldl !default;\n$screen-size-1280: l !default;\n$screen-size-1540: oldxl !default;\n$screen-size-1600: xl !default;\n$screen-size-s: 668px !default;\n$screen-size-m: 1024px !default;\n$screen-size-l: 1280px !default;\n$screen-size-xl: 1600px !default;\n$screen-size-oldl: 1200px !default;\n$screen-size-oldxl: 1540px !default;\n\n$error-custom-border: #d18e8e !default;\n$error-custom-bg: #ffbfbf !default;\n\n$color-alertDanger-colorBorder: #c8b282 !default;\n$color-alertDanger-bgColor: #f1d596 !default;\n\n// breakpoints\n\n$breakpoint-xs: 0 !default;\n$breakpoint-sm: 667px !default;\n$breakpoint-md: 1023px !default;\n$breakpoint-lg: 1279px !default;\n$breakpoint-xl: 1599px !default;\n"]}
@@ -32,6 +32,15 @@
32
32
  line-height: 1.4rem;
33
33
  color: common.$color-axa;
34
34
  }
35
+
36
+ &--large {
37
+ width: 100%;
38
+ }
39
+
40
+ &--accordion {
41
+ padding: 0;
42
+ box-shadow: none;
43
+ }
35
44
  }
36
45
 
37
46
  button.af-card {
@@ -1 +1 @@
1
- .af-list{flex-direction:column;list-style-type:none;padding:0}.af-list__item{padding:1rem 0}.af-list__separator{border:0;border-top:1px solid #e9ecf2;margin:0}.af-card--list{box-shadow:none;padding:0 1rem}.af-card--click-list{padding:0}.af-card--click-list .af-list__separator{margin:auto;width:calc(100% - 2rem)}.af-card--click-list .af-list__item{padding:0}.af-card--large{width:100%}.af-card--extra-padding{padding:.5rem 1.5rem}.af-card--first-separator-full-width{padding:0}.af-card--first-separator-full-width .af-list__item{padding:1rem}.af-card--first-separator-full-width .af-list__item:has(.af-click-item){padding:0}.af-card--first-separator-full-width .af-list__separator~.af-list__separator{margin:0 1rem}@media (width <= 667px){.af-card--extra-padding{padding:.25rem 1rem}.af-card--extra-padding .af-list__item{padding:.75rem 0}}
1
+ .af-list{flex-direction:column;list-style-type:none;padding:0}.af-list__item{padding:1rem 0}.af-list__separator{border:0;border-top:1px solid #e9ecf2;margin:0}.af-card--list{box-shadow:none;padding:0 1rem}.af-card--click-list{padding:0}.af-card--click-list .af-list__separator{margin:auto;width:calc(100% - 2rem)}.af-card--click-list .af-list__item{padding:0}.af-card--extra-padding{padding:.5rem 1.5rem}.af-card--first-separator-full-width{padding:0}.af-card--first-separator-full-width .af-list__item{padding:1rem}.af-card--first-separator-full-width .af-list__item:has(.af-click-item){padding:0}.af-card--first-separator-full-width .af-list__separator~.af-list__separator{margin:0 1rem}@media (width <= 667px){.af-card--extra-padding{padding:.25rem 1rem}.af-card--extra-padding .af-list__item{padding:.75rem 0}}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/List/List.scss%23sass","../../src/List/List.scss"],"names":[],"mappings":"AAEA,SCAA,qBAAA,CDGE,oBAAA,CAFA,SCCF,CDGE,eACE,cCDJ,CDIE,oBAEE,QAAA,CACA,4BAAA,CAFA,QCAJ,CDOE,eCHF,eAAA,CDII,cCHJ,CDOE,qBACE,SCLJ,CDOI,yCAEE,WAAA,CADA,uBCJN,CDQI,oCACE,SCNN,CDUE,gBACE,UCRJ,CDWE,wBACE,oBCTJ,CDYE,qCACE,SCVJ,CDYI,oDACE,YCVN,CDYM,wEACE,SCVR,CDcI,6EACE,aCZN,CDiBA,wBACE,wBACE,mBCdF,CDgBE,uCACE,gBCdJ,CACF","file":"List.css","sourcesContent":["@use \"../common/common\" as common;\n\n.af-list {\n padding: 0;\n flex-direction: column;\n list-style-type: none;\n\n &__item {\n padding: 1rem 0;\n }\n\n &__separator {\n margin: 0;\n border: 0;\n border-top: 1px solid common.$color-gray-300;\n }\n}\n\n.af-card {\n &--list {\n padding: 0 1rem;\n box-shadow: none;\n }\n\n &--click-list {\n padding: 0;\n\n .af-list__separator {\n width: calc(100% - 2rem);\n margin: auto;\n }\n\n .af-list__item {\n padding: 0;\n }\n }\n\n &--large {\n width: 100%;\n }\n\n &--extra-padding {\n padding: 0.5rem 1.5rem;\n }\n\n &--first-separator-full-width {\n padding: 0;\n\n .af-list__item {\n padding: 1rem;\n\n &:has(.af-click-item) {\n padding: 0;\n }\n }\n\n .af-list__separator ~ .af-list__separator {\n margin: 0 1rem;\n }\n }\n}\n\n@media (width <= #{common.$breakpoint-sm}) {\n .af-card--extra-padding {\n padding: 0.25rem 1rem;\n\n .af-list__item {\n padding: 0.75rem 0;\n }\n }\n}\n","@use \"../common/common\" as common;\n\n.af-list {\n padding: 0;\n flex-direction: column;\n list-style-type: none;\n\n &__item {\n padding: 1rem 0;\n }\n\n &__separator {\n margin: 0;\n border: 0;\n border-top: 1px solid common.$color-gray-300;\n }\n}\n\n.af-card {\n &--list {\n padding: 0 1rem;\n box-shadow: none;\n }\n\n &--click-list {\n padding: 0;\n\n .af-list__separator {\n width: calc(100% - 2rem);\n margin: auto;\n }\n\n .af-list__item {\n padding: 0;\n }\n }\n\n &--large {\n width: 100%;\n }\n\n &--extra-padding {\n padding: 0.5rem 1.5rem;\n }\n\n &--first-separator-full-width {\n padding: 0;\n\n .af-list__item {\n padding: 1rem;\n\n &:has(.af-click-item) {\n padding: 0;\n }\n }\n\n .af-list__separator ~ .af-list__separator {\n margin: 0 1rem;\n }\n }\n}\n\n@media (width <= #{common.$breakpoint-sm}) {\n .af-card--extra-padding {\n padding: 0.25rem 1rem;\n\n .af-list__item {\n padding: 0.75rem 0;\n }\n }\n}\n"]}
1
+ {"version":3,"sources":["../../src/List/List.scss%23sass","../../src/List/List.scss"],"names":[],"mappings":"AAEA,SCAA,qBAAA,CDGE,oBAAA,CAFA,SCCF,CDGE,eACE,cCDJ,CDIE,oBAEE,QAAA,CACA,4BAAA,CAFA,QCAJ,CDOE,eCHF,eAAA,CDII,cCHJ,CDOE,qBACE,SCLJ,CDOI,yCAEE,WAAA,CADA,uBCJN,CDQI,oCACE,SCNN,CDUE,wBACE,oBCRJ,CDWE,qCACE,SCTJ,CDWI,oDACE,YCTN,CDWM,wEACE,SCTR,CDaI,6EACE,aCXN,CDgBA,wBACE,wBACE,mBCbF,CDeE,uCACE,gBCbJ,CACF","file":"List.css","sourcesContent":["@use \"../common/common\" as common;\n\n.af-list {\n padding: 0;\n flex-direction: column;\n list-style-type: none;\n\n &__item {\n padding: 1rem 0;\n }\n\n &__separator {\n margin: 0;\n border: 0;\n border-top: 1px solid common.$color-gray-300;\n }\n}\n\n.af-card {\n &--list {\n padding: 0 1rem;\n box-shadow: none;\n }\n\n &--click-list {\n padding: 0;\n\n .af-list__separator {\n width: calc(100% - 2rem);\n margin: auto;\n }\n\n .af-list__item {\n padding: 0;\n }\n }\n\n &--extra-padding {\n padding: 0.5rem 1.5rem;\n }\n\n &--first-separator-full-width {\n padding: 0;\n\n .af-list__item {\n padding: 1rem;\n\n &:has(.af-click-item) {\n padding: 0;\n }\n }\n\n .af-list__separator ~ .af-list__separator {\n margin: 0 1rem;\n }\n }\n}\n\n@media (width <= #{common.$breakpoint-sm}) {\n .af-card--extra-padding {\n padding: 0.25rem 1rem;\n\n .af-list__item {\n padding: 0.75rem 0;\n }\n }\n}\n","@use \"../common/common\" as common;\n\n.af-list {\n padding: 0;\n flex-direction: column;\n list-style-type: none;\n\n &__item {\n padding: 1rem 0;\n }\n\n &__separator {\n margin: 0;\n border: 0;\n border-top: 1px solid common.$color-gray-300;\n }\n}\n\n.af-card {\n &--list {\n padding: 0 1rem;\n box-shadow: none;\n }\n\n &--click-list {\n padding: 0;\n\n .af-list__separator {\n width: calc(100% - 2rem);\n margin: auto;\n }\n\n .af-list__item {\n padding: 0;\n }\n }\n\n &--extra-padding {\n padding: 0.5rem 1.5rem;\n }\n\n &--first-separator-full-width {\n padding: 0;\n\n .af-list__item {\n padding: 1rem;\n\n &:has(.af-click-item) {\n padding: 0;\n }\n }\n\n .af-list__separator ~ .af-list__separator {\n margin: 0 1rem;\n }\n }\n}\n\n@media (width <= #{common.$breakpoint-sm}) {\n .af-card--extra-padding {\n padding: 0.25rem 1rem;\n\n .af-list__item {\n padding: 0.75rem 0;\n }\n }\n}\n"]}
@@ -35,10 +35,6 @@
35
35
  }
36
36
  }
37
37
 
38
- &--large {
39
- width: 100%;
40
- }
41
-
42
38
  &--extra-padding {
43
39
  padding: 0.5rem 1.5rem;
44
40
  }