@boikom
@boikom
Forum Replies Created
-
AuthorPosts
-
admin
KeymasterHi Peter,
Thank you for your interest in our Tank Web Component.
A note about those unfamiliar with what Shadow DOM is. Shadow DOM refers to the ability of the browser to include a subtree of DOM elements into the rendering of a document, but not into the main document DOM tree
A Shadow DOM support for the Tank is in active development. With every new release, we will add support for Shadow DOM in some of the elements and with the time we will have full support for it. At present, we cannot tell exactly when Tank will be with Shadow DOM support, but we will keep this topic up to date and when we add support, we will update it.
Please, let us know if you have additional questions.
Best Regards,
B. Markov
SmartHtmlElements Team
https://www.htmlelements.comKeymasterHi Peter,
Thank you for your interest in our Grid Web Component.
We are still working on Grid Filtering functionality. We will have Filter Menu and Filter Row UI Elements built into the HTML Element. Our plans are to have it in Q1.
Please, let us know if you have additional questions.
Best Regards,
B. Markov
SmartHtmlElements Team
https://www.htmlelements.comKeymasterHi Peter,
Thank you for your interest in our Grid Web Component.
We are still working on Grid Editing functionality. Our plans are to have it in Q1.
Please, let us know if you have additional questions.
Best Regards,
B. Markov
SmartHtmlElements Team
https://www.htmlelements.comKeymasterHi Peter,
There are several ways to install the Web Components.
1. Download the .zip package from our web site.
2. Use Node Package Manager(NPM).
You can take a look at: https://www.htmlelements.com/download/ and https://www.htmlelements.com/docs/download-and-installation/
Please, let us know if you have additional questions.
Best Regards,
B. Markov
SmartHtmlElements Team
https://www.htmlelements.comKeymasterHi Peter,
In order to style the DateTimePicker, please refer to: https://www.htmlelements.com/docs/datetimepicker-css/. The documentation tutorial will help you to learn which CSS variables can be used for styling the Web Component.
Please, let us know if you have additional questions.
Best Regards,
B. Markov
SmartHtmlElements Team
https://www.htmlelements.comKeymasterHi Mike,
The Menu demo page issue is resolved.
Thank you very much for the feedback!
Best regards,
Boyko Markov
Smart HTML Elements Team
https://www.htmlelements.comKeymasterHi Mike,
Thank you for your feedback. We will resolve this issue as soon as possible.
Best Regards,
Dimitar
Smart HTML Elements Team
https://www.htmlelements.comKeymasterThank you, Dimitar.
KeymasterHi Mike,
This can be achieved by setting the checkboxes attribute to the smart-menu and checkable and check-mode=”checkbox” to the particular smart-menu-items-group. You can see this in action in the “Menu labels” section of the Overview demo.
Best Regards,
Dimitar
Smart HTML Elements Team
https://www.htmlelements.comKeymasterHi john1987,
in order to control the visibility of the scroll buttons inside the header section of the element you simply need to changed the <b>overview</b> property to ‘hidden’. When you want to see the buttons again just set the value of the property back to it’s default value ‘auto’. Here’s how to do it:<script> window.onload = function () { var tabs = document.querySelector('smart-tabs'); tabs.addEventListener('mouseenter', function (event) { this.overflow = 'auto'; }); tabs.addEventListener('mouseleave', function (event) { this.overflow = 'hidden'; }); } </script> </head> <body> <smart-tabs> <smart-tab-item label="TAB 1">Content 1</smart-tab-item> <smart-tab-item label="TAB 2">Content 2</smart-tab-item> <smart-tab-item label="TAB 3">Content 3</smart-tab-item> <smart-tab-item label="TAB 4">Content 4</smart-tab-item> <smart-tab-item label="TAB 5">Content 5</smart-tab-item> <smart-tab-item label="TAB 6">Content 6</smart-tab-item> <smart-tab-item label="TAB 7">Content 7</smart-tab-item> <smart-tab-item label="TAB 8">Content 8</smart-tab-item> <smart-tab-item label="TAB 9">Content 9</smart-tab-item> <smart-tab-item label="TAB 10">Content 10</smart-tab-item> <smart-tab-item label="TAB 11">Content 11</smart-tab-item> </smart-tabs> </body>If you have further questions feel free to ask.
Best Regards,
Christopher
Smart HTML Elements Team
https://www.htmlelements.comKeymasterHi john1987,
To achieve this behavior, you can set pointer-events: none; to this particular item.
This will disable the interaction with it.
Best Regards,
Ivailo
Smart HTML Elements Team
https://www.htmlelements.comKeymasterHi AL,
Please try using smart-gauge configured as follows:<smart-gauge analog-display-type="fill" digital-display digital-display-position="center" start-angle="0" end-angle="180" min="1" max="500" value="2" logarithmic-scale show-ranges ranges='[{ "startValue": "1", "endValue": "20", "className": "calm" }, { "startValue": "200", "endValue": "500", "className": "danger" }]'></smart-gauge>You can style the “calm” and “danger” zones as follows:
<style type="text/css"> .calm { fill: darkseagreen; } .danger { fill: crimson; } </style>Best Regards,
Dimitar
Smart HTML Elements Team
https://www.htmlelements.comKeymasterHi Aleksandar,
You can do so by calling the update method, i.e.:
document.querySelector('smart-list-box').update(0, 'Order 1 (sold)');
Best Regards,
Dimitar
Smart HTML Elements Team
https://www.htmlelements.comKeymasterThank you Dimitar!. I have gone astray 🙂 it is my mistake.
This is greate But I have another question. How can I update one particular item?
For example I want to change the “Order 1” to “Order 1 (sold)”.
–Aleksandar LaskinKeymasterHi Ivailo,
Maybe I will spend more time to search how to make this style change. This doc is very useful! Thanks!
Now I have another question. Can I make it this with some toggle button or something? Becouse I want to change text of the button of in one case and in another to be different.
–Aleksandar Laskin -
AuthorPosts