Komponente laden...

Laden

Weitere Komponenten

Alle anzeigen
Teil von

Benutzerdefinierte Checkbox Dropdown

Huch! Beim Absenden des Formulars ist etwas schief gelaufen.
Benutzerdefinierte Checkbox Dropdown
{"type":"@webflow/XscpData","payload":{"nodes":[{"_id":"24d4993e-314c-5062-83b2-c562db5f73e8","type":"Block","tag":"div","classes":[],"children":["25bafab6-7cbb-25d6-9af7-80820c476fda","38f8a9e3-59ec-9e33-23a5-1d781cf515c7"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"25bafab6-7cbb-25d6-9af7-80820c476fda","type":"Block","tag":"div","classes":["6b8902a2-181b-b570-6fc0-60668a93022f"],"children":["25bafab6-7cbb-25d6-9af7-80820c476fdb","25bafab6-7cbb-25d6-9af7-80820c476fdc"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"25bafab6-7cbb-25d6-9af7-80820c476fdb","text":true,"v":"Custom Dropdown using checkboxes & Webflow IX"},{"_id":"25bafab6-7cbb-25d6-9af7-80820c476fdc","type":"Span","tag":"span","classes":["6b8902a2-181b-b570-6fc0-60668a930241"],"children":["25bafab6-7cbb-25d6-9af7-80820c476fdd"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"25bafab6-7cbb-25d6-9af7-80820c476fdd","text":true,"v":""},{"_id":"38f8a9e3-59ec-9e33-23a5-1d781cf515c7","type":"DropdownWrapper","tag":"div","classes":["24c9fe37-f231-1486-5711-0f46af614883"],"children":["38f8a9e3-59ec-9e33-23a5-1d781cf515c8","38f8a9e3-59ec-9e33-23a5-1d781cf515cc"],"data":{"search":{"exclude":true},"xattr":[],"displayName":"","dropdown":{"type":"wrapper"},"attr":{"data-delay":0,"data-hover":false,"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"38f8a9e3-59ec-9e33-23a5-1d781cf515c8","type":"DropdownToggle","tag":"div","classes":["6b8902a2-181b-b570-6fc0-60668a93023b"],"children":["38f8a9e3-59ec-9e33-23a5-1d781cf515c9","38f8a9e3-59ec-9e33-23a5-1d781cf515ca","36bd4db7-31ae-8a1f-268a-56d71940d24e"],"data":{"search":{"exclude":false},"xattr":[],"displayName":"","dropdown":{"type":"toggle"},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"38f8a9e3-59ec-9e33-23a5-1d781cf515c9","type":"Icon","tag":"div","classes":[],"children":[],"data":{"widget":{"type":"icon","icon":"dropdown-toggle"},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":true},"visibility":{"conditions":[]}}},{"_id":"38f8a9e3-59ec-9e33-23a5-1d781cf515ca","type":"Block","tag":"div","classes":[],"children":["38f8a9e3-59ec-9e33-23a5-1d781cf515cb"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"38f8a9e3-59ec-9e33-23a5-1d781cf515cb","text":true,"v":"Select all that apply"},{"_id":"36bd4db7-31ae-8a1f-268a-56d71940d24e","type":"HtmlEmbed","tag":"div","classes":["9446ac36-6c31-eb8d-f45c-a0547e011c2b","44a48675-0696-aa63-f52a-929047cdb39a"],"children":[],"v":"<svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M10 0C4.48 0 0 4.48 0 10C0 15.52 4.48 20 10 20C15.52 20 20 15.52 20 10C20 4.48 15.52 0 10 0ZM7.29 15.29L3.7 11.7C3.31 11.31 3.31 10.68 3.7 10.29C4.09 9.9 4.72 9.9 5.11 10.29L8 13.17L14.88 6.29C15.27 5.9 15.9 5.9 16.29 6.29C16.68 6.68 16.68 7.31 16.29 7.7L8.7 15.29C8.32 15.68 7.68 15.68 7.29 15.29Z\" fill=\"currentColor\"/>\n</svg>","data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"embed":{"meta":{"html":"<svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M10 0C4.48 0 0 4.48 0 10C0 15.52 4.48 20 10 20C15.52 20 20 15.52 20 10C20 4.48 15.52 0 10 0ZM7.29 15.29L3.7 11.7C3.31 11.31 3.31 10.68 3.7 10.29C4.09 9.9 4.72 9.9 5.11 10.29L8 13.17L14.88 6.29C15.27 5.9 15.9 5.9 16.29 6.29C16.68 6.68 16.68 7.31 16.29 7.7L8.7 15.29C8.32 15.68 7.68 15.68 7.29 15.29Z\" fill=\"currentColor\"/>\n</svg>","div":false,"script":false,"iframe":false,"compilable":false},"type":"html"},"insideRTE":false}},{"_id":"38f8a9e3-59ec-9e33-23a5-1d781cf515cc","type":"DropdownList","tag":"nav","classes":["579c2711-a4bf-de39-d392-180cf35eef36"],"children":["eb7df792-8e19-0cc0-34a8-cc7cd3040489"],"data":{"search":{"exclude":false},"xattr":[],"displayName":"","dropdown":{"type":"list"},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"nav"}},{"_id":"eb7df792-8e19-0cc0-34a8-cc7cd3040489","type":"Block","tag":"div","classes":[],"children":["eb7df792-8e19-0cc0-34a8-cc7cd304048a","eb7df792-8e19-0cc0-34a8-cc7cd304048e","1194664f-e13b-cf76-4717-81c89f42403c","4ed0e4bd-aa23-0d05-bfeb-991ff89fa795"],"data":{"search":{"exclude":false},"xattr":[{"name":"data-ms-member","value":"materials"}],"text":false,"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"eb7df792-8e19-0cc0-34a8-cc7cd304048a","type":"FormCheckboxWrapper","tag":"div","classes":["cdef046e-6bc9-26a7-b100-40c1e8882b09"],"children":["eb7df792-8e19-0cc0-34a8-cc7cd304048b","eb7df792-8e19-0cc0-34a8-cc7cd304048c"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"eb7df792-8e19-0cc0-34a8-cc7cd304048b","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-9","type":"checkbox","name":"checkbox-9","data-name":"Checkbox 9","required":false,"checked":true},"xattr":[{"name":"data-ms-value","value":"Graphic Design"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 9"},"inputType":"custom"}},{"_id":"eb7df792-8e19-0cc0-34a8-cc7cd304048c","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["eb7df792-8e19-0cc0-34a8-cc7cd304048d"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"eb7df792-8e19-0cc0-34a8-cc7cd304048d","text":true,"v":"Wood"},{"_id":"eb7df792-8e19-0cc0-34a8-cc7cd304048e","type":"FormCheckboxWrapper","tag":"div","classes":["cdef046e-6bc9-26a7-b100-40c1e8882b09"],"children":["eb7df792-8e19-0cc0-34a8-cc7cd304048f","eb7df792-8e19-0cc0-34a8-cc7cd3040490"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"eb7df792-8e19-0cc0-34a8-cc7cd304048f","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-8","type":"checkbox","name":"checkbox-8","data-name":"Checkbox 8","required":false,"checked":false},"xattr":[{"name":"data-ms-value","value":"Web Design"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 8"},"inputType":"custom"}},{"_id":"eb7df792-8e19-0cc0-34a8-cc7cd3040490","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["eb7df792-8e19-0cc0-34a8-cc7cd3040491"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"eb7df792-8e19-0cc0-34a8-cc7cd3040491","text":true,"v":"Metal"},{"_id":"1194664f-e13b-cf76-4717-81c89f42403c","type":"FormCheckboxWrapper","tag":"div","classes":["cdef046e-6bc9-26a7-b100-40c1e8882b09"],"children":["1194664f-e13b-cf76-4717-81c89f42403d","1194664f-e13b-cf76-4717-81c89f42403e"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"1194664f-e13b-cf76-4717-81c89f42403d","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-8","type":"checkbox","name":"checkbox-8","data-name":"Checkbox 8","required":false,"checked":false},"xattr":[{"name":"data-ms-value","value":"Web Design"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 8"},"inputType":"custom"}},{"_id":"1194664f-e13b-cf76-4717-81c89f42403e","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["1194664f-e13b-cf76-4717-81c89f42403f"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"1194664f-e13b-cf76-4717-81c89f42403f","text":true,"v":"Plastic"},{"_id":"4ed0e4bd-aa23-0d05-bfeb-991ff89fa795","type":"FormCheckboxWrapper","tag":"div","classes":["cdef046e-6bc9-26a7-b100-40c1e8882b09"],"children":["4ed0e4bd-aa23-0d05-bfeb-991ff89fa796","4ed0e4bd-aa23-0d05-bfeb-991ff89fa797"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"4ed0e4bd-aa23-0d05-bfeb-991ff89fa796","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-8","type":"checkbox","name":"checkbox-8","data-name":"Checkbox 8","required":false,"checked":false},"xattr":[{"name":"data-ms-value","value":"Web Design"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 8"},"inputType":"custom"}},{"_id":"4ed0e4bd-aa23-0d05-bfeb-991ff89fa797","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["4ed0e4bd-aa23-0d05-bfeb-991ff89fa798"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"4ed0e4bd-aa23-0d05-bfeb-991ff89fa798","text":true,"v":"Polycarbonate"}],"styles":[{"_id":"6b8902a2-181b-b570-6fc0-60668a93023b","fake":false,"type":"class","name":"input","namespace":"","comb":"","styleLess":"min-height: 48px; margin-bottom: 0px; padding-top: 13px; padding-right: 45px; padding-bottom: 10px; padding-left: 18px; border-top-style: solid; border-top-width: 1px; border-top-color: hsla(230, 22.16%, 76.88%, 1.00); border-right-style: solid; border-right-width: 1px; border-right-color: hsla(230, 22.16%, 76.88%, 1.00); border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: hsla(230, 22.16%, 76.88%, 1.00); border-left-style: solid; border-left-width: 1px; border-left-color: hsla(230, 22.16%, 76.88%, 1.00); border-top-left-radius: 6px; border-top-right-radius: 6px; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; background-color: hsla(231.42857142857142, 0.00%, 100.00%, 1.00); box-shadow: 0 3px 6px -2px hsla(261, 97.36%, 15.88%, 0.10); transition-property: border-color, box-shadow; transition-duration: 200ms, 200ms; transition-timing-function: ease, ease; color: hsla(225, 0.00%, 0.00%, 1.00); font-size: 1rem;","variants":{"main_focus":{"styleLess":"border-top-style: solid; border-top-width: 1px; border-top-color: hsla(225, 0.00%, 0.00%, 1.00); border-right-style: solid; border-right-width: 1px; border-right-color: hsla(225, 0.00%, 0.00%, 1.00); border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: hsla(225, 0.00%, 0.00%, 1.00); border-left-style: solid; border-left-width: 1px; border-left-color: hsla(225, 0.00%, 0.00%, 1.00);"},"main_placeholder":{"styleLess":"color: hsla(0, 0.00%, 43.33%, 1.00);"},"main_hover":{"styleLess":"border-top-color: hsla(225, 0.00%, 0.00%, 1.00); border-right-color: hsla(225, 0.00%, 0.00%, 1.00); border-bottom-color: hsla(225, 0.00%, 0.00%, 1.00); border-left-color: hsla(225, 0.00%, 0.00%, 1.00); box-shadow: none /* 0 1px 2px 0 hsla(261, 97.36%, 15.88%, 0.10) */;"},"tiny":{"styleLess":"font-size: 0.9rem;"},"main_open":{"styleLess":"border-top-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-right-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-bottom-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-left-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00);"}},"children":["6b8902a2-181b-b570-6fc0-60668a930250","dc98219a-6639-055f-f1b8-f6e1f8809f52"],"selector":null},{"_id":"9d7afcd0-9551-4cec-530e-de1e593ce0d2","fake":false,"type":"class","name":"custom-checkbox-label-b","namespace":"","comb":"","styleLess":"position: relative; z-index: 3; width: 100%; color: hsla(225, 0.00%, 0.00%, 1.00); font-weight: 600; mix-blend-mode: normal;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"44a48675-0696-aa63-f52a-929047cdb39a","fake":false,"type":"class","name":"editted","namespace":"","comb":"&","styleLess":"position: absolute; left: auto; top: 10px; right: 10px; bottom: auto; margin-right: 0px; background-color: white; color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00);","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"31c90483-67e8-0f87-5113-5c4dfc1c6135","fake":false,"type":"class","name":"checkbox_button-b","namespace":"","comb":"","styleLess":"position: absolute; left: 0%; top: 0%; right: 0%; bottom: 0%; z-index: 3; display: inline-block; width: 100%; height: 100%; margin-top: 0px; margin-left: 0px; border-top-color: transparent; border-right-color: transparent; border-bottom-color: transparent; border-left-color: transparent; border-top-left-radius: 6px; border-top-right-radius: 6px; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; cursor: pointer;","variants":{"main_redirected-checked":{"styleLess":"width: 100%; height: 100%; border-top-width: 2px; border-top-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-right-width: 2px; border-right-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-bottom-width: 2px; border-bottom-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-left-width: 2px; border-left-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-top-left-radius: 6px; border-top-right-radius: 6px; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; background-color: hsla(147.22222222222223, 65.06%, 32.55%, 0.05); background-image: @img_63570cb1b1dd1607479f1327; background-position: 90% 50%; background-size: 14px; background-repeat: no-repeat;"},"main_hover":{"styleLess":"background-color: hsla(225, 0.00%, 0.00%, 0.05);"}},"children":["ef87cee6-e256-7d29-0598-deb47550485b"],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"579c2711-a4bf-de39-d392-180cf35eef36","fake":false,"type":"class","name":"select-dropdown","namespace":"","comb":"","styleLess":"","variants":{"main_open":{"styleLess":"padding-top: 0.5rem; padding-right: 0.5rem; padding-bottom: 0.25rem; padding-left: 0.5rem; border-top-style: solid; border-top-width: 0.5px; border-top-color: hsla(232.8, 21.37%, 77.06%, 1.00); border-right-style: solid; border-right-width: 0.5px; border-right-color: hsla(232.8, 21.37%, 77.06%, 1.00); border-bottom-style: solid; border-bottom-width: 0.5px; border-bottom-color: hsla(232.8, 21.37%, 77.06%, 1.00); border-left-style: solid; border-left-width: 0.5px; border-left-color: hsla(232.8, 21.37%, 77.06%, 1.00); border-top-left-radius: 6px; border-top-right-radius: 6px; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; background-color: white; box-shadow: 0 10px 12px -3px hsla(225, 0.00%, 0.00%, 0.10);"}},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"cdef046e-6bc9-26a7-b100-40c1e8882b09","fake":false,"type":"class","name":"checkbox-field-b","namespace":"","comb":"","styleLess":"position: relative; z-index: 2; display: flex; width: 100%; margin-bottom: 0.25rem; padding-top: 0.3rem; padding-bottom: 0.2rem; padding-left: 0.7rem; align-items: center; flex-grow: 0; flex-shrink: 0; flex-basis: auto; line-height: 1.4em;","variants":{"main_hover":{"styleLess":"position: relative; border-top-color: hsla(244.5378151260504, 100.00%, 46.67%, 1.00); border-right-color: hsla(244.5378151260504, 100.00%, 46.67%, 1.00); border-bottom-color: hsla(244.5378151260504, 100.00%, 46.67%, 1.00); border-left-color: hsla(244.5378151260504, 100.00%, 46.67%, 1.00); box-shadow: 0 20px 30px -10px hsla(0, 0.00%, 0.00%, 0.13);"}},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"9446ac36-6c31-eb8d-f45c-a0547e011c2b","fake":false,"type":"class","name":"svg","namespace":"","comb":"","styleLess":"display: flex; overflow: hidden; width: 24px; height: 24px; min-height: 24px; min-width: 24px; margin-right: 6px; margin-left: -0.25rem; justify-content: center; align-items: center;","variants":{},"children":["44a48675-0696-aa63-f52a-929047cdb39a"],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"6b8902a2-181b-b570-6fc0-60668a930241","fake":false,"type":"class","name":"text-color-grey","namespace":"","comb":"","styleLess":"opacity: 0.7;","variants":{},"children":[],"selector":null},{"_id":"24c9fe37-f231-1486-5711-0f46af614883","fake":false,"type":"class","name":"select-input","namespace":"","comb":"","styleLess":"margin-right: 0px; margin-left: 0px;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"6b8902a2-181b-b570-6fc0-60668a93022f","fake":false,"type":"class","name":"checkbox-label","namespace":"","comb":"","styleLess":"margin-bottom: 0.5rem; color: hsla(225, 0.00%, 0.00%, 1.00); font-size: 0.9rem; font-weight: 600;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null}],"assets":[{"cdnUrl":"https://cdn.prod.website-files.com/635689ca57c4a5be05d92b4d/63570cb1b1dd1607479f1327_noun_Close_3610311.svg","siteId":"635689ca57c4a5be05d92b4d","isHD":false,"fileName":"63570cb1b1dd1607479f1327_noun_Close_3610311.svg","createdOn":"2022-10-24T22:07:45.460Z","origFileName":"noun_Close_3610311.svg","fileHash":"be9e4811a472e18505cbd30538757206","variants":[],"mimeType":"image/svg+xml","s3Url":"https://s3.amazonaws.com/webflow-prod-assets/635689ca57c4a5be05d92b4d/63570cb1b1dd1607479f1327_noun_Close_3610311.svg","thumbUrl":"https://cdn.prod.website-files.com/635689ca57c4a5be05d92b4d/63570cb1b1dd1607479f1327_noun_Close_3610311.svg","_id":"63570cb1b1dd1607479f1327","updatedOn":"2022-10-24T22:07:45.460Z","fileSize":705}],"ix1":[],"ix2":{"interactions":[{"id":"i","interactionTypeId":"MOUSE_CLICK_INTERACTION","eventIds":["e","e-2"],"target":"635689ca57c4a575b2d92b4e|38f8a9e3-59ec-9e33-23a5-1d781cf515cc","createdOn":1666634163231}],"events":[{"id":"e","name":"","animationType":"custom","eventTypeId":"MOUSE_CLICK","action":{"id":"","actionTypeId":"GENERAL_START_ACTION","instant":true,"config":{"delay":0,"easing":"","duration":0,"actionListId":"a","affectedElements":{},"playInReverse":false,"autoStopEventId":"e-2"}},"mediaQueries":["main","medium","small","tiny"],"target":{"id":"635689ca57c4a575b2d92b4e|38f8a9e3-59ec-9e33-23a5-1d781cf515cc","appliesTo":"CLASS","styleBlockIds":["579c2711-a4bf-de39-d392-180cf35eef36"]},"targets":[{"id":"635689ca57c4a575b2d92b4e|38f8a9e3-59ec-9e33-23a5-1d781cf515cc","appliesTo":"CLASS","styleBlockIds":["579c2711-a4bf-de39-d392-180cf35eef36"]}],"config":{"loop":false,"playInReverse":false,"scrollOffsetValue":null,"scrollOffsetUnit":null,"delay":null,"direction":null,"effectIn":null},"createdOn":1666634163231},{"id":"e-2","name":"","animationType":"preset","eventTypeId":"MOUSE_SECOND_CLICK","action":null,"mediaQueries":["main","medium","small","tiny"],"target":{"id":"635689ca57c4a575b2d92b4e|38f8a9e3-59ec-9e33-23a5-1d781cf515cc","appliesTo":"CLASS","styleBlockIds":["579c2711-a4bf-de39-d392-180cf35eef36"]},"targets":[{"id":"635689ca57c4a575b2d92b4e|38f8a9e3-59ec-9e33-23a5-1d781cf515cc","appliesTo":"CLASS","styleBlockIds":["579c2711-a4bf-de39-d392-180cf35eef36"]}],"config":{"loop":false,"playInReverse":false,"scrollOffsetValue":null,"scrollOffsetUnit":null,"delay":null,"direction":null,"effectIn":null},"createdOn":1666634163231}],"actionLists":[{"id":"a","title":"Edit Dropdown","actionItemGroups":[{"actionItems":[{"id":"a-n-2","actionTypeId":"GENERAL_DISPLAY","config":{"delay":0,"easing":"","duration":0,"target":{"nodeId":"635689ca57c4a575b2d92b4e|36bd4db7-31ae-8a1f-268a-56d71940d24e","appliesTo":"ELEMENT_CLASS","styleBlockIds":["9446ac36-6c31-eb8d-f45c-a0547e011c2b","44a48675-0696-aa63-f52a-929047cdb39a"],"boundaryMode":false},"value":"none"},"instant":true}]},{"actionItems":[{"id":"a-n","actionTypeId":"GENERAL_DISPLAY","config":{"delay":0,"easing":"","duration":0,"target":{"nodeId":"635689ca57c4a575b2d92b4e|36bd4db7-31ae-8a1f-268a-56d71940d24e","appliesTo":"ELEMENT_CLASS","styleBlockIds":["9446ac36-6c31-eb8d-f45c-a0547e011c2b","44a48675-0696-aa63-f52a-929047cdb39a"],"boundaryMode":false},"value":"flex"},"instant":true}]}],"useFirstGroupAsInitialState":true,"createdOn":1666634166772}]}},"meta":{"unlinkedSymbolCount":0,"droppedLinks":0,"dynBindRemovedCount":0,"dynListBindRemovedCount":0,"paginationRemovedCount":0}}
Klonen in Webflow
Komponente kopieren
{"type":"@webflow/XscpData","payload":{"nodes":[{"_id":"24d4993e-314c-5062-83b2-c562db5f73e8","type":"Block","tag":"div","classes":[],"children":["25bafab6-7cbb-25d6-9af7-80820c476fda","38f8a9e3-59ec-9e33-23a5-1d781cf515c7"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"25bafab6-7cbb-25d6-9af7-80820c476fda","type":"Block","tag":"div","classes":["6b8902a2-181b-b570-6fc0-60668a93022f"],"children":["25bafab6-7cbb-25d6-9af7-80820c476fdb","25bafab6-7cbb-25d6-9af7-80820c476fdc"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"25bafab6-7cbb-25d6-9af7-80820c476fdb","text":true,"v":"Custom Dropdown using checkboxes & Webflow IX"},{"_id":"25bafab6-7cbb-25d6-9af7-80820c476fdc","type":"Span","tag":"span","classes":["6b8902a2-181b-b570-6fc0-60668a930241"],"children":["25bafab6-7cbb-25d6-9af7-80820c476fdd"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"25bafab6-7cbb-25d6-9af7-80820c476fdd","text":true,"v":""},{"_id":"38f8a9e3-59ec-9e33-23a5-1d781cf515c7","type":"DropdownWrapper","tag":"div","classes":["24c9fe37-f231-1486-5711-0f46af614883"],"children":["38f8a9e3-59ec-9e33-23a5-1d781cf515c8","38f8a9e3-59ec-9e33-23a5-1d781cf515cc"],"data":{"search":{"exclude":true},"xattr":[],"displayName":"","dropdown":{"type":"wrapper"},"attr":{"data-delay":0,"data-hover":false,"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"38f8a9e3-59ec-9e33-23a5-1d781cf515c8","type":"DropdownToggle","tag":"div","classes":["6b8902a2-181b-b570-6fc0-60668a93023b"],"children":["38f8a9e3-59ec-9e33-23a5-1d781cf515c9","38f8a9e3-59ec-9e33-23a5-1d781cf515ca","36bd4db7-31ae-8a1f-268a-56d71940d24e"],"data":{"search":{"exclude":false},"xattr":[],"displayName":"","dropdown":{"type":"toggle"},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"38f8a9e3-59ec-9e33-23a5-1d781cf515c9","type":"Icon","tag":"div","classes":[],"children":[],"data":{"widget":{"type":"icon","icon":"dropdown-toggle"},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":true},"visibility":{"conditions":[]}}},{"_id":"38f8a9e3-59ec-9e33-23a5-1d781cf515ca","type":"Block","tag":"div","classes":[],"children":["38f8a9e3-59ec-9e33-23a5-1d781cf515cb"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"38f8a9e3-59ec-9e33-23a5-1d781cf515cb","text":true,"v":"Select all that apply"},{"_id":"36bd4db7-31ae-8a1f-268a-56d71940d24e","type":"HtmlEmbed","tag":"div","classes":["9446ac36-6c31-eb8d-f45c-a0547e011c2b","44a48675-0696-aa63-f52a-929047cdb39a"],"children":[],"v":"<svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M10 0C4.48 0 0 4.48 0 10C0 15.52 4.48 20 10 20C15.52 20 20 15.52 20 10C20 4.48 15.52 0 10 0ZM7.29 15.29L3.7 11.7C3.31 11.31 3.31 10.68 3.7 10.29C4.09 9.9 4.72 9.9 5.11 10.29L8 13.17L14.88 6.29C15.27 5.9 15.9 5.9 16.29 6.29C16.68 6.68 16.68 7.31 16.29 7.7L8.7 15.29C8.32 15.68 7.68 15.68 7.29 15.29Z\" fill=\"currentColor\"/>\n</svg>","data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"embed":{"meta":{"html":"<svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M10 0C4.48 0 0 4.48 0 10C0 15.52 4.48 20 10 20C15.52 20 20 15.52 20 10C20 4.48 15.52 0 10 0ZM7.29 15.29L3.7 11.7C3.31 11.31 3.31 10.68 3.7 10.29C4.09 9.9 4.72 9.9 5.11 10.29L8 13.17L14.88 6.29C15.27 5.9 15.9 5.9 16.29 6.29C16.68 6.68 16.68 7.31 16.29 7.7L8.7 15.29C8.32 15.68 7.68 15.68 7.29 15.29Z\" fill=\"currentColor\"/>\n</svg>","div":false,"script":false,"iframe":false,"compilable":false},"type":"html"},"insideRTE":false}},{"_id":"38f8a9e3-59ec-9e33-23a5-1d781cf515cc","type":"DropdownList","tag":"nav","classes":["579c2711-a4bf-de39-d392-180cf35eef36"],"children":["eb7df792-8e19-0cc0-34a8-cc7cd3040489"],"data":{"search":{"exclude":false},"xattr":[],"displayName":"","dropdown":{"type":"list"},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"nav"}},{"_id":"eb7df792-8e19-0cc0-34a8-cc7cd3040489","type":"Block","tag":"div","classes":[],"children":["eb7df792-8e19-0cc0-34a8-cc7cd304048a","eb7df792-8e19-0cc0-34a8-cc7cd304048e","1194664f-e13b-cf76-4717-81c89f42403c","4ed0e4bd-aa23-0d05-bfeb-991ff89fa795"],"data":{"search":{"exclude":false},"xattr":[{"name":"data-ms-member","value":"materials"}],"text":false,"displayName":"","attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"eb7df792-8e19-0cc0-34a8-cc7cd304048a","type":"FormCheckboxWrapper","tag":"div","classes":["cdef046e-6bc9-26a7-b100-40c1e8882b09"],"children":["eb7df792-8e19-0cc0-34a8-cc7cd304048b","eb7df792-8e19-0cc0-34a8-cc7cd304048c"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"eb7df792-8e19-0cc0-34a8-cc7cd304048b","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-9","type":"checkbox","name":"checkbox-9","data-name":"Checkbox 9","required":false,"checked":true},"xattr":[{"name":"data-ms-value","value":"Graphic Design"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 9"},"inputType":"custom"}},{"_id":"eb7df792-8e19-0cc0-34a8-cc7cd304048c","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["eb7df792-8e19-0cc0-34a8-cc7cd304048d"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"eb7df792-8e19-0cc0-34a8-cc7cd304048d","text":true,"v":"Wood"},{"_id":"eb7df792-8e19-0cc0-34a8-cc7cd304048e","type":"FormCheckboxWrapper","tag":"div","classes":["cdef046e-6bc9-26a7-b100-40c1e8882b09"],"children":["eb7df792-8e19-0cc0-34a8-cc7cd304048f","eb7df792-8e19-0cc0-34a8-cc7cd3040490"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"eb7df792-8e19-0cc0-34a8-cc7cd304048f","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-8","type":"checkbox","name":"checkbox-8","data-name":"Checkbox 8","required":false,"checked":false},"xattr":[{"name":"data-ms-value","value":"Web Design"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 8"},"inputType":"custom"}},{"_id":"eb7df792-8e19-0cc0-34a8-cc7cd3040490","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["eb7df792-8e19-0cc0-34a8-cc7cd3040491"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"eb7df792-8e19-0cc0-34a8-cc7cd3040491","text":true,"v":"Metal"},{"_id":"1194664f-e13b-cf76-4717-81c89f42403c","type":"FormCheckboxWrapper","tag":"div","classes":["cdef046e-6bc9-26a7-b100-40c1e8882b09"],"children":["1194664f-e13b-cf76-4717-81c89f42403d","1194664f-e13b-cf76-4717-81c89f42403e"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"1194664f-e13b-cf76-4717-81c89f42403d","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-8","type":"checkbox","name":"checkbox-8","data-name":"Checkbox 8","required":false,"checked":false},"xattr":[{"name":"data-ms-value","value":"Web Design"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 8"},"inputType":"custom"}},{"_id":"1194664f-e13b-cf76-4717-81c89f42403e","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["1194664f-e13b-cf76-4717-81c89f42403f"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"1194664f-e13b-cf76-4717-81c89f42403f","text":true,"v":"Plastic"},{"_id":"4ed0e4bd-aa23-0d05-bfeb-991ff89fa795","type":"FormCheckboxWrapper","tag":"div","classes":["cdef046e-6bc9-26a7-b100-40c1e8882b09"],"children":["4ed0e4bd-aa23-0d05-bfeb-991ff89fa796","4ed0e4bd-aa23-0d05-bfeb-991ff89fa797"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox"}}},{"_id":"4ed0e4bd-aa23-0d05-bfeb-991ff89fa796","type":"FormCheckboxInput","tag":"input","classes":["31c90483-67e8-0f87-5113-5c4dfc1c6135"],"children":[],"data":{"displayName":"","attr":{"id":"checkbox-8","type":"checkbox","name":"checkbox-8","data-name":"Checkbox 8","required":false,"checked":false},"xattr":[{"name":"data-ms-value","value":"Web Design"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-input","name":"Checkbox 8"},"inputType":"custom"}},{"_id":"4ed0e4bd-aa23-0d05-bfeb-991ff89fa797","type":"FormInlineLabel","tag":"label","classes":["9d7afcd0-9551-4cec-530e-de1e593ce0d2"],"children":["4ed0e4bd-aa23-0d05-bfeb-991ff89fa798"],"data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"checkbox-label"}}},{"_id":"4ed0e4bd-aa23-0d05-bfeb-991ff89fa798","text":true,"v":"Polycarbonate"}],"styles":[{"_id":"6b8902a2-181b-b570-6fc0-60668a93023b","fake":false,"type":"class","name":"input","namespace":"","comb":"","styleLess":"min-height: 48px; margin-bottom: 0px; padding-top: 13px; padding-right: 45px; padding-bottom: 10px; padding-left: 18px; border-top-style: solid; border-top-width: 1px; border-top-color: hsla(230, 22.16%, 76.88%, 1.00); border-right-style: solid; border-right-width: 1px; border-right-color: hsla(230, 22.16%, 76.88%, 1.00); border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: hsla(230, 22.16%, 76.88%, 1.00); border-left-style: solid; border-left-width: 1px; border-left-color: hsla(230, 22.16%, 76.88%, 1.00); border-top-left-radius: 6px; border-top-right-radius: 6px; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; background-color: hsla(231.42857142857142, 0.00%, 100.00%, 1.00); box-shadow: 0 3px 6px -2px hsla(261, 97.36%, 15.88%, 0.10); transition-property: border-color, box-shadow; transition-duration: 200ms, 200ms; transition-timing-function: ease, ease; color: hsla(225, 0.00%, 0.00%, 1.00); font-size: 1rem;","variants":{"main_focus":{"styleLess":"border-top-style: solid; border-top-width: 1px; border-top-color: hsla(225, 0.00%, 0.00%, 1.00); border-right-style: solid; border-right-width: 1px; border-right-color: hsla(225, 0.00%, 0.00%, 1.00); border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: hsla(225, 0.00%, 0.00%, 1.00); border-left-style: solid; border-left-width: 1px; border-left-color: hsla(225, 0.00%, 0.00%, 1.00);"},"main_placeholder":{"styleLess":"color: hsla(0, 0.00%, 43.33%, 1.00);"},"main_hover":{"styleLess":"border-top-color: hsla(225, 0.00%, 0.00%, 1.00); border-right-color: hsla(225, 0.00%, 0.00%, 1.00); border-bottom-color: hsla(225, 0.00%, 0.00%, 1.00); border-left-color: hsla(225, 0.00%, 0.00%, 1.00); box-shadow: none /* 0 1px 2px 0 hsla(261, 97.36%, 15.88%, 0.10) */;"},"tiny":{"styleLess":"font-size: 0.9rem;"},"main_open":{"styleLess":"border-top-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-right-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-bottom-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-left-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00);"}},"children":["6b8902a2-181b-b570-6fc0-60668a930250","dc98219a-6639-055f-f1b8-f6e1f8809f52"],"selector":null},{"_id":"9d7afcd0-9551-4cec-530e-de1e593ce0d2","fake":false,"type":"class","name":"custom-checkbox-label-b","namespace":"","comb":"","styleLess":"position: relative; z-index: 3; width: 100%; color: hsla(225, 0.00%, 0.00%, 1.00); font-weight: 600; mix-blend-mode: normal;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"44a48675-0696-aa63-f52a-929047cdb39a","fake":false,"type":"class","name":"editted","namespace":"","comb":"&","styleLess":"position: absolute; left: auto; top: 10px; right: 10px; bottom: auto; margin-right: 0px; background-color: white; color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00);","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"31c90483-67e8-0f87-5113-5c4dfc1c6135","fake":false,"type":"class","name":"checkbox_button-b","namespace":"","comb":"","styleLess":"position: absolute; left: 0%; top: 0%; right: 0%; bottom: 0%; z-index: 3; display: inline-block; width: 100%; height: 100%; margin-top: 0px; margin-left: 0px; border-top-color: transparent; border-right-color: transparent; border-bottom-color: transparent; border-left-color: transparent; border-top-left-radius: 6px; border-top-right-radius: 6px; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; cursor: pointer;","variants":{"main_redirected-checked":{"styleLess":"width: 100%; height: 100%; border-top-width: 2px; border-top-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-right-width: 2px; border-right-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-bottom-width: 2px; border-bottom-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-left-width: 2px; border-left-color: hsla(147.22222222222223, 65.06%, 32.55%, 1.00); border-top-left-radius: 6px; border-top-right-radius: 6px; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; background-color: hsla(147.22222222222223, 65.06%, 32.55%, 0.05); background-image: @img_63570cb1b1dd1607479f1327; background-position: 90% 50%; background-size: 14px; background-repeat: no-repeat;"},"main_hover":{"styleLess":"background-color: hsla(225, 0.00%, 0.00%, 0.05);"}},"children":["ef87cee6-e256-7d29-0598-deb47550485b"],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"579c2711-a4bf-de39-d392-180cf35eef36","fake":false,"type":"class","name":"select-dropdown","namespace":"","comb":"","styleLess":"","variants":{"main_open":{"styleLess":"padding-top: 0.5rem; padding-right: 0.5rem; padding-bottom: 0.25rem; padding-left: 0.5rem; border-top-style: solid; border-top-width: 0.5px; border-top-color: hsla(232.8, 21.37%, 77.06%, 1.00); border-right-style: solid; border-right-width: 0.5px; border-right-color: hsla(232.8, 21.37%, 77.06%, 1.00); border-bottom-style: solid; border-bottom-width: 0.5px; border-bottom-color: hsla(232.8, 21.37%, 77.06%, 1.00); border-left-style: solid; border-left-width: 0.5px; border-left-color: hsla(232.8, 21.37%, 77.06%, 1.00); border-top-left-radius: 6px; border-top-right-radius: 6px; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; background-color: white; box-shadow: 0 10px 12px -3px hsla(225, 0.00%, 0.00%, 0.10);"}},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"cdef046e-6bc9-26a7-b100-40c1e8882b09","fake":false,"type":"class","name":"checkbox-field-b","namespace":"","comb":"","styleLess":"position: relative; z-index: 2; display: flex; width: 100%; margin-bottom: 0.25rem; padding-top: 0.3rem; padding-bottom: 0.2rem; padding-left: 0.7rem; align-items: center; flex-grow: 0; flex-shrink: 0; flex-basis: auto; line-height: 1.4em;","variants":{"main_hover":{"styleLess":"position: relative; border-top-color: hsla(244.5378151260504, 100.00%, 46.67%, 1.00); border-right-color: hsla(244.5378151260504, 100.00%, 46.67%, 1.00); border-bottom-color: hsla(244.5378151260504, 100.00%, 46.67%, 1.00); border-left-color: hsla(244.5378151260504, 100.00%, 46.67%, 1.00); box-shadow: 0 20px 30px -10px hsla(0, 0.00%, 0.00%, 0.13);"}},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"9446ac36-6c31-eb8d-f45c-a0547e011c2b","fake":false,"type":"class","name":"svg","namespace":"","comb":"","styleLess":"display: flex; overflow: hidden; width: 24px; height: 24px; min-height: 24px; min-width: 24px; margin-right: 6px; margin-left: -0.25rem; justify-content: center; align-items: center;","variants":{},"children":["44a48675-0696-aa63-f52a-929047cdb39a"],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"6b8902a2-181b-b570-6fc0-60668a930241","fake":false,"type":"class","name":"text-color-grey","namespace":"","comb":"","styleLess":"opacity: 0.7;","variants":{},"children":[],"selector":null},{"_id":"24c9fe37-f231-1486-5711-0f46af614883","fake":false,"type":"class","name":"select-input","namespace":"","comb":"","styleLess":"margin-right: 0px; margin-left: 0px;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"6b8902a2-181b-b570-6fc0-60668a93022f","fake":false,"type":"class","name":"checkbox-label","namespace":"","comb":"","styleLess":"margin-bottom: 0.5rem; color: hsla(225, 0.00%, 0.00%, 1.00); font-size: 0.9rem; font-weight: 600;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null}],"assets":[{"cdnUrl":"https://cdn.prod.website-files.com/635689ca57c4a5be05d92b4d/63570cb1b1dd1607479f1327_noun_Close_3610311.svg","siteId":"635689ca57c4a5be05d92b4d","isHD":false,"fileName":"63570cb1b1dd1607479f1327_noun_Close_3610311.svg","createdOn":"2022-10-24T22:07:45.460Z","origFileName":"noun_Close_3610311.svg","fileHash":"be9e4811a472e18505cbd30538757206","variants":[],"mimeType":"image/svg+xml","s3Url":"https://s3.amazonaws.com/webflow-prod-assets/635689ca57c4a5be05d92b4d/63570cb1b1dd1607479f1327_noun_Close_3610311.svg","thumbUrl":"https://cdn.prod.website-files.com/635689ca57c4a5be05d92b4d/63570cb1b1dd1607479f1327_noun_Close_3610311.svg","_id":"63570cb1b1dd1607479f1327","updatedOn":"2022-10-24T22:07:45.460Z","fileSize":705}],"ix1":[],"ix2":{"interactions":[{"id":"i","interactionTypeId":"MOUSE_CLICK_INTERACTION","eventIds":["e","e-2"],"target":"635689ca57c4a575b2d92b4e|38f8a9e3-59ec-9e33-23a5-1d781cf515cc","createdOn":1666634163231}],"events":[{"id":"e","name":"","animationType":"custom","eventTypeId":"MOUSE_CLICK","action":{"id":"","actionTypeId":"GENERAL_START_ACTION","instant":true,"config":{"delay":0,"easing":"","duration":0,"actionListId":"a","affectedElements":{},"playInReverse":false,"autoStopEventId":"e-2"}},"mediaQueries":["main","medium","small","tiny"],"target":{"id":"635689ca57c4a575b2d92b4e|38f8a9e3-59ec-9e33-23a5-1d781cf515cc","appliesTo":"CLASS","styleBlockIds":["579c2711-a4bf-de39-d392-180cf35eef36"]},"targets":[{"id":"635689ca57c4a575b2d92b4e|38f8a9e3-59ec-9e33-23a5-1d781cf515cc","appliesTo":"CLASS","styleBlockIds":["579c2711-a4bf-de39-d392-180cf35eef36"]}],"config":{"loop":false,"playInReverse":false,"scrollOffsetValue":null,"scrollOffsetUnit":null,"delay":null,"direction":null,"effectIn":null},"createdOn":1666634163231},{"id":"e-2","name":"","animationType":"preset","eventTypeId":"MOUSE_SECOND_CLICK","action":null,"mediaQueries":["main","medium","small","tiny"],"target":{"id":"635689ca57c4a575b2d92b4e|38f8a9e3-59ec-9e33-23a5-1d781cf515cc","appliesTo":"CLASS","styleBlockIds":["579c2711-a4bf-de39-d392-180cf35eef36"]},"targets":[{"id":"635689ca57c4a575b2d92b4e|38f8a9e3-59ec-9e33-23a5-1d781cf515cc","appliesTo":"CLASS","styleBlockIds":["579c2711-a4bf-de39-d392-180cf35eef36"]}],"config":{"loop":false,"playInReverse":false,"scrollOffsetValue":null,"scrollOffsetUnit":null,"delay":null,"direction":null,"effectIn":null},"createdOn":1666634163231}],"actionLists":[{"id":"a","title":"Edit Dropdown","actionItemGroups":[{"actionItems":[{"id":"a-n-2","actionTypeId":"GENERAL_DISPLAY","config":{"delay":0,"easing":"","duration":0,"target":{"nodeId":"635689ca57c4a575b2d92b4e|36bd4db7-31ae-8a1f-268a-56d71940d24e","appliesTo":"ELEMENT_CLASS","styleBlockIds":["9446ac36-6c31-eb8d-f45c-a0547e011c2b","44a48675-0696-aa63-f52a-929047cdb39a"],"boundaryMode":false},"value":"none"},"instant":true}]},{"actionItems":[{"id":"a-n","actionTypeId":"GENERAL_DISPLAY","config":{"delay":0,"easing":"","duration":0,"target":{"nodeId":"635689ca57c4a575b2d92b4e|36bd4db7-31ae-8a1f-268a-56d71940d24e","appliesTo":"ELEMENT_CLASS","styleBlockIds":["9446ac36-6c31-eb8d-f45c-a0547e011c2b","44a48675-0696-aa63-f52a-929047cdb39a"],"boundaryMode":false},"value":"flex"},"instant":true}]}],"useFirstGroupAsInitialState":true,"createdOn":1666634166772}]}},"meta":{"unlinkedSymbolCount":0,"droppedLinks":0,"dynBindRemovedCount":0,"dynListBindRemovedCount":0,"paginationRemovedCount":0}}
Browser nicht unterstützt. Verwenden Sie
CC Chrome oder SS Safari.

Über diese Komponente

AI-generiert

Komponentenbeschreibung (von AI generiert)

The Custom Checkbox Dropdown is a fully customizable select field designed for Webflow, integrating seamlessly with Memberstack. It allows users to select multiple options.

Wesentliche Merkmale:

  • Fully customizable design
  • Integration with Memberstack
  • Multiple selection capability
  • Responsive and user-friendly interface

Gestaltungselemente:

  • Modern and clean aesthetic
  • Soft color palette with shades of green and white
  • Rounded corners and subtle shadows for depth
  • Interactive dropdown toggle with smooth animations

Potenzielle Anwendungsfälle:

  • E-commerce websites for product filtering
  • Surveys and feedback forms for data collection
  • Event registration forms requiring multiple selections
  • Portfolio sites for selecting project categories
  • Membership sites for user preferences

Conclusion: The Custom Checkbox Dropdown is a versatile component that enhances user experience through its customizable features and seamless integration, making it suitable for various applications across different industries.

Mit dem Bau beginnen

Bauen Sie Ihre Träume

Memberstack ist 100% kostenlos, bis Sie bereit sind, zu starten - worauf warten Sie also noch? Erstellen Sie Ihre erste App und beginnen Sie noch heute mit der Entwicklung.