{"type":"@webflow/XscpData","payload":{"nodes":[{"_id":"37116083-3b4b-595c-8c16-14442674bd76","type":"Block","tag":"div","classes":["06e420ce-dfad-0b7a-54d7-26c16023bb8c"],"children":["48691683-2b22-5637-7a42-20dc1e869065"],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"48691683-2b22-5637-7a42-20dc1e869065","type":"Block","tag":"div","classes":["06e420ce-dfad-0b7a-54d7-26c16023bb8d"],"children":["9efb7b66-372b-66a5-66b4-103e3db2370c","f2493ce2-df80-6210-d000-25b0886a2575"],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"9efb7b66-372b-66a5-66b4-103e3db2370c","type":"Block","tag":"div","classes":["06e420ce-dfad-0b7a-54d7-26c16023bb8e"],"children":["ece6860c-d48d-65b6-471d-0085808115a3"],"data":{"text":true,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"ece6860c-d48d-65b6-471d-0085808115a3","text":true,"v":"Hover to see the tooltip!"},{"_id":"f2493ce2-df80-6210-d000-25b0886a2575","type":"Block","tag":"div","classes":["06e420ce-dfad-0b7a-54d7-26c16023bb8f"],"children":["8baa4f9f-057a-bfde-1443-9be0ec7f42e5","97fe3888-4706-5154-a2ba-72d81cb545d6","e37271a2-b812-7e1d-aeaf-f9ca5803efd6","5e54fac2-f200-83d7-5f54-7a0cd6fb5407"],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"8baa4f9f-057a-bfde-1443-9be0ec7f42e5","type":"Heading","tag":"h3","classes":["06e420ce-dfad-0b7a-54d7-26c16023bb90"],"children":["c9722f5b-acb9-4375-6791-2e85d906c794"],"data":{"tag":"h3","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"c9722f5b-acb9-4375-6791-2e85d906c794","text":true,"v":"Tooltip title"},{"_id":"97fe3888-4706-5154-a2ba-72d81cb545d6","type":"Block","tag":"div","classes":[],"children":["45969f21-7dd5-a931-4c3e-e083f7a89d9d"],"data":{"text":true,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"45969f21-7dd5-a931-4c3e-e083f7a89d9d","text":true,"v":"This tooltip can be used to display more information when an element is hovered over."},{"_id":"e37271a2-b812-7e1d-aeaf-f9ca5803efd6","type":"Block","tag":"div","classes":["06e420ce-dfad-0b7a-54d7-26c16023bb91"],"children":[],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"5e54fac2-f200-83d7-5f54-7a0cd6fb5407","type":"Link","tag":"a","classes":["27e2c28d-84e7-9136-e293-5ae1ccc4f8d9","a6b7c620-6703-68cb-4e59-d2b3a9d1ab04"],"children":["e1966c45-d639-51a8-6034-de80758c9e63"],"data":{"button":true,"block":"","link":{"mode":"external","url":"#"},"attr":{"id":""},"devlink":{"runtimeProps":{},"slot":""},"displayName":"","xattr":[],"search":{"exclude":true},"visibility":{"conditions":[]}}},{"_id":"e1966c45-d639-51a8-6034-de80758c9e63","text":true,"v":"Button Text"}],"styles":[{"_id":"06e420ce-dfad-0b7a-54d7-26c16023bb8c","fake":false,"type":"class","name":"tooltip-2","namespace":"","comb":"","styleLess":"display: inline;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"06e420ce-dfad-0b7a-54d7-26c16023bb8d","fake":false,"type":"class","name":"tooltip-2_tooltip","namespace":"","comb":"","styleLess":"position: relative; display: inline-block; grid-auto-columns: 1fr; grid-column-gap: 16px; grid-row-gap: 16px; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; cursor: pointer;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"06e420ce-dfad-0b7a-54d7-26c16023bb8e","fake":false,"type":"class","name":"tooltip-2_object","namespace":"","comb":"","styleLess":"position: static; display: inline-block; font-weight: 700; text-decoration: underline; text-decoration-color: @raw<|#f6ad12|>; text-decoration-style: @raw<|dotted|>;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"06e420ce-dfad-0b7a-54d7-26c16023bb8f","fake":false,"type":"class","name":"tooltip-2_content","namespace":"","comb":"","styleLess":"position: absolute; left: 50%; bottom: 125%; display: none; max-width: 30rem; min-width: 25rem; padding-top: 0.75rem; padding-right: 1rem; padding-bottom: 1rem; padding-left: 1rem; flex-direction: column; justify-content: flex-start; flex-wrap: nowrap; align-items: flex-start; grid-column-gap: 0.5rem; grid-row-gap: 0.5rem; border-top-left-radius: 0.5rem; border-top-right-radius: 0.5rem; border-bottom-left-radius: 0.5rem; border-bottom-right-radius: 0.5rem; background-color: #0c60f5; color: white; font-weight: 700; cursor: auto; transform: @raw<|translateX(-50%)|>;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"06e420ce-dfad-0b7a-54d7-26c16023bb90","fake":false,"type":"class","name":"tooltip-2_heading","namespace":"","comb":"","styleLess":"margin-top: 0px; margin-bottom: 0px;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"06e420ce-dfad-0b7a-54d7-26c16023bb91","fake":false,"type":"class","name":"tooltip-2_pointer","namespace":"","comb":"","styleLess":"position: absolute; left: 50%; top: 100%; border-top-style: solid; border-top-width: 0.5rem; border-top-color: #0c60f5; border-right-style: solid; border-right-width: 0.5rem; border-right-color: #0c60f5; border-bottom-style: solid; border-bottom-width: 0.5rem; border-bottom-color: #0c60f5; border-left-style: solid; border-left-width: 0.5rem; border-left-color: #0c60f5; transform: @raw<|translateX(-50%)|>; border-color: @raw<|#0c60f5 transparent transparent transparent|>;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"27e2c28d-84e7-9136-e293-5ae1ccc4f8d9","fake":false,"type":"class","name":"button","namespace":"","comb":"","styleLess":"display: inline-block; padding-top: 1rem; padding-right: 1.5rem; padding-bottom: 1rem; padding-left: 1.5rem; border-top-style: solid; border-top-width: 2px; border-top-color: #0c60f5; border-right-style: solid; border-right-width: 2px; border-right-color: #0c60f5; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0c60f5; border-left-style: solid; border-left-width: 2px; border-left-color: #0c60f5; background-color: #0c60f5; color: white; font-size: 1em; line-height: 1.125em; font-weight: 700; text-align: center; text-decoration: none; white-space: nowrap;","variants":{"main_hover":{"styleLess":"border-top-color: #0049ca; border-right-color: #0049ca; border-bottom-color: #0049ca; border-left-color: #0049ca; background-color: #0049ca;"}},"children":["27e2c28d-84e7-9136-e293-5ae1ccc4f8de","a6b7c620-6703-68cb-4e59-d2b3a9d1ab04","5eb34a0d-1d4c-bc49-56cf-7af9cc5e2dcf","3b4f261d-5209-659d-b43e-d49e7abe6e82"],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"a6b7c620-6703-68cb-4e59-d2b3a9d1ab04","fake":false,"type":"class","name":"is-reverse","namespace":"","comb":"&","styleLess":"border-top-style: solid; border-top-width: 2px; border-top-color: #0c60f5; border-right-style: solid; border-right-width: 2px; border-right-color: #0c60f5; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0c60f5; border-left-style: solid; border-left-width: 2px; border-left-color: #0c60f5; background-color: white; color: #0f1929;","variants":{"main_hover":{"styleLess":"border-top-color: #0049ca; border-right-color: #0049ca; border-bottom-color: #0049ca; border-left-color: #0049ca; color: #0049ca;"}},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null}],"assets":[],"ix1":[],"ix2":{"interactions":[{"id":"i-65","interactionTypeId":"MOUSE_HOVER_INTERACTION","eventIds":["e-129","e-130"],"target":"66ba8f9d3e9f0fc3424d3f3e|48691683-2b22-5637-7a42-20dc1e869065","createdOn":1723502671490}],"events":[{"id":"e-129","name":"","animationType":"custom","eventTypeId":"MOUSE_OVER","action":{"id":"","actionTypeId":"GENERAL_START_ACTION","config":{"delay":0,"easing":"","duration":0,"actionListId":"a-83","affectedElements":{},"playInReverse":false,"autoStopEventId":"e-130"},"instant":true},"mediaQueries":["main","medium","small","tiny"],"target":{"appliesTo":"ELEMENT","styleBlockIds":[],"id":"66ba8f9d3e9f0fc3424d3f3e|48691683-2b22-5637-7a42-20dc1e869065"},"targets":[],"config":{"loop":false,"playInReverse":false,"scrollOffsetValue":null,"scrollOffsetUnit":null,"delay":null,"direction":null,"effectIn":null},"createdOn":1723502671490},{"id":"e-130","name":"","animationType":"custom","eventTypeId":"MOUSE_OUT","action":{"id":"","actionTypeId":"GENERAL_START_ACTION","config":{"delay":0,"easing":"","duration":0,"actionListId":"a-84","affectedElements":{},"playInReverse":false,"autoStopEventId":"e-129"},"instant":true},"mediaQueries":["main","medium","small","tiny"],"target":{"appliesTo":"ELEMENT","styleBlockIds":[],"id":"66ba8f9d3e9f0fc3424d3f3e|48691683-2b22-5637-7a42-20dc1e869065"},"targets":[],"config":{"loop":false,"playInReverse":false,"scrollOffsetValue":null,"scrollOffsetUnit":null,"delay":null,"direction":null,"effectIn":null},"createdOn":1723502671491}],"actionLists":[{"id":"a-83","title":"Tooltip 2 [HOVER IN]","actionItemGroups":[{"actionItems":[{"id":"a-83-n","actionTypeId":"STYLE_OPACITY","config":{"delay":0,"easing":"","duration":500,"target":{"nodeId":"66ba8f9d3e9f0fc3424d3f3e|f2493ce2-df80-6210-d000-25b0886a2575","appliesTo":"ELEMENT_CLASS","styleBlockIds":["06e420ce-dfad-0b7a-54d7-26c16023bb8f"],"useEventTarget":"CHILDREN","boundaryMode":false},"value":0,"unit":"%"},"instant":false}]},{"actionItems":[{"id":"a-83-n-2","actionTypeId":"GENERAL_DISPLAY","config":{"delay":0,"easing":"","duration":0,"target":{"nodeId":"66ba8f9d3e9f0fc3424d3f3e|f2493ce2-df80-6210-d000-25b0886a2575","appliesTo":"ELEMENT_CLASS","styleBlockIds":["06e420ce-dfad-0b7a-54d7-26c16023bb8f"],"useEventTarget":"CHILDREN","boundaryMode":false},"value":"flex"},"instant":true}]},{"actionItems":[{"id":"a-83-n-3","actionTypeId":"STYLE_OPACITY","config":{"delay":0,"easing":"inOutQuad","duration":300,"target":{"nodeId":"66ba8f9d3e9f0fc3424d3f3e|f2493ce2-df80-6210-d000-25b0886a2575","appliesTo":"ELEMENT_CLASS","styleBlockIds":["06e420ce-dfad-0b7a-54d7-26c16023bb8f"],"useEventTarget":"CHILDREN","boundaryMode":false},"value":100,"unit":"%"},"instant":false}]}],"useFirstGroupAsInitialState":true,"createdOn":1710612296395},{"id":"a-84","title":"Tooltip 2 [HOVER OUT]","actionItemGroups":[{"actionItems":[{"id":"a-84-n","actionTypeId":"STYLE_OPACITY","config":{"delay":0,"easing":"inOutQuad","duration":300,"target":{"nodeId":"66ba8f9d3e9f0fc3424d3f3e|f2493ce2-df80-6210-d000-25b0886a2575","appliesTo":"ELEMENT_CLASS","styleBlockIds":["06e420ce-dfad-0b7a-54d7-26c16023bb8f"],"useEventTarget":"CHILDREN","boundaryMode":false},"value":0,"unit":"%"},"instant":false}]},{"actionItems":[{"id":"a-84-n-2","actionTypeId":"GENERAL_DISPLAY","config":{"delay":0,"easing":"","duration":0,"target":{"nodeId":"66ba8f9d3e9f0fc3424d3f3e|f2493ce2-df80-6210-d000-25b0886a2575","appliesTo":"ELEMENT_CLASS","styleBlockIds":["06e420ce-dfad-0b7a-54d7-26c16023bb8f"],"useEventTarget":"CHILDREN","boundaryMode":false},"value":"none"},"instant":true}]}],"useFirstGroupAsInitialState":false,"createdOn":1710612296395}]}},"meta":{"droppedLinks":0,"dynBindRemovedCount":0,"dynListBindRemovedCount":0,"paginationRemovedCount":0,"universalBindingsRemovedCount":0,"unlinkedSymbolCount":0}}
Built by hand with
from
Piixel Media