fix: update query attributes

Author: frankpagan

docs/index.html

@@ -46,7 +46,7 @@
 			id="menuL"
 			class="position:fixed top:0px left:0px overflow:hidden background:whitesmoke height:100vh width:0px width:300px@xl"
 			resizable
-			resize-selector="[content_id='content']"
+			resize-query="[content_id='content']"
 			resize-property="margin-left"
 			resize-value="width">
 			<menu
@@ -75,7 +75,7 @@ <h2>CoCreate-calculate</h2>
 						share-width="700"
 						share-media="https://cdn.cocreate.app/docs/calculate.png"
 						hover="display:block!important"
-						hover-selector=".social-networks">
+						hover-query=".social-networks">
 						<div class="display:none social-networks">
 							<a
 								class="margin-right:15px"
@@ -134,11 +134,11 @@ <h2>CoCreate-calculate</h2>
 						class="border-bottom:1px_solid_lightgrey"
 						scroll
 						scroll-intersect="color:dodgerblue"
-						scroll-selector="#calculate-install-section">
+						scroll-query="#calculate-install-section">
 						<span
 							class="display:flex align-items:center width:fit-content"
 							hover="display:block!important"
-							hover-selector="[href='#calculate-install']">
+							hover-query="[href='#calculate-install']">
 							<h2 class="padding:5px_0px">Install</h2>
 							<a
 								class="margin-left:10px display:none"
@@ -159,11 +159,11 @@ <h2 class="padding:5px_0px">Install</h2>
 						class="margin-top:80px border-bottom:1px_solid_lightgrey"
 						scroll
 						scroll-intersect="color:dodgerblue"
-						scroll-selector="#calculate-usage-section">
+						scroll-query="#calculate-usage-section">
 						<span
 							class="display:flex align-items:center width:fit-content"
 							hover="display:block!important"
-							hover-selector="[href='#calculate-usage']">
+							hover-query="[href='#calculate-usage']">
 							<h2 class="padding:5px_0px">Usage</h2>
 							<a
 								class="margin-left:10px display:none"
@@ -193,11 +193,11 @@ <h2 class="padding:5px_0px">Usage</h2>
 						class="margin-top:80px border-bottom:1px_solid_lightgrey"
 						scroll
 						scroll-intersect="color:dodgerblue"
-						scroll-selector="#calculate-attributes-section">
+						scroll-query="#calculate-attributes-section">
 						<span
 							class="display:flex align-items:center width:fit-content"
 							hover="display:block!important"
-							hover-selector="[href='#calculate-attributes']">
+							hover-query="[href='#calculate-attributes']">
 							<h2 class="padding:5px_0px">Attributes</h2>
 							<a
 								class="margin-left:10px display:none"
@@ -244,11 +244,11 @@ <h4>
 						class="border-bottom:1px_solid_lightgrey"
 						scroll
 						scroll-intersect="color:dodgerblue"
-						scroll-selector="#calculate-demo-section">
+						scroll-query="#calculate-demo-section">
 						<span
 							class="display:flex align-items:center width:fit-content"
 							hover="display:block!important"
-							hover-selector="[href='#calculate-demo']">
+							hover-query="[href='#calculate-demo']">
 							<h2 class="padding:5px_0px">Demo</h2>
 							<a
 								class="margin-left:10px display:none"
@@ -295,7 +295,7 @@ <h2 class="padding:5px_0px">Demo</h2>
 									show="#eye-slash"
 									hide="#eye, #demo-preview"
 									toggle="code-height"
-									toggle-selector="#demo-code"
+									toggle-query="#demo-code"
 									><i
 										class="height:18px"
 										src="/assets/svg/eye.svg"></i
@@ -307,7 +307,7 @@ <h2 class="padding:5px_0px">Demo</h2>
 									show="#eye, #demo-preview"
 									hide="#eye-slash"
 									toggle="code-height"
-									toggle-selector="#demo-code"
+									toggle-query="#demo-code"
 									><i src="/assets/svg/eye-slash.svg"></i
 								></a>
 								<a
@@ -330,7 +330,7 @@ <h2 class="padding:5px_0px">Demo</h2>
 								<a
 									class="margin-right:5px"
 									fullscreen
-									fullscreen-selector="#playground"></a>
+									fullscreen-query="#playground"></a>
 							</div>
 						</div>
 						<!-- End SandBox -->