@omniumretail/component-library 1.2.29 → 1.2.31
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/bundle.js +1 -1
- package/dist/main.css +3 -3
- package/dist/types/components/ResponseType/ResponseType.stories.d.ts +4 -0
- package/package.json +1 -1
- package/src/components/BellNotifications/BellNotifications.stories.tsx +89 -19
- package/src/components/BellNotifications/index.tsx +33 -51
- package/src/components/BellNotifications/styles.module.scss +30 -11
- package/src/components/Button/styles.module.scss +0 -14
- package/src/components/CategoryResponse/index.tsx +34 -22
- package/src/components/CategoryResponse/styles.module.scss +7 -1
- package/src/components/Header/Header.stories.tsx +173 -0
- package/src/components/Questions/index.tsx +4 -1
- package/src/components/ResponseType/ResponseType.stories.tsx +393 -0
- package/src/components/ResponseType/index.tsx +1 -0
- package/src/components/ResponseType/Category.stories.tsx +0 -29
package/dist/main.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
.lCPh1mJwiXUUOgmbv_mk{padding:12px 24px;border-radius:4px;min-width:170px;display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;text-decoration:none;border:none;font-size:14px;line-height:16.8px;font-weight:700;font-family:"Silka",sans-serif;background-color:var(--button-default-background);color:var(--button-default-text-color)}@media(max-width: 767px){.lCPh1mJwiXUUOgmbv_mk{min-width:0px}}.lCPh1mJwiXUUOgmbv_mk:hover{background-color:var(--button-default-background-hover-color) !important;color:var(--button-default-text-hover-color) !important}.lCPh1mJwiXUUOgmbv_mk:
|
|
1
|
+
.lCPh1mJwiXUUOgmbv_mk{padding:12px 24px;border-radius:4px;min-width:170px;display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;text-decoration:none;border:none;font-size:14px;line-height:16.8px;font-weight:700;font-family:"Silka",sans-serif;background-color:var(--button-default-background);color:var(--button-default-text-color)}@media(max-width: 767px){.lCPh1mJwiXUUOgmbv_mk{min-width:0px}}.lCPh1mJwiXUUOgmbv_mk:hover{background-color:var(--button-default-background-hover-color) !important;color:var(--button-default-text-hover-color) !important}.lCPh1mJwiXUUOgmbv_mk:disabled,.lCPh1mJwiXUUOgmbv_mk.vwrGv_jOJcIvImjzKZNv{background-color:#c7cac9 !important;color:var(--button-disabled-default-text-color) !important;pointer-events:none}.PYUelyvKNnKRxaBMgCyk{flex-direction:row-reverse;gap:5px}.edzSVcT9ajLWxd6QfVI1{background-color:var(--button-style-1-background);color:var(--button-style-1-text-color)}.edzSVcT9ajLWxd6QfVI1:hover{background-color:var(--button-style-1-background-hover-color);color:var(--button-style-1-text-hover-color) !important}.edzSVcT9ajLWxd6QfVI1:disabled,.edzSVcT9ajLWxd6QfVI1.vwrGv_jOJcIvImjzKZNv{background-color:var(--button-disabled-background-color);color:var(--button-disabled-default-text-color);pointer-events:none}:where(.css-dev-only-do-not-override-m4timi).ant-btn-link:disabled,:where(.css-dev-only-do-not-override-m4timi).ant-btn-link.ant-btn-disabled{color:var(--button-disabled-default-text-color);background-color:#c7cac9}:where(.css-dev-only-do-not-override-m4timi).ant-btn-link:disabled,:where(.css-dev-only-do-not-override-m4timi).ant-btn-link.ant-btn-disabled{color:var(--button-disabled-default-text-color);background-color:#c7cac9}
|
|
2
2
|
.UxfXOleP69PjM5rFOMTD{display:grid !important;grid-template-columns:repeat(3, 1fr) !important;justify-items:center !important;align-items:center !important;height:45px !important;gap:0 24px !important;position:relative !important;padding:0px !important}@media(max-width: 767px){.UxfXOleP69PjM5rFOMTD .UxfXOleP69PjM5rFOMTD{grid-template-columns:1fr}.UxfXOleP69PjM5rFOMTD .UK3esJZjnri5Jb9Jxcca,.UxfXOleP69PjM5rFOMTD .U5tZ7kRlrIHUKsuduD1S{justify-self:center}.UxfXOleP69PjM5rFOMTD .LzcTbjk0fp70tXlKd3eS{text-align:center}.UxfXOleP69PjM5rFOMTD .DhO9jcXNunsWq22jXuJJ{text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}.UxfXOleP69PjM5rFOMTD .LzcTbjk0fp70tXlKd3eS{font-size:var(--font-size-body-3);font-weight:var(--font-weight-semibold);text-transform:uppercase}@media(min-width: 768px){.UxfXOleP69PjM5rFOMTD .LzcTbjk0fp70tXlKd3eS{font-size:var(--font-size-body-4)}}.UxfXOleP69PjM5rFOMTD .gn06XRZhFG00HaVjAqNc{align-self:center}@media(max-width: 768px){.UxfXOleP69PjM5rFOMTD .gn06XRZhFG00HaVjAqNc{position:unset !important;top:unset !important;margin:unset !important;left:unset !important;right:unset !important;text-align:unset !important}}.UxfXOleP69PjM5rFOMTD .UK3esJZjnri5Jb9Jxcca{justify-self:start}.UxfXOleP69PjM5rFOMTD .SP4eLTEZBzKjo_LdsNw2{justify-self:end}@media(max-width: 460px){.UxfXOleP69PjM5rFOMTD .SP4eLTEZBzKjo_LdsNw2{width:80px}}@media(max-width: 460px){.UxfXOleP69PjM5rFOMTD .SP4eLTEZBzKjo_LdsNw2 :where(.css-dev-only-do-not-override-fpg3f5).ant-btn.ant-btn-icon-only{padding-inline-start:40px}}.UxfXOleP69PjM5rFOMTD .nt_yaN_SHYobZ6zexnfY{justify-self:end}@media(max-width: 460px){.UxfXOleP69PjM5rFOMTD .nt_yaN_SHYobZ6zexnfY{width:60px}}@media(max-width: 460px){.UxfXOleP69PjM5rFOMTD .nt_yaN_SHYobZ6zexnfY :where(.css-dev-only-do-not-override-fpg3f5).ant-btn.ant-btn-icon-only{padding-inline-start:22px}}
|
|
3
3
|
.ii1Ag3GTfp8unGCe48A0{display:inline-flex;text-decoration:none;height:auto;color:var(--color-black);font-size:var(--font-size-body-3);line-height:100%;font-weight:300;font-style:var(--font-style-italic)}.L9ncGwaItcjHJBLuwrKb{color:var(--color-orange);font-style:var(--font-style-normal)}.Yrb4eAglcF7FedoEB9AH span:nth-child(2){margin-inline-end:8px;margin-inline-start:0;order:-1}
|
|
4
4
|
.dr2zFJ8bDffg5CjjPq2c{color:var(--color-black)}.ant-dropdown-menu-title-content{color:var(--color-black)}
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
.vw302ajYc4_7bIROncyM{font-size:var(--font-size-body-4);font-weight:600;line-height:100%;color:var(--color-blue);text-transform:uppercase;margin-bottom:32px}.k3OGGGQwXB0zmX0T61yt{display:flex;gap:32px}.JHuRhb2cRXyGWESiQ2TQ{width:100%}.DrsaZTs1Ny6wZ76RwDR9{font-size:var(--font-size-body-2);color:var(--color-black);font-weight:700;text-transform:uppercase}.HVSssNqaNxLcYT_1lxBL{display:grid;grid-template-columns:minmax(200px, 1fr) auto auto auto auto;gap:46px}.ACPbYsV0wNkissVLHcFh{margin-top:16px}Label{margin-bottom:8px}.mIHYAri6ebHm4Oeb1ogj{min-width:200px}@media(max-width: 768px){.mIHYAri6ebHm4Oeb1ogj{min-width:150px}}.g19LZsD26yzPPjBtV31w .ant-select{width:100%}.g19LZsD26yzPPjBtV31w .ant-select-selector{border-color:rgba(var(--color-black-rgb), 0.5) !important;height:35px !important;display:flex;align-items:center}.g19LZsD26yzPPjBtV31w .ant-select-arrow{color:var(--color-black)}.g19LZsD26yzPPjBtV31w .ant-switch{width:30px}
|
|
23
23
|
.j8_c3JHTX0JOkT36fF6A{contain:inline-size}.j8_c3JHTX0JOkT36fF6A .HgmGSts5FIH3osmekIYG{height:50px;width:300px}@media(min-width: 1024px){.j8_c3JHTX0JOkT36fF6A .HgmGSts5FIH3osmekIYG{width:450px}}.j8_c3JHTX0JOkT36fF6A .xlaG0XsJDRR9AClqXzzC .ant-tag{background-color:var(--color-orange);color:var(--color-white);padding:6px 16px;max-width:240px}.j8_c3JHTX0JOkT36fF6A .xlaG0XsJDRR9AClqXzzC .anticon-close{color:var(--color-white);font-size:12px}.j8_c3JHTX0JOkT36fF6A .xlaG0XsJDRR9AClqXzzC .anticon-close:hover{color:var(--color-black)}
|
|
24
24
|
.BWmwZ5nFKyctBZyOAXzg{width:100%}.GWTSauaAl_v9W8o4YPxW{background:rgba(44,45,46,.0509803922);height:100%;position:relative}.GWTSauaAl_v9W8o4YPxW .ant-menu-light{background-color:rgba(0,0,0,0) !important;border-inline-end:none !important}.GWTSauaAl_v9W8o4YPxW .ant-menu-title-content{font-size:17px;line-height:20px;font-weight:var(--font-weight-semibold)}.GWTSauaAl_v9W8o4YPxW .ant-menu-title-content:hover{color:var(--color-orange)}.GWTSauaAl_v9W8o4YPxW .ant-menu-sub .ant-menu-title-content{font-size:15px;line-height:18px;font-weight:var(--font-weight-medium)}.GWTSauaAl_v9W8o4YPxW .ant-menu-sub .ant-menu-item{height:30px;line-height:30px;margin-bottom:16px}.GWTSauaAl_v9W8o4YPxW .ant-menu-sub .ant-menu-item:first-child{margin-top:-10px}.GWTSauaAl_v9W8o4YPxW .ant-menu-submenu{border-top:1px solid var(--color-orange);border-radius:0}.GWTSauaAl_v9W8o4YPxW .ant-menu-item:hover{background-color:initial !important}.GWTSauaAl_v9W8o4YPxW .ant-menu-item-selected,.GWTSauaAl_v9W8o4YPxW .ant-menu-submenu-selected>.ant-menu-submenu-title{color:var(--color-orange);background-color:initial}.GWTSauaAl_v9W8o4YPxW .ant-menu-inline .ant-menu-sub.ant-menu-inline{background:initial}.GWTSauaAl_v9W8o4YPxW .ant-menu-submenu-title{height:50px !important;line-height:50px !important}.GWTSauaAl_v9W8o4YPxW .ant-menu-submenu-title:hover{background-color:initial !important}.GWTSauaAl_v9W8o4YPxW .ant-menu-submenu-title .anticon{color:var(--color-orange)}.GWTSauaAl_v9W8o4YPxW .ant-menu-inline.ant-menu-root .ant-menu-item>.ant-menu-title-content{overflow-x:auto;text-overflow:unset}.hWGer1IJ7RdkfQWwYfsw{position:absolute;top:24px;left:24px;right:24px;height:144px}.MD1FhirslDDwd2izGwai{font-size:var(--font-size-body-2);line-height:14px;font-weight:var(--font-weight-light);display:inline-block;padding:12px;cursor:pointer;position:absolute;right:0;top:60px}.RxGn4c38kNq8Ai4ypW_x{position:absolute;top:144px;left:24px;right:24px;bottom:0;overflow-y:auto;overflow-x:hidden;padding-bottom:24px}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{border-radius:10px;background:rgba(0,0,0,.1)}::-webkit-scrollbar-thumb{border-radius:10px;background:rgba(0,0,0,.2)}::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.4)}::-webkit-scrollbar-thumb:active{background:rgba(0,0,0,.9)}
|
|
25
|
-
.rdjN4ln3xiUoa6Q0NMMm{display:flex;flex-direction:column;gap:16px;height:100%}@media(min-width: 600px){.rdjN4ln3xiUoa6Q0NMMm{display:grid;grid-template-columns:220px auto}}@media(min-width: 768px){.rdjN4ln3xiUoa6Q0NMMm{grid-template-columns:300px auto}}.Q4flbvKEPN6Jx9Cob22I{background:#ebeced;overflow:auto;padding:20px}@media(max-width: 599px){.Q4flbvKEPN6Jx9Cob22I{padding:20px 20px 0 20px;max-height:80px}}.hK3soC6m563VuiLnNutq{background:var(--color-white);overflow:auto;padding:20px}@media(max-width: 599px){.hK3soC6m563VuiLnNutq{height:100%}}.guqqOMHeZE56Bg2p5Ad8{font-size:var(--font-size-body-2);color:var(--color-blue);margin-bottom:12px;font-weight:var(--font-weight-semibold);text-transform:uppercase}@media(min-width: 768px){.guqqOMHeZE56Bg2p5Ad8{font-size:var(--font-size-body-4);margin-bottom:36px}}.wRCQxnQc_MZGDeiY1bcL{padding-bottom:15px;font-weight:var(--font-weight-bold);font-size:var(--font-size-body-4)}@media(max-width: 767px){.wRCQxnQc_MZGDeiY1bcL{font-size:var(--font-size-body-3)}}.JRmeFBsSP1f1HJwarMpc{cursor:pointer}.Y6yF3VITdrKdQzDtqTZX{padding-left:16px}.Y6yF3VITdrKdQzDtqTZX .wRCQxnQc_MZGDeiY1bcL{font-weight:var(--font-weight-semibold)}.Y6yF3VITdrKdQzDtqTZX .aKZCkmPsc0LiPdj3sEeG .Y6yF3VITdrKdQzDtqTZX .wRCQxnQc_MZGDeiY1bcL{font-weight:var(--font-weight-light)}.aKZCkmPsc0LiPdj3sEeG{display:block}.U_3frSKmaOQyTCb9oBkg{color:var(--color-orange)}.GEZDeWAneRLnZQyf4y9l{margin-bottom:16px}@media(min-width: 768px){.GEZDeWAneRLnZQyf4y9l{margin-bottom:24px}}.YcOvMLXE7vKR2Y0_BPRr{font-size:var(--font-size-body-3);color:var(--color-blue);font-weight:var(--font-weight-semibold);margin-bottom:8px}@media(min-width: 768px){.YcOvMLXE7vKR2Y0_BPRr{font-size:var(--font-size-body-4)}}.vlMh_CCr45wbKV4fMhJx{font-size:var(--font-size-body-2);font-weight:var(--font-weight-light);color:var(--color-black)}@media(min-width: 768px){.vlMh_CCr45wbKV4fMhJx{font-size:var(--font-size-body-3)}}.NZ_ohAxNxhxZsCBr2PRA{display:flex;flex-direction:row;gap:12px;margin-bottom:24px}@media(min-width: 768px){.NZ_ohAxNxhxZsCBr2PRA{margin-bottom:36px}}.CArVrMs2ac6JvM1VGLSw{flex-direction:column;border-bottom:1px solid rgba(var(--color-blue-rgb), 0.2);margin-bottom:24px}.CArVrMs2ac6JvM1VGLSw .OpqJ6gab6fPIq3KyckPO{width:100%;border-bottom:none}.CArVrMs2ac6JvM1VGLSw .E9TXHxbgaI6LGMZHG9bV{width:100%;height:auto}.CArVrMs2ac6JvM1VGLSw .E9TXHxbgaI6LGMZHG9bV .ant-input{min-height:140px}.CArVrMs2ac6JvM1VGLSw .E9TXHxbgaI6LGMZHG9bV .ant-form-item{margin-bottom:16px}.OpqJ6gab6fPIq3KyckPO{width:100%;border-bottom:1px solid rgba(var(--color-blue-rgb), 0.2)}.E9TXHxbgaI6LGMZHG9bV{width:100px;height:50px;align-self:flex-end}.xdLvKgnXC4tm2aa6tAap{font-size:var(--font-size-body-4);font-weight:var(--font-weight-medium)}@media(max-width: 767px){.xdLvKgnXC4tm2aa6tAap{font-size:var(--font-size-body-3)}}.r5obiTduSUBq1uL7oceW{font-weight:var(--font-weight-light);font-size:var(--font-size-body-3);margin-bottom:4px}@media(max-width: 767px){.r5obiTduSUBq1uL7oceW{font-size:var(--font-size-body-2)}}.CHFuXtnqohUXV_oCAEKD{font-weight:var(--font-weight-light);margin-top:20px;display:flex;gap:4px}._Bw2YaPxzqqQRpeCMde6{word-wrap:break-word;white-space:pre-wrap;max-height:100px;overflow:auto;font-size:var(--font-size-body-3)}@media(max-width: 767px){._Bw2YaPxzqqQRpeCMde6{font-size:var(--font-size-body-2)}}.bIiuhNuRh643knAaSeyC{font-weight:var(--font-weight-semibold);font-size:var(--font-size-body-3)}@media(max-width: 767px){.bIiuhNuRh643knAaSeyC{font-size:var(--font-size-body-2)}}.DdqSfNoeh7KPEQiD0Zpe{margin-bottom:unset;width:100%}.sZh7rUlP4vu0LIE2fcab{font-weight:var(--font-weight-light);margin-bottom:4px;margin-top:16px;display:flex;gap:4px}.mdSJ5YgFou8MwSkVypYb{display:flex;flex-direction:column}.AvKaftoXc2t7E53rqtq6{display:flex;flex-direction:row;gap:20px;margin-top:12px;margin-bottom:12px;width:100%}.U3SMVXW9r1m_VHa3Y3V3{cursor:pointer}.SgT02NKW7ogui8ih5ehj{color:var(--color-black);background-color:var(--color-white);border:1px var(--color-black) solid;min-width:100px;height:20px;font-size:10px;padding:unset}.SgT02NKW7ogui8ih5ehj:hover{background-color:var(--color-grey-light);color:var(--color-black) !important;border:1px var(--color-black) solid !important}.URku_zrOtkyW6n9TPO22{margin-top:5px;cursor:pointer}@media(min-width: 1350px){.
|
|
25
|
+
.rdjN4ln3xiUoa6Q0NMMm{display:flex;flex-direction:column;gap:16px;height:100%}@media(min-width: 600px){.rdjN4ln3xiUoa6Q0NMMm{display:grid;grid-template-columns:220px auto}}@media(min-width: 768px){.rdjN4ln3xiUoa6Q0NMMm{grid-template-columns:300px auto}}.Q4flbvKEPN6Jx9Cob22I{background:#ebeced;overflow:auto;padding:20px}@media(max-width: 599px){.Q4flbvKEPN6Jx9Cob22I{padding:20px 20px 0 20px;max-height:80px}}.hK3soC6m563VuiLnNutq{background:var(--color-white);overflow:auto;padding:20px}@media(max-width: 599px){.hK3soC6m563VuiLnNutq{height:100%}}.guqqOMHeZE56Bg2p5Ad8{font-size:var(--font-size-body-2);color:var(--color-blue);margin-bottom:12px;font-weight:var(--font-weight-semibold);text-transform:uppercase}@media(min-width: 768px){.guqqOMHeZE56Bg2p5Ad8{font-size:var(--font-size-body-4);margin-bottom:36px}}.wRCQxnQc_MZGDeiY1bcL{padding-bottom:15px;font-weight:var(--font-weight-bold);font-size:var(--font-size-body-4)}@media(max-width: 767px){.wRCQxnQc_MZGDeiY1bcL{font-size:var(--font-size-body-3)}}.JRmeFBsSP1f1HJwarMpc{cursor:pointer}.Y6yF3VITdrKdQzDtqTZX{padding-left:16px}.Y6yF3VITdrKdQzDtqTZX .wRCQxnQc_MZGDeiY1bcL{font-weight:var(--font-weight-semibold)}.Y6yF3VITdrKdQzDtqTZX .aKZCkmPsc0LiPdj3sEeG .Y6yF3VITdrKdQzDtqTZX .wRCQxnQc_MZGDeiY1bcL{font-weight:var(--font-weight-light)}.aKZCkmPsc0LiPdj3sEeG{display:block}.U_3frSKmaOQyTCb9oBkg{color:var(--color-orange)}.GEZDeWAneRLnZQyf4y9l{margin-bottom:16px}@media(min-width: 768px){.GEZDeWAneRLnZQyf4y9l{margin-bottom:24px}}.YcOvMLXE7vKR2Y0_BPRr{font-size:var(--font-size-body-3);color:var(--color-blue);font-weight:var(--font-weight-semibold);margin-bottom:8px}@media(min-width: 768px){.YcOvMLXE7vKR2Y0_BPRr{font-size:var(--font-size-body-4)}}.vlMh_CCr45wbKV4fMhJx{font-size:var(--font-size-body-2);font-weight:var(--font-weight-light);color:var(--color-black)}@media(min-width: 768px){.vlMh_CCr45wbKV4fMhJx{font-size:var(--font-size-body-3)}}.NZ_ohAxNxhxZsCBr2PRA{display:flex;flex-direction:row;gap:12px;margin-bottom:24px}@media(min-width: 768px){.NZ_ohAxNxhxZsCBr2PRA{margin-bottom:36px}}.CArVrMs2ac6JvM1VGLSw{flex-direction:column;border-bottom:1px solid rgba(var(--color-blue-rgb), 0.2);margin-bottom:24px}.CArVrMs2ac6JvM1VGLSw .OpqJ6gab6fPIq3KyckPO{width:100%;border-bottom:none}.CArVrMs2ac6JvM1VGLSw .E9TXHxbgaI6LGMZHG9bV{width:100%;height:auto}.CArVrMs2ac6JvM1VGLSw .E9TXHxbgaI6LGMZHG9bV .ant-input{min-height:140px}.CArVrMs2ac6JvM1VGLSw .E9TXHxbgaI6LGMZHG9bV .ant-form-item{margin-bottom:16px}.OpqJ6gab6fPIq3KyckPO{width:100%;border-bottom:1px solid rgba(var(--color-blue-rgb), 0.2)}.E9TXHxbgaI6LGMZHG9bV{width:100px;height:50px;align-self:flex-end}.xdLvKgnXC4tm2aa6tAap{font-size:var(--font-size-body-4);font-weight:var(--font-weight-medium)}@media(max-width: 767px){.xdLvKgnXC4tm2aa6tAap{font-size:var(--font-size-body-3)}}.r5obiTduSUBq1uL7oceW{font-weight:var(--font-weight-light);font-size:var(--font-size-body-3);margin-bottom:4px}@media(max-width: 767px){.r5obiTduSUBq1uL7oceW{font-size:var(--font-size-body-2)}}.CHFuXtnqohUXV_oCAEKD{font-weight:var(--font-weight-light);margin-top:20px;display:flex;gap:4px}._Bw2YaPxzqqQRpeCMde6{word-wrap:break-word;white-space:pre-wrap;max-height:100px;overflow:auto;font-size:var(--font-size-body-3)}@media(max-width: 767px){._Bw2YaPxzqqQRpeCMde6{font-size:var(--font-size-body-2)}}.bIiuhNuRh643knAaSeyC{font-weight:var(--font-weight-semibold);font-size:var(--font-size-body-3)}@media(max-width: 767px){.bIiuhNuRh643knAaSeyC{font-size:var(--font-size-body-2)}}.DdqSfNoeh7KPEQiD0Zpe{margin-bottom:unset;width:100%}.sZh7rUlP4vu0LIE2fcab{font-weight:var(--font-weight-light);margin-bottom:4px;margin-top:16px;display:flex;gap:4px}.mdSJ5YgFou8MwSkVypYb{display:flex;flex-direction:column}.AvKaftoXc2t7E53rqtq6{display:flex;flex-direction:row;justify-content:center;gap:20px;margin-top:12px;margin-bottom:12px;width:100%}.U3SMVXW9r1m_VHa3Y3V3{cursor:pointer}.SgT02NKW7ogui8ih5ehj{color:var(--color-black);background-color:var(--color-white);border:1px var(--color-black) solid;min-width:100px;height:20px;font-size:10px;padding:unset}.SgT02NKW7ogui8ih5ehj:hover{background-color:var(--color-grey-light);color:var(--color-black) !important;border:1px var(--color-black) solid !important}.URku_zrOtkyW6n9TPO22{text-align:center}.UNtzy3E3VX36bgrXWOvb{margin-top:5px;cursor:pointer}@media(min-width: 1350px){.UNtzy3E3VX36bgrXWOvb{margin-top:1px}}@media(min-width: 768px){.UNtzy3E3VX36bgrXWOvb{font-size:4px}}.napoFD9UzaXTJiFTuxD7{font-size:12px;margin-right:4px}@media(min-width: 1350px){.napoFD9UzaXTJiFTuxD7{margin-top:4px;font-size:16px !important}}@media(min-width: 768px){.napoFD9UzaXTJiFTuxD7{font-size:14px}}.oKvHu4mW0qdERPdlFeaC{font-weight:400 !important;font-size:12px;text-transform:capitalize}@media(min-width: 1350px){.oKvHu4mW0qdERPdlFeaC{font-size:16px !important;margin-bottom:0px}}@media(min-width: 768px){.oKvHu4mW0qdERPdlFeaC{font-size:14px;margin-bottom:0px}}.WPOztO5lxS5PXlAz75dE{color:var(--color-black);background-color:var(--color-white);border:1px var(--color-black) solid;min-width:100px;height:20px;font-size:10px;padding:unset}.WPOztO5lxS5PXlAz75dE:hover{background-color:var(--color-grey-light);color:var(--color-black) !important;border:1px var(--color-black) solid !important}.Yz6q7yIXvsA956q84MoK{min-width:100% !important}.wNWP4ysIqgPu6PZjqhL4{width:25%;height:40px}@media(max-width: 767px){.wNWP4ysIqgPu6PZjqhL4{width:50%}}.WMxJFTbZxL1XrEMouOTq{width:25%;height:40px}@media(max-width: 767px){.WMxJFTbZxL1XrEMouOTq{width:50%}}.VXFyjnZC3eAzs5q36u0u{padding:unset;color:unset !important}.ant-upload-wrapper{line-height:12px}.ant-upload-wrapper .ant-upload-list .ant-upload-list-item{max-width:20vw !important;font-size:12px !important}@media(max-width: 767px){.ant-upload-wrapper .ant-upload-list .ant-upload-list-item{font-size:10px !important;max-width:50vw !important}}:where(.css-dev-only-do-not-override-f7vrd6).ant-input-number .ant-input-number-input{height:35px}
|
|
26
26
|
.lvTuRa6cS5HtBGBJWfyE{color:var(--color-black);background-color:var(--color-white);border:1px var(--color-black) solid;min-width:100px;height:20px;font-size:10px;padding:unset}@media(max-width: 767px){.lvTuRa6cS5HtBGBJWfyE{min-width:0px}}.lvTuRa6cS5HtBGBJWfyE:hover{background-color:var(--color-grey-light);color:var(--color-black) !important;border:1px var(--color-black) solid !important}.ant-upload-wrapper{line-height:12px}.ant-upload-wrapper .ant-upload-list .ant-upload-list-item{max-width:100px}
|
|
27
27
|
.qaO99d3JMWSM8DLS1LvS{display:flex;flex-direction:column;background-color:var(--white-color);padding:24px;color:var(--color-black);width:150px;word-wrap:break-word}.G3bzjyAQXu8uaFGhNMLG{width:150px}.Zv6hI_F5yvuBDnPK8u2C{color:var(--color-blue) !important;font-size:var(--font-size-body-5);font-weight:var(--font-weight-bold)}.JxTKMPM3nEvZB42uuV1e{font-weight:var(--font-weight-semibold);font-size:var(--font-size-label);margin-top:0px}.JKKhO8apIWdMp0JLU0iD{font-weight:var(--font-weight-bold);font-size:var(--font-size-body-base)}.GqgjW40ocDFW4xi4Mszm{font-weight:var(--font-weight-regular);font-size:var(--font-size-label)}
|
|
28
28
|
.zsvRMmfrmqBj9iRjtQpO{display:grid;grid-template-columns:300px auto;gap:16px;height:100%}.pb4QP8qfuDG2T6wfXkUC{overflow:auto;background:#ebeced}.gP05vt1R1r67eWteznvr{overflow:auto;background:var(--color-white)}.pb4QP8qfuDG2T6wfXkUC,.gP05vt1R1r67eWteznvr{padding:20px}.btRPAI8631Q2XXYP6nZ7{font-size:var(--font-size-body-4);color:var(--color-blue);margin-bottom:36px;font-weight:var(--font-weight-semibold);text-transform:uppercase}.SbA9dHRh1JSG4xp1Aqie{padding-bottom:15px;font-weight:var(--font-weight-bold);font-size:var(--font-size-body-4)}@media(max-width: 767px){.SbA9dHRh1JSG4xp1Aqie{font-size:var(--font-size-body-3)}}.ZsQJQ__gMgYGYau95r8U{cursor:pointer}.PPF4FGgo1aDsBm13cNj8{padding-left:16px}.PPF4FGgo1aDsBm13cNj8 .SbA9dHRh1JSG4xp1Aqie{font-weight:var(--font-weight-semibold)}.PPF4FGgo1aDsBm13cNj8 .QEsWraNRLBQux4k4KNAE .PPF4FGgo1aDsBm13cNj8 .SbA9dHRh1JSG4xp1Aqie{font-weight:var(--font-weight-light)}.QEsWraNRLBQux4k4KNAE{display:block}.VQ09MnwMcIzpW1iabb4A{color:var(--color-orange)}.cmcMqdZJEUjlu34ag1Md{margin-bottom:4px;display:flex;justify-content:flex-end;align-items:center}@media(max-width: 767px){.cmcMqdZJEUjlu34ag1Md{margin-bottom:20px}}.i_U4mKg0Sxl4EvVzgv0L{font-size:var(--font-size-body-4);color:var(--color-blue);font-weight:var(--font-weight-semibold);margin-bottom:8px}.Tnut0v2OeSU0e7XwrCXI{font-size:var(--font-size-body-3);font-weight:var(--font-weight-light);color:var(--color-black)}.W2hZQFsItdqKPcBu4UrA{display:flex;flex-direction:row;gap:36px;margin-bottom:36px;border-bottom:1px solid rgba(var(--color-blue-rgb), 0.2);padding-bottom:4px}.tIVLagS5XxibJ4PBCNpp{flex-direction:column;border-bottom:1px solid rgba(var(--color-blue-rgb), 0.2);margin-bottom:24px}.tIVLagS5XxibJ4PBCNpp .RenA6EOwu2sFJGoqYbYz{width:100%;border-bottom:none}.tIVLagS5XxibJ4PBCNpp .N0_FbFF8bLYtEcr8_2B9{width:100%;height:auto}.tIVLagS5XxibJ4PBCNpp .N0_FbFF8bLYtEcr8_2B9 .ant-input{min-height:140px}.tIVLagS5XxibJ4PBCNpp .N0_FbFF8bLYtEcr8_2B9 .ant-form-item{margin-bottom:16px}.RenA6EOwu2sFJGoqYbYz{width:calc(100% - 149px);display:flex;align-items:center}.N0_FbFF8bLYtEcr8_2B9{width:130px;min-width:130px;align-self:flex-end;display:flex;justify-content:space-between;padding-right:15px}.GaBbmrXh2G03hz6ha5vB{display:none}.QYrBVtDmfSFNxJFztXVl{min-width:130px;align-self:flex-end;display:flex;justify-content:space-between;gap:34px}.V_qOYQwuQ9mXa8aniYgl{font-size:var(--font-size-body-4);font-weight:var(--font-weight-medium)}@media(max-width: 767px){.V_qOYQwuQ9mXa8aniYgl{font-size:var(--font-size-body-3)}}.pvSzNydRHp3dkh3WrOeA{font-weight:var(--font-weight-light);font-size:var(--font-size-body-3);margin-bottom:4px}@media(max-width: 767px){.pvSzNydRHp3dkh3WrOeA{font-size:var(--font-size-body-2)}}.Ehgx39o1k8blh7IDJ2mg{padding:6px;font-size:var(--font-size-body-4);font-weight:var(--font-weight-medium);color:var(--color-white);border-radius:5px;display:inline-flex;letter-spacing:3px}.ifR0bkZtK7yVHD6YZ_Zz{background-color:rgba(217,217,217,.5);border-radius:5px;padding:8px 15px;display:flex;flex-direction:row;gap:50px;align-items:center}@media(max-width: 767px){.ifR0bkZtK7yVHD6YZ_Zz{gap:12px;padding:4px 8px}}.NL5HeemkTIg0oPHDXVtO{font-size:var(--font-size-body-3);font-weight:var(--font-weight-medium);color:var(--color-black)}.koYqEMOf6wzxWpwvrFkL{display:flex;justify-content:space-between;margin-bottom:12px;margin-left:16px;gap:40px;width:100%}
|
|
@@ -31,4 +31,4 @@
|
|
|
31
31
|
.aZEBTQus3Y3MyodeDwkf{display:flex;flex-direction:column;align-items:center;justify-content:center}.cc1pbQlAgw2CmXVml3bs{height:300px;width:400px}.aTf_CXAsyp0tySsoZdD_{display:flex;justify-content:space-between;margin:10px 10px 0px 10px;font-size:20px}.kuu1hf_JTvYD55IW6Nxl{color:#ff4d4f}.N8ODEO3zDbY7gmecjTrp{color:#52c41a}.WIsL9Shu6c0mGJq9qSSz{margin-top:20px;border-radius:4px;overflow:hidden}.WIsL9Shu6c0mGJq9qSSz img{width:100%;height:auto}
|
|
32
32
|
.OJKeuXyOSPIeCCssVum2{display:flex;gap:32px}.jzxszvL7wzCV5nztJL0S{padding:12px}.OGA8oJw8RDyohcRftjmo{width:100%}.y2_7QVPOhjRZlAHCRWKf{display:grid;grid-template-columns:minmax(200px, 1fr) auto auto auto auto;gap:46px}.Smkcs3LGp1uPuQge2GxE{margin-top:16px}Label{margin-bottom:8px}.djarlYFkE9Kb7wUjUnrY{height:36px}
|
|
33
33
|
:root{--color-grey: #e4e4e4;--color-grey-100: #E5E5E5}.SF5f_Q_Ggz_4JHUHS2Xa{display:flex;align-items:center;padding:13px 20px;box-sizing:border-box;height:72px}.SF5f_Q_Ggz_4JHUHS2Xa *{box-sizing:border-box}.gSVYvBn1sLbcMsGI32b9{display:flex;flex-grow:1;align-items:flex-end;justify-content:center;max-width:calc(100% - 60px)}.gSVYvBn1sLbcMsGI32b9 img{max-width:196px}.gSVYvBn1sLbcMsGI32b9 .fVSt3bSZBcJGsOdA5nIN{font-weight:var(--font-weight-semibold);text-transform:uppercase;color:var(--color-black)}.BIBQmS_NwoMw2Ncq5yuN{cursor:pointer;padding:4px 4px 4px 0;font-size:20px;width:30px;display:flex;align-items:center;justify-content:center}.ZinSgUtysxITkbGRKdux{position:fixed;top:0;left:-100%;bottom:0;width:100%;max-width:430px;background-color:var(--color-white);padding-inline:15px;z-index:999;box-shadow:0 3px 12px rgba(0,0,0,.45);transition:.6s ease-out}.ZinSgUtysxITkbGRKdux.FW1pOdad0uN5LO9h5PgQ{left:0;transition:.3s ease-in}.ZfA8OEmbRzRsNqLAmdtn{background-color:rgba(0,0,0,.3);backdrop-filter:blur(1px);position:absolute;left:0;top:0;right:0;bottom:0;z-index:998;pointer-events:none;opacity:0;transition:.3s}.ZfA8OEmbRzRsNqLAmdtn.FW1pOdad0uN5LO9h5PgQ{opacity:1;pointer-events:all}.YKSQJmdRP_7tKwvQpeuV{width:calc(100% + 30px);margin-left:-15px;background-color:var(--color-orange);display:flex;align-items:center;justify-content:center}.ISssYC5Uz452JVWP0xDc img{max-width:160px}.E6YZPpa60LxA7qqIW7jQ{position:absolute;top:23px;right:15px;font-size:25px;cursor:pointer;color:var(--color-white)}.YYp3pzktjEDEyW8knAZQ{overflow-y:auto;height:calc(100% - 51px);margin:0;padding:0}.u7k2VQ30AQDk6mKA22GX{height:60px;padding:10px;display:flex;align-items:center;border-bottom:1px solid var(--color-black);cursor:pointer;transition:.3s;text-transform:uppercase;width:100%}.u7k2VQ30AQDk6mKA22GX:hover{background-color:var(--color-grey);color:var(--color-black)}.QQoDB9XPcAK18l2DIym4{list-style:none}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN{height:auto;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding-bottom:0}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN>.u7k2VQ30AQDk6mKA22GX{position:relative}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN>.u7k2VQ30AQDk6mKA22GX .NytmT59TmaWHc4FLM2wa{position:absolute;width:60px;height:100%;background:var(--color-black);right:0;display:flex;align-items:center;justify-content:center}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN>.u7k2VQ30AQDk6mKA22GX .NytmT59TmaWHc4FLM2wa:hover{background-color:var(--color-orange)}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN>.u7k2VQ30AQDk6mKA22GX .zo7CFksIKx7Fahu4e4S_{color:var(--color-white)}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN.yk4DnBgiUlzk23Yg_q6E{background:var(--color-grey)}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN.yk4DnBgiUlzk23Yg_q6E .NytmT59TmaWHc4FLM2wa{background-color:var(--color-orange)}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN.yk4DnBgiUlzk23Yg_q6E .uLgjMU9sbvfaa0qKEguP{height:auto;opacity:1}.uLgjMU9sbvfaa0qKEguP{padding:0;width:100%;margin:0;background-color:var(--color-orange);color:var(--color-white);height:0;opacity:0;overflow:hidden;transition:height .3s ease,opacity .3s ease}.uLgjMU9sbvfaa0qKEguP .u7k2VQ30AQDk6mKA22GX{min-height:60px;height:auto;padding-inline:40px}.efnjUnudkE0UTVQ6wrgH{cursor:pointer}.u7k2VQ30AQDk6mKA22GX .fjNRYZMP1O0pTvBDBB3L span{margin-left:8px;transform:translateY(-2px);display:inline-block;font-size:var(--font-size-body-3);text-transform:capitalize}
|
|
34
|
-
.msELhnfhfo6un3c4Spoc{max-width:300px;max-height:400px;
|
|
34
|
+
@media(max-width: 768px){.muC1BdCbIEMIs70EtJoA{position:unset}}.msELhnfhfo6un3c4Spoc{max-width:300px;max-height:400px;padding:0 !important}@media(max-width: 768px){.msELhnfhfo6un3c4Spoc{max-width:100vw}}@media(min-width: 1024px){.msELhnfhfo6un3c4Spoc{max-width:600px;max-height:700px}}@media(max-width: 768px){.oGsIq0O_Hzwg2mLR72la{position:absolute}}.KSVguXBQ_A1SUSR6e8Wq{overflow-y:auto;max-height:calc(100vh - 60px - 72px - 43px)}.GeNg2HVTmhQDmsLLTpWj{display:flex;flex-direction:column;align-items:unset !important;padding:10px;border-bottom:1px solid #f0f0f0;background-color:#fff !important;cursor:pointer}.GeNg2HVTmhQDmsLLTpWj:hover{background-color:#f9f9f9}@media(max-width: 768px){.GeNg2HVTmhQDmsLLTpWj{padding:8px}}.GBb48KXbGnQtAY8xqmUp{display:flex;justify-content:space-between;align-items:center;padding:10px;background-color:#f5f5f5;border-bottom:1px solid #e8e8e8}.LoCH7sYpmK3VgRASqTgz{font-size:20px;cursor:pointer;color:#595959}.Xjs10kZPSsD_BVFomnIe{color:#ff674c;margin-right:8px}.oibCayv_cOyhyWCKzHSr{display:flex;align-items:center;gap:10px}.oibCayv_cOyhyWCKzHSr span{font-size:14px;font-weight:500;color:#595959}.hhwYXSd0CR75D8ETnUML{display:flex;align-items:center;position:relative;padding-left:12px}@media(max-width: 768px){.hhwYXSd0CR75D8ETnUML{padding-left:8px}}.LkP1cqeAyAYI9rCurnE8{position:absolute;left:0;top:50%;transform:translateY(-50%);font-size:16px}@media(max-width: 768px){.LkP1cqeAyAYI9rCurnE8{font-size:12px}}.u_jT9kmq2kyThRlj8HT1{width:50px;height:50px;margin-left:10px;margin-right:10px}@media(max-width: 768px){.u_jT9kmq2kyThRlj8HT1{width:40px;height:40px;margin-left:8px;margin-right:8px}}.ieGdf5FTgLUPcfuZi7Xz{flex:1;overflow:hidden}.QgZ3oHW9IRTexL8xWVqP{font-weight:bold;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;max-width:100%}@media(max-width: 768px){.QgZ3oHW9IRTexL8xWVqP{font-size:12px}}.JwfbSOSIRAz5OO2hiSFc{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;max-width:100%;font-size:12px;color:#666;margin-top:2px}@media(max-width: 768px){.JwfbSOSIRAz5OO2hiSFc{font-size:10px}}.XfXQBYqMfZc4p8s2Mhla{width:6px;height:6px;background-color:#1890ff;border-radius:50%;margin-left:10px}@media(max-width: 768px){.XfXQBYqMfZc4p8s2Mhla{width:4px;height:4px;margin-left:8px}}.RGXTlVxCxbZpD6__J5_g{font-size:12px}.rWa5cnbZQLDtxFxJU6qA{font-size:20px;cursor:pointer}@media(max-width: 768px){.rWa5cnbZQLDtxFxJU6qA{font-size:18px}}.Pus_rAoqX05D4Qz2pYxo{animation:Pus_rAoqX05D4Qz2pYxo 1s ease-in-out infinite}@keyframes Pus_rAoqX05D4Qz2pYxo{0%{transform:rotate(0deg)}25%{transform:rotate(10deg)}50%{transform:rotate(-10deg)}75%{transform:rotate(10deg)}100%{transform:rotate(0deg)}}
|
package/package.json
CHANGED
|
@@ -10,7 +10,7 @@ const Template: Story<BellNotificationsProps> = (args) => <BellNotifications {..
|
|
|
10
10
|
|
|
11
11
|
const notifications = [
|
|
12
12
|
{
|
|
13
|
-
"Id": "
|
|
13
|
+
"Id": "662C390B-A38F-45AB-B97C-2D00F0A8ACAD",
|
|
14
14
|
"Title": "Creation of an Evaluation Cycle",
|
|
15
15
|
"Description": "A new evaluation cycle was created. You must answer it.",
|
|
16
16
|
"RedirectURL": "https://www.google.pt",
|
|
@@ -21,10 +21,10 @@ const notifications = [
|
|
|
21
21
|
"Name": "High",
|
|
22
22
|
"ColorHex": "#E05151"
|
|
23
23
|
},
|
|
24
|
-
"IsRead":
|
|
24
|
+
"IsRead": true
|
|
25
25
|
},
|
|
26
26
|
{
|
|
27
|
-
"Id": "
|
|
27
|
+
"Id": "0AF18720-1C94-48CD-8DF3-D254077E8363",
|
|
28
28
|
"Title": "Creation of an Evaluation Cycle",
|
|
29
29
|
"Description": "A new evaluation cycle was created. You must answer it.",
|
|
30
30
|
"RedirectURL": "https://www.google.pt",
|
|
@@ -35,10 +35,10 @@ const notifications = [
|
|
|
35
35
|
"Name": "High",
|
|
36
36
|
"ColorHex": "#E05151"
|
|
37
37
|
},
|
|
38
|
-
"IsRead":
|
|
38
|
+
"IsRead": true
|
|
39
39
|
},
|
|
40
40
|
{
|
|
41
|
-
"Id": "
|
|
41
|
+
"Id": "0419654F-66FE-41EA-BBA4-D8BB6E3D6B33",
|
|
42
42
|
"Title": "Creation of an Evaluation Cycle",
|
|
43
43
|
"Description": "A new evaluation cycle was created. You must answer it.",
|
|
44
44
|
"RedirectURL": "https://www.google.pt",
|
|
@@ -49,10 +49,10 @@ const notifications = [
|
|
|
49
49
|
"Name": "High",
|
|
50
50
|
"ColorHex": "#E05151"
|
|
51
51
|
},
|
|
52
|
-
"IsRead":
|
|
52
|
+
"IsRead": true
|
|
53
53
|
},
|
|
54
54
|
{
|
|
55
|
-
"Id": "
|
|
55
|
+
"Id": "CC98EDA1-0461-4D08-982E-8424EF4AFB3B",
|
|
56
56
|
"Title": "Creation of an Evaluation Cycle",
|
|
57
57
|
"Description": "A new evaluation cycle was created. You must answer it.",
|
|
58
58
|
"RedirectURL": "https://www.google.pt",
|
|
@@ -66,7 +66,7 @@ const notifications = [
|
|
|
66
66
|
"IsRead": false
|
|
67
67
|
},
|
|
68
68
|
{
|
|
69
|
-
"Id": "
|
|
69
|
+
"Id": "3DB9310A-4BF8-4B90-8D5A-7583473664BB",
|
|
70
70
|
"Title": "Creation of an Evaluation Cycle",
|
|
71
71
|
"Description": "A new evaluation cycle was created. You must answer it.",
|
|
72
72
|
"RedirectURL": "https://www.google.pt",
|
|
@@ -80,32 +80,102 @@ const notifications = [
|
|
|
80
80
|
"IsRead": false
|
|
81
81
|
},
|
|
82
82
|
{
|
|
83
|
-
"Id": "
|
|
84
|
-
"Title": "Creation of
|
|
85
|
-
"Description": "A new
|
|
83
|
+
"Id": "D6FB93EE-3255-42B2-8EC1-27E7AC3F5249",
|
|
84
|
+
"Title": "Creation of a new user",
|
|
85
|
+
"Description": "A new user was created in the platform with the mecanographic number 8111.",
|
|
86
86
|
"RedirectURL": "https://www.google.pt",
|
|
87
|
-
"Icon": "https://
|
|
88
|
-
"ExpirationDate":
|
|
87
|
+
"Icon": "https://omnium-user-images.s3.eu-west-1.amazonaws.com/omniumretail-bigwingame-logotipo-vermelho.svg",
|
|
88
|
+
"ExpirationDate": 1736985600,
|
|
89
89
|
"Criticality": {
|
|
90
90
|
"Id": "F133ED4C-6C72-4CDC-86A1-27A76E6BDE7F",
|
|
91
91
|
"Name": "High",
|
|
92
92
|
"ColorHex": "#E05151"
|
|
93
93
|
},
|
|
94
|
-
"IsRead":
|
|
94
|
+
"IsRead": false
|
|
95
95
|
},
|
|
96
96
|
{
|
|
97
|
-
"Id": "
|
|
98
|
-
"Title": "Creation of a new
|
|
99
|
-
"Description": "A new
|
|
97
|
+
"Id": "D6FB96EE-3255-42B2-8EC1-27E7AC3F5249",
|
|
98
|
+
"Title": "Creation of a new action of inspection",
|
|
99
|
+
"Description": "A new inspection action was created.",
|
|
100
100
|
"RedirectURL": "https://www.google.pt",
|
|
101
|
-
"Icon": "https://
|
|
101
|
+
"Icon": "https://omnium-user-images.s3.eu-west-1.amazonaws.com/omniumretail-bigwingame-logotipo-vermelho.svg",
|
|
102
102
|
"ExpirationDate": 1736985600,
|
|
103
103
|
"Criticality": {
|
|
104
104
|
"Id": "F133ED4C-6C72-4CDC-86A1-27A76E6BDE7F",
|
|
105
105
|
"Name": "High",
|
|
106
106
|
"ColorHex": "#E05151"
|
|
107
107
|
},
|
|
108
|
-
"IsRead":
|
|
108
|
+
"IsRead": false
|
|
109
|
+
},
|
|
110
|
+
{
|
|
111
|
+
"Id": "D6FB96EE-3655-42B2-8EC1-27E7AC3F5249",
|
|
112
|
+
"Title": "Creation of a new action of inspection",
|
|
113
|
+
"Description": "A new inspection action was created.",
|
|
114
|
+
"RedirectURL": "https://www.google.pt",
|
|
115
|
+
"Icon": "https://omnium-user-images.s3.eu-west-1.amazonaws.com/omniumretail-bigwingame-logotipo-vermelho.svg",
|
|
116
|
+
"ExpirationDate": 1736985600,
|
|
117
|
+
"Criticality": {
|
|
118
|
+
"Id": "F133ED4C-6C72-4CDC-86A1-27A76E6BDE7F",
|
|
119
|
+
"Name": "High",
|
|
120
|
+
"ColorHex": "#E05151"
|
|
121
|
+
},
|
|
122
|
+
"IsRead": false
|
|
123
|
+
},
|
|
124
|
+
{
|
|
125
|
+
"Id": "D6FB96EE-3255-46B2-8EC1-27E7AC3F5249",
|
|
126
|
+
"Title": "Creation of a new action of inspection",
|
|
127
|
+
"Description": "A new inspection action was created.",
|
|
128
|
+
"RedirectURL": "https://www.google.pt",
|
|
129
|
+
"Icon": "https://omnium-user-images.s3.eu-west-1.amazonaws.com/omniumretail-bigwingame-logotipo-vermelho.svg",
|
|
130
|
+
"ExpirationDate": 1736985600,
|
|
131
|
+
"Criticality": {
|
|
132
|
+
"Id": "F133ED4C-6C72-4CDC-86A1-27A76E6BDE7F",
|
|
133
|
+
"Name": "High",
|
|
134
|
+
"ColorHex": "#E05151"
|
|
135
|
+
},
|
|
136
|
+
"IsRead": false
|
|
137
|
+
},
|
|
138
|
+
{
|
|
139
|
+
"Id": "D9FB96EE-3255-42B2-8EC1-27E7AC3F5249",
|
|
140
|
+
"Title": "Creation of a new action of inspection",
|
|
141
|
+
"Description": "A new inspection action was created.",
|
|
142
|
+
"RedirectURL": "https://www.google.pt",
|
|
143
|
+
"Icon": "https://omnium-user-images.s3.eu-west-1.amazonaws.com/omniumretail-bigwingame-logotipo-vermelho.svg",
|
|
144
|
+
"ExpirationDate": 1736985600,
|
|
145
|
+
"Criticality": {
|
|
146
|
+
"Id": "F133ED4C-6C72-4CDC-86A1-27A76E6BDE7F",
|
|
147
|
+
"Name": "High",
|
|
148
|
+
"ColorHex": "#E05151"
|
|
149
|
+
},
|
|
150
|
+
"IsRead": false
|
|
151
|
+
},
|
|
152
|
+
{
|
|
153
|
+
"Id": "D6FB96EE-5955-42B2-8EC1-27E7AC3F5249",
|
|
154
|
+
"Title": "Creation of a new action of inspection",
|
|
155
|
+
"Description": "A new inspection action was created.",
|
|
156
|
+
"RedirectURL": "https://www.google.pt",
|
|
157
|
+
"Icon": "https://omnium-user-images.s3.eu-west-1.amazonaws.com/omniumretail-bigwingame-logotipo-vermelho.svg",
|
|
158
|
+
"ExpirationDate": 1736985600,
|
|
159
|
+
"Criticality": {
|
|
160
|
+
"Id": "F133ED4C-6C72-4CDC-86A1-27A76E6BDE7F",
|
|
161
|
+
"Name": "High",
|
|
162
|
+
"ColorHex": "#E05151"
|
|
163
|
+
},
|
|
164
|
+
"IsRead": false
|
|
165
|
+
},
|
|
166
|
+
{
|
|
167
|
+
"Id": "D6FB96EE-3255-42B7-8EC1-27E7AC3F5249",
|
|
168
|
+
"Title": "Creation of a new action of inspection",
|
|
169
|
+
"Description": "A new inspection action was created.",
|
|
170
|
+
"RedirectURL": "https://www.google.pt",
|
|
171
|
+
"Icon": "https://omnium-user-images.s3.eu-west-1.amazonaws.com/omniumretail-bigwingame-logotipo-vermelho.svg",
|
|
172
|
+
"ExpirationDate": 1736985600,
|
|
173
|
+
"Criticality": {
|
|
174
|
+
"Id": "F133ED4C-6C72-4CDC-86A1-27A76E6BDE7F",
|
|
175
|
+
"Name": "High",
|
|
176
|
+
"ColorHex": "#E05151"
|
|
177
|
+
},
|
|
178
|
+
"IsRead": false
|
|
109
179
|
}
|
|
110
180
|
];
|
|
111
181
|
|
|
@@ -31,7 +31,6 @@ export interface BellNotificationsProps {
|
|
|
31
31
|
|
|
32
32
|
export const BellNotifications = ({ notifications, onFilterChange, onNotificationClick, handleMarkAllAsRead }: BellNotificationsProps) => {
|
|
33
33
|
const { t } = useTranslation();
|
|
34
|
-
const [maxChars, setMaxChars] = useState(30);
|
|
35
34
|
const [filter, setFilter] = useState<'all' | 'unread'>('all');
|
|
36
35
|
const [isShaking, setIsShaking] = useState(false);
|
|
37
36
|
|
|
@@ -47,23 +46,6 @@ export const BellNotifications = ({ notifications, onFilterChange, onNotificatio
|
|
|
47
46
|
onFilterChange(newFilter);
|
|
48
47
|
};
|
|
49
48
|
|
|
50
|
-
useEffect(() => {
|
|
51
|
-
const handleResize = () => {
|
|
52
|
-
if (window.innerWidth < 1024) {
|
|
53
|
-
setMaxChars(30);
|
|
54
|
-
} else {
|
|
55
|
-
setMaxChars(60);
|
|
56
|
-
}
|
|
57
|
-
};
|
|
58
|
-
|
|
59
|
-
handleResize();
|
|
60
|
-
window.addEventListener('resize', handleResize);
|
|
61
|
-
|
|
62
|
-
return () => {
|
|
63
|
-
window.removeEventListener('resize', handleResize);
|
|
64
|
-
};
|
|
65
|
-
}, []);
|
|
66
|
-
|
|
67
49
|
useEffect(() => {
|
|
68
50
|
if (unreadCount > 0) {
|
|
69
51
|
const interval = setInterval(() => {
|
|
@@ -104,53 +86,53 @@ export const BellNotifications = ({ notifications, onFilterChange, onNotificatio
|
|
|
104
86
|
/>
|
|
105
87
|
</div>
|
|
106
88
|
|
|
107
|
-
<Dropdown overlay={optionsMenu} trigger={['click']}>
|
|
89
|
+
<Dropdown overlayClassName={styles.optionsMenuStyle} overlay={optionsMenu} trigger={['click']}>
|
|
108
90
|
<MoreOutlined className={styles.moreOutlinedIconStyle} />
|
|
109
91
|
</Dropdown>
|
|
110
92
|
</div>
|
|
111
93
|
)}
|
|
112
94
|
|
|
113
|
-
{
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
{
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
<div
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
95
|
+
<div className={styles.menuItemContainer}>
|
|
96
|
+
{notifications.map((notif) => (
|
|
97
|
+
<Menu.Item
|
|
98
|
+
key={notif.Id}
|
|
99
|
+
className={styles.notificationItem}
|
|
100
|
+
onClick={() => handleNotificationClick(notif.Id, notif.RedirectURL)}
|
|
101
|
+
>
|
|
102
|
+
<div className={styles.notificationContent}>
|
|
103
|
+
{notif.Criticality?.Name === 'High' && (
|
|
104
|
+
<ExclamationCircleOutlined
|
|
105
|
+
className={styles.criticalityIcon}
|
|
106
|
+
style={{ color: notif.Criticality?.ColorHex }}
|
|
107
|
+
/>
|
|
108
|
+
)}
|
|
109
|
+
|
|
110
|
+
<img src={notif.Icon} alt="Notification Icon" className={styles.notificationIcon} />
|
|
111
|
+
|
|
112
|
+
<div className={styles.notificationText}>
|
|
113
|
+
<div
|
|
114
|
+
className={styles.notificationTitle}
|
|
115
|
+
>
|
|
116
|
+
{notif.Title}
|
|
117
|
+
</div>
|
|
118
|
+
|
|
119
|
+
<div className={styles.notificationDescription}>
|
|
120
|
+
{notif.Description}
|
|
121
|
+
</div>
|
|
134
122
|
</div>
|
|
135
123
|
|
|
136
|
-
<div className={styles.
|
|
137
|
-
{notif.Description.length > maxChars
|
|
138
|
-
? `${notif.Description.slice(0, maxChars)}...`
|
|
139
|
-
: notif.Description}
|
|
140
|
-
</div>
|
|
124
|
+
{!notif.IsRead && <div className={styles.unreadIndicator}></div>}
|
|
141
125
|
</div>
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
</Menu.Item>
|
|
146
|
-
))}
|
|
126
|
+
</Menu.Item>
|
|
127
|
+
))}
|
|
128
|
+
</div>
|
|
147
129
|
|
|
148
130
|
{notifications.length === 0 && <Menu.Item disabled>{t('components.bellNotifications.noNotifications')}</Menu.Item>}
|
|
149
131
|
</Menu>
|
|
150
132
|
);
|
|
151
133
|
|
|
152
134
|
return (
|
|
153
|
-
<Dropdown overlay={menu} trigger={['click']}>
|
|
135
|
+
<Dropdown overlayClassName={styles.dropdownContainer} overlay={menu} trigger={['click']}>
|
|
154
136
|
<Badge count={unreadCount} className={styles.badgeStyle} overflowCount={99} offset={[8, 0]}>
|
|
155
137
|
<BellOutlined className={`${styles.bellIcon} ${isShaking ? styles.shake : ''}`} />
|
|
156
138
|
</Badge>
|
|
@@ -1,12 +1,16 @@
|
|
|
1
|
+
.dropdownContainer {
|
|
2
|
+
@media (max-width: 768px) {
|
|
3
|
+
position: unset;
|
|
4
|
+
}
|
|
5
|
+
}
|
|
6
|
+
|
|
1
7
|
.notificationMenu {
|
|
2
8
|
max-width: 300px;
|
|
3
9
|
max-height: 400px;
|
|
4
|
-
|
|
5
|
-
padding: 0;
|
|
10
|
+
padding: 0 !important;
|
|
6
11
|
|
|
7
12
|
@media (max-width: 768px) {
|
|
8
|
-
max-width:
|
|
9
|
-
max-height: 300px;
|
|
13
|
+
max-width: 100vw;
|
|
10
14
|
}
|
|
11
15
|
|
|
12
16
|
@media (min-width: 1024px) {
|
|
@@ -15,13 +19,24 @@
|
|
|
15
19
|
}
|
|
16
20
|
}
|
|
17
21
|
|
|
22
|
+
.optionsMenuStyle {
|
|
23
|
+
@media (max-width: 768px) {
|
|
24
|
+
position: absolute;
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
.menuItemContainer {
|
|
29
|
+
overflow-y: auto;
|
|
30
|
+
max-height: calc(100vh - 60px - 72px - 43px);
|
|
31
|
+
}
|
|
32
|
+
|
|
18
33
|
.notificationItem {
|
|
19
34
|
display: flex;
|
|
20
35
|
flex-direction: column;
|
|
21
36
|
align-items: unset !important;
|
|
22
37
|
padding: 10px;
|
|
23
38
|
border-bottom: 1px solid #f0f0f0;
|
|
24
|
-
background-color: #fff;
|
|
39
|
+
background-color: #fff !important;
|
|
25
40
|
cursor: pointer;
|
|
26
41
|
|
|
27
42
|
&:hover {
|
|
@@ -40,12 +55,6 @@
|
|
|
40
55
|
padding: 10px;
|
|
41
56
|
background-color: #f5f5f5;
|
|
42
57
|
border-bottom: 1px solid #e8e8e8;
|
|
43
|
-
|
|
44
|
-
@media (max-width: 768px) {
|
|
45
|
-
flex-direction: column;
|
|
46
|
-
align-items: flex-start;
|
|
47
|
-
gap: 8px;
|
|
48
|
-
}
|
|
49
58
|
}
|
|
50
59
|
|
|
51
60
|
.moreOutlinedIconStyle {
|
|
@@ -116,6 +125,11 @@
|
|
|
116
125
|
.notificationTitle {
|
|
117
126
|
font-weight: bold;
|
|
118
127
|
font-size: 14px;
|
|
128
|
+
overflow: hidden;
|
|
129
|
+
text-overflow: ellipsis;
|
|
130
|
+
white-space: nowrap;
|
|
131
|
+
display: block;
|
|
132
|
+
max-width: 100%;
|
|
119
133
|
|
|
120
134
|
@media (max-width: 768px) {
|
|
121
135
|
font-size: 12px;
|
|
@@ -123,6 +137,11 @@
|
|
|
123
137
|
}
|
|
124
138
|
|
|
125
139
|
.notificationDescription {
|
|
140
|
+
overflow: hidden;
|
|
141
|
+
text-overflow: ellipsis;
|
|
142
|
+
white-space: nowrap;
|
|
143
|
+
display: block;
|
|
144
|
+
max-width: 100%;
|
|
126
145
|
font-size: 12px;
|
|
127
146
|
color: #666;
|
|
128
147
|
margin-top: 2px;
|
|
@@ -24,13 +24,6 @@
|
|
|
24
24
|
color: var(--button-default-text-hover-color) !important;
|
|
25
25
|
}
|
|
26
26
|
|
|
27
|
-
&:focus,
|
|
28
|
-
&:active,
|
|
29
|
-
&:focus:active {
|
|
30
|
-
background-color: var(--button-default-background-focus-color) !important;
|
|
31
|
-
color: var(--button-default-text-focus-color) !important;
|
|
32
|
-
}
|
|
33
|
-
|
|
34
27
|
&:disabled,
|
|
35
28
|
&.disabled {
|
|
36
29
|
background-color: #C7CAC9 !important;
|
|
@@ -52,13 +45,6 @@
|
|
|
52
45
|
color: var(--button-style-1-text-hover-color) !important;
|
|
53
46
|
}
|
|
54
47
|
|
|
55
|
-
&:focus,
|
|
56
|
-
&:active,
|
|
57
|
-
&:focus:active {
|
|
58
|
-
background-color: var(--button-style-1-background-focus-color);
|
|
59
|
-
color: var(--button-style-1-text-focus-color);
|
|
60
|
-
}
|
|
61
|
-
|
|
62
48
|
&:disabled,
|
|
63
49
|
&.disabled {
|
|
64
50
|
background-color: var(--button-disabled-background-color);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import styles from './styles.module.scss';
|
|
2
2
|
import { useEffect, useImperativeHandle, useState } from 'react';
|
|
3
|
-
import { Form, UploadFile, Upload, DatePicker, InputNumber, Tag } from 'antd';
|
|
3
|
+
import { Form, UploadFile, Upload, DatePicker, InputNumber, Tag, Modal } from 'antd';
|
|
4
4
|
import { useForm } from 'antd/es/form/Form';
|
|
5
5
|
import classNames from 'classnames';
|
|
6
6
|
import TextArea from 'antd/es/input/TextArea';
|
|
@@ -101,6 +101,8 @@ export const CategoryResponse = React.forwardRef((props: CategoryResponse, ref)
|
|
|
101
101
|
const [isNoteVisible, setIsNoteVisible] = useState<{ categoryIndex: number; questionIndex: number } | null>(null);
|
|
102
102
|
const [form] = useForm();
|
|
103
103
|
const [isMobile, setIsMobile] = useState(window.innerWidth < 767);
|
|
104
|
+
const [previewVisible, setPreviewVisible] = useState(false);
|
|
105
|
+
const [previewImage, setPreviewImage] = useState<string>("");
|
|
104
106
|
|
|
105
107
|
const handleResize = () => {
|
|
106
108
|
setIsMobile(window.innerWidth < 767);
|
|
@@ -141,11 +143,11 @@ export const CategoryResponse = React.forwardRef((props: CategoryResponse, ref)
|
|
|
141
143
|
? !question.Disabled
|
|
142
144
|
? (question.IsDate
|
|
143
145
|
? (question?.Answer?.length > 0
|
|
144
|
-
? dayjs.unix(Number(question?.Answer
|
|
146
|
+
? dayjs.unix(Number(question?.Answer))
|
|
145
147
|
: null)
|
|
146
148
|
: question.Answer)
|
|
147
|
-
:
|
|
148
|
-
:
|
|
149
|
+
: question.Answer
|
|
150
|
+
: data.StartDate,
|
|
149
151
|
Note: question.Note || "",
|
|
150
152
|
IsMultipleChoise: question.IsMultipleChoise || false,
|
|
151
153
|
IsNumerical: question.IsNumerical || false,
|
|
@@ -200,10 +202,9 @@ export const CategoryResponse = React.forwardRef((props: CategoryResponse, ref)
|
|
|
200
202
|
reader.onload = () => resolve(reader.result as string);
|
|
201
203
|
});
|
|
202
204
|
}
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
imgWindow?.document.write(image.outerHTML);
|
|
205
|
+
|
|
206
|
+
setPreviewImage(src);
|
|
207
|
+
setPreviewVisible(true);
|
|
207
208
|
};
|
|
208
209
|
|
|
209
210
|
const handleAddAction = (questionId: string, questionAnswerId: string) => {
|
|
@@ -390,25 +391,36 @@ export const CategoryResponse = React.forwardRef((props: CategoryResponse, ref)
|
|
|
390
391
|
<span className={styles.buttonLabel}>{t('components.categoryResponse.note')}</span>
|
|
391
392
|
</div>
|
|
392
393
|
|
|
394
|
+
<div className={styles.uploadContainer}>
|
|
395
|
+
<Upload
|
|
396
|
+
listType={"picture"}
|
|
397
|
+
fileList={fileLists[`${selectedCategory.Data.CategoryId}_${question.Id}`] || []}
|
|
398
|
+
beforeUpload={() => false} // Prevent automatic upload
|
|
399
|
+
onChange={({ fileList }) => handleFileChange(fileList, selectedCategory.Data.CategoryId, question.Id)}
|
|
400
|
+
onPreview={onPreview}
|
|
401
|
+
>
|
|
402
|
+
<div className={styles.uploadIconContainer}>
|
|
403
|
+
<PictureOutlined className={styles.iconStyle} />
|
|
404
|
+
|
|
405
|
+
<span className={styles.buttonLabel}>{t('components.categoryResponse.loadFile')}</span>
|
|
406
|
+
</div>
|
|
407
|
+
</Upload>
|
|
408
|
+
|
|
409
|
+
<Modal
|
|
410
|
+
open={previewVisible}
|
|
411
|
+
footer={null}
|
|
412
|
+
onCancel={() => setPreviewVisible(false)}
|
|
413
|
+
closeIcon={false}
|
|
414
|
+
>
|
|
415
|
+
<img alt="Preview" style={{ width: "100%" }} src={previewImage} />
|
|
416
|
+
</Modal>
|
|
417
|
+
</div>
|
|
418
|
+
|
|
393
419
|
<div className={styles.buttonContainer} onClick={() => handleAddAction(question.QuestionId, question.Id)}>
|
|
394
420
|
<FileDoneOutlined className={styles.iconStyle} />
|
|
395
421
|
|
|
396
422
|
<span className={styles.buttonLabel}>{t('components.categoryResponse.createAction')}</span>
|
|
397
423
|
</div>
|
|
398
|
-
|
|
399
|
-
<Upload
|
|
400
|
-
listType={"text"}
|
|
401
|
-
fileList={fileLists[`${selectedCategory.Data.CategoryId}_${question.Id}`] || []}
|
|
402
|
-
beforeUpload={() => false} // Prevent automatic upload
|
|
403
|
-
onChange={({ fileList }) => handleFileChange(fileList, selectedCategory.Data.CategoryId, question.Id)}
|
|
404
|
-
onPreview={onPreview}
|
|
405
|
-
>
|
|
406
|
-
<div className={styles.uploadContainer}>
|
|
407
|
-
<PictureOutlined className={styles.iconStyle} />
|
|
408
|
-
|
|
409
|
-
<span className={styles.buttonLabel}>{t('components.categoryResponse.loadFile')}</span>
|
|
410
|
-
</div>
|
|
411
|
-
</Upload>
|
|
412
424
|
</div>
|
|
413
425
|
</>
|
|
414
426
|
}
|
|
@@ -232,6 +232,7 @@
|
|
|
232
232
|
.actionsButtonsContainer {
|
|
233
233
|
display: flex;
|
|
234
234
|
flex-direction: row;
|
|
235
|
+
justify-content: center;
|
|
235
236
|
gap: 20px;
|
|
236
237
|
margin-top: 12px;
|
|
237
238
|
margin-bottom: 12px;
|
|
@@ -259,6 +260,10 @@
|
|
|
259
260
|
}
|
|
260
261
|
|
|
261
262
|
.uploadContainer {
|
|
263
|
+
text-align: center;
|
|
264
|
+
}
|
|
265
|
+
|
|
266
|
+
.uploadIconContainer {
|
|
262
267
|
margin-top: 5px;
|
|
263
268
|
cursor: pointer;
|
|
264
269
|
|
|
@@ -350,11 +355,12 @@
|
|
|
350
355
|
}
|
|
351
356
|
|
|
352
357
|
.ant-upload-wrapper .ant-upload-list .ant-upload-list-item {
|
|
353
|
-
max-width:
|
|
358
|
+
max-width: calc(100vw/5) !important;
|
|
354
359
|
font-size: 12px !important;
|
|
355
360
|
|
|
356
361
|
@media(max-width: 767px) {
|
|
357
362
|
font-size: 10px !important;
|
|
363
|
+
max-width: calc(100vw/2) !important;
|
|
358
364
|
}
|
|
359
365
|
}
|
|
360
366
|
|