How do I use --calcite-block-padding to remove padding on block?
disablePadding disable-padding deprecatedUse --calcite-block-padding CSS variable instead.
Here's my code
let block = document.createElement('calcite-block'); block.setAttribute('id', 'pao-accordion-block'); block.setAttribute('heading', 'Buffer Results'); block.setAttribute('description', ' '); // populated on table update block.setAttribute('collapsible', ''); block.setAttribute('open', ''); block.addEventListener( 'calciteBlockToggle', toggleAccordionBlockDescription );
Solved! Go to Solution.
Hi @GregoryBologna, you can set the CSS variable on the component:
calcite-block {
--calcite-block-padding: 0rem;
}
For setting the CSS variable using JavaScript, can use properties:
block.style.setProperty("--calcite-block-padding", "0rem");
There is a new documentation page on web concepts that includes some guidance on CSS variables releasing this week. Will post an update when the page is available.
Hi @GregoryBologna, you can set the CSS variable on the component:
calcite-block {
--calcite-block-padding: 0rem;
}
For setting the CSS variable using JavaScript, can use properties:
block.style.setProperty("--calcite-block-padding", "0rem");
There is a new documentation page on web concepts that includes some guidance on CSS variables releasing this week. Will post an update when the page is available.
Hi @GregoryBologna , we added a new page to the Calcite’s ArcGIS Developers Site around web concepts.
Since we've had a few conversations around a few web component concepts, wanted to share some more in-depth details – if interested in exploring some of the terms further.