Merge pull request #453 from Infineon/442-breadcrumbs-dropdown-menu-n…

…eeds-to-be-updated added dropdown-menu to breadcrumb
Infineon · Sep 7, 2023 · fa26768 · fa26768
2 parents 22a6bd4 + 2391f9d
commit fa26768
Show file tree

Hide file tree

Showing 29 changed files with 15,087 additions and 20,071 deletions.
diff --git a/examples/stencil-components/angular/src/app/app.component.html b/examples/stencil-components/angular/src/app/app.component.html
@@ -21,6 +21,34 @@
 
   <h1>Using Stencil web components in an Angular application</h1>
 
+  <h2>Breadcrumb</h2>
+    <ifx-breadcrumb>
+      <ifx-breadcrumb-item>
+        <ifx-breadcrumb-item-label slot="label" icon="">Breadcrumb 1</ifx-breadcrumb-item-label>
+        <ifx-dropdown-menu>
+          <ifx-dropdown-item url="http://google.com">Google</ifx-dropdown-item>
+          <ifx-dropdown-item url="http://bing.com">Bing</ifx-dropdown-item>
+          <ifx-dropdown-item url="http://yahoo.com">Yahoo</ifx-dropdown-item>
+          <ifx-dropdown-item url="http://naver.com">Naver</ifx-dropdown-item>
+        </ifx-dropdown-menu>
+      </ifx-breadcrumb-item>
+
+      <ifx-breadcrumb-item>
+        <ifx-breadcrumb-item-label slot="label" icon="">Breadcrumb 2</ifx-breadcrumb-item-label>
+        <ifx-dropdown-menu>
+        <ifx-dropdown-item url="http://google.com">Google</ifx-dropdown-item>
+        <ifx-dropdown-item url="http://bing.com">Bing</ifx-dropdown-item>
+        <ifx-dropdown-item url="http://yahoo.com">Yahoo</ifx-dropdown-item>
+        <ifx-dropdown-item url="http://naver.com">Naver</ifx-dropdown-item>
+        </ifx-dropdown-menu>
+      </ifx-breadcrumb-item>
+
+      <ifx-breadcrumb-item>
+        <ifx-breadcrumb-item-label slot="label" icon="" url="http://google.com">Breadcrumb 3</ifx-breadcrumb-item-label>
+      </ifx-breadcrumb-item>
+    </ifx-breadcrumb>
+    <br />
+
   <h2>Alert</h2>
   <ifx-alert color="primary" icon="c-info-24">Attention! This is an alert message — check it out!</ifx-alert>
   <br />

diff --git a/examples/stencil-components/vanilla-cdn/index.html b/examples/stencil-components/vanilla-cdn/index.html
@@ -38,6 +38,34 @@
     <h1>Using Stencil web components in an Vanilla JS</h1>
 
 
+    <h2>Breadcrumb</h2>
+    <ifx-breadcrumb>
+      <ifx-breadcrumb-item>
+        <ifx-breadcrumb-item-label slot="label" icon="">Breadcrumb 1</ifx-breadcrumb-item-label>
+        <ifx-dropdown-menu>
+          <ifx-dropdown-item url="http://google.com">Google</ifx-dropdown-item>
+          <ifx-dropdown-item url="http://bing.com">Bing</ifx-dropdown-item>
+          <ifx-dropdown-item url="http://yahoo.com">Yahoo</ifx-dropdown-item>
+          <ifx-dropdown-item url="http://naver.com">Naver</ifx-dropdown-item>
+        </ifx-dropdown-menu>
+      </ifx-breadcrumb-item>
+
+      <ifx-breadcrumb-item>
+        <ifx-breadcrumb-item-label slot="label" icon="">Breadcrumb 2</ifx-breadcrumb-item-label>
+        <ifx-dropdown-menu>
+        <ifx-dropdown-item url="http://google.com">Google</ifx-dropdown-item>
+        <ifx-dropdown-item url="http://bing.com">Bing</ifx-dropdown-item>
+        <ifx-dropdown-item url="http://yahoo.com">Yahoo</ifx-dropdown-item>
+        <ifx-dropdown-item url="http://naver.com">Naver</ifx-dropdown-item>
+        </ifx-dropdown-menu>
+      </ifx-breadcrumb-item>
+
+      <ifx-breadcrumb-item>
+        <ifx-breadcrumb-item-label slot="label" icon="" url="http://google.com">Breadcrumb 3</ifx-breadcrumb-item-label>
+      </ifx-breadcrumb-item>
+    </ifx-breadcrumb>
+    <br />
+
     <h2>Alert</h2>
     <ifx-alert color="primary" icon="c-info-24">Attention! This is an alert message — check it out!</ifx-alert>
     <br />