@axa-fr/design-system-apollo-css 1.0.5-alpha.443 → 1.0.5-alpha.445
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.
- package/dist/BasePicture/BasePicture.css +1 -0
- package/dist/BasePicture/BasePicture.css.map +1 -0
- package/dist/BasePicture/BasePicture.scss +5 -0
- package/dist/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionApollo.css +1 -1
- package/dist/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionApollo.css.map +1 -1
- package/dist/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionCommon.css +1 -1
- package/dist/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionCommon.css.map +1 -1
- package/dist/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionCommon.scss +9 -1
- package/dist/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionLF.css +1 -1
- package/dist/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionLF.css.map +1 -1
- package/dist/Form/Radio/CardRadioOption/CardRadioOptionApollo.css +1 -1
- package/dist/Form/Radio/CardRadioOption/CardRadioOptionApollo.css.map +1 -1
- package/dist/Form/Radio/CardRadioOption/CardRadioOptionCommon.css +1 -1
- package/dist/Form/Radio/CardRadioOption/CardRadioOptionCommon.css.map +1 -1
- package/dist/Form/Radio/CardRadioOption/CardRadioOptionCommon.scss +9 -1
- package/dist/Form/Radio/CardRadioOption/CardRadioOptionLF.css +1 -1
- package/dist/Form/Radio/CardRadioOption/CardRadioOptionLF.css.map +1 -1
- package/dist/apollo.css +1 -1
- package/dist/apollo.css.map +1 -1
- package/dist/apollo.scss +1 -1
- package/dist/look-and-feel.css +1 -1
- package/dist/look-and-feel.css.map +1 -1
- package/dist/look-and-feel.scss +1 -1
- package/package.json +1 -1
- package/dist/BasePicture/BasePictureApollo.css +0 -1
- package/dist/BasePicture/BasePictureApollo.css.map +0 -1
- package/dist/BasePicture/BasePictureApollo.scss +0 -1
- package/dist/BasePicture/BasePictureCommon.css +0 -1
- package/dist/BasePicture/BasePictureCommon.css.map +0 -1
- package/dist/BasePicture/BasePictureCommon.scss +0 -5
- package/dist/BasePicture/BasePictureLF.css +0 -1
- package/dist/BasePicture/BasePictureLF.css.map +0 -1
- package/dist/BasePicture/BasePictureLF.scss +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.af-basepicture{border-radius:100%;height:calc(48/var(--font-size-base)*1rem);width:calc(48/var(--font-size-base)*1rem)}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/BasePicture/BasePicture.scss%23sass","../../src/BasePicture/BasePicture.scss"],"names":[],"mappings":"AAAA,gBAGE,kBAAA,CADA,0CAAA,CADA,yCCGF","file":"BasePicture.css","sourcesContent":[".af-basepicture {\n width: calc(48 / var(--font-size-base) * 1rem);\n height: calc(48 / var(--font-size-base) * 1rem);\n border-radius: 100%;\n}\n",".af-basepicture {\n width: calc(48 / var(--font-size-base) * 1rem);\n height: calc(48 / var(--font-size-base) * 1rem);\n border-radius: 100%;\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.af-card-checkbox-option{--checkbox-option-border-width:1px;--checkbox-option-background-color:var(--white);align-items:center;background-color:var(--checkbox-option-background-color);border-radius:calc(8/var(--font-size-base)*1rem);cursor:pointer;display:flex;flex-direction:column;gap:var(--checkbox-option-gap);justify-content:space-between;outline:var(--checkbox-option-border-width) solid var(--checkbox-option-border-color);outline-offset:calc(var(--checkbox-option-border-width)*-1);padding:1rem;position:relative;text-align:center}.af-card-checkbox-option:hover{--checkbox-option-border-width:2px}.af-card-checkbox-option__label{color:var(--checkbox-option-color-title);font-size:calc(16/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-checkbox-option__label{font-size:calc(18/var(--font-size-base)*1rem)}}.af-card-checkbox-option:has(input:checked){--checkbox-option-border-width:2px}.af-card-checkbox-option:has(input:checked) .af-card-checkbox-option__label{font-weight:600}.af-card-checkbox-option__content{align-items:center;display:flex;flex-direction:column;flex-grow:1;gap:var(--checkbox-option-gap);justify-content:space-between;text-align:center}.af-card-checkbox-option__description,.af-card-checkbox-option__subtitle{color:var(--checkbox-option-color-subtitle);font-size:calc(14/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-checkbox-option__description,.af-card-checkbox-option__subtitle{font-size:1rem}}.af-card-checkbox-option--horizontal{flex-direction:row}.af-card-checkbox-option--horizontal .af-card-checkbox-option__content{align-items:flex-start}.af-card-checkbox-option--horizontal .af-checkbox{order:-1}.af-card-checkbox-option .af-icon{--icon-size:var(--icon-size-medium)}@media (width > 667px){.af-card-checkbox-option .af-icon{--icon-size:var(--icon-size-large)}}.af-card-checkbox-option{--checkbox-option-border-color:var(--axa-blue-65);--checkbox-option-color-title:var(--axa-blue-100);--checkbox-option-color-subtitle:var(--neutral-80);--checkbox-option-gap:calc(8/var(--font-size-base)*1rem)}.af-card-checkbox-option:hover{--checkbox-option-border-color:var(--axa-blue-100)}.af-card-checkbox-option--horizontal{--checkbox-option-gap:calc(8/var(--font-size-base)*1rem)}.af-card-checkbox-option--horizontal .af-card-checkbox-option__content{--checkbox-option-gap:calc(4/var(--font-size-base)*1rem)}.af-card-checkbox-option--horizontal .af-checkbox{margin-right:calc(8/var(--font-size-base)*1rem)}.af-card-checkbox-option:not(.af-card-checkbox-option--horizontal) .af-checkbox{margin-top:calc(8/var(--font-size-base)*1rem)}.af-card-checkbox-option:has(input:checked){--checkbox-option-background-color:var(--axa-blue-4);--checkbox-option-border-color:var(--axa-blue-100)}.af-card-checkbox-option:has(input[aria-invalid=true]):not(:has(input:checked)){--checkbox-option-border-color:var(--red-alert-100);--checkbox-option-background-color:var(--axa-red-4);--checkbox-option-color-title:var(--neutral-80)}
|
|
1
|
+
.af-card-checkbox-option{--checkbox-option-border-width:1px;--checkbox-option-background-color:var(--white);align-items:center;background-color:var(--checkbox-option-background-color);border-radius:calc(8/var(--font-size-base)*1rem);cursor:pointer;display:flex;flex-direction:column;gap:var(--checkbox-option-gap);justify-content:space-between;outline:var(--checkbox-option-border-width) solid var(--checkbox-option-border-color);outline-offset:calc(var(--checkbox-option-border-width)*-1);padding:1rem;position:relative;text-align:center}.af-card-checkbox-option:focus-visible,.af-card-checkbox-option:focus-within,.af-card-checkbox-option:hover{--checkbox-option-border-width:2px;--checkbox-option-border-color:var(--axa-blue-100)}.af-card-checkbox-option__label{color:var(--checkbox-option-color-title);font-size:calc(16/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-checkbox-option__label{font-size:calc(18/var(--font-size-base)*1rem)}}.af-card-checkbox-option:has(input:checked){--checkbox-option-border-width:2px}.af-card-checkbox-option:has(input:checked):focus-visible,.af-card-checkbox-option:has(input:checked):focus-within,.af-card-checkbox-option:has(input:checked):hover{--checkbox-option-border-width:3px}.af-card-checkbox-option:has(input:checked) .af-card-checkbox-option__label{font-weight:600}.af-card-checkbox-option__content{align-items:center;display:flex;flex-direction:column;flex-grow:1;gap:var(--checkbox-option-gap);justify-content:space-between;text-align:center}.af-card-checkbox-option__description,.af-card-checkbox-option__subtitle{color:var(--checkbox-option-color-subtitle);font-size:calc(14/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-checkbox-option__description,.af-card-checkbox-option__subtitle{font-size:1rem}}.af-card-checkbox-option--horizontal{flex-direction:row}.af-card-checkbox-option--horizontal .af-card-checkbox-option__content{align-items:flex-start}.af-card-checkbox-option--horizontal .af-checkbox{order:-1}.af-card-checkbox-option .af-icon{--icon-size:var(--icon-size-medium)}@media (width > 667px){.af-card-checkbox-option .af-icon{--icon-size:var(--icon-size-large)}}.af-card-checkbox-option{--checkbox-option-border-color:var(--axa-blue-65);--checkbox-option-color-title:var(--axa-blue-100);--checkbox-option-color-subtitle:var(--neutral-80);--checkbox-option-gap:calc(8/var(--font-size-base)*1rem)}.af-card-checkbox-option:hover{--checkbox-option-border-color:var(--axa-blue-100)}.af-card-checkbox-option--horizontal{--checkbox-option-gap:calc(8/var(--font-size-base)*1rem)}.af-card-checkbox-option--horizontal .af-card-checkbox-option__content{--checkbox-option-gap:calc(4/var(--font-size-base)*1rem)}.af-card-checkbox-option--horizontal .af-checkbox{margin-right:calc(8/var(--font-size-base)*1rem)}.af-card-checkbox-option:not(.af-card-checkbox-option--horizontal) .af-checkbox{margin-top:calc(8/var(--font-size-base)*1rem)}.af-card-checkbox-option:has(input:checked){--checkbox-option-background-color:var(--axa-blue-4);--checkbox-option-border-color:var(--axa-blue-100)}.af-card-checkbox-option:has(input[aria-invalid=true]):not(:has(input:checked)){--checkbox-option-border-color:var(--red-alert-100);--checkbox-option-background-color:var(--axa-red-4);--checkbox-option-color-title:var(--neutral-80)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionCommon.scss","../../../../src/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionApollo.scss","../../../../src/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionApollo.scss%23sass"],"names":[],"mappings":"AAEA,yBACE,kCAAA,CCDF,+CAAA,CDSE,kBAAA,CAIA,wDAAA,CANA,gDAAA,CAUA,cAAA,CAZA,YAAA,CAGA,qBAAA,CAGA,8BAAA,CADA,6BAAA,CAIA,qFAAA,CAEA,2DAAA,CAVA,YAAA,CAFA,iBAAA,CAQA,iBCEF,CDKE
|
|
1
|
+
{"version":3,"sources":["../../../../src/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionCommon.scss","../../../../src/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionApollo.scss","../../../../src/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionApollo.scss%23sass"],"names":[],"mappings":"AAEA,yBACE,kCAAA,CCDF,+CAAA,CDSE,kBAAA,CAIA,wDAAA,CANA,gDAAA,CAUA,cAAA,CAZA,YAAA,CAGA,qBAAA,CAGA,8BAAA,CADA,6BAAA,CAIA,qFAAA,CAEA,2DAAA,CAVA,YAAA,CAFA,iBAAA,CAQA,iBCEF,CDKE,4GAGE,kCAAA,CACA,kDCLJ,CDQE,gCAIE,wCAAA,CAFA,6CAAA,CACA,eAAA,CAFA,QCHJ,CDQI,uBANF,gCAOI,6CCLJ,CACF,CDQE,4CACE,kCCNJ,CDQI,qKAGE,kCCRN,CDWI,4EACE,eCTN,CDaE,kCAIE,kBAAA,CAHA,YAAA,CACA,qBAAA,CACA,WAAA,CAGA,8BAAA,CADA,6BAAA,CAEA,iBCXJ,CDcE,yEAKE,2CAAA,CAFA,6CAAA,CACA,eAAA,CAFA,QCVJ,CDeI,uBAPF,yEAQI,cCZJ,CACF,CDeE,qCACE,kBCbJ,CDeI,uEACE,sBCbN,CDgBI,kDACE,QCdN,CDkBE,kCACE,mCChBJ,CDkBI,uBAHF,kCAII,kCCfJ,CACF,CC3EA,yBACE,iDAAA,CACA,iDAAA,CACA,kDAAA,CACA,wDD8EF,CC5EE,+BACE,kDD8EJ,CC3EE,qCACE,wDD6EJ,CC3EI,uEACE,wDD6EN,CC1EI,kDACE,+CD4EN,CCxEE,gFACE,6CD0EJ,CCvEE,4CACE,oDAAA,CACA,kDDyEJ,CCtEE,gFACE,mDAAA,CACA,mDAAA,CACA,+CDwEJ","file":"CardCheckboxOptionApollo.css","sourcesContent":["@use \"../../../common/breakpoints\";\n\n.af-card-checkbox-option {\n --checkbox-option-border-width: 1px;\n --checkbox-option-background-color: var(--white);\n\n position: relative;\n display: flex;\n padding: 1rem;\n border-radius: calc(8 / var(--font-size-base) * 1rem);\n flex-direction: column;\n align-items: center;\n justify-content: space-between;\n gap: var(--checkbox-option-gap);\n text-align: center;\n background-color: var(--checkbox-option-background-color);\n outline: var(--checkbox-option-border-width) solid\n var(--checkbox-option-border-color);\n outline-offset: calc(-1 * var(--checkbox-option-border-width));\n cursor: pointer;\n\n &:hover,\n &:focus-visible,\n &:focus-within {\n --checkbox-option-border-width: 2px;\n --checkbox-option-border-color: var(--axa-blue-100);\n }\n\n &__label {\n margin: 0;\n font-size: calc(16 / var(--font-size-base) * 1rem);\n font-weight: 400;\n color: var(--checkbox-option-color-title);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n font-size: calc(18 / var(--font-size-base) * 1rem);\n }\n }\n\n &:has(input:checked) {\n --checkbox-option-border-width: 2px;\n\n &:hover,\n &:focus-visible,\n &:focus-within {\n --checkbox-option-border-width: 3px;\n }\n\n & .af-card-checkbox-option__label {\n font-weight: 600;\n }\n }\n\n &__content {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n align-items: center;\n justify-content: space-between;\n gap: var(--checkbox-option-gap);\n text-align: center;\n }\n\n &__description,\n &__subtitle {\n margin: 0;\n font-size: calc(14 / var(--font-size-base) * 1rem);\n font-weight: 400;\n color: var(--checkbox-option-color-subtitle);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n font-size: 1rem;\n }\n }\n\n &--horizontal {\n flex-direction: row;\n\n & .af-card-checkbox-option__content {\n align-items: flex-start;\n }\n\n & .af-checkbox {\n order: -1;\n }\n }\n\n & .af-icon {\n --icon-size: var(--icon-size-medium);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n --icon-size: var(--icon-size-large);\n }\n }\n}\n","@use \"CardCheckboxOptionCommon\";\n\n.af-card-checkbox-option {\n --checkbox-option-border-color: var(--axa-blue-65);\n --checkbox-option-color-title: var(--axa-blue-100);\n --checkbox-option-color-subtitle: var(--neutral-80);\n --checkbox-option-gap: calc(8 / var(--font-size-base) * 1rem);\n\n &:hover {\n --checkbox-option-border-color: var(--axa-blue-100);\n }\n\n &--horizontal {\n --checkbox-option-gap: calc(8 / var(--font-size-base) * 1rem);\n\n & .af-card-checkbox-option__content {\n --checkbox-option-gap: calc(4 / var(--font-size-base) * 1rem);\n }\n\n & .af-checkbox {\n margin-right: calc(8 / var(--font-size-base) * 1rem);\n }\n }\n\n &:not(&--horizontal) .af-checkbox {\n margin-top: calc(8 / var(--font-size-base) * 1rem);\n }\n\n &:has(input:checked) {\n --checkbox-option-background-color: var(--axa-blue-4);\n --checkbox-option-border-color: var(--axa-blue-100);\n }\n\n &:has(input[aria-invalid=\"true\"]):not(:has(input:checked)) {\n --checkbox-option-border-color: var(--red-alert-100);\n --checkbox-option-background-color: var(--axa-red-4);\n --checkbox-option-color-title: var(--neutral-80);\n }\n}\n","@use \"CardCheckboxOptionCommon\";\n\n.af-card-checkbox-option {\n --checkbox-option-border-color: var(--axa-blue-65);\n --checkbox-option-color-title: var(--axa-blue-100);\n --checkbox-option-color-subtitle: var(--neutral-80);\n --checkbox-option-gap: calc(8 / var(--font-size-base) * 1rem);\n\n &:hover {\n --checkbox-option-border-color: var(--axa-blue-100);\n }\n\n &--horizontal {\n --checkbox-option-gap: calc(8 / var(--font-size-base) * 1rem);\n\n & .af-card-checkbox-option__content {\n --checkbox-option-gap: calc(4 / var(--font-size-base) * 1rem);\n }\n\n & .af-checkbox {\n margin-right: calc(8 / var(--font-size-base) * 1rem);\n }\n }\n\n &:not(&--horizontal) .af-checkbox {\n margin-top: calc(8 / var(--font-size-base) * 1rem);\n }\n\n &:has(input:checked) {\n --checkbox-option-background-color: var(--axa-blue-4);\n --checkbox-option-border-color: var(--axa-blue-100);\n }\n\n &:has(input[aria-invalid=\"true\"]):not(:has(input:checked)) {\n --checkbox-option-border-color: var(--red-alert-100);\n --checkbox-option-background-color: var(--axa-red-4);\n --checkbox-option-color-title: var(--neutral-80);\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.af-card-checkbox-option{--checkbox-option-border-width:1px;--checkbox-option-background-color:var(--white);align-items:center;background-color:var(--checkbox-option-background-color);border-radius:calc(8/var(--font-size-base)*1rem);cursor:pointer;display:flex;flex-direction:column;gap:var(--checkbox-option-gap);justify-content:space-between;outline:var(--checkbox-option-border-width) solid var(--checkbox-option-border-color);outline-offset:calc(var(--checkbox-option-border-width)*-1);padding:1rem;position:relative;text-align:center}.af-card-checkbox-option:hover{--checkbox-option-border-width:2px;--checkbox-option-border-color:var(--axa-blue-100)}.af-card-checkbox-option__label{color:var(--checkbox-option-color-title);font-size:calc(16/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-checkbox-option__label{font-size:calc(18/var(--font-size-base)*1rem)}}.af-card-checkbox-option:has(input:checked){--checkbox-option-border-width:2px}.af-card-checkbox-option:has(input:checked) .af-card-checkbox-option__label{font-weight:600}.af-card-checkbox-option__content{align-items:center;display:flex;flex-direction:column;flex-grow:1;gap:var(--checkbox-option-gap);justify-content:space-between;text-align:center}.af-card-checkbox-option__description,.af-card-checkbox-option__subtitle{color:var(--checkbox-option-color-subtitle);font-size:calc(14/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-checkbox-option__description,.af-card-checkbox-option__subtitle{font-size:1rem}}.af-card-checkbox-option--horizontal{flex-direction:row}.af-card-checkbox-option--horizontal .af-card-checkbox-option__content{align-items:flex-start}.af-card-checkbox-option--horizontal .af-checkbox{order:-1}.af-card-checkbox-option .af-icon{--icon-size:var(--icon-size-medium)}@media (width > 667px){.af-card-checkbox-option .af-icon{--icon-size:var(--icon-size-large)}}
|
|
1
|
+
.af-card-checkbox-option{--checkbox-option-border-width:1px;--checkbox-option-background-color:var(--white);align-items:center;background-color:var(--checkbox-option-background-color);border-radius:calc(8/var(--font-size-base)*1rem);cursor:pointer;display:flex;flex-direction:column;gap:var(--checkbox-option-gap);justify-content:space-between;outline:var(--checkbox-option-border-width) solid var(--checkbox-option-border-color);outline-offset:calc(var(--checkbox-option-border-width)*-1);padding:1rem;position:relative;text-align:center}.af-card-checkbox-option:focus-visible,.af-card-checkbox-option:focus-within,.af-card-checkbox-option:hover{--checkbox-option-border-width:2px;--checkbox-option-border-color:var(--axa-blue-100)}.af-card-checkbox-option__label{color:var(--checkbox-option-color-title);font-size:calc(16/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-checkbox-option__label{font-size:calc(18/var(--font-size-base)*1rem)}}.af-card-checkbox-option:has(input:checked){--checkbox-option-border-width:2px}.af-card-checkbox-option:has(input:checked):focus-visible,.af-card-checkbox-option:has(input:checked):focus-within,.af-card-checkbox-option:has(input:checked):hover{--checkbox-option-border-width:3px}.af-card-checkbox-option:has(input:checked) .af-card-checkbox-option__label{font-weight:600}.af-card-checkbox-option__content{align-items:center;display:flex;flex-direction:column;flex-grow:1;gap:var(--checkbox-option-gap);justify-content:space-between;text-align:center}.af-card-checkbox-option__description,.af-card-checkbox-option__subtitle{color:var(--checkbox-option-color-subtitle);font-size:calc(14/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-checkbox-option__description,.af-card-checkbox-option__subtitle{font-size:1rem}}.af-card-checkbox-option--horizontal{flex-direction:row}.af-card-checkbox-option--horizontal .af-card-checkbox-option__content{align-items:flex-start}.af-card-checkbox-option--horizontal .af-checkbox{order:-1}.af-card-checkbox-option .af-icon{--icon-size:var(--icon-size-medium)}@media (width > 667px){.af-card-checkbox-option .af-icon{--icon-size:var(--icon-size-large)}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionCommon.scss%23sass","../../../../src/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionCommon.scss"],"names":[],"mappings":"AAEA,yBACE,kCAAA,CCDF,+CAAA,CDSE,kBAAA,CAIA,wDAAA,CANA,gDAAA,CAUA,cAAA,CAZA,YAAA,CAGA,qBAAA,CAGA,8BAAA,CADA,6BAAA,CAIA,qFAAA,CAEA,2DAAA,CAVA,YAAA,CAFA,iBAAA,CAQA,iBCEF,CDKE
|
|
1
|
+
{"version":3,"sources":["../../../../src/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionCommon.scss%23sass","../../../../src/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionCommon.scss"],"names":[],"mappings":"AAEA,yBACE,kCAAA,CCDF,+CAAA,CDSE,kBAAA,CAIA,wDAAA,CANA,gDAAA,CAUA,cAAA,CAZA,YAAA,CAGA,qBAAA,CAGA,8BAAA,CADA,6BAAA,CAIA,qFAAA,CAEA,2DAAA,CAVA,YAAA,CAFA,iBAAA,CAQA,iBCEF,CDKE,4GAGE,kCAAA,CACA,kDCLJ,CDQE,gCAIE,wCAAA,CAFA,6CAAA,CACA,eAAA,CAFA,QCHJ,CDQI,uBANF,gCAOI,6CCLJ,CACF,CDQE,4CACE,kCCNJ,CDQI,qKAGE,kCCRN,CDWI,4EACE,eCTN,CDaE,kCAIE,kBAAA,CAHA,YAAA,CACA,qBAAA,CACA,WAAA,CAGA,8BAAA,CADA,6BAAA,CAEA,iBCXJ,CDcE,yEAKE,2CAAA,CAFA,6CAAA,CACA,eAAA,CAFA,QCVJ,CDeI,uBAPF,yEAQI,cCZJ,CACF,CDeE,qCACE,kBCbJ,CDeI,uEACE,sBCbN,CDgBI,kDACE,QCdN,CDkBE,kCACE,mCChBJ,CDkBI,uBAHF,kCCZA,kCACA,CACF","file":"CardCheckboxOptionCommon.css","sourcesContent":["@use \"../../../common/breakpoints\";\n\n.af-card-checkbox-option {\n --checkbox-option-border-width: 1px;\n --checkbox-option-background-color: var(--white);\n\n position: relative;\n display: flex;\n padding: 1rem;\n border-radius: calc(8 / var(--font-size-base) * 1rem);\n flex-direction: column;\n align-items: center;\n justify-content: space-between;\n gap: var(--checkbox-option-gap);\n text-align: center;\n background-color: var(--checkbox-option-background-color);\n outline: var(--checkbox-option-border-width) solid\n var(--checkbox-option-border-color);\n outline-offset: calc(-1 * var(--checkbox-option-border-width));\n cursor: pointer;\n\n &:hover,\n &:focus-visible,\n &:focus-within {\n --checkbox-option-border-width: 2px;\n --checkbox-option-border-color: var(--axa-blue-100);\n }\n\n &__label {\n margin: 0;\n font-size: calc(16 / var(--font-size-base) * 1rem);\n font-weight: 400;\n color: var(--checkbox-option-color-title);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n font-size: calc(18 / var(--font-size-base) * 1rem);\n }\n }\n\n &:has(input:checked) {\n --checkbox-option-border-width: 2px;\n\n &:hover,\n &:focus-visible,\n &:focus-within {\n --checkbox-option-border-width: 3px;\n }\n\n & .af-card-checkbox-option__label {\n font-weight: 600;\n }\n }\n\n &__content {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n align-items: center;\n justify-content: space-between;\n gap: var(--checkbox-option-gap);\n text-align: center;\n }\n\n &__description,\n &__subtitle {\n margin: 0;\n font-size: calc(14 / var(--font-size-base) * 1rem);\n font-weight: 400;\n color: var(--checkbox-option-color-subtitle);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n font-size: 1rem;\n }\n }\n\n &--horizontal {\n flex-direction: row;\n\n & .af-card-checkbox-option__content {\n align-items: flex-start;\n }\n\n & .af-checkbox {\n order: -1;\n }\n }\n\n & .af-icon {\n --icon-size: var(--icon-size-medium);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n --icon-size: var(--icon-size-large);\n }\n }\n}\n","@use \"../../../common/breakpoints\";\n\n.af-card-checkbox-option {\n --checkbox-option-border-width: 1px;\n --checkbox-option-background-color: var(--white);\n\n position: relative;\n display: flex;\n padding: 1rem;\n border-radius: calc(8 / var(--font-size-base) * 1rem);\n flex-direction: column;\n align-items: center;\n justify-content: space-between;\n gap: var(--checkbox-option-gap);\n text-align: center;\n background-color: var(--checkbox-option-background-color);\n outline: var(--checkbox-option-border-width) solid\n var(--checkbox-option-border-color);\n outline-offset: calc(-1 * var(--checkbox-option-border-width));\n cursor: pointer;\n\n &:hover,\n &:focus-visible,\n &:focus-within {\n --checkbox-option-border-width: 2px;\n --checkbox-option-border-color: var(--axa-blue-100);\n }\n\n &__label {\n margin: 0;\n font-size: calc(16 / var(--font-size-base) * 1rem);\n font-weight: 400;\n color: var(--checkbox-option-color-title);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n font-size: calc(18 / var(--font-size-base) * 1rem);\n }\n }\n\n &:has(input:checked) {\n --checkbox-option-border-width: 2px;\n\n &:hover,\n &:focus-visible,\n &:focus-within {\n --checkbox-option-border-width: 3px;\n }\n\n & .af-card-checkbox-option__label {\n font-weight: 600;\n }\n }\n\n &__content {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n align-items: center;\n justify-content: space-between;\n gap: var(--checkbox-option-gap);\n text-align: center;\n }\n\n &__description,\n &__subtitle {\n margin: 0;\n font-size: calc(14 / var(--font-size-base) * 1rem);\n font-weight: 400;\n color: var(--checkbox-option-color-subtitle);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n font-size: 1rem;\n }\n }\n\n &--horizontal {\n flex-direction: row;\n\n & .af-card-checkbox-option__content {\n align-items: flex-start;\n }\n\n & .af-checkbox {\n order: -1;\n }\n }\n\n & .af-icon {\n --icon-size: var(--icon-size-medium);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n --icon-size: var(--icon-size-large);\n }\n }\n}\n"]}
|
|
@@ -19,7 +19,9 @@
|
|
|
19
19
|
outline-offset: calc(-1 * var(--checkbox-option-border-width));
|
|
20
20
|
cursor: pointer;
|
|
21
21
|
|
|
22
|
-
&:hover
|
|
22
|
+
&:hover,
|
|
23
|
+
&:focus-visible,
|
|
24
|
+
&:focus-within {
|
|
23
25
|
--checkbox-option-border-width: 2px;
|
|
24
26
|
--checkbox-option-border-color: var(--axa-blue-100);
|
|
25
27
|
}
|
|
@@ -38,6 +40,12 @@
|
|
|
38
40
|
&:has(input:checked) {
|
|
39
41
|
--checkbox-option-border-width: 2px;
|
|
40
42
|
|
|
43
|
+
&:hover,
|
|
44
|
+
&:focus-visible,
|
|
45
|
+
&:focus-within {
|
|
46
|
+
--checkbox-option-border-width: 3px;
|
|
47
|
+
}
|
|
48
|
+
|
|
41
49
|
& .af-card-checkbox-option__label {
|
|
42
50
|
font-weight: 600;
|
|
43
51
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.af-card-checkbox-option{--checkbox-option-border-width:1px;--checkbox-option-background-color:var(--white);align-items:center;background-color:var(--checkbox-option-background-color);border-radius:calc(8/var(--font-size-base)*1rem);cursor:pointer;display:flex;flex-direction:column;gap:var(--checkbox-option-gap);justify-content:space-between;outline:var(--checkbox-option-border-width) solid var(--checkbox-option-border-color);outline-offset:calc(var(--checkbox-option-border-width)*-1);padding:1rem;position:relative;text-align:center}.af-card-checkbox-option:hover{--checkbox-option-border-width:2px;--checkbox-option-border-color:var(--axa-blue-100)}.af-card-checkbox-option__label{color:var(--checkbox-option-color-title);font-size:calc(16/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-checkbox-option__label{font-size:calc(18/var(--font-size-base)*1rem)}}.af-card-checkbox-option:has(input:checked){--checkbox-option-border-width:2px}.af-card-checkbox-option:has(input:checked) .af-card-checkbox-option__label{font-weight:600}.af-card-checkbox-option__content{align-items:center;display:flex;flex-direction:column;flex-grow:1;gap:var(--checkbox-option-gap);justify-content:space-between;text-align:center}.af-card-checkbox-option__description,.af-card-checkbox-option__subtitle{color:var(--checkbox-option-color-subtitle);font-size:calc(14/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-checkbox-option__description,.af-card-checkbox-option__subtitle{font-size:1rem}}.af-card-checkbox-option--horizontal{flex-direction:row}.af-card-checkbox-option--horizontal .af-card-checkbox-option__content{align-items:flex-start}.af-card-checkbox-option--horizontal .af-checkbox{order:-1}.af-card-checkbox-option .af-icon{--icon-size:var(--icon-size-medium)}@media (width > 667px){.af-card-checkbox-option .af-icon{--icon-size:var(--icon-size-large)}}.af-card-checkbox-option{--checkbox-option-border-color:var(--color-gray-700);--checkbox-option-color-title:var(--color-gray-900);--checkbox-option-color-subtitle:var(--color-gray-700);--checkbox-option-gap:calc(8/var(--font-size-base)*1rem)}.af-card-checkbox-option:hover{--checkbox-option-border-color:var(--color-axa)}.af-card-checkbox-option:not(.af-card-checkbox-option--horizontal) .af-checkbox{left:calc(12/var(--font-size-base)*1rem);position:absolute;top:calc(12/var(--font-size-base)*1rem)}@media (width > 667px){.af-card-checkbox-option:not(.af-card-checkbox-option--horizontal) .af-checkbox{left:calc(16/var(--font-size-base)*1rem);top:calc(16/var(--font-size-base)*1rem)}}.af-card-checkbox-option .af-card-checkbox-option__content{--checkbox-option-gap:calc(4/var(--font-size-base)*1rem)}.af-card-checkbox-option--horizontal{column-gap:calc(12/var(--font-size-base)*1rem)}.af-card-checkbox-option:has(input:checked){--checkbox-option-background-color:var(--color-blue-2);--checkbox-option-border-color:var(--color-axa)}.af-card-checkbox-option:has(input[aria-invalid=true]):not(:has(input:checked)){--checkbox-option-border-color:var(--color-red-700)}
|
|
1
|
+
.af-card-checkbox-option{--checkbox-option-border-width:1px;--checkbox-option-background-color:var(--white);align-items:center;background-color:var(--checkbox-option-background-color);border-radius:calc(8/var(--font-size-base)*1rem);cursor:pointer;display:flex;flex-direction:column;gap:var(--checkbox-option-gap);justify-content:space-between;outline:var(--checkbox-option-border-width) solid var(--checkbox-option-border-color);outline-offset:calc(var(--checkbox-option-border-width)*-1);padding:1rem;position:relative;text-align:center}.af-card-checkbox-option:focus-visible,.af-card-checkbox-option:focus-within,.af-card-checkbox-option:hover{--checkbox-option-border-width:2px;--checkbox-option-border-color:var(--axa-blue-100)}.af-card-checkbox-option__label{color:var(--checkbox-option-color-title);font-size:calc(16/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-checkbox-option__label{font-size:calc(18/var(--font-size-base)*1rem)}}.af-card-checkbox-option:has(input:checked){--checkbox-option-border-width:2px}.af-card-checkbox-option:has(input:checked):focus-visible,.af-card-checkbox-option:has(input:checked):focus-within,.af-card-checkbox-option:has(input:checked):hover{--checkbox-option-border-width:3px}.af-card-checkbox-option:has(input:checked) .af-card-checkbox-option__label{font-weight:600}.af-card-checkbox-option__content{align-items:center;display:flex;flex-direction:column;flex-grow:1;gap:var(--checkbox-option-gap);justify-content:space-between;text-align:center}.af-card-checkbox-option__description,.af-card-checkbox-option__subtitle{color:var(--checkbox-option-color-subtitle);font-size:calc(14/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-checkbox-option__description,.af-card-checkbox-option__subtitle{font-size:1rem}}.af-card-checkbox-option--horizontal{flex-direction:row}.af-card-checkbox-option--horizontal .af-card-checkbox-option__content{align-items:flex-start}.af-card-checkbox-option--horizontal .af-checkbox{order:-1}.af-card-checkbox-option .af-icon{--icon-size:var(--icon-size-medium)}@media (width > 667px){.af-card-checkbox-option .af-icon{--icon-size:var(--icon-size-large)}}.af-card-checkbox-option{--checkbox-option-border-color:var(--color-gray-700);--checkbox-option-color-title:var(--color-gray-900);--checkbox-option-color-subtitle:var(--color-gray-700);--checkbox-option-gap:calc(8/var(--font-size-base)*1rem)}.af-card-checkbox-option:hover{--checkbox-option-border-color:var(--color-axa)}.af-card-checkbox-option:not(.af-card-checkbox-option--horizontal) .af-checkbox{left:calc(12/var(--font-size-base)*1rem);position:absolute;top:calc(12/var(--font-size-base)*1rem)}@media (width > 667px){.af-card-checkbox-option:not(.af-card-checkbox-option--horizontal) .af-checkbox{left:calc(16/var(--font-size-base)*1rem);top:calc(16/var(--font-size-base)*1rem)}}.af-card-checkbox-option .af-card-checkbox-option__content{--checkbox-option-gap:calc(4/var(--font-size-base)*1rem)}.af-card-checkbox-option--horizontal{column-gap:calc(12/var(--font-size-base)*1rem)}.af-card-checkbox-option:has(input:checked){--checkbox-option-background-color:var(--color-blue-2);--checkbox-option-border-color:var(--color-axa)}.af-card-checkbox-option:has(input[aria-invalid=true]):not(:has(input:checked)){--checkbox-option-border-color:var(--color-red-700)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionCommon.scss","../../../../src/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionLF.scss","../../../../src/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionLF.scss%23sass"],"names":[],"mappings":"AAEA,yBCDA,kCDEE,CACA,+CAAA,CAOA,kBAAA,CAIA,wDAAA,CANA,gDAAA,CAUA,cAAA,CAZA,YAAA,CAGA,qBAAA,CAGA,8BAAA,CADA,6BAAA,CAIA,qFAAA,CAEA,2DAAA,CAVA,YAAA,CCLF,iBAAA,CDWE,iBCEF,CDKE
|
|
1
|
+
{"version":3,"sources":["../../../../src/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionCommon.scss","../../../../src/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionLF.scss","../../../../src/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionLF.scss%23sass"],"names":[],"mappings":"AAEA,yBCDA,kCDEE,CACA,+CAAA,CAOA,kBAAA,CAIA,wDAAA,CANA,gDAAA,CAUA,cAAA,CAZA,YAAA,CAGA,qBAAA,CAGA,8BAAA,CADA,6BAAA,CAIA,qFAAA,CAEA,2DAAA,CAVA,YAAA,CCLF,iBAAA,CDWE,iBCEF,CDKE,4GAGE,kCAAA,CACA,kDCLJ,CDQE,gCAIE,wCAAA,CAFA,6CAAA,CACA,eAAA,CAFA,QCHJ,CDQI,uBANF,gCAOI,6CCLJ,CACF,CDQE,4CACE,kCCNJ,CDQI,qKAGE,kCCRN,CDWI,4EACE,eCTN,CDaE,kCAIE,kBAAA,CAHA,YAAA,CACA,qBAAA,CACA,WAAA,CAGA,8BAAA,CADA,6BAAA,CAEA,iBCXJ,CDcE,yEAKE,2CAAA,CAFA,6CAAA,CACA,eAAA,CAFA,QCVJ,CDeI,uBAPF,yEAQI,cCZJ,CACF,CDeE,qCACE,kBCbJ,CDeI,uEACE,sBCbN,CDgBI,kDACE,QCdN,CDkBE,kCACE,mCChBJ,CDkBI,uBAHF,kCAII,kCCfJ,CACF,CC1EA,yBACE,oDAAA,CACA,mDAAA,CACA,sDAAA,CACA,wDD6EF,CC3EE,+BACE,+CD6EJ,CC1EE,gFAGE,wCAAA,CAFA,iBAAA,CACA,uCD6EJ,CC1EI,uBALF,gFAOI,wCAAA,CADA,uCD8EJ,CACF,CC1EE,2DACE,wDD4EJ,CCzEE,qCACE,8CD2EJ,CCxEE,4CACE,sDAAA,CACA,+CD0EJ,CCvEE,gFACE,mDDyEJ","file":"CardCheckboxOptionLF.css","sourcesContent":["@use \"../../../common/breakpoints\";\n\n.af-card-checkbox-option {\n --checkbox-option-border-width: 1px;\n --checkbox-option-background-color: var(--white);\n\n position: relative;\n display: flex;\n padding: 1rem;\n border-radius: calc(8 / var(--font-size-base) * 1rem);\n flex-direction: column;\n align-items: center;\n justify-content: space-between;\n gap: var(--checkbox-option-gap);\n text-align: center;\n background-color: var(--checkbox-option-background-color);\n outline: var(--checkbox-option-border-width) solid\n var(--checkbox-option-border-color);\n outline-offset: calc(-1 * var(--checkbox-option-border-width));\n cursor: pointer;\n\n &:hover,\n &:focus-visible,\n &:focus-within {\n --checkbox-option-border-width: 2px;\n --checkbox-option-border-color: var(--axa-blue-100);\n }\n\n &__label {\n margin: 0;\n font-size: calc(16 / var(--font-size-base) * 1rem);\n font-weight: 400;\n color: var(--checkbox-option-color-title);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n font-size: calc(18 / var(--font-size-base) * 1rem);\n }\n }\n\n &:has(input:checked) {\n --checkbox-option-border-width: 2px;\n\n &:hover,\n &:focus-visible,\n &:focus-within {\n --checkbox-option-border-width: 3px;\n }\n\n & .af-card-checkbox-option__label {\n font-weight: 600;\n }\n }\n\n &__content {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n align-items: center;\n justify-content: space-between;\n gap: var(--checkbox-option-gap);\n text-align: center;\n }\n\n &__description,\n &__subtitle {\n margin: 0;\n font-size: calc(14 / var(--font-size-base) * 1rem);\n font-weight: 400;\n color: var(--checkbox-option-color-subtitle);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n font-size: 1rem;\n }\n }\n\n &--horizontal {\n flex-direction: row;\n\n & .af-card-checkbox-option__content {\n align-items: flex-start;\n }\n\n & .af-checkbox {\n order: -1;\n }\n }\n\n & .af-icon {\n --icon-size: var(--icon-size-medium);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n --icon-size: var(--icon-size-large);\n }\n }\n}\n","@use \"CardCheckboxOptionCommon\";\n@use \"../../../common/breakpoints\";\n\n.af-card-checkbox-option {\n --checkbox-option-border-color: var(--color-gray-700);\n --checkbox-option-color-title: var(--color-gray-900);\n --checkbox-option-color-subtitle: var(--color-gray-700);\n --checkbox-option-gap: calc(8 / var(--font-size-base) * 1rem);\n\n &:hover {\n --checkbox-option-border-color: var(--color-axa);\n }\n\n &:not(&--horizontal) .af-checkbox {\n position: absolute;\n top: calc(12 / var(--font-size-base) * 1rem);\n left: calc(12 / var(--font-size-base) * 1rem);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n top: calc(16 / var(--font-size-base) * 1rem);\n left: calc(16 / var(--font-size-base) * 1rem);\n }\n }\n\n & .af-card-checkbox-option__content {\n --checkbox-option-gap: calc(4 / var(--font-size-base) * 1rem);\n }\n\n &--horizontal {\n column-gap: calc(12 / var(--font-size-base) * 1rem);\n }\n\n &:has(input:checked) {\n --checkbox-option-background-color: var(--color-blue-2);\n --checkbox-option-border-color: var(--color-axa);\n }\n\n &:has(input[aria-invalid=\"true\"]):not(:has(input:checked)) {\n --checkbox-option-border-color: var(--color-red-700);\n }\n}\n","@use \"CardCheckboxOptionCommon\";\n@use \"../../../common/breakpoints\";\n\n.af-card-checkbox-option {\n --checkbox-option-border-color: var(--color-gray-700);\n --checkbox-option-color-title: var(--color-gray-900);\n --checkbox-option-color-subtitle: var(--color-gray-700);\n --checkbox-option-gap: calc(8 / var(--font-size-base) * 1rem);\n\n &:hover {\n --checkbox-option-border-color: var(--color-axa);\n }\n\n &:not(&--horizontal) .af-checkbox {\n position: absolute;\n top: calc(12 / var(--font-size-base) * 1rem);\n left: calc(12 / var(--font-size-base) * 1rem);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n top: calc(16 / var(--font-size-base) * 1rem);\n left: calc(16 / var(--font-size-base) * 1rem);\n }\n }\n\n & .af-card-checkbox-option__content {\n --checkbox-option-gap: calc(4 / var(--font-size-base) * 1rem);\n }\n\n &--horizontal {\n column-gap: calc(12 / var(--font-size-base) * 1rem);\n }\n\n &:has(input:checked) {\n --checkbox-option-background-color: var(--color-blue-2);\n --checkbox-option-border-color: var(--color-axa);\n }\n\n &:has(input[aria-invalid=\"true\"]):not(:has(input:checked)) {\n --checkbox-option-border-color: var(--color-red-700);\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.af-card-radio-option{--radio-option-border-width:1px;--radio-option-background-color:var(--white);align-items:center;background-color:var(--radio-option-background-color);border-radius:calc(8/var(--font-size-base)*1rem);cursor:pointer;display:flex;flex-direction:column;gap:var(--radio-option-gap);justify-content:space-between;outline:var(--radio-option-border-width) solid var(--radio-option-border-color);outline-offset:calc(var(--radio-option-border-width)*-1);padding:1rem;position:relative;text-align:center}.af-card-radio-option:hover{--radio-option-border-width:2px}.af-card-radio-option__label{color:var(--radio-option-color-title);font-size:calc(16/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-radio-option__label{font-size:calc(18/var(--font-size-base)*1rem)}}.af-card-radio-option:has(input:checked){--radio-option-border-width:2px}.af-card-radio-option:has(input:checked) .af-card-radio-option__label{font-weight:600}.af-card-radio-option__content{align-items:center;display:flex;flex-direction:column;flex-grow:1;gap:var(--radio-option-gap);justify-content:space-between;text-align:center}.af-card-radio-option__description,.af-card-radio-option__subtitle{color:var(--radio-option-color-subtitle);font-size:calc(14/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-radio-option__description,.af-card-radio-option__subtitle{font-size:1rem}}.af-card-radio-option--horizontal{flex-direction:row}.af-card-radio-option--horizontal .af-card-radio-option__content{align-items:flex-start}.af-card-radio-option--horizontal .af-radio{order:-1}.af-card-radio-option .af-icon{--icon-size:var(--icon-size-medium)}@media (width > 667px){.af-card-radio-option .af-icon{--icon-size:var(--icon-size-large)}}.af-card-radio-option{--radio-option-border-color:var(--axa-blue-65);--radio-option-color-title:var(--axa-blue-100);--radio-option-color-subtitle:var(--neutral-80);--radio-option-gap:calc(8/var(--font-size-base)*1rem)}.af-card-radio-option:hover{--radio-option-border-color:var(--axa-blue-100)}.af-card-radio-option--horizontal{--radio-option-gap:calc(8/var(--font-size-base)*1rem)}.af-card-radio-option--horizontal .af-card-radio-option__content{--radio-option-gap:calc(4/var(--font-size-base)*1rem)}.af-card-radio-option--horizontal .af-radio{margin-right:calc(8/var(--font-size-base)*1rem)}.af-card-radio-option:not(.af-card-radio-option--horizontal) .af-radio{margin-top:calc(8/var(--font-size-base)*1rem)}.af-card-radio-option--invalid:not(:has(input:checked)){--radio-option-border-color:var(--red-alert-100);--radio-option-background-color:var(--axa-red-4);--radio-option-color-title:var(--neutral-80)}.af-card-radio-option:has(input:checked){--radio-option-background-color:var(--axa-blue-4);--radio-option-border-color:var(--axa-blue-100)}
|
|
1
|
+
.af-card-radio-option{--radio-option-border-width:1px;--radio-option-background-color:var(--white);align-items:center;background-color:var(--radio-option-background-color);border-radius:calc(8/var(--font-size-base)*1rem);cursor:pointer;display:flex;flex-direction:column;gap:var(--radio-option-gap);justify-content:space-between;outline:var(--radio-option-border-width) solid var(--radio-option-border-color);outline-offset:calc(var(--radio-option-border-width)*-1);padding:1rem;position:relative;text-align:center}.af-card-radio-option:focus-visible,.af-card-radio-option:focus-within,.af-card-radio-option:hover{--radio-option-border-width:2px;--radio-option-border-color:var(--axa-blue-100)}.af-card-radio-option__label{color:var(--radio-option-color-title);font-size:calc(16/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-radio-option__label{font-size:calc(18/var(--font-size-base)*1rem)}}.af-card-radio-option:has(input:checked){--radio-option-border-width:2px}.af-card-radio-option:has(input:checked):focus-visible,.af-card-radio-option:has(input:checked):focus-within,.af-card-radio-option:has(input:checked):hover{--radio-option-border-width:3px}.af-card-radio-option:has(input:checked) .af-card-radio-option__label{font-weight:600}.af-card-radio-option__content{align-items:center;display:flex;flex-direction:column;flex-grow:1;gap:var(--radio-option-gap);justify-content:space-between;text-align:center}.af-card-radio-option__description,.af-card-radio-option__subtitle{color:var(--radio-option-color-subtitle);font-size:calc(14/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-radio-option__description,.af-card-radio-option__subtitle{font-size:1rem}}.af-card-radio-option--horizontal{flex-direction:row}.af-card-radio-option--horizontal .af-card-radio-option__content{align-items:flex-start}.af-card-radio-option--horizontal .af-radio{order:-1}.af-card-radio-option .af-icon{--icon-size:var(--icon-size-medium)}@media (width > 667px){.af-card-radio-option .af-icon{--icon-size:var(--icon-size-large)}}.af-card-radio-option{--radio-option-border-color:var(--axa-blue-65);--radio-option-color-title:var(--axa-blue-100);--radio-option-color-subtitle:var(--neutral-80);--radio-option-gap:calc(8/var(--font-size-base)*1rem)}.af-card-radio-option:hover{--radio-option-border-color:var(--axa-blue-100)}.af-card-radio-option--horizontal{--radio-option-gap:calc(8/var(--font-size-base)*1rem)}.af-card-radio-option--horizontal .af-card-radio-option__content{--radio-option-gap:calc(4/var(--font-size-base)*1rem)}.af-card-radio-option--horizontal .af-radio{margin-right:calc(8/var(--font-size-base)*1rem)}.af-card-radio-option:not(.af-card-radio-option--horizontal) .af-radio{margin-top:calc(8/var(--font-size-base)*1rem)}.af-card-radio-option--invalid:not(:has(input:checked)){--radio-option-border-color:var(--red-alert-100);--radio-option-background-color:var(--axa-red-4);--radio-option-color-title:var(--neutral-80)}.af-card-radio-option:has(input:checked){--radio-option-background-color:var(--axa-blue-4);--radio-option-border-color:var(--axa-blue-100)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/Form/Radio/CardRadioOption/CardRadioOptionCommon.scss","../../../../src/Form/Radio/CardRadioOption/CardRadioOptionApollo.scss","../../../../src/Form/Radio/CardRadioOption/CardRadioOptionApollo.scss%23sass"],"names":[],"mappings":"AAEA,sBACE,+BAAA,CCDF,4CAAA,CDSE,kBAAA,CAIA,qDAAA,CANA,gDAAA,CAUA,cAAA,CAZA,YAAA,CAGA,qBAAA,CAGA,2BAAA,CADA,6BAAA,CAIA,+EAAA,CAEA,wDAAA,CAVA,YAAA,CAFA,iBAAA,CAQA,iBCEF,CDKE,
|
|
1
|
+
{"version":3,"sources":["../../../../src/Form/Radio/CardRadioOption/CardRadioOptionCommon.scss","../../../../src/Form/Radio/CardRadioOption/CardRadioOptionApollo.scss","../../../../src/Form/Radio/CardRadioOption/CardRadioOptionApollo.scss%23sass"],"names":[],"mappings":"AAEA,sBACE,+BAAA,CCDF,4CAAA,CDSE,kBAAA,CAIA,qDAAA,CANA,gDAAA,CAUA,cAAA,CAZA,YAAA,CAGA,qBAAA,CAGA,2BAAA,CADA,6BAAA,CAIA,+EAAA,CAEA,wDAAA,CAVA,YAAA,CAFA,iBAAA,CAQA,iBCEF,CDKE,mGAGE,+BAAA,CACA,+CCLJ,CDQE,6BAIE,qCAAA,CAFA,6CAAA,CACA,eAAA,CAFA,QCHJ,CDQI,uBANF,6BAOI,6CCLJ,CACF,CDQE,yCACE,+BCNJ,CDQI,4JAGE,+BCRN,CDWI,sEACE,eCTN,CDaE,+BAIE,kBAAA,CAHA,YAAA,CACA,qBAAA,CACA,WAAA,CAGA,2BAAA,CADA,6BAAA,CAEA,iBCXJ,CDcE,mEAKE,wCAAA,CAFA,6CAAA,CACA,eAAA,CAFA,QCVJ,CDeI,uBAPF,mEAQI,cCZJ,CACF,CDeE,kCACE,kBCbJ,CDeI,iEACE,sBCbN,CDgBI,4CACE,QCdN,CDkBE,+BACE,mCChBJ,CDkBI,uBAHF,+BAII,kCCfJ,CACF,CC3EA,sBACE,8CAAA,CACA,8CAAA,CACA,+CAAA,CACA,qDD8EF,CC5EE,4BACE,+CD8EJ,CC3EE,kCACE,qDD6EJ,CC3EI,iEACE,qDD6EN,CC1EI,4CACE,+CD4EN,CCxEE,uEACE,6CD0EJ,CCvEE,wDACE,gDAAA,CACA,gDAAA,CACA,4CDyEJ,CCtEE,yCACE,iDAAA,CACA,+CDwEJ","file":"CardRadioOptionApollo.css","sourcesContent":["@use \"../../../common/breakpoints\";\n\n.af-card-radio-option {\n --radio-option-border-width: 1px;\n --radio-option-background-color: var(--white);\n\n position: relative;\n display: flex;\n padding: 1rem;\n border-radius: calc(8 / var(--font-size-base) * 1rem);\n flex-direction: column;\n align-items: center;\n justify-content: space-between;\n gap: var(--radio-option-gap);\n text-align: center;\n background-color: var(--radio-option-background-color);\n outline: var(--radio-option-border-width) solid\n var(--radio-option-border-color);\n outline-offset: calc(-1 * var(--radio-option-border-width));\n cursor: pointer;\n\n &:hover,\n &:focus-visible,\n &:focus-within {\n --radio-option-border-width: 2px;\n --radio-option-border-color: var(--axa-blue-100);\n }\n\n &__label {\n margin: 0;\n font-size: calc(16 / var(--font-size-base) * 1rem);\n font-weight: 400;\n color: var(--radio-option-color-title);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n font-size: calc(18 / var(--font-size-base) * 1rem);\n }\n }\n\n &:has(input:checked) {\n --radio-option-border-width: 2px;\n\n &:hover,\n &:focus-visible,\n &:focus-within {\n --radio-option-border-width: 3px;\n }\n\n & .af-card-radio-option__label {\n font-weight: 600;\n }\n }\n\n &__content {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n align-items: center;\n justify-content: space-between;\n gap: var(--radio-option-gap);\n text-align: center;\n }\n\n &__description,\n &__subtitle {\n margin: 0;\n font-size: calc(14 / var(--font-size-base) * 1rem);\n font-weight: 400;\n color: var(--radio-option-color-subtitle);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n font-size: 1rem;\n }\n }\n\n &--horizontal {\n flex-direction: row;\n\n & .af-card-radio-option__content {\n align-items: flex-start;\n }\n\n & .af-radio {\n order: -1;\n }\n }\n\n & .af-icon {\n --icon-size: var(--icon-size-medium);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n --icon-size: var(--icon-size-large);\n }\n }\n}\n","@use \"CardRadioOptionCommon\";\n\n.af-card-radio-option {\n --radio-option-border-color: var(--axa-blue-65);\n --radio-option-color-title: var(--axa-blue-100);\n --radio-option-color-subtitle: var(--neutral-80);\n --radio-option-gap: calc(8 / var(--font-size-base) * 1rem);\n\n &:hover {\n --radio-option-border-color: var(--axa-blue-100);\n }\n\n &--horizontal {\n --radio-option-gap: calc(8 / var(--font-size-base) * 1rem);\n\n & .af-card-radio-option__content {\n --radio-option-gap: calc(4 / var(--font-size-base) * 1rem);\n }\n\n & .af-radio {\n margin-right: calc(8 / var(--font-size-base) * 1rem);\n }\n }\n\n &:not(&--horizontal) .af-radio {\n margin-top: calc(8 / var(--font-size-base) * 1rem);\n }\n\n &--invalid:not(:has(input:checked)) {\n --radio-option-border-color: var(--red-alert-100);\n --radio-option-background-color: var(--axa-red-4);\n --radio-option-color-title: var(--neutral-80);\n }\n\n &:has(input:checked) {\n --radio-option-background-color: var(--axa-blue-4);\n --radio-option-border-color: var(--axa-blue-100);\n }\n}\n","@use \"CardRadioOptionCommon\";\n\n.af-card-radio-option {\n --radio-option-border-color: var(--axa-blue-65);\n --radio-option-color-title: var(--axa-blue-100);\n --radio-option-color-subtitle: var(--neutral-80);\n --radio-option-gap: calc(8 / var(--font-size-base) * 1rem);\n\n &:hover {\n --radio-option-border-color: var(--axa-blue-100);\n }\n\n &--horizontal {\n --radio-option-gap: calc(8 / var(--font-size-base) * 1rem);\n\n & .af-card-radio-option__content {\n --radio-option-gap: calc(4 / var(--font-size-base) * 1rem);\n }\n\n & .af-radio {\n margin-right: calc(8 / var(--font-size-base) * 1rem);\n }\n }\n\n &:not(&--horizontal) .af-radio {\n margin-top: calc(8 / var(--font-size-base) * 1rem);\n }\n\n &--invalid:not(:has(input:checked)) {\n --radio-option-border-color: var(--red-alert-100);\n --radio-option-background-color: var(--axa-red-4);\n --radio-option-color-title: var(--neutral-80);\n }\n\n &:has(input:checked) {\n --radio-option-background-color: var(--axa-blue-4);\n --radio-option-border-color: var(--axa-blue-100);\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.af-card-radio-option{--radio-option-border-width:1px;--radio-option-background-color:var(--white);align-items:center;background-color:var(--radio-option-background-color);border-radius:calc(8/var(--font-size-base)*1rem);cursor:pointer;display:flex;flex-direction:column;gap:var(--radio-option-gap);justify-content:space-between;outline:var(--radio-option-border-width) solid var(--radio-option-border-color);outline-offset:calc(var(--radio-option-border-width)*-1);padding:1rem;position:relative;text-align:center}.af-card-radio-option:hover{--radio-option-border-width:2px;--radio-option-border-color:var(--axa-blue-100)}.af-card-radio-option__label{color:var(--radio-option-color-title);font-size:calc(16/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-radio-option__label{font-size:calc(18/var(--font-size-base)*1rem)}}.af-card-radio-option:has(input:checked){--radio-option-border-width:2px}.af-card-radio-option:has(input:checked) .af-card-radio-option__label{font-weight:600}.af-card-radio-option__content{align-items:center;display:flex;flex-direction:column;flex-grow:1;gap:var(--radio-option-gap);justify-content:space-between;text-align:center}.af-card-radio-option__description,.af-card-radio-option__subtitle{color:var(--radio-option-color-subtitle);font-size:calc(14/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-radio-option__description,.af-card-radio-option__subtitle{font-size:1rem}}.af-card-radio-option--horizontal{flex-direction:row}.af-card-radio-option--horizontal .af-card-radio-option__content{align-items:flex-start}.af-card-radio-option--horizontal .af-radio{order:-1}.af-card-radio-option .af-icon{--icon-size:var(--icon-size-medium)}@media (width > 667px){.af-card-radio-option .af-icon{--icon-size:var(--icon-size-large)}}
|
|
1
|
+
.af-card-radio-option{--radio-option-border-width:1px;--radio-option-background-color:var(--white);align-items:center;background-color:var(--radio-option-background-color);border-radius:calc(8/var(--font-size-base)*1rem);cursor:pointer;display:flex;flex-direction:column;gap:var(--radio-option-gap);justify-content:space-between;outline:var(--radio-option-border-width) solid var(--radio-option-border-color);outline-offset:calc(var(--radio-option-border-width)*-1);padding:1rem;position:relative;text-align:center}.af-card-radio-option:focus-visible,.af-card-radio-option:focus-within,.af-card-radio-option:hover{--radio-option-border-width:2px;--radio-option-border-color:var(--axa-blue-100)}.af-card-radio-option__label{color:var(--radio-option-color-title);font-size:calc(16/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-radio-option__label{font-size:calc(18/var(--font-size-base)*1rem)}}.af-card-radio-option:has(input:checked){--radio-option-border-width:2px}.af-card-radio-option:has(input:checked):focus-visible,.af-card-radio-option:has(input:checked):focus-within,.af-card-radio-option:has(input:checked):hover{--radio-option-border-width:3px}.af-card-radio-option:has(input:checked) .af-card-radio-option__label{font-weight:600}.af-card-radio-option__content{align-items:center;display:flex;flex-direction:column;flex-grow:1;gap:var(--radio-option-gap);justify-content:space-between;text-align:center}.af-card-radio-option__description,.af-card-radio-option__subtitle{color:var(--radio-option-color-subtitle);font-size:calc(14/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-radio-option__description,.af-card-radio-option__subtitle{font-size:1rem}}.af-card-radio-option--horizontal{flex-direction:row}.af-card-radio-option--horizontal .af-card-radio-option__content{align-items:flex-start}.af-card-radio-option--horizontal .af-radio{order:-1}.af-card-radio-option .af-icon{--icon-size:var(--icon-size-medium)}@media (width > 667px){.af-card-radio-option .af-icon{--icon-size:var(--icon-size-large)}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/Form/Radio/CardRadioOption/CardRadioOptionCommon.scss%23sass","../../../../src/Form/Radio/CardRadioOption/CardRadioOptionCommon.scss"],"names":[],"mappings":"AAEA,sBACE,+BAAA,CCDF,4CAAA,CDSE,kBAAA,CAIA,qDAAA,CANA,gDAAA,CAUA,cAAA,CAZA,YAAA,CAGA,qBAAA,CAGA,2BAAA,CADA,6BAAA,CAIA,+EAAA,CAEA,wDAAA,CAVA,YAAA,CAFA,iBAAA,CAQA,iBCEF,CDKE,
|
|
1
|
+
{"version":3,"sources":["../../../../src/Form/Radio/CardRadioOption/CardRadioOptionCommon.scss%23sass","../../../../src/Form/Radio/CardRadioOption/CardRadioOptionCommon.scss"],"names":[],"mappings":"AAEA,sBACE,+BAAA,CCDF,4CAAA,CDSE,kBAAA,CAIA,qDAAA,CANA,gDAAA,CAUA,cAAA,CAZA,YAAA,CAGA,qBAAA,CAGA,2BAAA,CADA,6BAAA,CAIA,+EAAA,CAEA,wDAAA,CAVA,YAAA,CAFA,iBAAA,CAQA,iBCEF,CDKE,mGAGE,+BAAA,CACA,+CCLJ,CDQE,6BAIE,qCAAA,CAFA,6CAAA,CACA,eAAA,CAFA,QCHJ,CDQI,uBANF,6BAOI,6CCLJ,CACF,CDQE,yCACE,+BCNJ,CDQI,4JAGE,+BCRN,CDWI,sEACE,eCTN,CDaE,+BAIE,kBAAA,CAHA,YAAA,CACA,qBAAA,CACA,WAAA,CAGA,2BAAA,CADA,6BAAA,CAEA,iBCXJ,CDcE,mEAKE,wCAAA,CAFA,6CAAA,CACA,eAAA,CAFA,QCVJ,CDeI,uBAPF,mEAQI,cCZJ,CACF,CDeE,kCACE,kBCbJ,CDeI,iEACE,sBCbN,CDgBI,4CACE,QCdN,CDkBE,+BACE,mCChBJ,CDkBI,uBAHF,+BCZA,kCACA,CACF","file":"CardRadioOptionCommon.css","sourcesContent":["@use \"../../../common/breakpoints\";\n\n.af-card-radio-option {\n --radio-option-border-width: 1px;\n --radio-option-background-color: var(--white);\n\n position: relative;\n display: flex;\n padding: 1rem;\n border-radius: calc(8 / var(--font-size-base) * 1rem);\n flex-direction: column;\n align-items: center;\n justify-content: space-between;\n gap: var(--radio-option-gap);\n text-align: center;\n background-color: var(--radio-option-background-color);\n outline: var(--radio-option-border-width) solid\n var(--radio-option-border-color);\n outline-offset: calc(-1 * var(--radio-option-border-width));\n cursor: pointer;\n\n &:hover,\n &:focus-visible,\n &:focus-within {\n --radio-option-border-width: 2px;\n --radio-option-border-color: var(--axa-blue-100);\n }\n\n &__label {\n margin: 0;\n font-size: calc(16 / var(--font-size-base) * 1rem);\n font-weight: 400;\n color: var(--radio-option-color-title);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n font-size: calc(18 / var(--font-size-base) * 1rem);\n }\n }\n\n &:has(input:checked) {\n --radio-option-border-width: 2px;\n\n &:hover,\n &:focus-visible,\n &:focus-within {\n --radio-option-border-width: 3px;\n }\n\n & .af-card-radio-option__label {\n font-weight: 600;\n }\n }\n\n &__content {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n align-items: center;\n justify-content: space-between;\n gap: var(--radio-option-gap);\n text-align: center;\n }\n\n &__description,\n &__subtitle {\n margin: 0;\n font-size: calc(14 / var(--font-size-base) * 1rem);\n font-weight: 400;\n color: var(--radio-option-color-subtitle);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n font-size: 1rem;\n }\n }\n\n &--horizontal {\n flex-direction: row;\n\n & .af-card-radio-option__content {\n align-items: flex-start;\n }\n\n & .af-radio {\n order: -1;\n }\n }\n\n & .af-icon {\n --icon-size: var(--icon-size-medium);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n --icon-size: var(--icon-size-large);\n }\n }\n}\n","@use \"../../../common/breakpoints\";\n\n.af-card-radio-option {\n --radio-option-border-width: 1px;\n --radio-option-background-color: var(--white);\n\n position: relative;\n display: flex;\n padding: 1rem;\n border-radius: calc(8 / var(--font-size-base) * 1rem);\n flex-direction: column;\n align-items: center;\n justify-content: space-between;\n gap: var(--radio-option-gap);\n text-align: center;\n background-color: var(--radio-option-background-color);\n outline: var(--radio-option-border-width) solid\n var(--radio-option-border-color);\n outline-offset: calc(-1 * var(--radio-option-border-width));\n cursor: pointer;\n\n &:hover,\n &:focus-visible,\n &:focus-within {\n --radio-option-border-width: 2px;\n --radio-option-border-color: var(--axa-blue-100);\n }\n\n &__label {\n margin: 0;\n font-size: calc(16 / var(--font-size-base) * 1rem);\n font-weight: 400;\n color: var(--radio-option-color-title);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n font-size: calc(18 / var(--font-size-base) * 1rem);\n }\n }\n\n &:has(input:checked) {\n --radio-option-border-width: 2px;\n\n &:hover,\n &:focus-visible,\n &:focus-within {\n --radio-option-border-width: 3px;\n }\n\n & .af-card-radio-option__label {\n font-weight: 600;\n }\n }\n\n &__content {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n align-items: center;\n justify-content: space-between;\n gap: var(--radio-option-gap);\n text-align: center;\n }\n\n &__description,\n &__subtitle {\n margin: 0;\n font-size: calc(14 / var(--font-size-base) * 1rem);\n font-weight: 400;\n color: var(--radio-option-color-subtitle);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n font-size: 1rem;\n }\n }\n\n &--horizontal {\n flex-direction: row;\n\n & .af-card-radio-option__content {\n align-items: flex-start;\n }\n\n & .af-radio {\n order: -1;\n }\n }\n\n & .af-icon {\n --icon-size: var(--icon-size-medium);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n --icon-size: var(--icon-size-large);\n }\n }\n}\n"]}
|
|
@@ -19,7 +19,9 @@
|
|
|
19
19
|
outline-offset: calc(-1 * var(--radio-option-border-width));
|
|
20
20
|
cursor: pointer;
|
|
21
21
|
|
|
22
|
-
&:hover
|
|
22
|
+
&:hover,
|
|
23
|
+
&:focus-visible,
|
|
24
|
+
&:focus-within {
|
|
23
25
|
--radio-option-border-width: 2px;
|
|
24
26
|
--radio-option-border-color: var(--axa-blue-100);
|
|
25
27
|
}
|
|
@@ -38,6 +40,12 @@
|
|
|
38
40
|
&:has(input:checked) {
|
|
39
41
|
--radio-option-border-width: 2px;
|
|
40
42
|
|
|
43
|
+
&:hover,
|
|
44
|
+
&:focus-visible,
|
|
45
|
+
&:focus-within {
|
|
46
|
+
--radio-option-border-width: 3px;
|
|
47
|
+
}
|
|
48
|
+
|
|
41
49
|
& .af-card-radio-option__label {
|
|
42
50
|
font-weight: 600;
|
|
43
51
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.af-card-radio-option{--radio-option-border-width:1px;--radio-option-background-color:var(--white);align-items:center;background-color:var(--radio-option-background-color);border-radius:calc(8/var(--font-size-base)*1rem);cursor:pointer;display:flex;flex-direction:column;gap:var(--radio-option-gap);justify-content:space-between;outline:var(--radio-option-border-width) solid var(--radio-option-border-color);outline-offset:calc(var(--radio-option-border-width)*-1);padding:1rem;position:relative;text-align:center}.af-card-radio-option:hover{--radio-option-border-width:2px;--radio-option-border-color:var(--axa-blue-100)}.af-card-radio-option__label{color:var(--radio-option-color-title);font-size:calc(16/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-radio-option__label{font-size:calc(18/var(--font-size-base)*1rem)}}.af-card-radio-option:has(input:checked){--radio-option-border-width:2px}.af-card-radio-option:has(input:checked) .af-card-radio-option__label{font-weight:600}.af-card-radio-option__content{align-items:center;display:flex;flex-direction:column;flex-grow:1;gap:var(--radio-option-gap);justify-content:space-between;text-align:center}.af-card-radio-option__description,.af-card-radio-option__subtitle{color:var(--radio-option-color-subtitle);font-size:calc(14/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-radio-option__description,.af-card-radio-option__subtitle{font-size:1rem}}.af-card-radio-option--horizontal{flex-direction:row}.af-card-radio-option--horizontal .af-card-radio-option__content{align-items:flex-start}.af-card-radio-option--horizontal .af-radio{order:-1}.af-card-radio-option .af-icon{--icon-size:var(--icon-size-medium)}@media (width > 667px){.af-card-radio-option .af-icon{--icon-size:var(--icon-size-large)}}.af-card-radio-option{--radio-option-border-color:var(--color-gray-700);--radio-option-color-title:var(--color-gray-900);--radio-option-color-subtitle:var(--color-gray-700);--radio-option-gap:calc(8/var(--font-size-base)*1rem)}.af-card-radio-option:hover{--radio-option-border-color:var(--color-axa)}.af-card-radio-option:not(.af-card-radio-option--horizontal) .af-radio{left:calc(12/var(--font-size-base)*1rem);position:absolute;top:calc(12/var(--font-size-base)*1rem)}@media (width > 667px){.af-card-radio-option:not(.af-card-radio-option--horizontal) .af-radio{left:calc(16/var(--font-size-base)*1rem);top:calc(16/var(--font-size-base)*1rem)}}.af-card-radio-option .af-card-radio-option__content{--radio-option-gap:calc(4/var(--font-size-base)*1rem)}.af-card-radio-option--horizontal{column-gap:calc(12/var(--font-size-base)*1rem)}.af-card-radio-option--invalid:not(:has(input:checked)){--radio-option-border-color:var(--color-red-700)}.af-card-radio-option:has(input:checked){--radio-option-background-color:var(--color-blue-2);--radio-option-border-color:var(--color-axa)}
|
|
1
|
+
.af-card-radio-option{--radio-option-border-width:1px;--radio-option-background-color:var(--white);align-items:center;background-color:var(--radio-option-background-color);border-radius:calc(8/var(--font-size-base)*1rem);cursor:pointer;display:flex;flex-direction:column;gap:var(--radio-option-gap);justify-content:space-between;outline:var(--radio-option-border-width) solid var(--radio-option-border-color);outline-offset:calc(var(--radio-option-border-width)*-1);padding:1rem;position:relative;text-align:center}.af-card-radio-option:focus-visible,.af-card-radio-option:focus-within,.af-card-radio-option:hover{--radio-option-border-width:2px;--radio-option-border-color:var(--axa-blue-100)}.af-card-radio-option__label{color:var(--radio-option-color-title);font-size:calc(16/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-radio-option__label{font-size:calc(18/var(--font-size-base)*1rem)}}.af-card-radio-option:has(input:checked){--radio-option-border-width:2px}.af-card-radio-option:has(input:checked):focus-visible,.af-card-radio-option:has(input:checked):focus-within,.af-card-radio-option:has(input:checked):hover{--radio-option-border-width:3px}.af-card-radio-option:has(input:checked) .af-card-radio-option__label{font-weight:600}.af-card-radio-option__content{align-items:center;display:flex;flex-direction:column;flex-grow:1;gap:var(--radio-option-gap);justify-content:space-between;text-align:center}.af-card-radio-option__description,.af-card-radio-option__subtitle{color:var(--radio-option-color-subtitle);font-size:calc(14/var(--font-size-base)*1rem);font-weight:400;margin:0}@media (width > 667px){.af-card-radio-option__description,.af-card-radio-option__subtitle{font-size:1rem}}.af-card-radio-option--horizontal{flex-direction:row}.af-card-radio-option--horizontal .af-card-radio-option__content{align-items:flex-start}.af-card-radio-option--horizontal .af-radio{order:-1}.af-card-radio-option .af-icon{--icon-size:var(--icon-size-medium)}@media (width > 667px){.af-card-radio-option .af-icon{--icon-size:var(--icon-size-large)}}.af-card-radio-option{--radio-option-border-color:var(--color-gray-700);--radio-option-color-title:var(--color-gray-900);--radio-option-color-subtitle:var(--color-gray-700);--radio-option-gap:calc(8/var(--font-size-base)*1rem)}.af-card-radio-option:hover{--radio-option-border-color:var(--color-axa)}.af-card-radio-option:not(.af-card-radio-option--horizontal) .af-radio{left:calc(12/var(--font-size-base)*1rem);position:absolute;top:calc(12/var(--font-size-base)*1rem)}@media (width > 667px){.af-card-radio-option:not(.af-card-radio-option--horizontal) .af-radio{left:calc(16/var(--font-size-base)*1rem);top:calc(16/var(--font-size-base)*1rem)}}.af-card-radio-option .af-card-radio-option__content{--radio-option-gap:calc(4/var(--font-size-base)*1rem)}.af-card-radio-option--horizontal{column-gap:calc(12/var(--font-size-base)*1rem)}.af-card-radio-option--invalid:not(:has(input:checked)){--radio-option-border-color:var(--color-red-700)}.af-card-radio-option:has(input:checked){--radio-option-background-color:var(--color-blue-2);--radio-option-border-color:var(--color-axa)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/Form/Radio/CardRadioOption/CardRadioOptionCommon.scss","../../../../src/Form/Radio/CardRadioOption/CardRadioOptionLF.scss","../../../../src/Form/Radio/CardRadioOption/CardRadioOptionLF.scss%23sass"],"names":[],"mappings":"AAEA,sBCDA,+BDEE,CACA,4CAAA,CAOA,kBAAA,CAIA,qDAAA,CANA,gDAAA,CAUA,cAAA,CAZA,YAAA,CAGA,qBAAA,CAGA,2BAAA,CADA,6BAAA,CAIA,+EAAA,CAEA,wDAAA,CAVA,YAAA,CCLF,iBAAA,CDWE,iBCEF,CDKE,
|
|
1
|
+
{"version":3,"sources":["../../../../src/Form/Radio/CardRadioOption/CardRadioOptionCommon.scss","../../../../src/Form/Radio/CardRadioOption/CardRadioOptionLF.scss","../../../../src/Form/Radio/CardRadioOption/CardRadioOptionLF.scss%23sass"],"names":[],"mappings":"AAEA,sBCDA,+BDEE,CACA,4CAAA,CAOA,kBAAA,CAIA,qDAAA,CANA,gDAAA,CAUA,cAAA,CAZA,YAAA,CAGA,qBAAA,CAGA,2BAAA,CADA,6BAAA,CAIA,+EAAA,CAEA,wDAAA,CAVA,YAAA,CCLF,iBAAA,CDWE,iBCEF,CDKE,mGAGE,+BAAA,CACA,+CCLJ,CDQE,6BAIE,qCAAA,CAFA,6CAAA,CACA,eAAA,CAFA,QCHJ,CDQI,uBANF,6BAOI,6CCLJ,CACF,CDQE,yCACE,+BCNJ,CDQI,4JAGE,+BCRN,CDWI,sEACE,eCTN,CDaE,+BAIE,kBAAA,CAHA,YAAA,CACA,qBAAA,CACA,WAAA,CAGA,2BAAA,CADA,6BAAA,CAEA,iBCXJ,CDcE,mEAKE,wCAAA,CAFA,6CAAA,CACA,eAAA,CAFA,QCVJ,CDeI,uBAPF,mEAQI,cCZJ,CACF,CDeE,kCACE,kBCbJ,CDeI,iEACE,sBCbN,CDgBI,4CACE,QCdN,CDkBE,+BACE,mCChBJ,CDkBI,uBAHF,+BAII,kCCfJ,CACF,CC1EA,sBACE,iDAAA,CACA,gDAAA,CACA,mDAAA,CACA,qDD6EF,CC3EE,4BACE,4CD6EJ,CC1EE,uEAGE,wCAAA,CAFA,iBAAA,CACA,uCD6EJ,CC1EI,uBALF,uEAOI,wCAAA,CADA,uCD8EJ,CACF,CC1EE,qDACE,qDD4EJ,CCzEE,kCACE,8CD2EJ,CCxEE,wDACE,gDD0EJ,CCvEE,yCACE,mDAAA,CACA,4CDyEJ","file":"CardRadioOptionLF.css","sourcesContent":["@use \"../../../common/breakpoints\";\n\n.af-card-radio-option {\n --radio-option-border-width: 1px;\n --radio-option-background-color: var(--white);\n\n position: relative;\n display: flex;\n padding: 1rem;\n border-radius: calc(8 / var(--font-size-base) * 1rem);\n flex-direction: column;\n align-items: center;\n justify-content: space-between;\n gap: var(--radio-option-gap);\n text-align: center;\n background-color: var(--radio-option-background-color);\n outline: var(--radio-option-border-width) solid\n var(--radio-option-border-color);\n outline-offset: calc(-1 * var(--radio-option-border-width));\n cursor: pointer;\n\n &:hover,\n &:focus-visible,\n &:focus-within {\n --radio-option-border-width: 2px;\n --radio-option-border-color: var(--axa-blue-100);\n }\n\n &__label {\n margin: 0;\n font-size: calc(16 / var(--font-size-base) * 1rem);\n font-weight: 400;\n color: var(--radio-option-color-title);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n font-size: calc(18 / var(--font-size-base) * 1rem);\n }\n }\n\n &:has(input:checked) {\n --radio-option-border-width: 2px;\n\n &:hover,\n &:focus-visible,\n &:focus-within {\n --radio-option-border-width: 3px;\n }\n\n & .af-card-radio-option__label {\n font-weight: 600;\n }\n }\n\n &__content {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n align-items: center;\n justify-content: space-between;\n gap: var(--radio-option-gap);\n text-align: center;\n }\n\n &__description,\n &__subtitle {\n margin: 0;\n font-size: calc(14 / var(--font-size-base) * 1rem);\n font-weight: 400;\n color: var(--radio-option-color-subtitle);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n font-size: 1rem;\n }\n }\n\n &--horizontal {\n flex-direction: row;\n\n & .af-card-radio-option__content {\n align-items: flex-start;\n }\n\n & .af-radio {\n order: -1;\n }\n }\n\n & .af-icon {\n --icon-size: var(--icon-size-medium);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n --icon-size: var(--icon-size-large);\n }\n }\n}\n","@use \"CardRadioOptionCommon\";\n@use \"../../../common/breakpoints\";\n\n.af-card-radio-option {\n --radio-option-border-color: var(--color-gray-700);\n --radio-option-color-title: var(--color-gray-900);\n --radio-option-color-subtitle: var(--color-gray-700);\n --radio-option-gap: calc(8 / var(--font-size-base) * 1rem);\n\n &:hover {\n --radio-option-border-color: var(--color-axa);\n }\n\n &:not(&--horizontal) .af-radio {\n position: absolute;\n top: calc(12 / var(--font-size-base) * 1rem);\n left: calc(12 / var(--font-size-base) * 1rem);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n top: calc(16 / var(--font-size-base) * 1rem);\n left: calc(16 / var(--font-size-base) * 1rem);\n }\n }\n\n & .af-card-radio-option__content {\n --radio-option-gap: calc(4 / var(--font-size-base) * 1rem);\n }\n\n &--horizontal {\n column-gap: calc(12 / var(--font-size-base) * 1rem);\n }\n\n &--invalid:not(:has(input:checked)) {\n --radio-option-border-color: var(--color-red-700);\n }\n\n &:has(input:checked) {\n --radio-option-background-color: var(--color-blue-2);\n --radio-option-border-color: var(--color-axa);\n }\n}\n","@use \"CardRadioOptionCommon\";\n@use \"../../../common/breakpoints\";\n\n.af-card-radio-option {\n --radio-option-border-color: var(--color-gray-700);\n --radio-option-color-title: var(--color-gray-900);\n --radio-option-color-subtitle: var(--color-gray-700);\n --radio-option-gap: calc(8 / var(--font-size-base) * 1rem);\n\n &:hover {\n --radio-option-border-color: var(--color-axa);\n }\n\n &:not(&--horizontal) .af-radio {\n position: absolute;\n top: calc(12 / var(--font-size-base) * 1rem);\n left: calc(12 / var(--font-size-base) * 1rem);\n\n @media (width > #{breakpoints.$breakpoint-sm}) {\n top: calc(16 / var(--font-size-base) * 1rem);\n left: calc(16 / var(--font-size-base) * 1rem);\n }\n }\n\n & .af-card-radio-option__content {\n --radio-option-gap: calc(4 / var(--font-size-base) * 1rem);\n }\n\n &--horizontal {\n column-gap: calc(12 / var(--font-size-base) * 1rem);\n }\n\n &--invalid:not(:has(input:checked)) {\n --radio-option-border-color: var(--color-red-700);\n }\n\n &:has(input:checked) {\n --radio-option-background-color: var(--color-blue-2);\n --radio-option-border-color: var(--color-axa);\n }\n}\n"]}
|